/* eslint-disable */
import React from 'react';
import 'antd-mobile-v2/dist/antd-mobile.css';
import { Icon, NavBar, TabBar, Modal } from 'antd-mobile-v2';
// import { history } from 'dva/router';
import { connect,history  } from 'umi';

import styles from './IndexMobile.less';
import SceneCssMobile from './common/SceneCssMobile';
import MessageMobile from './common/MessageMobile';
import ContactsMobile from './common/ContactsMobile';
import WorkBenchMobile from './common/WorkBenchMobile';
import CommobileList from './commobileList/commobileList';
import ProcessReportMobile from './common/ProcessReportMobile';
import MyselfMobile from './common/MyselfMobile';
import ContactsInfoMobile from './common/ContactsInfoMobile';
import RevisePasswordMobile from './common/RevisePasswordMobile';
import CommobileBill from './common/commobileBill';
import CommobilePrintPdf from './common/commobilePrintPdf';
import Icon1 from '../../assets/mobile/1.png';
import Icon11 from '../../assets/mobile/11.png';
import Icon2 from '../../assets/mobile/2.png';
import Icon21 from '../../assets/mobile/21.png';
import Icon3 from '../../assets/mobile/3.png';
import Icon31 from '../../assets/mobile/31.png';
import Icon4 from '../../assets/mobile/4.png';
import Icon41 from '../../assets/mobile/41.png';
import Icon5 from '../../assets/mobile/5.png';
import Icon51 from '../../assets/mobile/51.png';
// import AppUtil from '../../utils/AppUtil';
import * as commonBusiness from '../../components/Common/commonBusiness';

// eslint-disable-next-line prefer-destructuring
const alert = Modal.alert;
class indexCssMobile extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      selectedTab: 'scene',
      title: '现场',
      hidden: false,
      fullScreen: true,
      touchStartPageX: 0, // 滑动开始的Y坐标
      touchStartPageY: 0,
    };
  }
  componentWillMount() {
    this.props.dispatch(history.push('/indexCssMobile')); // 刷新时更新路由，避免底部按钮和返回按钮错乱显示
    if (this.props.routing && this.props.routing) {
      const { state } = this.props.routing;
      if (state) {
        const { sId } = state;
        if (sId === 'myself') {
          this.setState({ selectedTab: 'myself' });
          // this.renderContent('contacts');
        }
      }
    }

    // AppUtil.addDrag();
  }
  handleTouchStart = (e) => {
    this.setState({
      touchStartPageX: e.changedTouches[0].pageX,
      touchStartPageY: e.changedTouches[0].pageY,
    });
  }

  handleTouchEnd = (e) => {
    const touchEndtPageX = e.changedTouches[0].pageX;
    const touchEndtPageY = e.changedTouches[0].pageY;
    const touchDireactionX = touchEndtPageX - this.state.touchStartPageX; // 滑动横向坐标
    const touchDireactionY = touchEndtPageY - this.state.touchStartPageY; // 滑动横向坐标
    if (touchDireactionX > 100 && touchDireactionY > -80) { // 滑动一定距离
      const { plus } = window;
      if (location.pathname === '/indexCssMobile') {
        alert('确定退出吗?', '', [
          { text: '取消', onPress: () => {} },
          { text: '是', onPress: () => plus.runtime.quit() }, // 关闭app
        ]);
      } else {
        window.history.back(-1);
      }
    }
  }
  renderContent(pageText) {
    if (pageText === 'message') {
      return (
        <div className={styles.demoContainer}>
          <MessageMobile sModelsId="15881420820002724305540568933000" />
        </div>
      );
    } else if (pageText === 'scene') {
      if (location.pathname === '/indexCssMobile/commobileList') {
        return (
          <div className={styles.demoContainer}>
            <CommobileList {...this.props} />
          </div>
        );
      } else if (location.pathname === '/indexCssMobile/printPdf') {
        return (
          <div className={styles.demoContainer}>
            <CommobilePrintPdf {...this.props} />
          </div>
        );
      } else if (location.pathname === '/indexCssMobile/processReport') {
        return (
          <div className={styles.demoContainer}>
            <ProcessReportMobile {...this.props} />
          </div>
        );
      } else if (location.pathname === '/indexCssMobile/commobileBill') {
        return (
          <div className={styles.demoContainer}>
            <CommobileBill {...this.props} />
          </div>
        );
      } else {
        return (
          <div className={styles.demoContainer}>
            <SceneCssMobile {...this.props} sModelType={pageText} sModelsId="101251240115015916850901130" />
            {/* 15881422910005021526504105317000 */}
          </div>
        );
      }
    } else if (pageText === 'workbench') {
      if (location.pathname === '/indexCssMobile/commobileList') {
        return (
          <div className={styles.demoContainer}>
            <CommobileList {...this.props} />
          </div>
        );
      } else {
        return (
          <div className={styles.demoContainer}>
            <WorkBenchMobile sModelsId="15881424880009660140992643529000" />
          </div>
        );
      }
    } else if (pageText === 'device') {
      return (
        <CommobileList {...this.props} sModelsId="101251240115015888433389260" />
      );
    } else if (pageText === 'myself') {
      if (location.pathname === '/indexCssMobile/contacts') {
        return (
          <div className={styles.demoContainer}>
            <ContactsMobile {...this.props} sModelType={pageText} sModelsId="101251240115015888435981690" />
          </div>
        );
      } else if (location.pathname === '/indexCssMobile/revisePassword') {
        return (
          <div className={styles.demoContainer}>
            <RevisePasswordMobile {...this.props} sModelsId="101251240115015888435981690" />
          </div>
        );
      } else if (location.pathname === '/indexCssMobile/contactsInfo') {
        return (
          <div className={styles.demoContainer}>
            <ContactsInfoMobile {...this.props} sModelsId="101251240115015892479567200" />
          </div>
        );
      } else {
        return (
          <div className={styles.demoContainer}>
            <MyselfMobile {...this.props} sModelType={pageText} sModelsId="101251240115015888435981690" />
          </div>
        );
      }
    }
  }

  render() {
    const { hidden } = this.state;
    const TabBarHidden = location.pathname === '/indexCssMobile' ? hidden : true;
    return (
      <div id="tab-bar" className={styles.demo}>
        {this.state.selectedTab === 'scene' ? this.renderContent(this.state.selectedTab) : ''}
      </div>
    );
  }
}
export default connect(({ app, routing }) =>
  ({ app, routing }))(indexCssMobile);