/* eslint-disable jsx-a11y/anchor-is-valid */
import React, { Component } from 'react';
import { routerRedux } from 'dva/router';
import { Layout, Spin, message, Input, Button, Tabs, LocaleProvider, Menu, Dropdown } from 'antd';
import { Form, Icon as LegacyIcon } from '@ant-design/compatible';
import '@ant-design/compatible/assets/index.css';
import zhCN from 'antd/lib/locale-provider/zh_CN';
import * as commonFunc from '../../components/Common/commonFunc'; /* 通用单据方法 */ /* 通用单据方法 */
import * as commonServices from '../../services/services';
import oeeStyle from './oee.less';
import CommonOeeReport from '../../routes/oee/common/commonOeeRepot'; // 生产任务
import CommonOeeProcessReport from '../../routes/oee/common/oeeProcessReport'; // 工序任务
import OeeCurrentState from '../../routes/oee/common/oeeCurrentState';
import OeeWagesSearch from '../../routes/oee/common/oeeWagesSearch';
import * as commonConfig from '../../utils/config';
import * as commonUtils from '../../utils/utils';
import AntdDraggableModal from '../../components/Common/AntdDraggableModal';
import styles from '../../routes/IndexPage.less';
import currentState from '../../assets/oee/currentState.svg';
import processReport from '../../assets/oee/processRepoort.svg';
import productWork from '../../assets/oee/productWork.svg';
import wagesSearch from '../../assets/oee/wages.svg';
import addState from '../../assets/oee/addState.svg';
import passWord from '../../assets/oee/passWord.svg';
import close from '../../assets/oee/close.svg';
import firstTing from '../../assets/oee/firstTing.svg';
import changeWork from '../../assets/oee/changeWork.svg';
import OeeLabelPrint from './oeeLabelPrint';
import CommonOeeBill from './commonOeeBill';
import OeeCommonList from '../../routes/oee/common/oeeCommonList'; // 通用列表
import OeeCommonListTab from '../../routes/oee/common/oeeCommonListTab'; // 通用1拖N列表
import fileManage from '../../assets/oee/fileManage.svg';
import commonIcon from '../../assets/oee/commonIcon.svg';
import { VirtualKeyboard } from './oeeKeyBoard';
// import {object} from "prop-types";
import OeeChooseEmployee from '../../routes/oee/common/oeeChooseEmployee';
import FaceDetect from '../../components/FaceDetect';


const FormItem = Form.Item;
const { TabPane } = Tabs;

class CommonReport extends Component {
  constructor(props) {
    super(props);
    this.state = {
      pwdVisible: false,
      isRender: true,
      defaultActiveKey: '3',
      startWorkStr: 'startWork', /* 默认显示历史任务 */
      slaveSelectedRowKeysValue: [],
      dateVisibleState: false, // 开启日期选择弹窗
    };
  }
  // componentDidUpdate(prevProps) {
  //   console.log(666, prevProps);
  // }
  handleColseOee = () => {
    const { app, sModelsId } = this.props;
    const { sId } = app.userinfo;
    /* OEE退出时,当iplcNo>0时，调用sp_OEE_Exit过程  */
    const iPlcNo = commonUtils.isNotEmptyObject(app.iPlcNo) ? commonUtils.convertStrToNumber(app.iPlcNo) : 0;
    if (iPlcNo > 0) {
      const sProcedureName = 'sp_OEE_Exit';
      const sProcedureValue = {
        sMachineId: app.sMachineId,
        sTeamId: app.sTeamId,
      };
      this.handleGenericProcedureCall(sProcedureName, sProcedureValue, app.token, sModelsId);
    }
    const url = `${commonConfig.server_host}logout`;
    this.props.dispatch({ type: 'app/loginOut', payload: { url, sId, loginOutType: 'loginOeeOut' } });
  }
  /* 自定义存储过程 */
  handleGenericProcedureCall = async (sProcedureName, value, token, sModelsId) => {
    const url = `${commonConfig.server_host}procedureCall/doGenericProcedureCall?sModelsId=${sModelsId}`;
    const returnData = (await commonServices.postValueService(token, value, url)).data;
    if (returnData.code === -1) {
      this.props.getServiceError(returnData);
    }
  };
  handleSetPsw = () => {
    this.setState({ pwdVisible: true });
  }
  handleSubmitPwd = (e) => {
   
    /* 阻止表单提交动作 */
    e.preventDefault();
    this.psdform.validateFields((err, values) => {
      if (!err) {
        const { app } = this.props;
        values.sId = app.userinfo.sId;
        if (values.sUserPwd !== values.sUserPwdAgain) {
          message.error('密码输入不一致');
          return;
        }
        const url = `${commonConfig.server_host}sftlogininfo/updatePasswordUserName/update?sModelsId=${100}`;
        // const { dispatch } = this.state;
        this.props.dispatch({ type: 'app/editPwd', payload: { url, value: values, editPwdType: 'oee' } });
        this.setState({
          pwdVisible: false,
        });
      }
    });
  }
  handleSetPswCancel = () => {
    this.setState({
      userVisible: false,
      pwdVisible: false,
    });
  };
  handlePsdForm = (form) => {
    this.psdform = form;
  }
  handleColsePage = () => {
    // eslint-disable-next-line prefer-destructuring
    const userAgent = navigator.userAgent;
    if (userAgent.indexOf('Firefox') !== -1 || userAgent.indexOf('Chrome') !== -1) {
      window.location.href = 'about:blank';
    } else {
      window.opener = null;
      window.open(' ', '_self', ' ');
      window.close();
    }
  }
  handleTabClick = (params) => {
    const addState = {};
    if (params === '2') {
      this.props.dispatch(routerRedux.push('/indexOee/processReport'));
      if (this.state.defaultActiveKey === params) {
        addState.startWorkStr = this.state.clickCount === 1 ? 'currentState' : 'startWork';
        addState.clickCount = this.state.clickCount === 1 ? 2 : 1;
      } else {
        addState.startWorkStr = 'startWork';
        addState.clickCount = 1;
      }
      addState.IsReturnWork = true;
    } else if (params === '3') {
      this.props.dispatch(routerRedux.push('/indexOee/processReportList'));
    } else if (params === '4') {
      this.props.dispatch(routerRedux.push('/indexOee/process'));
    } else if (params === '7') {
      this.props.dispatch(routerRedux.push('/indexOee/wagesSearch'));
    } else if (params === '6' || params === '8' || params === '1' || params === '5' || params === '21' || params === '22' || params === '33') {
      return;
    }
    this.setState({ ...addState, defaultActiveKey: params, slaveSelectedRowKeysValue: [] });
  }
  handleReturnForm = (form) => {
    this.form = form;
  }

  /* btnLabelPrintConfig：打印标签按钮配置 存放跳转界面sModelsId,对应字段,sOeeFromRoute:点击窗体名字 */
  handleSaveCurrentState = (slaveDataNew, isReturnWork, linkToActiveKey, btnLabelPrintConfig, iCount, sOeeFromRoute) => { // 是否重新渲染oeeCurrentState页面
    /* OEE路由跳转到指定Tab */
    if (commonUtils.isNotEmptyObject(linkToActiveKey)) {
      this.setState({
        defaultActiveKey: linkToActiveKey,
      });
      return;
    }
    // const { app } = this.props;
    // const IsReturnWork = commonUtils.isEmpty(isReturnWork);
    const slaveData = commonUtils.isNotEmptyArr(slaveDataNew) ? slaveDataNew : this.state.currentStateData;
    const addState = {};
    if (commonUtils.isNotEmptyObject(btnLabelPrintConfig)) {
      addState.sPrintModelsId = btnLabelPrintConfig.sActiveId;
      addState.sPrintActiveKey = btnLabelPrintConfig.sActiveKey;
    }
    if (this.state.IsReturnWork && !sOeeFromRoute) {
      if (this.state.clickCount === 1) {
        addState.startWorkStr = 'startWork';
        addState.clickCount = 2;
      } else if (this.state.startWorkStr === 'startWork') {
        addState.startWorkStr = 'currentState';
      } else {
        addState.startWorkStr = 'startWork';
      }
    }
    /* 产量上报操作成功后跳转到当前任务列表 */
    if (iCount === 2 && !sOeeFromRoute) {
      addState.startWorkStr = 'currentState';
      addState.clickCount = 2;
    }
    if (iCount === 1 && !sOeeFromRoute) {
      addState.startWorkStr = 'startWork';
      addState.clickCount = 1;
    }
    // const startWorkStr =  ( && this.state.startWorkStr === 'currentState') ? 'startWork' : 'currentState';
    this.setState({
      currentStateData: slaveData,
      ...addState,
      defaultActiveKey: '2',
    });
  }

  /* 数据保存到state */
  handleSaveOeeState = (values, callback) => {
    this.setState(values, typeof callback === 'function' ? callback : undefined);
  };

  handleGetSlaveSelectedRowKeys = (slaveSelectedRowKeys) => { // 存储slaveSelectedRowKeys
    const slaveSelectedRowKeysValue = [];
    slaveSelectedRowKeysValue.push(slaveSelectedRowKeys[0]);
    this.setState({
      slaveSelectedRowKeysValue,
    });
  }
  handleInputOnClick = (e) => {
    if (VirtualKeyboard.isKeyBoard()) { // 关闭上次键盘
      VirtualKeyboard.closeKeyboard();
    }
    const keyboardValue = {};
    keyboardValue.value = '';
    VirtualKeyboard.showKeyboardSetState(keyboardValue, this, e);
  }
  handleKeyeBoardValueChange = (e, value) => { // e为输入框得节点， value为软键盘得输入值
    document.getElementById(`${e.props.id}`).value = value;
  }
  handleWagesSearchVisble = (visible) => { // 工资查询显示
    this.props.dispatch(routerRedux.push('/indexOee/process'));
    this.setState({
      defaultActiveKey: '22',
      dateVisibleState: visible, // 开启日期选择弹窗
      wagesSearchVisble: true,
    });
  }
  /* 点击下拉菜单切换界面 */
  handleMenuClick = (params, menuName, sModelsId) => {
    if (menuName === 'processReportAll') { // 点击所有任务菜单
      this.props.dispatch(routerRedux.push('/indexOee/process'));
      this.setState({
        defaultActiveKey: params,
        processReportAllVisible: true, /* 所有任务界面显示 */
        wagesSearchVisble: false, /* 工资界面隐藏 */
      });
    } else if (menuName === 'commonOeeListTab') {
      this.props.dispatch(routerRedux.push('/indexOee/oeeCommonListTab'));
      this.setState({
        defaultActiveKey: params,
        processReportAllVisible: false, /* 所有任务界面隐藏 */
        wagesSearchVisble: false, /* 工资界面隐藏 */
        commonListTableVisible: false, /* 通用列表界面显示 */
        commonOeeListTabVisible: true, /* 通用列表界面显示 */
        sModelsId,
      });
    } else if (menuName === 'commonListTable') { // 通用列表
      this.props.dispatch(routerRedux.push('/indexOee/oeeCommonList'));
      this.setState({
        defaultActiveKey: params,
        processReportAllVisible: false, /* 所有任务界面隐藏 */
        wagesSearchVisble: false, /* 工资界面隐藏 */
        commonListTableVisible: true, /* 通用列表界面显示 */
        commonOeeListTabVisible: false,
        sModelsId,
      });
    } else if (menuName === 'oeeFileManage') { // 附件管理
      this.props.dispatch(routerRedux.push('/indexOee/oeeFileManage'));
      this.setState({
        defaultActiveKey: params,
        processReportAllVisible: false, /* 所有任务界面隐藏 */
        wagesSearchVisble: false, /* 工资界面隐藏 */
        commonListTableVisible: false, /* 通用列表界面隐藏 */
        commonOeeListTabVisible: false,
        sModelsId,
      });
    }
  }
  handleChangeStatus = (item) => {
    const { sName: doWork } = item;
    if (doWork === 'onwork') {
      this.setState({
        faceVisible: true,
      });
    } else {
      this.setState({
        handoverModalVisible: true,
      });
    }
  }
  handleChangeStatus1 =async (item) => {
    const { app, sModelsId } = this.props;
    const plcMachinedata = commonUtils.isJSON(localStorage.getItem(`${commonConfig.prefix}plcMachinedata_${app.sMachineNameSId}`)) ? JSON.parse(localStorage.getItem(`${commonConfig.prefix}plcMachinedata_${app.sMachineNameSId}`)) : [];
    if (true) {
      const value = {
        plcMachinedata,
      };
      const doWorkEnd = item.sName;
      const url = `${commonConfig.server_host}oee/doUpdateStatus/${doWorkEnd}?sModelsId=${sModelsId}`;
      const returnData = (await commonServices.postValueService(app.token, value, url)).data;
      if (returnData.code === 1) {
        const dataReturn = returnData.dataset.rows[0];
        if (commonUtils.isNotEmptyObject(dataReturn)) {
          const plcMachineNewdata = { ...plcMachinedata, ...dataReturn };
          localStorage.setItem(`${commonConfig.prefix}plcMachinedata_${app.sMachineNameSId}`, JSON.stringify(plcMachineNewdata));/* 主页masterData */
          if (dataReturn.sStatus === 'offwork') {
            this.handleColseOee();
          } else if (typeof window.oeeStartworkHandleRefresh === 'function') {
            window.oeeStartworkHandleRefresh();
          }
        }
        message.success(`${item.sStatusName}状态切换${returnData.msg}`);
      } else { /*   失败   */
        message.error(`${item.sStatusName}状态切换${returnData.msg}`);
        // this.props.getServiceError(returnData);
      }
    }
  }
  handleChangeModalVisible = (visible, name) => {
    this.setState({
      [`${name}Visible`]: visible,
    });
  }
  handleIdentifySuccess = () => {
    this.setState({
      faceVisible: false,
      handoverModalVisible: true,
    });

    const { app } = this.props;
    const oeeEmployeeData = JSON.parse(localStorage.getItem(`${commonConfig.prefix}oeeEmployeeData_${app.sTeamNameSId}`) || '[]');
    const data = {
      sId: commonUtils.createSid(),
      sSlaveId: '12710101116958935729080',
      sMakePerson: 'zhangz',
      iOrder: 0,
      sEmployeeName: `张震${oeeEmployeeData.length + 1}`,
      iRowNum: oeeEmployeeData.length + 1,
      sEmployeeId: commonUtils.createSid(),
      handleType: 'add',
      sParentId: commonUtils.createSid(),
      dProportion: 1,
    };
    oeeEmployeeData.push(data);
    localStorage.setItem(`${commonConfig.prefix}oeeEmployeeData_${app.sTeamNameSId}`, JSON.stringify(oeeEmployeeData));
    if (window.reloadOeeStartWork) {
      window.reloadOeeStartWork();
    }
  };
  renderContent = (propsValue) => {
    if (location.pathname === '/indexOee/labelPrint') {
      /* 拿到选中数据行的sWorkOrerId */
      const {
        slaveSelectedRowKeysValue, currentStateData, sPrintModelsId, sPrintActiveKey,
      } = this.state;
      // console.log('渲染', sPrintModelsId, sPrintActiveKey);
      const iIndex = currentStateData.findIndex(item => slaveSelectedRowKeysValue.includes(item.sSlaveId));
      let sWorkOrderIdNew = null;
      if (iIndex > -1) {
        sWorkOrderIdNew = currentStateData[iIndex][sPrintActiveKey];
      }
      const appContent = {
        ...propsValue.app,
        currentPane: {
          name: 'OeelabelPrint',
          conditonValues: { [sPrintActiveKey]: sWorkOrderIdNew },
          title: 'OeelabelPrint',
          route: '/indexOee/labelPrint',
        },
      };
      return (
        <div>
          <OeeLabelPrint
            app={appContent}
            token={propsValue.app.token}
            checkedId={sWorkOrderIdNew}
            dispatch={propsValue.dispatch}
            sModelsId={commonUtils.isNotEmptyObject(sPrintModelsId) ? sPrintModelsId : '16054914490001410221224309727200'}
            onSaveCurrentState={this.handleSaveCurrentState}
            sModelsType="/indexOee/print/labelPrint"
            formRoute="/indexOee/labelPrint"
          />
        </div>
      );
    } else if (location.pathname === '/indexOee/commonOeeBill') {
      /* OEE通用单据 */
      const {
        slaveSelectedRowKeysValue, currentStateData, sPrintModelsId, sPrintActiveKey, checkedId,
      } = this.state;
      const iIndex = currentStateData.findIndex(item => slaveSelectedRowKeysValue.includes(item.sSlaveId));
      let sWorkOrderIdNew = null;
      if (iIndex > -1) {
        sWorkOrderIdNew = currentStateData[iIndex][sPrintActiveKey];
      }
      const appContent = {
        ...propsValue.app,
        currentPane: {
          name: 'commonOeeBill',
          conditonValues: { [sPrintActiveKey]: sWorkOrderIdNew },
          title: 'commonOeeBill',
          route: '/indexOee/commonOeeBill',
          copyTo: propsValue.app.currentPane.copyTo,
        },
      };
      return (
        <div>
          <CommonOeeBill
            app={appContent}
            token={propsValue.app.token}
            checkedId={commonUtils.isNotEmptyObject(checkedId) ? checkedId : ''}
            dispatch={propsValue.dispatch}
            sModelsId={commonUtils.isNotEmptyObject(sPrintModelsId) ? sPrintModelsId : '16054914490001410221224309727200'}
            onSaveCurrentState={this.handleSaveCurrentState}
            onSaveOeeState={this.handleSaveOeeState}
            startWorkStr={this.state.startWorkStr}
            sModelsType={commonUtils.isNotEmptyObject(propsValue.app.currentPane.sModelsType) ? propsValue.app.currentPane.sModelsType : 'commonOeeBill'}
            formRoute="/indexOee/commonOeeBill"
          />
        </div>
      );
    } else {
      return (
        <OeeCurrentState
          formRoute="/indexOee/oeeCurrentState"
          sModelsId="101251240115016043081412740"
          sModelsType="/indexOee/oeeCurrentState"
          onSaveCurrentState={this.handleSaveCurrentState}
          onSaveOeeState={this.handleSaveOeeState}
          startWorkStr={this.state.startWorkStr}
          isReturnWork={this.state.IsReturnWork}
          slaveSelectedRowKeys={this.state.slaveSelectedRowKeysValue}
          getSlaveSelectedRowKeys={this.handleGetSlaveSelectedRowKeys}
        />
      );
    }
  }
  render() {
    let { pageLoading } = this.props;
    if (pageLoading === undefined) {
      pageLoading = false;
    }
    return (
      <LocaleProvider locale={zhCN}>
        <div style={{ height: '100%' }}>
          <Spin spinning={pageLoading}>
            <div style={{ height: '100%' }}>
              <CommonReportComponent
                {...this.props}
                {...this.state}
                onSetPsw={this.handleSetPsw}
                onSetPswCancel={this.handleSetPswCancel}
                onSetPswModalClose={this.handleSetPswModalClose}
                onColseOee={this.handleColseOee}
                // onEject={this.handleEject}
                onSelectTree={this.handleTreeSelect}
                handleSubmitPwd={this.handleSubmitPwd}
                handlePsdForm={this.handlePsdForm}
                handleColsePage={this.handleColsePage}
                onTabClick={this.handleTabClick}
                onReturnForm={this.handleReturnForm}
                onSaveCurrentState={this.handleSaveCurrentState}
                onSaveOeeState={this.handleSaveOeeState}
                getSlaveSelectedRowKeys={this.handleGetSlaveSelectedRowKeys}
                onRenderContent={this.renderContent}
                onInputOnClick={this.handleInputOnClick}
                onWagesSearchVisble={this.handleWagesSearchVisble}
                onRenderMenuContent={this.handleMenuContent}
                onRenderMenuClick={this.handleMenuClick}
                onChangeStatus={this.handleChangeStatus}
                onChangeModalVisible={this.handleChangeModalVisible}
                onIdentifySuccess={this.handleIdentifySuccess}
              />
            </div>
          </Spin>
        </div>
      </LocaleProvider>
    );
  }
}

const CommonReportComponent = Form.create({
  mapPropsToFields(props) {
    const { masterData } = props;
    const obj = commonFunc.mapPropsToFields(masterData, Form);
    return obj;
  },
})((props) => {
  const {
    app,
    form,
    onReturnForm,
    slavePagination,
    isSmall,
    onSetPsw,
    onColseOee,
    pwdVisible,
    onSetPswCancel,
    onSetPswModalClose,
    handleSubmitPwd,
    handlePsdForm,
    onTabClick,
    // IsReturnWork,
    startWorkStr,
    // currentStateData,
    onRenderContent,
    dateVisibleState, // 工资查询传递显示值
    onWagesSearchVisble, // 查询工资函数
    onRenderMenuClick, // 所有任务
    sModelsId,
  } = props;
  // isSmall将分页变小，以及去掉跳转页面和总条数记录
  /*   回带表单   */
  const { getFieldDecorator } = props.form;
  if (commonUtils.isNotEmptyObject(slavePagination)) {
    if (isSmall) {
      slavePagination.showTotal = null;
    }
  }
  const formItemLayout = {
    labelCol: {
      xs: { span: 24 },
      sm: { span: 8 },
    },
    wrapperCol: {
      xs: { span: 24 },
      sm: { span: 13 },
    },
  };
  const tailFormItemLayout = {
    wrapperCol: {
      xs: {
        span: 24,
        offset: 0,
      },
      sm: {
        span: 16,
        offset: 8,
      },
    },
  };
  /*  密码不一致验证 */
  const passwordValidator = (rule, value, callback) => {
    const { getFieldValue } = form;
    if (value && value !== getFieldValue('sUserPwd')) {
      callback(NotSamePassword);
    }
    // 必须总是返回一个 callback，否则 validateFields 无法响应
    callback();
  };
  /* 质量管理菜单 */
  // eslint-disable-next-line no-unused-vars
  const qualityMenuData = (
    <Menu className={oeeStyle.indexMenuStyle}>
      <Menu.Item>
        {/* eslint-disable-next-line jsx-a11y/anchor-is-valid */}
        <a className={oeeStyle.addSetting}><img src={addState} alt="" />首检记录</a>
      </Menu.Item>
      <Menu.Item>
        {/* eslint-disable-next-line jsx-a11y/anchor-is-valid */}
        <a className={oeeStyle.firstThing} ><img src={firstTing} alt="" />自检记录</a>
      </Menu.Item>
    </Menu>
  );
  const { managementData, fileData } = app;
  const colorList = ['#006d75', '#177ddc', '#49aa19', '#cc3467', '#a734cc', '#3455cc', '#34a7cc', '#faad14', '#cc3444', '#8b6060'];
  const systemMenuData = (
    <Menu className={oeeStyle.indexMenuStyle}>
      <Menu.Item>
        {/* eslint-disable-next-line jsx-a11y/anchor-is-valid */}
        <a className={oeeStyle.processReport} onClick={onRenderMenuClick.bind(this, '22', 'processReportAll')}><img src={processReport} alt="" />所有任务</a>
      </Menu.Item>
      <Menu.Item>
        {/* eslint-disable-next-line jsx-a11y/anchor-is-valid */}
        <a className={oeeStyle.wagesSearch} onClick={props.onWagesSearchVisble}><img src={wagesSearch} alt="" />工资查询</a>
      </Menu.Item>
      {/* eslint-disable-next-line jsx-a11y/anchor-is-valid */}
      { commonUtils.isNotEmptyArrNew(managementData) ? managementData.map((item, index) => (<Menu.Item key={item.sId}><a style={{ background: colorList[(index + 3) % 10] }} onClick={item.sId === '101801153119616723640465020' ? onRenderMenuClick.bind(this, '22', 'commonOeeListTab', item.sId) : onRenderMenuClick.bind(this, '22', 'commonListTable', item.sId)}><img src={commonIcon} alt="" />{item.sMenuName}</a></Menu.Item>)) : '' }
      <Menu.Item>
        {/* eslint-disable-next-line jsx-a11y/anchor-is-valid */}
        <a className={oeeStyle.updatePassWord} onClick={onSetPsw}><img src={passWord} alt="" />修改密码</a>
      </Menu.Item>
    </Menu>
  );
  let statusData = [];
  if (commonUtils.isNotEmptyObject(app.sMachineNameSId)) {
    statusData = commonUtils.isJSON(localStorage.getItem(`${commonConfig.prefix}statusData_${app.sMachineNameSId}`)) ? JSON.parse(localStorage.getItem(`${commonConfig.prefix}statusData_${app.sMachineNameSId}`)) : [];
  }
  const statusMenuData = (
    <Menu className={oeeStyle.indexMenuStyle}>
      {
        statusData.map((item) => {
          // eslint-disable-next-line jsx-a11y/anchor-is-valid
         return (<Menu.Item><a className={oeeStyle.processReport} onClick={props.onChangeStatus.bind(this, item)}><img src={processReport} alt="" />{ item.sStatusName}</a></Menu.Item>);
        })
      }
    </Menu>
  );
  onReturnForm(form);
  const NotSamePassword = commonFunc.showMessage(app.commonConst, 'NotSamePassword');/* 两次密码输入不一致 */
  // const mProps = { ...commonBusiness.createMemoProps('master', props)};
  const ModifyPassword = commonFunc.showMessage(app.commonConst, 'ModifyPassword');/* 修改密码 */
  const oldPassword = commonFunc.showMessage(app.commonConst, 'oldPassword');/* 原密码 */
  const pleaseInputOldPassword = commonFunc.showMessage(app.commonConst, 'pleaseInputOldPassword');/* 请输入原密码 */
  const newPassword = commonFunc.showMessage(app.commonConst, 'newPassword');/* 新密码 */
  const peleaseInputNewPassword = commonFunc.showMessage(app.commonConst, 'peleaseInputNewPassword');/* 请输入新密码 */
  const confirmNewPassword = commonFunc.showMessage(app.commonConst, 'confirmNewPassword');/* 确认新密码 */
  const pleaseConfirmPasswordAgin = commonFunc.showMessage(app.commonConst, 'pleaseConfirmPasswordAgin');/* 请再次确认新密码 */
  const btnSave = commonFunc.showMessage(app.commonConst, 'BtnSave');/* 保存 */
  /* 当defaultActiveKey不等于2时,都是当前任务，当前任务点击切换历史记录，历史记录点击切换当前任务 */
  // const sStatusIndex = commonUtils.isNotEmptyArr(currentStateData) ? currentStateData.findIndex(item => item.sStatus === commonFunc.showMessage(app.commonConst, 'startWorking') || item.sStatus === 'startWorking') : -1;
  const fileMenuData = (
    <Menu className={oeeStyle.indexMenuStyle}>
      {
         /* eslint-disable-next-line jsx-a11y/anchor-is-valid */
         commonUtils.isNotEmptyArrNew(fileData) ? fileData.map((item, index) => (<Menu.Item key={item.sId}><a style={{ background: colorList[index % 10] }} onClick={onRenderMenuClick.bind(this, '33', 'oeeFileManage', item.sId)}><img src={commonIcon} alt="" />{item.sMenuName}</a></Menu.Item>)) : ''
      }
    </Menu>
  );
  return (
    <div id="commonReport" style={{ height: '100vh' }}>
      <Form style={{ height: '100%' }}>
        <Layout style={{ height: '100%' }} className="xly-list">
          <div className="buttons">
            <div className={oeeStyle.btnBrints} id="oeeHeader">
              <Tabs activeKey={props.defaultActiveKey} onChange={onTabClick}>
                <TabPane
                  tab={
                    <span>
                      {/* eslint-disable-next-line jsx-a11y/anchor-is-valid */}
                      <a className={oeeStyle.btnBrint} style={{ minWidth: '200px' }}>
                        <div>{app.userinfo.sUserName}</div>
                        <div>{app.sTeamNameSName}</div>
                        <div>{app.sMachineNameStr}{app.iPlcNo > 0 ? `(${app.iPlcNo})` : ''}</div>
                      </a>
                    </span>
                  }
                  key="1"
                />
                {
                  props.defaultActiveKey === '2' ?
                    <TabPane
                      tab={
                        <span>
                          {/* eslint-disable-next-line jsx-a11y/anchor-is-valid */}
                          <a className={oeeStyle.currenSetting} onClick={props.onSaveCurrentState.bind(this, undefined)}>
                            <img src={startWorkStr === 'startWork' ? currentState : changeWork} alt="" />
                            { startWorkStr === 'startWork' ? '历史记录' : '当前任务' }
                          </a>
                        </span>
                      }
                      key="2"
                    >
                      {
                        onRenderContent(props)
                      }
                    </TabPane> :
                    <TabPane
                      tab={
                        <span>
                          {/* eslint-disable-next-line jsx-a11y/anchor-is-valid */}
                          <a className={oeeStyle.currenSetting}>
                            <img src={changeWork} alt="" />
                             当前任务
                          </a>
                        </span>
                      }
                      key="2"
                    />
                }
                <TabPane
                  tab={
                    <span>
                      {/* eslint-disable-next-line jsx-a11y/anchor-is-valid */}
                      <a className={oeeStyle.reportWork}> <img src={productWork} alt="" /> 机台任务 </a>
                    </span>
                  }
                  key="3"
                >
                  {props.defaultActiveKey === '3' ?
                    <CommonOeeReport
                      {...props}
                      formRoute="/indexOee/processReportList"
                      sModelsId="101251240115016040215303900"
                      sModelsType="/indexOee/processReportList"
                    /> : ''
                  }
                </TabPane>
                {/* <TabPane */}
                {/*  tab={ */}
                {/*    <span> */}
                {/*      /!* eslint-disable-next-line jsx-a11y/anchor-is-valid *!/ */}
                {/*      <a className={oeeStyle.processReport}> <img src={processReport} alt="" /> 所有任务 </a> */}
                {/*    </span> */}
                {/*  } */}
                {/*  key="4" */}
                {/* > */}
                {/*  {props.defaultActiveKey === '4' ? */}
                {/*    <CommonOeeProcessReport */}
                {/*      {...props} */}
                {/*      formRoute="/indexOee/process" */}
                {/*      sModelsId="101251240115016087809801610" */}
                {/*      sModelsType="/indexOee/process" */}
                {/*    /> : '' */}
                {/*  } */}
                {/* </TabPane> */}
                {/* <TabPane */}
                {/*  tab={ */}
                {/*    <span> */}
                {/*      <Dropdown overlay={qualityMenuData} className={oeeStyle.indexDropdown} trigger="click"> */}
                {/*        /!* eslint-disable-next-line jsx-a11y/anchor-is-valid *!/ */}
                {/*        <a style={{ position: 'relative' }} className={oeeStyle.addSetting}><img src={addState} alt="" />质量管理 */}
                {/*          <LegacyIcon */}
                {/*            className="indexIcon" */}
                {/*            style={{ */}
                {/*              position: 'absolute', left: '39%', top: '55%', fontSize: '1.3rem', color: '#fff', */}
                {/*            }} */}
                {/*            type="caret-down" */}
                {/*          /> */}
                {/*        </a> */}
                {/*      </Dropdown> */}
                {/*    </span> */}
                {/*  } */}
                {/*  key="21" */}
                {/* /> */}
                {/* <TabPane */}
                {/*  tab={ */}
                {/*    <span> */}
                {/*      /!* eslint-disable-next-line jsx-a11y/anchor-is-valid *!/ */}
                {/*      <a className={oeeStyle.firstThing} ><img src={firstTing} alt="" />首件签样</a> */}
                {/*    </span> */}
                {/*  } */}
                {/*  key="6" */}
                {/* /> */}
                <TabPane
                  tab={
                    <span>
                      <Dropdown overlay={systemMenuData} className={oeeStyle.indexDropdown} trigger="click">
                        {/* eslint-disable-next-line jsx-a11y/anchor-is-valid */}
                        <a style={{ position: 'relative' }} className={oeeStyle.wagesSearch} ><img src={wagesSearch} alt="" />功能管理
                          <LegacyIcon
                            className="indexIcon"
                            style={{
                              position: 'absolute', left: '39%', top: '55%', fontSize: '1.3rem', color: '#fff',
                            }}
                            type="caret-down"
                          />
                        </a>
                      </Dropdown>
                    </span>
                  }
                  key="22"
                >
                  {props.wagesSearchVisble ?
                    <OeeWagesSearch
                      {...props}
                      formRoute="/indexOee/wagesSearch"
                      sModelsId="16082796220003580567226691758000"
                      sModelsType="/indexOee/wagesSearch"
                      dateVisibleState={dateVisibleState}
                      handleWagesSearchVisble={onWagesSearchVisble}
                    /> : props.processReportAllVisible ?
                      <CommonOeeProcessReport
                        {...props}
                        formRoute="/indexOee/process"
                        sModelsId="101251240115016087809801610"
                        sModelsType="/indexOee/process"
                      /> : props.commonListTableVisible ?
                        <OeeCommonList
                          key={Math.random().toString(36).substring(2)}
                          {...props}
                          formRoute="/indexOee/commonList"
                          sModelsId={sModelsId}
                          sModelsType="/indexOee/commonList"
                        /> : props.commonOeeListTabVisible ?
                          <OeeCommonListTab
                            key={Math.random().toString(36).substring(2)}
                            {...props}
                            formRoute="/indexOee/commonListTab"
                            sModelsId={sModelsId}
                            sModelsType="/indexOee/commonListTab"
                          /> : ''
                  }
                </TabPane>
                {commonUtils.isNotEmptyArrNew(fileData) ?
                  <TabPane
                    tab={
                      <span>
                        <Dropdown overlay={fileMenuData} className={oeeStyle.indexDropdown} trigger="click">
                          {/* eslint-disable-next-line jsx-a11y/anchor-is-valid */}
                          <a style={{ position: 'relative' }} className={oeeStyle.fileManage} ><img src={fileManage} alt="" />附件管理
                            <LegacyIcon
                              className="indexIcon"
                              style={{
                                position: 'absolute', left: '39%', top: '55%', fontSize: '1.3rem', color: '#fff',
                              }}
                              type="caret-down"
                            />
                          </a>
                        </Dropdown>
                      </span>
                    }
                    key="33"
                  >
                    <OeeCommonList
                      key={Math.random().toString(36).substring(2)}
                      {...props}
                      formRoute="/indexOee/oeeFileManage"
                      sModelsId={sModelsId}
                      sModelsType="/indexOee/oeeFileManage"
                    />
                  </TabPane> : ''
                }
                <TabPane
                  style={{ float: 'right' }}
                  tab={
                    <span>
                      {/* eslint-disable-next-line jsx-a11y/anchor-is-valid */}
                      <a className={oeeStyle.loginOut} onClick={onColseOee}><img src={close} alt="" />退出系统</a>
                    </span>
                  }
                  key="9"
                />
                <TabPane
                  tab={
                    <span>
                      <Dropdown overlay={statusMenuData} className={oeeStyle.indexDropdown} trigger="click">
                        {/* eslint-disable-next-line jsx-a11y/anchor-is-valid */}
                        <a style={{ position: 'relative' }} className={oeeStyle.addSetting}><img src={addState} alt="" />状态切换
                          <LegacyIcon
                            className="indexIcon"
                            style={{
                              position: 'absolute', left: '39%', top: '55%', fontSize: '1.3rem', color: '#fff',
                            }}
                            type="caret-down"
                          />
                        </a>
                      </Dropdown>
                    </span>
                  }
                  key="21"
                />
              </Tabs>
            </div>
          </div>
        </Layout>
      </Form>
      <div>
        {
          pwdVisible ?
            <AntdDraggableModal
              title={ModifyPassword}
              width={500}
              visible={pwdVisible}
              onCancel={onSetPswCancel}
              afterClose={onSetPswModalClose}
              footer={null}
              className={styles.changePwd}
            >
              {handlePsdForm(form)}
              <Form onSubmit={handleSubmitPwd} className={styles.popoverForm}>
                <FormItem label={oldPassword} {...formItemLayout}>
                  {getFieldDecorator('sOldPwd', {
                    rules: [{ required: true, message: pleaseInputOldPassword }],
                    // eslint-disable-next-line no-return-assign
                  })(<Input placeholder={pleaseInputOldPassword} type="password" onClick={props.onInputOnClick.bind(this, 'sOldPwd')} />)}
                </FormItem>
                <FormItem label={newPassword} {...formItemLayout} hasFeedback>
                  {getFieldDecorator('sUserPwd', {
                    rules: [{ required: true, message: peleaseInputNewPassword }],
                    // eslint-disable-next-line no-return-assign
                  })(<Input placeholder={peleaseInputNewPassword} type="password" onClick={props.onInputOnClick.bind(this, 'sUserPwd')} />)}
                </FormItem>
                <FormItem label={confirmNewPassword} {...formItemLayout} hasFeedback>
                  {getFieldDecorator('sUserPwdAgain', {
                    rules: [{ required: true, message: pleaseConfirmPasswordAgin }, {
                      validator: passwordValidator,
                    }],
                    validateFirst: true,
                    // eslint-disable-next-line no-return-assign
                  })(<Input placeholder={pleaseConfirmPasswordAgin} type="password" onClick={props.onInputOnClick.bind(this, 'sUserPwdAgain')} />)}
                </FormItem>
                <FormItem {...tailFormItemLayout}>
                  <Button type="primary" htmlType="submit">{btnSave}</Button>
                </FormItem>
              </Form>
            </AntdDraggableModal>
            : ''
        }
      </div>
      {
        props.handoverModalVisible ?
          <AntdDraggableModal
            title="交接明细"
            width={1200}
            visible={props.handoverModalVisible}
            onOk={() => { props.onChangeModalVisible(false, 'handoverModal'); }}
            onCancel={() => { props.onChangeModalVisible(false, 'handoverModal'); }}
            footer={null}
          >
            <OeeChooseEmployee
              sModelsId="101251240115016045406518220"
              sModelsType="/indexOee/oeeStartWork/chooseEmployee"
              formRoute="/indexOee/oeeStartWork/chooseEmployee"
              bHandover
              onReciveSelectData={() => {
                props.onChangeModalVisible(false, 'handoverModal');
              }}
            />
          </AntdDraggableModal>
          : ''
      }
      {
        props.faceVisible ?
          <AntdDraggableModal
            title="人脸识别"
            width={400}
            visible={props.faceVisible}
            onOk={() => { props.onChangeModalVisible(false, 'face'); }}
            onCancel={() => { props.onChangeModalVisible(false, 'face'); }}
            footer={null}
            style={{ paddingTop: '10%' }}
          >
            <div
              style={{
                width: '100%',
                display: 'flex',
                alignItems: 'center',
                justifyContent: 'center',
                fontSize: '2rem',
              }}
            >
              <FaceDetect
                loginAfterInit
                onIdentifySuccess={props.onIdentifySuccess}
                actionType="identifyFace"
              />
            </div>
          </AntdDraggableModal> : ''
      }
    </div>

  );
});

export default CommonReport;