import React from 'react' 
import 'antd-mobile/dist/antd-mobile.css'; 
import { TabBar,Badge } from 'antd-mobile';
import { MMaincard } from './maincard';
import { Dashboard } from './dashboard'
import { My } from './my';
import { Http } from '../../Utils/help';
//import {alertlist} from './../dashboard/alertlist';
export class MTabBar extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      selectedTab: globalpresenttab,
      hidden: false,
      unread:'',//判断是否有未读消息
    };
    const {onClick} = this.props;  
    this.onClick = onClick; 
  }
  componentWillMount(){
    window.conditionarr=[]
    var unread
    this.dataAjax = Http.getJSON2("showmessage", {},data=>{
        console.log(data)
        data.map((item,index) =>{
            if(item.ExtraDatas.unreadnum > 0){
                unread=true
                return
            }   
            else
              unread=false 
        })

        this.setState({unread})
        console.log(this.state.unread) 
    }
    )

}
  render() {
    return (
      // <div style={{ position: 'fixed', height: '100%', width: '100%', top: 0 }}> 
      <TabBar
        unselectedTintColor="#949494"
        tintColor="#33A3F4"
        barTintColor="white"
        hidden={this.state.hidden}
      >
        <TabBar.Item
          key='dashboard'
          title="dashboard"
          selected={this.state.selectedTab === 'dashboard'}
          onPress={() => {
            window.globalpresenttab='dashboard'
            this.setState({
              selectedTab: 'dashboard',
            });
          }}
          icon={
            <div
              style={{
                width: '22px',
                height: '22px',//type={require('./foo.svg')
                // background:'../../images/dashboard1.png'
                background: 'url(https://gw.alipayobjects.com/zos/rmsportal/LIrTcIGtEmwqZsQnTtFa.svg) center center /  21px 21px no-repeat'
              }}
            />
          }
          selectedIcon={
            <div
              style={{
                width: '22px',
                height: '22px',
                // background:'../../images/dashboard1.png'
                background: 'url(https://gw.alipayobjects.com/zos/rmsportal/ZGXnYElJHBJjuiWLIlNe.svg) center center /  21px 21px no-repeat' }}
            />
          }
        >
          <Dashboard style={{ backgroundColor: 'white', height: '100%', textAlign: 'center' }}  onClick={this.onClick}/>
        </TabBar.Item>
        <TabBar.Item
          icon={
            <div style={{
              width: '22px',
              height: '22px',
              background: 'url(https://gw.alipayobjects.com/zos/rmsportal/LIrTcIGtEmwqZsQnTtFa.svg) center center /  21px 21px no-repeat' }}
            />
          }
          selectedIcon={
            <div style={{
              width: '22px',
              height: '22px',
              background: 'url(https://gw.alipayobjects.com/zos/rmsportal/ZGXnYElJHBJjuiWLIlNe.svg) center center /  21px 21px no-repeat' }}
            />
          }
          title="主页"
          key="home"
          //badge={'new'}
          selected={this.state.selectedTab === 'home'}
          onPress={() => {
            window.globalpresenttab='home'
            this.setState({
              selectedTab: 'home',
            });
          }}
        >
          <MMaincard style={{ display: 'block', marginBottom: 600, color: '#108ee9' }} onClick={this.onClick} />
        </TabBar.Item>

        <TabBar.Item
          icon={
            <div style={{
              width: '22px',
              height: '22px',
              background: 'url(https://zos.alipayobjects.com/rmsportal/psUFoAMjkCcjqtUCNPxB.svg) center center /  21px 21px no-repeat' }}
            />
          }
          selectedIcon={
            <div style={{
              width: '22px',
              height: '22px',
              background: 'url(https://zos.alipayobjects.com/rmsportal/IIRLrXXrFAhXVdhMWgUI.svg) center center /  21px 21px no-repeat' }}
            />
          }
          title="我的"
          key="my"
          dot={this.state.unread?true:false}
          selected={this.state.selectedTab === 'my'}
          onPress={() => {
            window.globalpresenttab='my'
            this.setState({
              selectedTab: 'my',
            });
          }}
        > 
          <My style={{ backgroundColor: 'white', height: '100%', textAlign: 'center' }} />
        </TabBar.Item> 
      </TabBar>
      // </div>
    );
  }
}