/*
 * Create:      柿子
 * CreateDate:  2022/08/31
 * Describe：   配镜管理 - 配镜申请单列表 / 供应商 - 订单管理 / 库房 - 订单审核 / 确认发货 / 接收采购计划(库存产品)
 * suppFlag:              N               Y                  K                G         S
 * */
import React, { Component } from 'react';
import { Tabs, Input, Select, Button, Divider, Icon, Menu, Dropdown, Tooltip, Tag, message, Popconfirm, Modal, Upload } from 'antd';
import { Util, Keup, dayFormat } from 'tools';
import { handleExcel } from 'tools/handleExcel';
import { $loadTemplate } from 'pages/lodop/Common/Print.js';
import store from 'store';
import moment from 'moment';
import ShowMedicalRecordModal from 'pages/workstation/component/ShowMedicalRecordModal';
import ShowComponentModal from 'pages/workstation/component/ShowComponentModal';
import PubilcTablePagination from 'pages/common/PubilcTablePagination.jsx';
import GetPatientInformation from '../component/GetPatientInformation';
import BatchMirrorRetrievalModal from './component/BatchMirrorRetrievalModal';
import LogisticsDocEntry from './component/LogisticsDocEntry';
import RangeDatePicker from 'components/rangePicker/index';
import TakeAMirrorModal from './component/TakeAMirrorModal';
import PrescriptionExchangeType from './component/PrescriptionExchangeType'; // 处方交换
import MatchingDetails from './component/MatchingDetails';
import DeliverGoods from './component/DeliverGoods';
import ReturnOrder from './component/ReturnOrder';
import './style/index.less';

const { TabPane } = Tabs;

class GlassesMatchingApplicationList extends Component {
  constructor(props) {
    super(props);
    let userData = React.$getSessionData();
    this.state = {
      userData,
      selectData: {},
      queryParams: { // 查询条件
        hospID: userData?.hospID || undefined, // 医院
        endDate: moment().format(dayFormat), // 申请单日期
        startDate: moment().format(dayFormat),
        inputDesc: undefined, // 订购产品
        orderTypeID: undefined, // 订单类型
        billingUserID: undefined, // 开单人员
        brandID: undefined, // 品牌
        varietyID: undefined, // 品种
        takeEndDate: undefined, // 取镜日期
        takeStartDate: undefined,
        payStatusCode: undefined, // 收费状态
        orderStatusID: undefined, // 订单状态
        logisticsNo: undefined, // 快递单号
        vendorID: undefined, // 供应商
        purNo: undefined, // 采购单号
        handleStatus: undefined, // 处理状态
      },
      headerHeight: 100,
      tabActiveKey: undefined, // 当前状态
      page: 1,
      pageSize: 20,
      total: 0,
      loading: false,
      tableData: [],
      totalWidth: 1850,
      columns: [],
      selectedRows: [],
      selectedRowKeys: [],
      tabStatus: [], // 页签数据
      varietySelectData: [], // 品种下拉数据
      suppFlag: '', // 界面标识 - Y(订单管理) / K (库房订单审核)
      rowID: '', // 选中行数据
      isShowComponentModal: false,
      componentModalData: {},
      purFlag: 'N', // 默认订单日期
      categoryData: {},
      emrVisible: false,
      emrAdmID: '',
      exportBtnLoading: false, // 导出状态
      importBtnLoading: false, // 导入状态
      exportDetailBtnLoading: false, // 导出详情状态
    };

    this.staticColumns = [{
      key: 1,
      title: '订单号',
      dataIndex: 'reqNo',
      align: 'center',
      width: 150
    }, {
      key: 2,
      title: '姓名',
      dataIndex: 'patName',
      align: 'center',
      width: 100
    }, {
      key: 3,
      title: '性别',
      dataIndex: 'sexDesc',
      align: 'center',
      width: 80
    }, {
      key: 4,
      title: '年龄',
      dataIndex: 'patAge',
      align: 'center',
      width: 80
    }, {
      key: 5,
      title: '病人ID',
      dataIndex: 'patNo',
      align: 'center',
      width: 100
    }, {
      key: 6,
      title: '预交金',
      dataIndex: 'deposit',
      align: 'center',
      width: 100
    }, {
      key: 7,
      title: '联系电话',
      dataIndex: 'patMobile',
      align: 'center',
      width: 150
    }, {
      key: 8,
      title: '订购产品',
      dataIndex: 'productDesc',
      align: 'center',
      width: 200
    }, {
      key: 9,
      title: '品牌',
      dataIndex: 'brandDesc',
      align: 'center',
      width: 100
    }, {
      key: 10,
      title: '规格型号',
      dataIndex: 'varietyDesc',
      align: 'center',
      width: 100
    }, {
      key: 11,
      title: '总金额',
      dataIndex: 'sumAmt',
      align: 'center',
      width: 100
    }, {
      key: 12,
      title: '收费状态',
      dataIndex: 'payStatusDesc',
      align: 'center',
      width: 100
    }, {
      key: 13,
      title: '订单状态',
      dataIndex: 'reqStatusDesc',
      align: 'center',
      width: 100
    }, {
      key: 14,
      title: '开单日期',
      dataIndex: 'createDate',
      align: 'center',
      width: 150
    }, {
      key: 15,
      title: '开单人',
      dataIndex: 'createUserDesc',
      align: 'center',
      width: 100
    }, {
      key: 16,
      title: '备注',
      dataIndex: 'remark',
      align: 'center',
      width: 100
    }]
  }

  componentDidMount() {
    let newCategory;
    if ('paras' in this.props && this.props.paras && this.props.paras.params) { // 侧菜单获取类别参数
      newCategory = this.props.paras.params;
    } else {
      if ('location' in this.props && this.props.location.state && this.props.location.state.params) { // 头菜单获取类别参数
        newCategory = this.props.location.state.params;
        React.$setSessionData('glassesMatchingApplicationList', newCategory, false);
      } else { // 头菜单刷新界面时获取类别
        newCategory = React.$getSessionData('glassesMatchingApplicationList', false);
      }
    }
    let suppFlag = Util.getValueByUrlStr(newCategory, 'suppFlag'); // 订单管理为Y，配镜管理默认不传
    if (suppFlag === 'G' || suppFlag === 'Y') { // 集团发货确认、供应商订单管理不默认医院
      this.state.queryParams.hospID = undefined;
    }
    let categoryData = Util.getObjByUrlStr(newCategory);
    console.log("categoryData", categoryData);
    this.setState({ suppFlag, categoryData }, () => {
      this.getSelectData();
      this.getTableColumns();
    });
  }

  componentWillUnmount() {
    React.$removeSessionData('patientData');
    this.setState = (state, callback) => { return; }
  }

  // 获取下拉数据
  getSelectData = async () => {
    try {
      const { suppFlag, queryParams } = this.state;
      let data = {
        params: [{
          suppFlag
        }]
      }
      let res = await React.$asyncPost(this, '17030023', data);
      let result = res?.result || {};
      this.state.queryParams.endDate = result?.endDate || queryParams.endDate; // 申请单日期
      this.state.queryParams.startDate = result?.startDate || queryParams.startDate;
      this.state.queryParams.orderTypeID = result && 'defaultOrderTypeID' in result ? result.defaultOrderTypeID : undefined;
      // 动态获取查询条件区域的高度，查询条件过多，可能两行放不下
      var box = document.querySelector('.gmaf-header');
      this.setState({
        selectData: result,
        tabStatus: result?.tabStatus || [],
        tabActiveKey: result && 'defaultTab' in result ? result.defaultTab : '',
        headerHeight: box?.clientHeight || box?.offsetHeight || 100
      }, () => {
        this.getTableData('N');
      });
    } catch (error) {
      this.setState({ selectData: {} });
    }
  }

  // 获取表头数据
  getTableColumns = async () => {
    try {
      const { categoryData } = this.state;
      let data = {
        params: [{
          compontName: categoryData?.componentName || 'GlassesMatchingApplicationList',
          type: 'C',
        }]
      }
      let orderStatusColor = {
        '待发送供应商': 'purple',
        '供应商退回': 'red',
        '等待取镜': 'orange',
        '已取镜': 'success',
        '退镜': '#999',
      }
      let res = await React.$asyncPost(this, '01040073', data);
      let columns = res.result && res.result.C && res.result.C.length > 0 ? res.result.C.map(item => {
        return {
          ...item,
          render: (text, record) => {
            if (item.dataIndex === 'prePayAmt' || item.dataIndex === 'totalAmount') { // 预交金和总金额
              return (
                <span style={{ color: '#fa8c17' }}>{text}</span>
              )
            } else if (item.dataIndex === 'chargingStatusDesc') { // 收费状态
              return (
                <span style={{ color: text === '已退费' ? 'red' : '' }}>{text}</span>
              )
            } else if (item.dataIndex === 'orderStatusDesc') { // 订单状态
              return (
                <Tag style={{ fontWeight: 'normal' }} color={orderStatusColor[text] || 'gold'}>{text}</Tag>
              )
            } else if (item.dataIndex === 'exchange' && text === '是') { // 需换货
              return (
                <span style={{ color: 'red' }}>{text}</span>
              );
            } else if (item.dataIndex === 'urgentSign' && (text === '一级加急' || text === '二级加急')) { // 加急标志
              return (
                <Tag style={{ fontWeight: 'normal' }} color={text === '一级加急' ? '#FF3D00' : (text === '二级加急' ? '#FA8C17' : '')}>{text}</Tag>
              );
            } else {
              return (
                <Tooltip title={text}>
                  <span className="ellipsis" style={{ width: '100%', display: 'block' }}>{text}</span>
                </Tooltip>
              );
            }
          },
        }
      }) : [];
      if (columns && columns.length > 0) {
        this.setState({
          columns,
          totalWidth: res.totalWidth
        })
      }
    } catch (error) {
      console.log(error)
    }
  }

  // 查询
  handleQuery = (isTips) => {
    this.setState({ page: 1 }, () => {
      this.getTableData(isTips);
    })
  }

  // 修改操作框数据
  handleModifyInputValue = (e, dataIndex) => {
    this.state.queryParams[dataIndex] = e;
    dataIndex === 'brandID' ? this.getVarietySelectData(e) : '';
    this.setState({}, () => {
      if (dataIndex === 'startDate' || dataIndex === 'endDate' || dataIndex === 'takeStartDate' || dataIndex === 'takeEndDate' || dataIndex === 'orderStatusID' || dataIndex === 'handleStatus') {
        this.handleQuery();
      }
    })
  }

  // 获取品种下拉数据
  getVarietySelectData = async (e) => {
    try {
      if (!e) return;
      let data = {
        params: [{
          desc: '',
          brandID: e,
        }]
      }
      let res = await React.$asyncPost(this, '17060005', data);
      this.state.queryParams.varietyID = undefined;
      this.setState({ varietySelectData: res.result?.rows || [] });
    } catch (error) {
      this.setState({ varietySelectData: [] });
    }
  }

  // tabs切换
  handleTabsChange = key => {
    this.setState({ tabActiveKey: key }, () => {
      this.handleQuery();
    })
  }

  // 请求列表数据
  getTableData = async (isTips) => {
    try {
      this.setState({ loading: true })
      let { suppFlag, tabActiveKey, pageSize, page, queryParams, tabStatus, purFlag } = this.state;
      let patID = this.patientRef && this.patientRef.getPatientID();
      let data = {
        params: [{
          ...queryParams,
          suppFlag, // 界面标识
          takeFlag: tabActiveKey === '' && queryParams && (queryParams.takeEndDate || queryParams.takeStartDate) ? 'Y' : 'N', // 取镜日期标志
          takeEndDate: tabActiveKey === '' ? queryParams?.takeEndDate : undefined, // 取镜日期
          takeStartDate: tabActiveKey === '' ? queryParams?.takeStartDate : undefined,
          patInfo: patID, // 人员标识
          tabStatusID: tabActiveKey,
          purFlag
        }],
        pagination: [{
          pageSize,
          currentPage: page
        }]
      }
      let res = await React.$asyncPost(this, '17030024', data);
      let tableData = res.result && 'rows' in res.result ? Util.addKeyValueToDataSource(res.result.rows, 'glassesRequestID') : [];
      let statusArr = res.result && 'statusArr' in res.result ? res.result.statusArr : [];
      // for (let i = 0; i < tabStatus.length; i++) {
      //   for (let j = 0; j < statusArr.length; j++) {
      //     if (tabStatus[i] && 'id' in tabStatus[i] && statusArr[j] && 'code' in statusArr[j] && (tabStatus[i].id === statusArr[j].code)) {
      //       tabStatus[i]['count'] = statusArr[j]?.count || 0;
      //       continue;
      //     }
      //   }
      // }
      const statusObj = statusArr.reduce((obj, item) => {
        if (item && 'code' in item) {
          obj[item.code] = item;
        }
        return obj;
      }, {});

      for (let i = 0; i < tabStatus.length; i++) {
        if (tabStatus[i] && 'id' in tabStatus[i]) {
          const matchedItem = statusObj[tabStatus[i].id];
          if (matchedItem) {
            tabStatus[i]['count'] = matchedItem.count || 0;
          } else {
            tabStatus[i]['count'] = 0;
          }
        }
      }
      this.setState({ tableData, total: res.result.total, loading: false, tabStatus, selectedRowKeys: [], selectedRows: [], rowID: '' }, () => {
        isTips !== 'N' && this.state.total < 1 ? message.error('未查询到相关数据！') : '';
      });
    } catch (error) {
      this.setState({ tableData: [], total: 0, loading: false, selectedRowKeys: [], selectedRows: [], rowID: '' });
    }
  }

  // 分页操作
  compilePage = (page, pageSize) => {
    this.setState({ page, pageSize }, () => {
      this.getTableData();
    })
  }

  // 操作行
  onClickRowPublic = (record) => {
    return {
      // 单击行选中
      onClick: () => {
        if (this.state.rowID === '' || (this.state.rowID && (this.state.rowID !== record.key))) {
          this.setState({ rowID: record.key });
        } else {
          this.setState({ rowID: '' });
        }
      },
      // 双击直接查看详情
      onDoubleClick: () => {
        this.handleViewDetails(record, '')
      }
    }
  }

  // 选中行操作
  setRowClassNamePublic = (record) => {
    return record.key === this.state.rowID ? 'clickRowStyle' : (record?.exchange === '是' ? 'common-row-color-FDECF2' : '');
  }

  // 列表选择操作
  handleSelectedRowKeysChange = (selectedRowKeys, selectedRows) => {
    this.setState({
      selectedRows,
      selectedRowKeys,
    })
  }

  // 查看详情
  handleViewDetails = (record, e) => {
    React.$stopPropagation(e);
    const { suppFlag } = this.state;
    this.matchingDetailsRef && this.matchingDetailsRef.modifyVisible(true, { ...record, suppFlag });
  }

  // 取镜
  handleTakeAMirror = record => {
    const { selectData } = this.state;
    if (selectData?.mirrorRetrievalFee === 'Y' && record?.payStatusDesc !== '已收费') { // 取镜前判断是否已缴费
      message.error('当前订单未缴费，不允许取镜');
      return;
    }
    this.takeAMirrorRef && this.takeAMirrorRef.modifyVisible(true, record);
  }

  // 批量修改申请单状态
  modifyApplicationFormStatus = async (statusCode, requestIDArr, compnentSource, remark, isClose) => {
    try {
      const { selectedRowKeys } = this.state;
      let data = {
        params: [{
          requestIDArr: requestIDArr && Array.isArray(requestIDArr) && requestIDArr.length > 0 ? requestIDArr : selectedRowKeys,
          statusCode,
          remark, // 退回时填写，退回原因
        }]
      }
      let res = await React.$asyncPost(this, '17030026', data);
      message.success(res.errorMessage || '操作成功');
      if (isClose !== 'N') {
        compnentSource === 'returnOrder' && this.returnOrderRef && this.returnOrderRef.modifyVisible(false, '', '', 'Y'); // 关闭退回订单弹窗
        compnentSource === 'matchingDetails' && this.matchingDetailsRef && this.matchingDetailsRef.modifyVisible(false); // 关闭详情弹窗
      } else {
        compnentSource === 'matchingDetails' && this.matchingDetailsRef && this.matchingDetailsRef.getMatchingDetails();
      }
      this.handleQuery('N');
    } catch (error) {
      console.log(error)
    }
  }

  // 补打配镜单/批量打印发货单
  handlePrint = async (invoiceFlag, suppFlag) => {
    try {
      let { selectedRowKeys } = this.state;
      if (!(selectedRowKeys && selectedRowKeys.length > 0)) {
        message.error('请选择需要打印的数据');
        return;
      }
      // Y:发货订单 N:配镜申请订单
      if (invoiceFlag == 'Y') {
        let data = {
          params: [{
            glassesRequestIDArr: selectedRowKeys,
            invoiceFlag, // Y:发货订单 N:配镜申请订单
            suppFlag, // 供应商标志 - 供应商界面打印脱敏
          }]
        }
        let res = await React.$asyncPost(this, '17030077', data);
        let dataArr = res?.result || [];
        dataArr && dataArr.map((item, i) => {
          $loadTemplate(item.template, item.printStr);
        });
        if (!(dataArr && dataArr.length > 0)) {
          message.warning('暂无打印数据');
        }
      } else {
        let data = {
          params: [{
            glassesRequestIDArr: selectedRowKeys,
            viewFlag: 'Y'
          }]
        }
        let res = await React.$asyncPost(this, '17030084', data);
        let dataArr = res?.result || [];
        dataArr && dataArr.map((item, i) => {
          $loadTemplate(item.template, item.printStr);
        });
        if (!(dataArr && dataArr.length > 0)) {
          message.warning('暂无打印数据');
        }
      }


    } catch (error) {
      console.log(error);
    }
  }

  // 群发通知
  handleMassNotification = () => {
    message.warning('功能开发中，请耐心等待……');
  }

  // 退回订单
  handleReturnOrder = (statusCode) => {
    let { selectedRowKeys } = this.state;
    if (selectedRowKeys && selectedRowKeys.length > 0) {
      this.returnOrderRef && this.returnOrderRef.modifyVisible(true, {}, statusCode);
    }
  }

  // 详情界面退回订单
  handleDetailsReturnOrder = (record, statusCode) => {
    this.setState({ selectedRowKeys: [record?.glassesRequestID], selectedRows: [{ ...record }] }, () => {
      this.returnOrderRef && this.returnOrderRef.modifyVisible(true, {}, statusCode);
    })
  }

  // 发货
  handleDeliverGoods = (record, e) => {
    let batchArr = [];
    if (record === 'batch') { // 批量发货
      batchArr = this.state.selectedRowKeys;
    } else {
      batchArr.push(record?.glassesRequestID);
    }
    this.deliverGoodsRef && this.deliverGoodsRef.modifyVisible(true, batchArr);
  }

  // 撤销
  handleRevoke = (statusCode, typeCode, statusTitle) => {
    const { selectedRows } = this.state;
    let flag = true;
    let reqStatusDesc = '';
    for (var i = 0; i < selectedRows.length; i++) {
      if (selectedRows[i].reqStatusCode !== typeCode) {
        flag = false;
        reqStatusDesc = selectedRows[i]?.reqStatusDesc; // 状态描述
        break;
      }
    }
    if (flag) {
      this.modifyApplicationFormStatus(statusCode);
    } else {
      message.error(reqStatusDesc + '状态不能' + statusTitle + '!');
    }
  }

  // 就诊历史
  handleVisitHistory = (record, e) => {
    React.$stopPropagation(e);
    let patientData = {
      patID: record?.patID,
      admID: record?.admID,
    };
    React.$setSessionData('patientData', patientData);
    this.setState({
      isShowComponentModal: true,
      componentModalData: {
        ENDesc: '',
        title: '历史查询',
        component: 'pages/workstation/component/ConsultationHistory.jsx',
      }
    })
  }

  // 取镜预约
  handleMirrorAppointment = (record, e) => {
    React.$stopPropagation(e);
    message.info('功能开发中，请耐心等待……')
  }

  //隐藏弹出框
  hideModal = (name) => {
    this.setState({
      [name]: false
    });
  }

  // 批量录入物流单
  handleEnterLogisticsNo = () => {
    this.logisticsDocRef && this.logisticsDocRef.modifyVisible(true);
  }

  // expressServiceID - 物流公司ID, logisticsNo - 物流单号
  handleConfirmEntryLogisticsNo = async (expressServiceID, logisticsNo) => {
    try {
      const { selectedRowKeys } = this.state;
      let data = {
        params: [{
          requestIDArr: selectedRowKeys,
          expressServiceID,
          logisticsNo,
        }]
      }
      let res = await React.$asyncPost(this, '17030070', data);
      message.success(res.errorMessage || '操作成功');
      this.logisticsDocRef && this.logisticsDocRef.modifyVisible(false, 'Y');
      this.handleQuery('N');
    } catch (error) {
      console.log(error);
    }
  }

  // 修改行数据状态
  handleModifyRowStatus = (statusCode, record, e) => {
    React.$stopPropagation(e);
    this.modifyApplicationFormStatus(statusCode, [record?.glassesRequestID])
  }

  // 日期切换
  handleDateFlagChange = flag => {
    this.setState({ purFlag: flag });
  }

  // 供应商退回状态删除订单
  handleReturnedByTheSupplier = () => {
    const { selectedRows } = this.state;
    let reqNoArr = [];
    for (var i = 0; i < selectedRows.length; i++) {
      if (selectedRows[i].payStatusDesc === '已收费') {
        reqNoArr.push(selectedRows[i].reqNo);
      }
    }
    Modal.confirm({
      title: '确认删除提醒',
      content: reqNoArr && reqNoArr.length > 0 ? ('存在已缴费订单，删除后订单作废，患者可到收费处退费（' + reqNoArr.join('、') + '）') : '删除不可恢复，您确定要删除吗?',
      okText: '确认',
      cancelText: '取消',
      onOk: () => this.modifyApplicationFormStatus('08'),
      onCancel: () => { },
    });
  }

  // 修改病历弹窗
  modifyEMRModal = (visible, record, e) => {
    React.$stopPropagation(e);
    if (visible && !(record && record.admID)) {
      message.error('就诊ID不存在，请稍后重试！');
      return;
    }
    this.setState({ emrVisible: visible, emrAdmID: record?.admID || '' });
  }

  // 处方交换
  handlePrescriptionExchange = async (record) => {
    // this.matchingDetailsRef && this.matchingDetailsRef.modifyVisible(true, { ...record, suppFlag: 'exchange' });
    this.exchangeRef && this.exchangeRef.modifyVisible(true, record);
  }

  // 批量取镜
  handleBatchMirrorRetrieval = () => {
    const { selectedRows, categoryData } = this.state;
    let takeData = [];
    if (categoryData?.takeTarget === 'all') {
      takeData = [...selectedRows];
    } else { // 只取待取镜数据
      takeData = selectedRows && selectedRows.filter(item => item.reqStatusCode === (item.getStatusCode || '36'));
    }
    this.batchMirrorRetrievalRef && this.batchMirrorRetrievalRef.modifyVisible(true, takeData);
  }

  // 批量撤回订单
  handleBatchWithdrawal = () => {
    const { selectedRows } = this.state;
    if (selectedRows && selectedRows.length > 0) {
      let sendArr = [];
      let reqNoArr = [];
      for (let i = 0; i < selectedRows.length; i++) {
        if (selectedRows[i].reqStatusCode === '02') {
          sendArr.push(selectedRows[i]?.glassesRequestID || '');
          reqNoArr.push(selectedRows[i]?.reqNo || '');
        }
      }
      if (sendArr.length === selectedRows.length) {
        this.modifyApplicationFormStatus('09');
      } else if (sendArr.length > 0) {
        Modal.confirm({
          title: '可撤回订单核对',
          content: reqNoArr.join(','),
          okText: '确认撤回',
          cancelText: '取消',
          onOk: () => this.modifyApplicationFormStatus('09', sendArr),
          onCancel: () => { },
        });
      } else {
        message.error('无可撤回订单！');
      }
    }
  };

  // 导出
  handleExport = async (exportCode, loadingDataIndex, reactExportFlag) => {
    try {
      let { suppFlag, tabActiveKey, pageSize, page, queryParams, purFlag, tableData } = this.state;
      this.setState({ [loadingDataIndex]: true });
      let patID = this.patientRef && this.patientRef.getPatientID();
      let data = {
        params: [{
          ...queryParams,
          suppFlag, // 界面标识
          takeFlag: tabActiveKey === '' && queryParams && (queryParams.takeEndDate || queryParams.takeStartDate) ? 'Y' : 'N', // 取镜日期标志
          takeEndDate: tabActiveKey === '' ? queryParams?.takeEndDate : undefined, // 取镜日期
          takeStartDate: tabActiveKey === '' ? queryParams?.takeStartDate : undefined,
          patInfo: patID, // 人员标识
          tabStatusID: tabActiveKey,
          purFlag
        }],
        pagination: [{
          pageSize,
          currentPage: page
        }]
      }
      let res = await React.$asyncPost(this, exportCode, data);
      let exportData = res?.result?.exportData || res?.result?.url || res?.result || [];
      if (reactExportFlag === 'Y') { // 前端导出标志
        for (let i = 0; i < exportData.length; i++) {
          let recordData = exportData[i];
          handleExcel.exportExcelWithExcelJs(
            recordData?.columnArr || recordData?.column || [], // 表头数据
            recordData?.dataArr || recordData?.tableData || [], // 数据源
            recordData?.fileName || '', // 导出文件名
            recordData?.format || '', // 导出文件后缀
            recordData?.sheetName || '', // 导出文件页签sheet名称
          );
        }
      } else {
        handleExcel.downloadExcel(exportData);
      }
      Keup.ModalMessage(parseInt(res?.countdown || 3), this, (res?.modalTitle || '导出成功，') + (res?.modalContent || ('共计' + (tableData?.length || 1) + '条订单，' + (exportData?.length || 1) + '份文件，请在浏览器右上角选择文件下载！')), '自动关闭', 'destroy', '知道了', 'success')
      this.setState({ [loadingDataIndex]: false });
    } catch (error) {
      this.setState({ [loadingDataIndex]: false });
    }
  };

  // 导入
  handleImport = (file, fileList) => {
    let { categoryData } = this.state;
    handleExcel.importExcel(file, 'keyVal')
      .then(async (jsonData) => {
        let data = {
          params: [{
            importArr: jsonData,
            componentName: categoryData?.componentName || undefined, // 组件名
          }]
        }
        let res = await React.$asyncPost(this, categoryData?.importCode || '', data);
        let result = res?.result || {};
        let excelData = Array.isArray(result) ? result : (result?.rows || result?.data || []);
        this.deliverGoodsRef && this.deliverGoodsRef.modifyVisible(true, excelData, 'import', res?.logistics || {});
      })
      .catch((error) => {
        console.error(error); // 处理错误
      });
    return false;
  }

  render() {
    const { suppFlag, headerHeight, selectData, queryParams, tabActiveKey, page, total, loading, tableData, totalWidth, columns, selectedRowKeys, tabStatus, varietySelectData, isShowComponentModal, purFlag,
      categoryData, emrVisible, emrAdmID, exportBtnLoading, importBtnLoading, exportDetailBtnLoading
    } = this.state;
    // 列表多选操作
    let rowSelection = {
      selectedRowKeys,
      onChange: this.handleSelectedRowKeysChange,
    };

    // 配镜申请单列表操作
    const glassesMatchingApplicationFormOperationObj = {
      width: 190,
      title: '操作',
      fixed: 'right',
      align: 'left',
      key: 'operation',
      render: (text, record) => (
        <span style={{ padding: '0 12px' }}>
          <span className="span" onClick={(e) => this.handleViewDetails(record, e)}>详情</span>
          {record && record.reqStatusCode === (record?.getStatusCode || '36') ? ( // 转移质检
            <>
              <Divider type="vertical" />
              <span className="span" onClick={(e) => this.handleTakeAMirror(record, e)}>取镜</span>
            </>
          ) : ''}
          {record && record.reqStatusCode === '06' ? ( // 医院采购退回配镜申请单可以重新提交
            <>
              <Divider type="vertical" />
              <span className="span" onClick={(e) => this.handlePrescriptionExchange(record, e)}>处方交换</span>
            </>
          ) : ''}
          {record && (record.reqStatusCode === '01' || record.reqStatusCode === '20') ? (
            <>
              <Divider type="vertical" />
              <span className="span" onClick={(e) => this.handleModifyRowStatus('02', record, e)}>{record.reqStatusCode === '20' ? '重新发送' : '发送订单'}</span>
            </>
          ) : ''}
          {/* {record && (record.reqStatusCode === '01' || record.reqStatusCode === '38' || record.reqStatusCode === '04' || record.reqStatusCode === '10') ? (
            <>
              <Divider type="vertical" />
              <span className="span" onClick={(e) => this.handleVisitHistory(record, e)}>就诊历史</span>
            </>
          ) : ''}
          {record && !(record.reqStatusCode === (record.getStatusCode || '36')) ? (
            <>
              <Divider type="vertical" />
              <span className="span" onClick={(e) => this.modifyEMRModal(true, record, e)}>病历录入</span>
            </>
          ) : ''} */}
          {record && record.reqStatusCode === '02' ? (
            <>
              <Divider type="vertical" />
              <Popconfirm title="确定撤回订单吗?" onClick={(e) => React.$stopPropagation(e)} onConfirm={(e) => this.handleModifyRowStatus('01', record, e)} >
                <span className="span common-record-delete-span">撤回订单</span>
              </Popconfirm>
            </>
          ) : ''}
          {record && record.reqStatusCode === '25' ? ( // 医院采购退回配镜申请单可以重新提交
            <>
              <Divider type="vertical" />
              <span className="span" onClick={(e) => this.handleModifyRowStatus(record?.hisRtnStatusCode || '11', record, e)}>重新提交</span>
            </>
          ) : ''}
          {record ? (
            <>
              <Divider type="vertical" />
              <Dropdown overlay={(
                <Menu>
                  {record.reqStatusCode === (record.getStatusCode || '36') ? (
                    <Menu.Item onClick={(e) => this.handleMirrorAppointment(true, record, e)}>
                      取镜预约
                    </Menu.Item>
                  ) : ''}
                  <Menu.Item onClick={(e) => this.modifyEMRModal(true, record, e)}>
                    病历录入
                  </Menu.Item>
                  <Menu.Item onClick={(e) => this.handleVisitHistory(record, e)}>
                    就诊历史
                  </Menu.Item>
                </Menu>
              )}>
                <span className="span">
                  更多
                  <Icon type="down" />
                </span>
              </Dropdown>
            </>
          ) : ''}
        </span>
      ),
    };

    // 订单管理列表操作
    const glassesOrderManagementOperationObj = {
      width: 160,
      title: '操作',
      fixed: 'right',
      align: 'left',
      key: 'operation',
      render: (text, record) => (
        <span style={{ padding: '0 12px' }}>
          <span className="span" onClick={(e) => this.handleViewDetails(record, e)}>查看详情</span>
          {record && record.reqStatusCode === '38' || record && record.reqStatusCode === '03' ? <Divider type="vertical" /> : ''}
          {record && record.reqStatusCode === '38' ? (
            <span className="span" onClick={(e) => this.handleModifyRowStatus('03', record, e)}>接收订单</span>
          ) : (record && record.reqStatusCode === '03' ? (
            <span className="span" onClick={(e) => this.handleDeliverGoods(record, e)}>订单发货</span>
          ) : '')}
        </span>
      ),
    };

    // 库房订单审核
    const warehouseOrder = {
      width: 240,
      title: '操作',
      fixed: 'right',
      align: 'left',
      key: 'operation',
      render: (text, record) => (
        <span style={{ padding: '0 12px' }}>
          <span className="span" onClick={(e) => this.handleViewDetails(record, e)}>查看详情</span>
          {record && record.reqStatusCode === '02' ? (
            <>
              <Divider type="vertical" />
              <span className="span" onClick={(e) => this.handleModifyRowStatus('11', record, e)}>审核通过</span>
            </>
          ) : ''}
          {record && record.reqStatusCode === '25' ? (
            <>
              <Divider type="vertical" />
              <span className="span" onClick={(e) => this.handleModifyRowStatus('11', record, e)}>重新提交</span>
            </>
          ) : ''}
          {record && record.reqStatusCode === '11' ? (
            <>
              <Divider type="vertical" />
              <Popconfirm title="确定要撤销审核吗?" onClick={(e) => React.$stopPropagation(e)} onConfirm={(e) => this.handleModifyRowStatus('09', record, e)} >
                <span className="span common-record-delete-span">撤销审核</span>
              </Popconfirm>
            </>
          ) : ''}
        </span>
      ),
    };

    const groupConfirmsReceipt = {
      width: 160,
      title: '操作',
      fixed: 'right',
      align: 'left',
      key: 'operation',
      render: (text, record) => (
        <span style={{ padding: '0 12px' }}>
          <span className="span" onClick={(e) => this.handleViewDetails(record, e)}>查看详情</span>
          {record && record.reqStatusCode === '04' ? (
            <>
              <Divider type="vertical" />
              <span className="span" onClick={(e) => this.handleModifyRowStatus('39', record, e)}>确认发货</span>
            </>
          ) : ''}
        </span>
      ),
    };

    // 导入入参
    const uploadExcelParams = {
      accept: '.xls,.xlsx',
      name: 'file',
      headers: {
        authorization: 'authorization-text',
      },
      showUploadList: false,
      beforeUpload: this.handleImport
    };

    let operationObj = suppFlag === 'Y' ? glassesOrderManagementOperationObj : (suppFlag === 'K' ? warehouseOrder : (suppFlag === 'G' ? groupConfirmsReceipt : glassesMatchingApplicationFormOperationObj));

    return (
      <div className="glasses-matching-application-form">
        <div className="gmaf-header flex-wrap-align-items">
          {suppFlag === 'G' || suppFlag === 'Y' || suppFlag === 'K' || suppFlag === 'S' ? ( // G为集团 / Y为供应商 / k为库房 / S为接收采购计划
            <div>
              <span className="common-input-label">{suppFlag === 'G' || suppFlag === 'K' ? '申请机构' : (suppFlag === 'Y' ? '收货单位' : '客户名称')}：</span>
              <Select
                allowClear
                showSearch
                placeholder="请选择"
                optionFilterProp="search"
                className="common-query-input"
                style={{ width: 200 }}
                value={queryParams?.hospID}
                disabled={categoryData?.hospDisabled === 'Y'}
                onChange={(e) => this.handleModifyInputValue(e, 'hospID')}
              >
                {React.$SelectOptions(selectData?.hosp || [])}
              </Select>
            </div>
          ) : ''}
          {suppFlag === 'Y' ? (
            <div className="flex-align-item">
              <Dropdown overlay={(
                <Menu>
                  <Menu.Item onClick={() => this.handleDateFlagChange('N')}>
                    订单日期
                  </Menu.Item>
                  <Menu.Item onClick={() => this.handleDateFlagChange('Y')}>
                    采购日期
                  </Menu.Item>
                </Menu>
              )}>
                <span className="span" style={{ color: 'black' }}>
                  <span className="common-input-label">{purFlag === 'Y' ? '采购日期' : '订单日期'}</span>
                  <Icon type="down" style={{ fontSize: '15px', marginLeft: '4px' }} />
                  ：
                </span>
              </Dropdown>
            </div>
          ) : ''}
          <div style={{ marginRight: 15 }} className="flex-align-items">
            <span className="common-input-label">{suppFlag === 'Y' ? '' : suppFlag === 'S' ? '采购日期：' : '申请日期：'}</span>
            <RangeDatePicker
              width="300px"
              isChange={true}
              format={dayFormat}
              endDate={queryParams?.endDate}
              startDate={queryParams?.startDate}
              label=""
              endChange={(e) => this.handleModifyInputValue(e, 'endDate')}
              startChange={(e) => this.handleModifyInputValue(e, 'startDate')}
            />
          </div>
          {suppFlag === 'S' ? '' : (
            <GetPatientInformation
              queryType="fuzzySearch"
              parLabelClass="common-input-label"
              cardType={selectData?.cardType || []}
              cardSelectData={selectData?.cardSelectData || []}
              onRef={ref => this.patientRef = ref}
              handleQuery={this.handleQuery}
            />
          )}
          {suppFlag === 'N' ? (
            <div>
              <span className="common-input-label">订单类型：</span>
              <Select
                allowClear
                showSearch
                placeholder="请选择"
                optionFilterProp="search"
                className="common-query-input"
                value={queryParams?.orderTypeID}
                onChange={(e) => this.handleModifyInputValue(e, 'orderTypeID')}
              >
                {React.$SelectOptions(selectData?.orderType || [])}
              </Select>
            </div>
          ) : ''}
          {suppFlag === 'N' ? (
            <div>
              <span className="common-input-label">开单人员：</span>
              <Select
                allowClear
                showSearch
                placeholder="请选择"
                optionFilterProp="search"
                className="common-query-input"
                value={queryParams?.billingUserID}
                onChange={(e) => this.handleModifyInputValue(e, 'billingUserID')}
              >
                {React.$SelectOptions(selectData?.user || [])}
              </Select>
            </div>
          ) : ''}
          {suppFlag === 'S' ? '' : (
            <div>
              <span className="common-input-label">供应商：</span>
              <Select
                allowClear
                showSearch
                placeholder="请选择"
                optionFilterProp="search"
                className="common-query-input"
                value={queryParams?.vendorID}
                onChange={(e) => this.handleModifyInputValue(e, 'vendorID')}
              >
                {/* 订单审核为授权供应商 */}
                {React.$SelectOptions(suppFlag === 'K' ? (selectData?.authVendor || []) : (selectData?.vendor || []))}
              </Select>
            </div>
          )}
          <div>
            <span className="common-input-label">品牌：</span>
            <Select
              allowClear
              showSearch
              placeholder="请选择"
              optionFilterProp="search"
              className="common-query-input"
              value={queryParams?.brandID}
              onChange={(e) => this.handleModifyInputValue(e, 'brandID')}
            >
              {React.$SelectOptions(selectData?.brand || [])}
            </Select>
          </div>
          {suppFlag === 'S' ? '' : (
            <div>
              <span className="common-input-label">规格型号：</span>
              <Select
                allowClear
                showSearch
                placeholder="请选择"
                optionFilterProp="search"
                className="common-query-input"
                value={queryParams?.varietyID}
                onChange={(e) => this.handleModifyInputValue(e, 'varietyID')}
              >
                {React.$SelectOptions(varietySelectData)}
              </Select>
            </div>
          )}
          {suppFlag === 'K' ? '' : (
            <>
              {suppFlag === 'S' ? '' : (
                <div>
                  <span className="common-input-label">订购产品：</span>
                  <Input
                    className="common-query-input"
                    placeholder="输入产品名称回车查询"
                    style={{ width: 200 }}
                    value={queryParams?.inputDesc}
                    onPressEnter={this.handleQuery}
                    onChange={(e) => this.handleModifyInputValue(e.target.value, 'inputDesc')}
                  />
                </div>
              )}
              {suppFlag === 'Y' ? ( // 供应商添加采购单号
                <div>
                  <span className="common-input-label">采购单号：</span>
                  <Input
                    className="common-query-input"
                    placeholder="输入采购单号回车查询"
                    style={{ width: 200 }}
                    value={queryParams?.purNo}
                    onPressEnter={this.handleQuery}
                    onChange={(e) => this.handleModifyInputValue(e.target.value, 'purNo')}
                  />
                </div>
              ) : ''}
              {categoryData?.payStatusFlag === 'Y' ? (
                <div>
                  <span className="common-input-label">收费状态：</span>
                  <Select
                    allowClear
                    showSearch
                    placeholder="请选择"
                    optionFilterProp="search"
                    className="common-query-input"
                    value={queryParams?.payStatusCode}
                    onChange={(e) => this.handleModifyInputValue(e, 'payStatusCode')}
                  >
                    {React.$SelectOptions(selectData?.payStatus || [])}
                  </Select>
                </div>
              ) : ''}
            </>
          )}
          <div>
            <Button type="primary" onClick={this.handleQuery}>查询</Button>
            {categoryData?.exportCode ? ( // 按钮导出
              <Button
                ghost
                type="primary"
                loading={exportBtnLoading}
                style={{ marginLeft: '12px' }}
                onClick={() => this.handleExport(categoryData?.exportCode || '', 'exportBtnLoading', categoryData?.reactExportFlag || '')}
              >
                {categoryData?.exportBtnTitle || '导出'}
              </Button>
            ) : ''}
            {categoryData?.exportDetailCode ? ( // 按钮导出
              <Button
                ghost
                type="primary"
                loading={exportDetailBtnLoading}
                style={{ marginLeft: '12px' }}
                onClick={() => this.handleExport(categoryData?.exportDetailCode || '', 'exportDetailBtnLoading', categoryData?.reactExportDetailFlag || '')}
              >
                {categoryData?.exportDetailBtnTitle || '导出明细'}
              </Button>
            ) : ''}
            {categoryData?.importCode ? ( // 导入
              <Upload  {...uploadExcelParams}>
                <Button
                  ghost
                  type="primary"
                  loading={importBtnLoading}
                  style={{ marginLeft: '12px' }}
                >
                  {categoryData?.importBtnTitle || '导入'}
                </Button>
              </Upload>
            ) : ''}
          </div>
        </div>
        <div className="common-query-split-line" style={{ height: 8 }}></div>
        <div>
          <Tabs
            className="gmaf-tabs"
            activeKey={tabActiveKey}
            onChange={this.handleTabsChange}
            tabBarExtraContent={(
              <div className="flex-align-items" style={{ paddingRight: '24px', fontWeight: 'normal', color: '#999', fontSize: '12px' }}>
                <span style={{ display: 'inline-block', width: '18px', height: '18px', background: '#f5d3df', marginRight: '6px', borderRadius: '2px' }}></span>处方交换
              </div>
            )}
          >
            {tabStatus && tabStatus.map((item) => {
              return (
                <TabPane tab={item.descripts + '(' + (item && 'count' in item ? item.count : 0) + ')'} key={item.id}></TabPane>
              )
            })}
          </Tabs>
          <div className="gmaf-talbe table-body-height">
            <div className="flex-between-center" style={{ height: 32, marginBottom: 8 }}>
              <div className="gmaf-checkbox-operation flex-align-items">
                {suppFlag === 'Y' ? ( // 订单管理
                  <>
                    {!tabActiveKey || tabActiveKey === '38' ? (
                      <>
                        <span
                          className={selectedRowKeys && selectedRowKeys.length > 0 ? '' : 'gmaf-btn-disabled'}
                          onClick={() => this.handleReturnOrder('52')} // 10
                        >
                          <Icon type="close" style={{ color: 'red' }} />
                          退回订单
                        </span>
                        <Divider type="vertical" />
                      </>
                    ) : ''}
                    {!tabActiveKey || tabActiveKey === '03' ? (
                      <>
                        {selectedRowKeys && selectedRowKeys.length > 0 ? (
                          <Popconfirm title="确定撤销接收吗?" onConfirm={() => this.handleRevoke('09', '03', '撤销接收')} >
                            <span>
                              <Icon type="undo" style={{ color: 'red' }} />
                              撤销接收
                            </span>
                          </Popconfirm>
                        ) : (
                          <span className="gmaf-btn-disabled">
                            <Icon type="undo" />
                            撤销接收
                          </span>
                        )}
                        <Divider type="vertical" />
                      </>
                    ) : ''}
                    {/* {!tabActiveKey ? (
                      <>
                        {selectedRowKeys && selectedRowKeys.length > 0 ? (
                          <Popconfirm title="确定撤销发货吗?" onConfirm={() => this.handleRevoke('09', '04', '撤销发货')} >
                            <span>
                              <Icon type="rollback" style={{ color: 'red' }} />
                              撤销发货
                            </span>
                          </Popconfirm>
                        ) : (
                          <span className="gmaf-btn-disabled">
                            <Icon type="rollback" />
                            撤销发货
                          </span>
                        )}
                        <Divider type="vertical" />
                      </>
                    ) : ''} */}
                    <span
                      className={selectedRowKeys && selectedRowKeys.length > 0 ? '' : 'gmaf-btn-disabled'}
                      onClick={selectedRowKeys && selectedRowKeys.length > 0 ? () => this.handlePrint('N', 'Y') : null}
                    >
                      <Icon type="printer" style={{ color: '#08979c' }} />
                      打印订单
                    </span>
                    {!tabActiveKey || tabActiveKey === '38' ? (
                      <>
                        <Divider type="vertical" />
                        <span
                          className={selectedRowKeys && selectedRowKeys.length > 0 ? '' : 'gmaf-btn-disabled'}
                          onClick={selectedRowKeys && selectedRowKeys.length > 0 ? () => this.modifyApplicationFormStatus('03') : null}
                        >
                          <Icon type="share-alt" style={{ color: '#d500f9' }} />
                          批量接收订单
                        </span>
                      </>
                    ) : ''}
                    {!tabActiveKey || tabActiveKey === '03' ? (
                      <>
                        <Divider type="vertical" />
                        <span
                          className={selectedRowKeys && selectedRowKeys.length > 0 ? '' : 'gmaf-btn-disabled'}
                          onClick={selectedRowKeys && selectedRowKeys.length > 0 ? (e) => this.handleDeliverGoods('batch', e) : null}
                        >
                          <Icon type="share-alt" style={{ color: '#d500f9' }} />
                          批量发货
                        </span>
                      </>
                    ) : ''}
                    {!tabActiveKey ? (
                      <>
                        <Divider type="vertical" />
                        <span
                          className={selectedRowKeys && selectedRowKeys.length > 0 ? '' : 'gmaf-btn-disabled'}
                          onClick={selectedRowKeys && selectedRowKeys.length > 0 ? () => this.handlePrint('Y', 'Y') : null}
                        >
                          <Icon type="printer" style={{ color: '#08979c' }} />
                          批量打印发货单
                        </span>
                        <Divider type="vertical" />
                        <span
                          className={selectedRowKeys && selectedRowKeys.length > 0 ? '' : 'gmaf-btn-disabled'}
                          onClick={selectedRowKeys && selectedRowKeys.length > 0 ? this.handleEnterLogisticsNo : null}
                        >
                          <Icon type="form" style={{ color: '#007AFF' }} />
                          批量录入物流单
                        </span>
                      </>
                    ) : ''}
                  </>
                ) : (suppFlag === 'K' ? ( // 库房订单管理
                  <>
                    <span
                      className={selectedRowKeys && selectedRowKeys.length > 0 ? '' : 'gmaf-btn-disabled'}
                      onClick={() => this.handleReturnOrder('20')}
                    >
                      <Icon type="rollback" style={{ color: 'red' }} />
                      退回订单
                    </span>
                    <Divider type="vertical" />
                    {!tabActiveKey ? (
                      <>
                        <span
                          className={selectedRowKeys && selectedRowKeys.length > 0 ? '' : 'gmaf-btn-disabled'}
                          onClick={() => this.modifyApplicationFormStatus('09')}
                        >
                          <Icon type="redo" style={{ color: 'red' }} />
                          批量撤销审核
                        </span>
                        <Divider type="vertical" />
                      </>
                    ) : ''}
                    <span
                      className={selectedRowKeys && selectedRowKeys.length > 0 ? '' : 'gmaf-btn-disabled'}
                      onClick={selectedRowKeys && selectedRowKeys.length > 0 ? () => this.modifyApplicationFormStatus('11') : null}
                    >
                      <Icon type="form" style={{ color: '#007AFF' }} />
                      {tabActiveKey === '25' ? '批量重新提交' : '批量审核通过'}
                    </span>
                  </>
                ) : (suppFlag === 'G' ? ( // 集团确认发货
                  !tabActiveKey || tabActiveKey === '04' ? ( // 04 - 待发货
                    <span
                      className={selectedRowKeys && selectedRowKeys.length > 0 ? '' : 'gmaf-btn-disabled'}
                      onClick={selectedRowKeys && selectedRowKeys.length > 0 ? () => this.modifyApplicationFormStatus('39') : null}
                    >
                      <Icon type="share-alt" style={{ color: '#d500f9' }} />
                      批量确认发货
                    </span>
                  ) : ''
                ) : (suppFlag === 'S' ? ( // 接收采购计划
                  <>
                    {!tabActiveKey ? (
                      <>
                        <span
                          className={selectedRowKeys && selectedRowKeys.length > 0 ? '' : 'gmaf-btn-disabled'}
                          onClick={() => this.handleReturnOrder('10')}
                        >
                          <Icon type="close" style={{ color: 'red' }} />
                          退回订单
                        </span>
                        <Divider type="vertical" />
                      </>
                    ) : ''}
                  </>
                ) : ( // 配镜申请单列表
                  <>
                    {!tabActiveKey || tabActiveKey === '01' || tabActiveKey === '10' || tabActiveKey === '20' ? (
                      <>
                        {selectedRowKeys && selectedRowKeys.length > 0 ? (tabActiveKey === '10' ? ( // 供货商退回
                          <span onClick={this.handleReturnedByTheSupplier}>
                            <Icon type="delete" style={{ color: 'red' }} />
                            删除订单
                          </span>
                        ) : ( // 01: 待发送订单; 20: 订单审核退
                          <Popconfirm title="删除不可恢复，您确定要删除吗?" onConfirm={() => this.modifyApplicationFormStatus('08')} >
                            <span>
                              <Icon type="delete" style={{ color: 'red' }} />
                              删除订单
                            </span>
                          </Popconfirm>
                        )) : (
                          <span className="gmaf-btn-disabled">
                            <Icon type="delete" />
                            删除订单
                          </span>
                        )}
                        <Divider type="vertical" />
                      </>
                    ) : ''}
                    {!tabActiveKey || tabActiveKey === '38' ? (
                      <>
                        {selectedRowKeys && selectedRowKeys.length > 0 ? (
                          <Popconfirm title="确定撤回订单吗?" onConfirm={this.handleBatchWithdrawal} >
                            <span>
                              <Icon type="switcher" style={{ color: '#fa8c17' }} />
                              撤回订单
                            </span>
                          </Popconfirm>
                        ) : (
                          <span className="gmaf-btn-disabled">
                            <Icon type="switcher" />
                            撤回订单
                          </span>
                        )}
                        <Divider type="vertical" />
                      </>
                    ) : ''}
                    <span
                      className={selectedRowKeys && selectedRowKeys.length > 0 ? '' : 'gmaf-btn-disabled'}
                      onClick={selectedRowKeys && selectedRowKeys.length > 0 ? () => this.handlePrint('N') : null}
                    >
                      <Icon type="printer" style={{ color: '#08979c' }} />
                      补打配镜单
                    </span>
                    {!tabActiveKey || tabActiveKey === '04' || tabActiveKey === '36' ? (
                      <>
                        <Divider type="vertical" />
                        <span
                          className={selectedRowKeys && selectedRowKeys.length > 0 ? '' : 'gmaf-btn-disabled'}
                          onClick={selectedRowKeys && selectedRowKeys.length > 0 ? this.handleMassNotification : null}
                        >
                          <Icon type="bell" style={{ color: '#d500f9' }} />
                          群发通知
                        </span>
                      </>
                    ) : ''}
                    {!tabActiveKey || (tabActiveKey === '01' || tabActiveKey === '20') ? (
                      <>
                        <Divider type="vertical" />
                        <span
                          className={selectedRowKeys && selectedRowKeys.length > 0 ? '' : 'gmaf-btn-disabled'}
                          onClick={selectedRowKeys && selectedRowKeys.length > 0 ? () => this.modifyApplicationFormStatus('02') : null}
                        >
                          <Icon type="share-alt" style={{ color: '#d500f9' }} />
                          {tabActiveKey === '20' ? '批量重新发送' : '批量发送订单'}
                        </span>
                      </>
                    ) : ''}
                    {selectData?.batchTakeFlag === 'Y' && (!tabActiveKey || tabActiveKey === '36') ? (
                      <>
                        <Divider type="vertical" />
                        <span
                          className={selectedRowKeys && selectedRowKeys.length > 0 ? '' : 'gmaf-btn-disabled'}
                          onClick={selectedRowKeys && selectedRowKeys.length > 0 ? this.handleBatchMirrorRetrieval : null}
                        >
                          <Icon type="tags" style={{ color: '#007AFF' }} />
                          批量取镜
                        </span>
                      </>
                    ) : ''}
                  </>
                ))))}
              </div>
              <div className="flex-align-items">
                {tabActiveKey ? '' : (
                  <>
                    {categoryData?.orderStatusFlag === 'N' ? '' : (
                      <Select
                        allowClear
                        showSearch
                        value={queryParams?.orderStatusID}
                        placeholder="订单状态"
                        optionFilterProp="search"
                        className="common-query-input"
                        onChange={(e) => this.handleModifyInputValue(e, 'orderStatusID')}
                      >
                        {React.$SelectOptions(selectData?.orderStatus || [])}
                      </Select>
                    )}
                    {categoryData?.handleStatusFlag === 'Y' ? (
                      <Select
                        allowClear
                        showSearch
                        value={queryParams?.handleStatus}
                        placeholder="处理状态"
                        optionFilterProp="search"
                        className="common-query-input"
                        style={{ marginLeft: categoryData?.orderStatusFlag !== 'N' ? '15px' : 0 }}
                        onChange={(e) => this.handleModifyInputValue(e, 'handleStatus')}
                      >
                        {React.$SelectOptions(selectData?.handleStatus || [])}
                      </Select>
                    ) : ''}
                    {suppFlag === 'K' || suppFlag === 'S' ? '' : (
                      <Input
                        placeholder="物流单号"
                        className="common-query-input"
                        value={queryParams?.logisticsNo}
                        style={{ marginRight: categoryData?.takeFlag !== 'N' ? '15px' : 0 }}
                        onChange={(e) => this.handleModifyInputValue(e.target.value, 'logisticsNo')}
                        onPressEnter={this.handleQuery}
                      />
                    )}
                    {categoryData?.takeFlag !== 'N' ? (
                      <RangeDatePicker
                        width="300px"
                        isChange={true}
                        format={dayFormat}
                        placeholder={suppFlag === 'Y' ? '发货' : '取镜'}
                        endDate={queryParams?.takeEndDate}
                        startDate={queryParams?.takeStartDate}
                        endChange={(e) => this.handleModifyInputValue(e, 'takeEndDate')}
                        startChange={(e) => this.handleModifyInputValue(e, 'takeStartDate')}
                      />
                    ) : ''}
                  </>
                )}
              </div>
            </div>
            <PubilcTablePagination
              param={{
                page,
                total,
                loading,
                pageSize: '20',
                data: tableData, // 表格数据
                x: totalWidth, // 表格的宽度
                y: store.getState().tableHeight.y + 38 - headerHeight,
                componentName: categoryData?.componentName || 'GlassesMatchingApplicationList',
                height: store.getState().tableHeight.y + 88 - headerHeight + 'px',
                columns: columns && columns.length > 0 ? [...columns, operationObj] : [...this.staticColumns, operationObj], // 表头配置
              }}
              rowSelectionPublic={rowSelection}
              compilePage={this.compilePage}
              getColumns={this.getTableColumns}
              onClickRowPublic={this.onClickRowPublic}
              setRowClassNamePublic={this.setRowClassNamePublic}
            />
          </div>
        </div>

        {/* 取镜 */}
        <TakeAMirrorModal selectData={selectData} onRef={ref => this.takeAMirrorRef = ref} handleQuery={this.handleQuery} />

        {/* 查看详情 */}
        <MatchingDetails
          interfaceFlag={'GlassesMatchingApplicationList'}
          handleQuery={() => this.handleQuery('N')}
          handleDeliverGoods={this.handleDeliverGoods}
          handleReturnOrder={this.handleDetailsReturnOrder}
          modifyApplicationFormStatus={this.modifyApplicationFormStatus}
          onRef={ref => this.matchingDetailsRef = ref}
        />

        {/* 处方交换 */}
        <PrescriptionExchangeType
          selectData={selectData}
          handleQuery={() => this.handleQuery('N')}
          onRef={ref => this.exchangeRef = ref}
        />

        {/* 退回订单 */}
        <ReturnOrder selectData={selectData} modifyApplicationFormStatus={this.modifyApplicationFormStatus} onRef={ref => this.returnOrderRef = ref} />

        {/* 发货 */}
        <DeliverGoods selectData={selectData} suppFlag={suppFlag} handleQuery={this.handleQuery} onRef={ref => this.deliverGoodsRef = ref} />

        {/* 批量录入物流单 */}
        <LogisticsDocEntry selectData={selectData} suppFlag={suppFlag} handleConfirmEntry={this.handleConfirmEntryLogisticsNo} onRef={ref => this.logisticsDocRef = ref} />

        <ShowComponentModal isShow={isShowComponentModal}
          dataSource={this.state.componentModalData}
          onHide={() => this.hideModal('isShowComponentModal')}
        />

        {/* 批量取镜 */}
        <BatchMirrorRetrievalModal categoryData={categoryData} selectData={selectData} handleQuery={this.getTableData} onRef={ref => this.batchMirrorRetrievalRef = ref} />

        {/* 查看病历 */}
        {emrVisible ? <ShowMedicalRecordModal
          admTypeCode="O" // 就诊类型
          prCont="Y" // 病历操作按钮 第二栏 【打印，添加行，删除行，等这一行】
          initTemplate="Y" // 初始化加载默认模板标志
          modalTitle="病历录入" // 查看病历弹窗Modal的title
          isOperable={false} // 是否可操作 - 保存，更新系列按钮
          isBasicOperation={false} // 病历操作按钮 第一栏【保存，修改，解锁等操作按钮这一行】 
          isShow={emrVisible} // 查看病历按钮显示隐藏控制标志
          historyAdmID={emrAdmID}
          onHide={() => this.modifyEMRModal(false, {}, {})}
        /> : ''}
      </div>
    )
  }
};

export default GlassesMatchingApplicationList;

/*
  状态变化表状态（status）
  |  ID  | Code | Descripts |
  |  1   |  01  |   创建    |
  |  2   |  02  |   发送    |
  |  3   |  03  |   接收    |
  |  4   |  04  |   发货    |
  |  5   |  05  |   入库    |
  |  6   |  06  |   取镜    |
  |  7   |  07  |   退镜    |
  |  8   |  08  |   取消    |
  |  9   |  09  |   撤销    |
  |  10  |  10  |   退回    | 
  01	创建
  02	发送    
  03	接收
  04	发货
  05	入库
  06	取镜
  07	退镜
  08	取消
  09	撤销
  10	退回
  11	订单审核
  12	采购计划
  13	采购收货
  14	入库质检
  15	转移质检
  16	科室退库申请
  17	科室退库申请接收
  18	退库质检
  19	入库复核
  20 订单审核退回
  21 采购退回
  22 退货
  23 退货处理
  25 采购计划医院退回

  以前的流程:

  01->02->03->04->05->06->07

  现在的流程:

  01->02->11->12->03->04->13->14->05->15->06->07->16->17->18->19
* */