import React from 'react'
import { Popover,NavBar, Icon } from 'antd-mobile';
import {Auth} from '../../Utils/help';
import 'antd-mobile/dist/antd-mobile.css'; 

import '../../less/main.less'

const Item = Popover.Item;

const customIcon = src => <img src={src} className="am-icon am-icon-xs" alt="icon" />;

export class MNavBar extends React.Component {
     
    constructor(props) {
        super(props); 
        //const { NVback,NVtitle } = this.props ;
        this.state = {
          visible: false,
        };
    }

    onSelect = (opt) => {  
      // this.setState({
      //   visible: false,
      // }); 
      const { onClick } = this.props ;
      onClick('logout');
    };
    handleVisibleChange = (visible) => {
      this.setState({
        visible,
      });
    };

    render() {
      // let offsetX = -10; // just for pc demo
      // if (/(iPhone|iPad|iPod|iOS|Android)/i.test(navigator.userAgent)) {
      //   offsetX = -26;
      // }
      return (<div className='main-bar'>
        <NavBar
          leftContent={'移动终端'}
          mode="dark" 
          rightContent={
            <div onClick={this.onSelect}>登出</div>
          }
        >
          {Auth.UserName}
        </NavBar>
      </div>);
    }
  }