/*
	* @Author: Sakura
 * @LastEditors: Sakura
	* @Date: 2024-02-28 9:55:04
	* @Description: 计划任务 ---- 机台任务
	*/
    import React, { useEffect, useRef, useState } from "react";
    import moment from "moment";
    import {
      Carousel,
      Col,
      Row,
      Button,
      Input,
      Modal,
      Space,
      Dropdown,
      message,
      Tooltip
    } from "antd";
    import { SettingTwoTone } from "@ant-design/icons";
    import * as commonFunc from "@/components/Common/commonFunc";
    import * as commonUtils from "@/utils/utils";
    import * as commonConfig from "@/utils/config";
    import * as commonBusiness from "@/components/Common/commonBusiness";
    import * as commonServices from "@/services/services";
    import useCommonBase from "@/components/Common/CommonHooks/useCommonBase";
    import StaticEditTable from "@/components/Common/CommonTable";
    import CommonViewTable from "@/components/Common/CommonViewTable";
    import styles from "./index.less";
    import taskInfoIcon from "../assets/taskInfo2.png";
    import statusIcon from "../assets/status.png";
    import taskIcon from "../assets/task.png";
    import timeIcon from "../assets/time.png";
    import { handleOeeBtnEent } from "./common/handlePause";
    import { operationFetch } from "../../productionExec/productionExecMain/operationFetch";

    // 业务层
    const useInfoEvent = props => {
      const { formData } = props;
      const [refreshCount, setRefreshCount] = useState(0);

      useEffect(
        async () => {
          if (commonUtils.isNotEmptyArr(formData)) {
            const colunmData = handleGetColumnData(formData, true);
            const result = await handleGetData(formData, true);
            const addState = {
              ...colunmData,
              ...result
            };
            props.onSaveState(addState);
          }
        },
        [formData, refreshCount]
      );

      // 获取表头数据
      const handleGetColumnData = (formData = [], isWait) => {
        let addState = {};
        for (let i = 0; i < formData.length; i++) {
          const config = formData[i];
          const column = commonFunc.getHeaderConfig(config);
          addState = {
            ...addState,
            [`slave${i}Column`]: column,
            [`slave${i}Config`]: config
          };
        }
        if (isWait) {
          return addState;
        } else {
          props.onSaveState(addState);
        }
      };

      // 获取数据集
      const handleGetData = async (formData = [], isWait, filter) => {
        let addState = {};
        for (let i = 0; i < formData.length; i++) {
          const config = formData[i];
          if (!config) continue;

          const conditonValues = props.onGetSqlConditionValues(config);

          if (config.sSqlStr === "Sp_OEE_ProductionReport") {
            conditonValues.sMachineId_s_pro = props.app.sMachineNameSId;
          }

          // 前期生产或反馈问题表必须有非空过滤条件
          if (
            (i === 1 && Object.values(conditonValues).includes("")) ||
            Object.values(conditonValues).includes(undefined)
          ) {
            continue;
          }

          const bFilter = [];
          if (filter) {
            Object.keys(filter).forEach(key => {
              bFilter.push({
                bFilterName: key,
                bFilterCondition: "like",
                bFilterValue: filter[key]
              });
            });
          }

          const result =
            (await props.onGetDataSet({
              name: `slave${i}`,
              configData: config,
              condition: {
                bFilter,
                sSqlCondition: { ...conditonValues }
              },
              isWait: true
            })) || {};
          props.setTempRef(result);
          addState = { ...addState, ...result };
        }
        props.setTempRef({}, true);
        if (isWait) {
          return addState;
        } else {
          props.onSaveState(addState);
        }
      };

      // 查询
      const handleSearch = sWorkOrderNo => {
        handleGetData([formData[0]], false, {
          sWorkOrderNo
        });
      };

      // 开工事件
      const handleStartWork = async params => {
        const { sModelsId, token, app } = props;
        const { name, record, config, tableData, iFlag, pauseValue } = params;
        const { sMachineId, sId, sSlaveId } = record;

        // /* 若设置了禁止跳单 选择数据不是第一条时进行提示 */
        // const iIndex = app.systemData.findIndex(item => item.sName === "CkxNoSkip");
        // if (iIndex > -1) {
        //   const sValue = app.systemData[iIndex].sValue;
        //   if (sValue === "1") {
        //     /* 如果设置了进制跳单 */
        //     const indexFirst = tableData.findIndex(
        //       item => sId === item.sId || sSlaveId === item.sSlaveId
        //     );
        //     if (indexFirst > 0) {
        //       message.warn("禁止跳单!");
        //       return;
        //     }
        //   }
        // }
        // // 验证是否单据是否被使用
        // const dataUrl = `${
        //   commonConfig.server_host
        // }bill/billCopyToCheckWork?sModelsId=${sModelsId}`;
        // const values = { sMachineId };
        // const dataReturn = (await commonServices.postValueService(
        //   token,
        //   values,
        //   dataUrl
        // )).data;
        // if (dataReturn.code !== 1) {
        //   props.getServiceError(dataReturn);
        //   return;
        // }

        // 单据可以使用
        const { startWorkConfig = {} } = config;
        const { sAssignField } = startWorkConfig;
        const allTableData = {
          [name]: record
        };
        let rowData = commonFunc.getDefaultData(config, allTableData); // 取默认值
        rowData = {
          ...rowData,
          ...commonFunc.getAssignFieldValue(sAssignField, record, allTableData),
          handleType: "add",
          sId: commonUtils.createSid(),
          sTeamId: app.sTeamNameSId,
          sMachineId: app.sMachineNameSId,
          sParentId: record.sId,
          tCreateDate: new Date()
        };

        const valuesNew = {};
        valuesNew.data = [];
        valuesNew.data.push(
          commonBusiness.mergeData(name, "plc_machinedata", [rowData], [])
        );

        if ((iFlag || Object.is(iFlag, 0)) && valuesNew.data[0]) {
          valuesNew.data[0].iFlag = iFlag;
        }

        if (pauseValue) {
          valuesNew.data[0].sWorkOrderChangeMemo = pauseValue;
        }

        const BtnSave = commonFunc.showMessage(
          app.commonConst,
          "BtnSave"
        ); /* 保存 */
        params.optName = BtnSave;
        params.sClientType = "1";
        const returnData = await commonBusiness.saveData({
          token,
          value: valuesNew,
          sModelsId,
          bMachineTask: true
        });

        return returnData;
        // if (commonUtils.isEmptyObject(returnData)) return;

        // props.onSaveState(
        //   {
        //     [`${name}SelectedRowKeys`]: [record.sId]
        //   },
        //   () => {
        //     props.dispatch({
        //       type: "app/saveGlobalData",
        //       payload: {
        //         currentStartWorkMachineTaskDataRow: rowData
        //       }
        //     });
        //     handleRefresh();
        //     setTimeout(() => {
        //       props.onChangeRouter({
        //         type: "name",
        //         path: ["生产执行", "生产执行"]
        //       });
        //     }, 500);
        //   }
        // );
        // this.props.onSaveCurrentState(slaveData, true, undefined, undefined, 1);
      };

      // 更新工单状态
      const handleUpdateStatus = async params => {
        const { doWorkState, record } = params;

        const { sModelsId, app } = props;

        const value = {
          plcMachinedata: record
        };

        const url = `${
          commonConfig.server_host
        }oee/doUpdateStatus/${doWorkState}?sModelsId=${sModelsId}&sMachineId=${
          record.sMachineId
        }`;
        const returnData = (await commonServices.postValueService(
          app.token,
          value,
          url
        )).data;

        if (returnData.code !== 1) {
          props.getServiceError(returnData);
          return false;
        }

        return true;
      };

      // 监听机台任务选中行变化
      const { slave0SelectedRowKeys = [], slave0Data = [], sModelsId } = props;
      useEffect(
        () => {
          if (!slave0Data.length) return;

          const globalData = commonUtils.convertStrToObj(
            localStorage.xlybusinessglobalData
          );
          const { currentSelectedMachineTaskDataRow = {} } = globalData;

          // 当前选中行sId,默认取缓存数据
          let currentSelectedRowKey = slave0SelectedRowKeys[0];
          if (
            !currentSelectedRowKey &&
            sModelsId === currentSelectedMachineTaskDataRow?.sModelsId
          ) {
            currentSelectedRowKey = currentSelectedMachineTaskDataRow.sId;
          }
          if (!currentSelectedRowKey) {
            currentSelectedRowKey = slave0Data[0].sId;
          }

          // 默认选中第一行
          if (!slave0SelectedRowKeys.length) {
            props.onSaveState({
              slave0SelectedRowKeys: [currentSelectedRowKey]
            });
          }

          // 将当前选中行保存到全局
          props.dispatch({
            type: "app/saveGlobalData",
            payload: {
              currentSelectedMachineTaskDataRow: {
                ...(slave0Data.find(item => item.sId === currentSelectedRowKey) ||
                  {}),
                sModelsId
              }
            }
          });

          // 前期生产或反馈问题数据根据机台任务选中行变化
          handleGetData(["", formData[1]], false);
        },
        [slave0SelectedRowKeys[0], slave0Data.length]
      );

      // 监听开工任务变化
      useEffect(
        () => {
          if (commonUtils.isEmptyObject(props.slave0Data)) return;
          const startRowData = props.slave0Data.find(item => item.iStar === 1);
          if (!startRowData) return;
          props.dispatch({
            type: "app/saveGlobalData",
            payload: {
              currentStartWorkMachineTaskDataRow: startRowData
            }
          });
        },
        [JSON.stringify(props.slave0Data)]
      );

      // 刷新页面
      const handleRefresh = () => {
        setRefreshCount(pre => pre + 1);
      };

      const itemClickRef = useRef();
      const finishConstruction = commonFunc.showLocalMessage(props, 'finishConstruction', '完工');

      const confirmCompletion = commonFunc.showLocalMessage(props, 'confirmCompletion', '确认完工');
      const FriendlyReminder = commonFunc.showLocalMessage(props, 'FriendlyReminder', '温馨提示');
      const btnSure = commonFunc.showLocalMessage(props, 'BtnSure', '确认');
      const btnCancel = commonFunc.showLocalMessage(props, 'BtnCancel', '取消');
      const pause = commonFunc.showLocalMessage(props, 'pause', '暂停');
      const pausingReason = commonFunc.showLocalMessage(props, 'pausingReason', '请选择暂停原因');
      const sLanguage = props?.app?.userinfo?.sLanguage ;
      // 开工、暂停事件
      const handleTableBtnClick = async item => {
        const { tableName, index, record, tableData, config, iFlag } = item;
        const { showName, sChinese } = config;
        if (sChinese === "完工" || showName === 'Complete') {
          Modal.confirm({
            title: FriendlyReminder,
            content: <div>{confirmCompletion}?</div>,
            okText: btnSure,
            cancelText: btnCancel,
            onOk() {
              handleUpdateProductionplan({ item, iFlag: 4 });
            }
          });
          return;
        }
        // const iStar = index === 0 ? 1 : 2;
        const { iStar } = record;

        if (iStar === 1) {
          // 如果只剩一条数据，询问是暂停还是完工
          if (tableData.length === 1) {
            const result = await new Promise(resolve => {
              Modal.confirm({
                title: FriendlyReminder,
                content: <div>{sLanguage === "sEnglish" ? "Please select the status you want to change" : "请选择要变更的状态"}</div>,
                okText: finishConstruction,
                cancelText: pause,
                onOk() {
                  resolve(true);
                },
                onCancel() {
                  resolve(false);
                }
              });
            });
            if (result) {
              // 走完工接口
              handleUpdateProductionplan({ item, iFlag: 4 });
              return;
            }
          }

          // 开工中，走暂停接口
          props.onSaveState({
            taskConfirmModalVisible: true,
            taskConfirmModalMsg: pausingReason,
            tempTaskId: record.sId,
            bPauseOnly: true,
            pauseCallback: pauseValue => {
              props.onSaveState({
                taskConfirmModalVisible: false,
                taskConfirmModalMsg: "",
                tempTaskId: "",
                bPauseOnly: false,
                pauseCallback: null
              });
              handleUpdateProductionplan({ item, iFlag: 3, pauseValue });
            }
          });
        } else if (iStar === 2 || iStar === 3) {
          // 暂停中，走开工接口
          const dataReturn = await handleStartWork(item);
          const { code, msg } = dataReturn;
          if (code === 1) {
            // 成功开工
            itemClickRef.current = null;
            message.success(dataReturn.msg);
            if (props.taskConfirmModalVisible) {
              props.onSaveState({
                taskConfirmModalVisible: false,
                taskConfirmModalMsg: "",
                tempTaskId: ""
              });
            }
            if(sLanguage ==='sEnglish') {
              props.onChangeRouter({
                type: "name",
                path: ["Production Execution", "Production Execution"]
              });
            }else {
              props.onChangeRouter({
                type: "name",
                path: ["生产执行", "生产执行"]
              });
            }

          } else if (code === -7) {
            // 如果有开工中的任务，即接口返回-7，弹出确认窗体
            itemClickRef.current = { data: item };
            props.onSaveState({
              taskConfirmModalVisible: true,
              taskConfirmModalMsg: msg,
              tempTaskId: record.sId
            });
          } else {
            // 报错
            message.error(msg);
          }
        }
      };

      // 更新机台状态
      const handleUpdateProductionplan = async ({ item, iFlag, pauseValue }) => {
        const { app } = props;
        const { sId } = item.record;
        const { token } = app;
        const url = `${
          commonConfig.server_host
        }oee/updateProductionplan/${sId}/${iFlag}${
          pauseValue
            ? `?sWorkOrderChangeMemo=${encodeURIComponent(pauseValue)}`
            : ""
        }`;
        const dataReturn = (await commonServices.getService(token, url)).data;
        if (dataReturn.code === 1) {
          dataReturn.msg && message.success(dataReturn.msg, 3);
          handleRefresh();
        } else {
          message.error(dataReturn.msg, 3);
        }
      };

      return {
        ...props,
        // 其他对象
        itemClickRef,
        onSearch: handleSearch,
        onStartWork: handleStartWork, // 开工事件
        onRefresh: handleRefresh, // 刷新页面
        onTableBtnClick: handleTableBtnClick, // 开工、暂停事件
        onUpdateProductionplan: handleUpdateProductionplan // 更新机台状态
      };
    };

    /**
     * 暂停按钮
     * @param {*} params
     */
    const handlePause = async params => {
      const { item, props } = params;
      const { record, config } = item;
      await operationFetch(
        { ...props, workOrderInfoData: [record] },
        config,
        config.sName || "fileError"
      );
      await handleOeeBtnEent({ props, item });
    };

    const MachineTasks = baseProps => {
      const props = useInfoEvent(useCommonBase({ ...baseProps }));
      const {
        app,
        slave0Config,
        slave1Column,
        slave1Data = [],
        slave2Column,
        slave2Data = []
      } = props;

      const bStartWork = commonUtils.getAppData("userinfo", "bStartWork");

      const [isTableLoading, setTableLoading] = useState(false);

      // const BtnTableCopyTo.startWork
      // 开工按钮配置
      const startWorkConfig =
        slave0Config?.gdsconfigformslave?.find(
          item => item.sControlName === "BtnTableCopyTo.startWork"
        ) || {};
      const pauseWorkConfig =
        slave0Config?.gdsconfigformslave?.find(
          item => item.sControlName === "BtnTableCopyTo.pauseWork"
        ) || {};
      const beginConstruction = commonFunc.showLocalMessage(props, 'beginConstruction', '开工');
      const finishConstruction = commonFunc.showLocalMessage(props, 'finishConstruction', '完工');
      const pause = commonFunc.showLocalMessage(props, 'pause', '暂停');

      // 表格业务
      const [sSrcNo, setSSrcNo] = useState("");
      // 顶部表格配置
      const tableProps = {
        ...commonBusiness.getTableTypes("slave0", props),
        tableProps: {
          onChange: () => {},
          loading: isTableLoading
        },
        tableBtnsConfig: params => {
          const { record, index } = params;
          const { iStar } = record;
          // const iStar = index === 0 ? 1 : 2;

          // const bStart = iStar === 1;
          // const bPause = iStar === 2;

          // 1 ：开工状态(显示暂停)   2: 暂停状态(显示开工)  3: 完工状态(显示完工，灰色)
          //  开工：开工接口（现在）1：正常， -7：有开工，要有提示， -1: 错误提示
          // -7 ：完工： iFlag:3 (完工上一条) 暂停：iFlag:2 (暂停上一条)
          // 暂停：新接口

          let showName, btnBgColor, sDefault;
          if (iStar === 1) {
            showName = pause;
            btnBgColor = "#FAAD14";
          } else if (iStar === 2 || iStar === 3) {
            showName = beginConstruction;
            btnBgColor = "#1890FF";
          } else {
            showName = finishConstruction;
            btnBgColor = "#AAA";
            sDefault = "${false}";
          }

          if (!bStartWork) {
            sDefault = "${false}";
          }

          return [
            { showName, btnBgColor, sDefault, startWorkConfig, pauseWorkConfig },
            { showName: finishConstruction, btnBgColor: "#1890FF", sDefault }
          ];

          // return [
          //   {
          //     ...startWorkConfig,
          //     showName: "开工",
          //     btnBgColor: bStart ? "#1890FF" : "#AAA"
          //   },
          //   {
          //     ...pauseWorkConfig,
          //     showName: "暂停",
          //     btnBgColor: bPause ? "#FAAD14" : "#AAA"
          //   }
          // ];
        },
        onTableBtnClick: item => {
          props.onTableBtnClick(item);
          return;
          // 通用按钮操作
          // props.onTableBtnClick(item);
          const { tableName, index, record, tableData, config } = item;
          const { iStar } = record;
          const { showName } = config;
          if (iStar === 1 && showName === "开工") {
            setTableLoading(true);
            props.onStartWork(item).finally(() => {
              setTableLoading(false);
            });
          } else if (iStar === 2 && showName === "暂停") {
            setTableLoading(true);
            handlePause({ item, props }).finally(() => {
              setTableLoading(false);
              props.onRefresh();
            });
          }
        },
        tableBtnsWidth: "190px",
        fixedHeight: "335px"
      };
      // 全部按钮事件
      const tableAll = () => {
        setSSrcNo("");
        props.onSearch();
      };
      // 查询按钮事件
      const tableQuery = () => {
        props.onSearch(sSrcNo);
      };

      // 前期生产或反馈问题业务
      const [issueType, setIssueType] = useState(4);
      const issueObj = slave1Column?.reduce((acc, item) => {
        const chineseKey = item.title.replace(/[0-9]/g, "");
        if (acc[chineseKey]) {
          acc[chineseKey].push(item);
        } else {
          acc[chineseKey] = [item];
        }
        return acc;
      }, {});

      let issue = [];

      if (issueObj) {
        issue = Object.keys(issueObj)?.map((key, i) => {
          return { name: key, items: issueObj[key], id: i };
        });
      }

      const component = id => {
        if (issue?.length > 0) {
          return (
            <div className="marginTop componentBox">
              {issue[id].items.map(item => (
                <p>
                  <span>{item.title}：</span>
                  {slave1Data[0] ? (
                    <Tooltip
                      placement="topLeft"
                      title={
                        <span style={{ fontSize: 20 }}>
                          {slave1Data[0][item.dataIndex]}
                        </span>
                      }
                    >
                      <span>{slave1Data[0][item.dataIndex]}</span>
                    </Tooltip>
                  ) : (
                    ""
                  )}
                </p>
              ))}
            </div>
          );
        }
      };

      const NoAnnouncements = commonFunc.showLocalMessage(props, 'NoAnnouncements', '暂无通告');

      const [carouselData, setCarouselData] = useState([
        {
          title: NoAnnouncements,
          content: NoAnnouncements,
          id: 999
        }
      ]);

      const { slave3Data = [] } = props;

      useEffect(
        () => {
          if (!slave3Data.length) return;

          const tempData = slave3Data.map((item, index) => ({
            title: `车间通告${index + 1}`,
            content: item.sNoticeMemo,
            id: index
          }));

          setCarouselData(tempData);
        },
        [slave3Data.length]
      );

      // 设备信息业务
      const slave2OneData = slave2Data[0] || {};
      const { countMapJsON } = slave2OneData;
      const countMap = commonUtils.convertStrToObj(countMapJsON);

      const taskInfoData = {};
      slave2Column?.forEach(obj => {
        taskInfoData[`${obj.dataIndex}Title`] = obj.title;
        taskInfoData[`${obj.dataIndex}Conent`] = countMap[obj.dataIndex];
      });
      const feedbackIssues = commonFunc.showLocalMessage(props, 'feedbackIssues', '前期生产或反馈问题');
      const btnsearch = commonFunc.showLocalMessage(props, 'BtnSearch', '查询');
      const btnAll = 111111;
      const sWorkOrderNo = commonFunc.showLocalMessage(props, 'sWorkOrderNo', '工单编号');
      const deviceInfo = commonFunc.showLocalMessage(props, 'deviceInfo', '设备信息');
      const TasksQty = commonFunc.showLocalMessage(props, 'TasksQty', '今日完成任务批次/产量(个)');
      return (
        <div className={styles.tasksBox}>
          <Row className={`tasksBg tasksTable`}>
            <Col span={24}>
              <div className="table">
                <StaticEditTable {...tableProps} />
              </div>
              <div className="tableSearch">
                <Button type="primary" size="large" onClick={tableAll}>
                  {" "}
                  {btnAll}{" "}
                </Button>
                <Input
                  allowClear
                  placeholder={sWorkOrderNo}
                  value={sSrcNo}
                  onChange={e => setSSrcNo(e.target.value)}
                />
                <Button type="primary" size="large" onClick={tableQuery}>
                  {" "}
                  {btnsearch}{" "}
                </Button>
              </div>
            </Col>
          </Row>
          <Row gutter={[15, 0]} className={`marginTop`}>
            <Col span={18}>
              <div className={`tasksBg taskIssue`}>
                <h2>{feedbackIssues}</h2>
                {issue?.map(item => (
                  <Button
                    className="taskBtn"
                    key={item.id}
                    type={issueType === item.id ? "primary" : ""}
                    ghost={issueType === item.id ? false : true}
                    onClick={() => setIssueType(item.id)}
                  >
                    {item.name}
                  </Button>
                ))}
                {component(issueType)}
              </div>
            </Col>
            <Col span={6}>
              <div className={`tasksBg taskIssue`} style={{ maxWidth: "434px" }}>
                <Carousel autoplay>
                  {carouselData.map(item => (
                    <div key={item.id} className={`tasksCarousel`}>
                      <h2>{item.title}</h2>
                      <p>{item.content}</p>
                    </div>
                  ))}
                </Carousel>
              </div>
            </Col>
          </Row>
          <Row gutter={[15, 0]} className={`tasksBg marginTop taskInfo`}>
            <h2>{deviceInfo}</h2>
            <Col span={4} className="taskInfoBox">
              <div className={"leftBox"}>
                <img src={taskInfoIcon} alt={taskInfoData.sMachineNameTitle} />
                <div>
                  <h3>{taskInfoData.sMachineNameTitle}：</h3>
                  <p>{taskInfoData.sMachineNameConent}</p>
                </div>
              </div>
            </Col>
            <Col span={4} className="taskInfoBox">
              <div className={"leftBox"}>
                <img src={statusIcon} alt={taskInfoData.sStatusNameTitle} />
                <div>
                  <h3>{taskInfoData.sStatusNameTitle}：</h3>
                  <p>{taskInfoData.sStatusNameConent}</p>
                </div>
                <StatusBtnComponent  props ={ props}/>
              </div>
            </Col>
            <Col span={10} className="taskInfoBox">
              <div className={"centerBox"}>
                <img src={timeIcon} alt={taskInfoData.tStartingUpTimeTitle} />
                <div className="timeBox">
                  <h3>{taskInfoData.tStartingUpTimeTitle}：</h3>
                  <p>{taskInfoData.tStartingUpTimeConent}</p>
                </div>
                <div className="timeBox">
                  <div className="bothEndsAlign">
                    <p>{taskInfoData.tNorRunTimeTitle}：</p>
                    <span>{taskInfoData.tNorRunTimeConent}</span>
                  </div>
                  <div className="bothEndsAlign">
                    <p>{taskInfoData.tExeWaitTimeTitle}：</p>
                    <span>{taskInfoData.tExeWaitTimeConent}</span>
                  </div>
                </div>
                <div className="timeBox">
                  <div className="bothEndsAlign">
                    <p>{taskInfoData.tNorWaitTimeTitle}：</p>
                    <span>{taskInfoData.tNorWaitTimeConent}</span>
                  </div>
                  <div className="bothEndsAlign">
                    <p>{taskInfoData.tMaintenceTimeTitle}：</p>
                    <span>{taskInfoData.tMaintenceTimeConent}</span>
                  </div>
                </div>
              </div>
            </Col>
            <Col span={6} className="taskInfoBox">
              <div className={"leftBox"}>
                <img src={taskIcon} alt={taskInfoData.tStartingUpTimeTitle} />
                <div>
                  <h3>{TasksQty}：</h3>
                  <p>
                    {taskInfoData.iFinishTaskBatchConent} /{" "}
                    {taskInfoData.iFinishProductionNumConent}
                  </p>
                </div>
              </div>
            </Col>
          </Row>
          <TaskConfirmModal {...props} />
        </div>
      );
    };

    const TaskConfirmModal = props => {
      const {
        taskConfirmModalVisible,
        taskConfirmModalMsg,
        bPauseOnly,
        slave0Config
      } = props;
      if (!taskConfirmModalVisible) return "";

      const handleClose = () => {
        props.itemClickRef.current = null;
        props.onSaveState({
          taskConfirmModalVisible: false,
          bPauseOnly: false,
          pauseCallback: null
        });
      };

      const [pauseValue, setPauseValue] = useState("");

      const viewConfigs = slave0Config?.gdsconfigformslave.filter(
        item => item.sName === "sPausereason"
      );

      const sIdRef = useRef(commonUtils.createSid());

      const viewProps = {
        ...props,
        viewConfigs,
        tableConfig: { ...slave0Config, gdsconfigformslave: viewConfigs },
        iColValueView: 24,
        viewRow: { sId: sIdRef.current, sPausereason: pauseValue },
        tableName: "slave0",
        enabled: true,
        onDataChange: (...args) => {
          setPauseValue(args[2].sPausereason);
        }
      };
      const prompt = commonFunc.showLocalMessage(props, 'prompt', '提示');
      const pause = commonFunc.showLocalMessage(props, 'pause', '提示');
      const finishConstruction = commonFunc.showLocalMessage(props, 'finishConstruction', '完工');
      const choosePauseReason = commonFunc.showLocalMessage(props, 'choosePauseReason', '请先选择暂停原因');
      return (
        <Modal
          title={<span style={{ fontSize: 22 }}>{prompt}</span>}
          open={taskConfirmModalVisible}
          width={500}
          height={320}
          className="mesCommonModal"
          footer={
            <>
              {bPauseOnly ? (
                <Space>
                    <Button
                    size="large"
                    type="primary"
                    className={styles.btnZt}
                    onClick={() => {
                        if (!pauseValue.trim()) {
                        message.warning(choosePauseReason);
                        return;
                        }
                        props.pauseCallback(pauseValue.trim());
                    }}
                    >
                      {pause}
                    </Button>
                </Space>
              ) : (
                <Space style={{ width: "100%" , 'justify-content': 'space-between' }}>
                        <Button
                            size="large"
                            type="primary"
                            className={styles.btnWg}
                            onClick={() => {
                            if (props.itemClickRef.current?.data)
                                props.onTableBtnClick({
                                ...(props.itemClickRef.current?.data || {}),
                                iFlag: 4
                                });
                            // handleClose();
                            }}
                        >
                          {finishConstruction}
                        </Button>
                        <Button
                            size="large"
                            type="primary"
                            className={styles.btnZt}
                            onClick={() => {
                            if (!pauseValue.trim()) {
                                message.warning(choosePauseReason);
                                return;
                            }
                            if (props.itemClickRef.current?.data)
                                props.onTableBtnClick({
                                ...(props.itemClickRef.current?.data || {}),
                                iFlag: 3,
                                pauseValue: pauseValue.trim()
                                });
                            // handleClose();
                            }}
                        >
                         {pause}
                    </Button>
                </Space>
              )}
            </>
          }
          onCancel={handleClose}
        >
          <div className={styles.taskConfirmModal}>{taskConfirmModalMsg}</div>
          <div className={styles.pauseReason}>
            {/* <div className={styles.pauseTitle}>暂停原因</div> */}
            <CommonViewTable {...viewProps} />
            {/* <Input.TextArea
              placeholder="请输入暂停原因"
              autoSize={{ minRows: 3, maxRows: 3 }}
              style={{ width: "100%" }}
              value={pauseValue}
              onChange={e => setPauseValue(e.target.value)}
            /> */}
          </div>
        </Modal>
      );
    };

    // 全屏状态
    const StatusBtnComponent = ({props}) => {

      const test = commonFunc.showLocalMessage(props, 'test', '测试');
      const switchProduction = commonFunc.showLocalMessage(props, 'switchProduction', '转111产');
      const maintain = commonFunc.showLocalMessage(props, 'maintain', '保养');
      const productSampling = commonFunc.showLocalMessage(props, 'productSampling', '产品打111样');
      const processTesting = commonFunc.showLocalMessage(props, 'processTesting', '工艺测试');
      const dailyMaintenance = commonFunc.showLocalMessage(props, 'dailyMaintenance', '日常保养');
      const firstMaintenance = commonFunc.showLocalMessage(props, 'firstMaintenance', '日常保养');
      const secondMaintenance = commonFunc.showLocalMessage(props, 'secondMaintenance', '二级保养');
      const FSMaintenance = commonFunc.showLocalMessage(props, 'FSMaintenance', '一级+二级保养');
      const annualMaintenance = commonFunc.showLocalMessage(props, 'annualMaintenance', '年度保养');



        const items = [
            {
                key: "4",
                label: <span className={styles.statusDropdown}>{switchProduction}</span>,
                value: {
                    conent2: switchProduction,
                    backgroundColor: "#752AFE"
                }
            },
            {
                key: "1",
                label: <span className={styles.statusDropdown}>{test}</span>,
                value: {
                    conent2: switchProduction,
                    backgroundColor: "#21C9FE"
                },
                children: [
                    {
                    key: "1-1",
                    label: <span className={styles.statusDropdown}>{productSampling}</span>,
                    value: {
                        conent2: processTesting,
                        backgroundColor: "#21C9FE"
                    }
                    },
                    {
                    key: "1-2",
                    label: <span className={styles.statusDropdown}>{processTesting}</span>,
                    value: {
                        conent2: processTesting,
                        backgroundColor: "#21C9FE"
                    }
                    }
                ]
            },
            {
                key: "2",
                label: <span className={styles.statusDropdown}>{maintain}</span>,
                value: {
                    conent2: maintain,
                    backgroundColor: "#FF6600"
                },
                children: [
                    {
                    key: "2-1",
                    label: <span className={styles.statusDropdown}>{dailyMaintenance}</span>,
                    value: {
                        conent2: dailyMaintenance,
                        backgroundColor: "#FF6600"
                    }
                    },
                    {
                    key: "2-2",
                    label: <span className={styles.statusDropdown}>{firstMaintenance}</span>,
                    value: {
                        conent2: firstMaintenance,
                        backgroundColor: "#FF6600"
                    }
                    },
                    {
                    key: "2-3",
                    label: <span className={styles.statusDropdown}>{secondMaintenance}</span>,
                    value: {
                        conent2: secondMaintenance,
                        backgroundColor: "#FF6600"
                    }
                    },
                    // {
                    // key: "2-4",
                    // label: <span className={styles.statusDropdown}>{FSMaintenance}</span>,
                    // value: {
                    //     conent2: FSMaintenance,
                    //     backgroundColor: "#FF6600",
                    //     fontSize: 130
                    // }
                    // },
                    {
                    key: "2-5",
                    label: <span className={styles.statusDropdown}>{annualMaintenance}</span>,
                    value: {
                        conent2: annualMaintenance,
                        backgroundColor: "#FF6600"
                    }
                    }
                ]
            }
        ];

        // 全屏
        const handleMenuClick = item2 => {
            const newObj = {
                ...item2,
                item: item2.item
            };
            window.$wkcFullStatus(newObj , true)
        };


      return (
        <>
            <div className={styles.statusBtn}>
                <Dropdown  menu={{ items, onClick: handleMenuClick }} trigger={["click"]} placement="top" overlayClassName={styles.statusDropdown}  >
                    <Button type="link" size="large" style={{ fontSize: 26 }}>
                        <SettingTwoTone />
                    </Button>
                </Dropdown>
            </div>
        </>
      );
    };

    // const MachineMessageComponent = ({ e  , shutDown , minimize}) => {
    //   const value = e.item?.props?.value || {};
    //   const { current: startTime } = useRef(moment().format("YYYY-MM-DD HH:mm:ss"));
    //   const { backgroundColor, conent2, fontSize } = value;
    //   const [currentTime, setCurrentTime] = useState("");
    //   const [diffHours, setDiffHours] = useState(0);
    //   const [diffMins, setDiffMins] = useState(0);
    //   const [diffSecs, setDiffSecs] = useState(0);
    //   const flagRef = useRef(0);
    //   useEffect(() => {
    //     const getTime = () => {
    //       const currentTimeNew = moment().format("YYYY-MM-DD HH:mm:ss");
    //       setCurrentTime(currentTimeNew);

    //       const duration = moment.duration(
    //         moment(currentTimeNew).diff(moment(startTime))
    //       );
    //       const hours = duration
    //         .asHours()
    //         .toString()
    //         .split(".")[0];
    //       const minutes = (duration.asMinutes() % 60).toString().split(".")[0];
    //       const seconds = duration.asSeconds() % 60;

    //       setDiffHours(hours);
    //       setDiffMins(minutes);
    //       setDiffSecs(seconds);
    //     };

    //     getTime();
    //     const timer = setInterval(() => {
    //       getTime();
    //     }, 1000);

    //     // const handleMenuClose = () => {
    //     //   if (flagRef.current) return;
    //     //   flagRef.current++;
    //     //   Modal.confirm({
    //     //     title: "温馨提示:",
    //     //     content: <div>确认退出该页面？</div>,
    //     //     okText: "确认",
    //     //     cancelText: "取消",
    //     //     zIndex: 2000,
    //     //     onOk() {
    //     //       message.destroy();
    //     //     },
    //     //     onCancel() {
    //     //       setTimeout(() => {
    //     //         flagRef.current = 0;
    //     //       }, 500);
    //     //     }
    //     //   });
    //     // };

    //     // setInterval(() => {
    //     //   document.addEventListener("click", handleMenuClose);
    //     // }, 1000);

    //     return () => {
    //         clearInterval(timer);
    //         //   document.removeEventListener("click", handleMenuClose);
    //     };
    //   }, []);

    //   const handleMenuClose = () => {
    //     if (flagRef.current) return;
    //     flagRef.current++;
    //     Modal.confirm({
    //       title: "温馨提示:",
    //       content: <div>确认退出该页面？</div>,
    //       okText: "确认",
    //       cancelText: "取消",
    //       zIndex: 2000,
    //       onOk() {
    //         // message.destroy();
    //         shutDown()
    //       },
    //       onCancel() {
    //         setTimeout(() => {
    //           flagRef.current = 0;
    //         }, 500);
    //       }
    //     });
    //   };

    //   return (
    //     <div className={styles.machineStatusContent} style={{ backgroundColor }}>
    //       <div className="conent1">设备停机状态告知</div>
    //       <div className="conent2" style={fontSize ? { fontSize } : {}}>
    //         {conent2}
    //       </div>
    //       <div className="conent3">
    //         停机开始时间：
    //         {startTime}
    //       </div>
    //       <div className="conent4">
    //         系统当前时间：
    //         {currentTime}
    //       </div>
    //       <div className="conent5">
    //         此次停机耗时：
    //         <span className="conent6">
    //           约：
    //           {diffHours}时 {diffMins}分 {diffSecs}秒
    //         </span>
    //       </div>
    //       <div className="conent7">
    //         <Button size="large" type="primary" className={styles.btnWg} onClick={minimize} > 最小化 </Button>
    //         <Button size="large" type="primary" className={styles.btnWg} onClick={handleMenuClose} > 退出 </Button>
    //       </div>
    //     </div>
    //   );
    // };

    export default MachineTasks;