/*
 * @Author: Sakura
 * @LastEditors: Sakura
 * @Date: 2024-02-26 10:55:04
 * @Description: 班组信息界面
 */

import React, { useEffect, useRef, useState } from "react";
import { Avatar, Col, Row, Button, Modal, Spin, Form, Input } from "antd";
import { UserOutlined } from "@ant-design/icons";
import RouterComponent from "@/routes/mes/routerComponent";

import styles from "./index.less";
import { DraggableConfirmModal } from "@/components/Draggable";

import * as commonFunc from "@/components/Common/commonFunc";
import * as commonUtils from "@/utils/utils";
import * as commonBusiness from "@/components/Common/commonBusiness";
import * as commonConfig from "@/utils/config";
import * as commonServices from "@/services/services";
import ShowType from "@/components/Common/CommonComponent";
import useCommonBase from "@/components/Common/CommonHooks/useCommonBase";
import StaticEditTable from "@/components/Common/CommonTable";
import FaceDetect from "@/components/FaceDetect";
import CommonOperationBarComponent from "@/mes/common/commonOperationBarComponent";

import userImgs from "./assets/user.jpg";
import teaIcon from "./assets/teaIcon.png";
import joinIcon from "./assets/joinIcon.png";
import { message } from "antd";

const teamInfoSid = "17086669370007136849817837261000";
let loginInfo = {};
// 业务层
const useTeamInfoEvent = props => {
  const { formData, mesRefresh = true } = props;
  useEffect(
    async () => {
      if (commonUtils.isNotEmptyArr(formData) && mesRefresh) {
        const colunmData = handleGetColumnData(formData, true);
        const result = await handleGetData(formData, true);
        const addState = {
          ...colunmData,
          ...result,
          bFinish: true
        };
        props.onSaveState({ ...addState, loadings: false, mesRefresh: false });
      }
    },
    [formData, mesRefresh]
  );

  // 监听人员表第一条数据的实际上班人员
  const sFirstActualEmployeeName = props.slave0Data?.[0]?.sActualEmployeeName;
  const timer = useRef(null);
  useEffect(
    () => {
      if (!props.bFinish) return;
      const changeUserInfo = () => {
        const userinfo = commonUtils.getAppData("userinfo");
        if (
          sFirstActualEmployeeName &&
          sFirstActualEmployeeName !== userinfo.sUserName
        ) {
          userinfo.sUserName = sFirstActualEmployeeName;
          userinfo.sUserNo = props.slave0Data[0].sActualEmployeeNo;
          props.dispatch({
            type: "app/saveUserinfo",
            payload: userinfo
          });
        } else if (
          sFirstActualEmployeeName === undefined &&
          userinfo.sUserNameBak &&
          userinfo.sUserNameBak !== userinfo.sUserName
        ) {
          userinfo.sUserName = userinfo.sUserNameBak;
          userinfo.sUserNo = userinfo.sUserNoBak;
          props.dispatch({
            type: "app/saveUserinfo",
            payload: userinfo
          });
        }
      };

      clearTimeout(timer.current);
      timer.current = setTimeout(() => {
        changeUserInfo();
      }, 200);
    },
    [sFirstActualEmployeeName]
  );

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

  // 获取数据集
  const handleGetData = async (formData = [], isWait) => {
    let addState = {};
    for (let i = 0; i < formData.length; i++) {
      const config = formData[i];
      const { sGrd } = config;
      const conditonValues = props.onGetSqlConditionValues(config);
      const result =
        (await props.onGetDataSet({
          name: sGrd, // 有指定表名时用指定表名
          configData: config,
          condition: { sSqlCondition: { ...conditonValues } },
          isWait: true
        })) || {};
      props.setTempRef(result);
      addState = { ...addState, ...result };
    }
    props.setTempRef({}, true);
    if (isWait) {
      return addState;
    } else {
      props.onSaveState(addState);
    }
  };

  const sModelsId = "16034339700006038392152714521000";
  const mesSysbrands = commonUtils.convertStrToObj(
    localStorage.getItem("mesSysbrands")
  );
  const { masterData = {} } = props;
  // 遍历登录文本组件
  const handleGetFormItem = (props, item) => {
    let enabledNew = true;
    const showTypeProps = {
      bNewForm: true,
      iColValue: 24,
      record: { ...masterData, ...mesSysbrands },
      name: "master",
      formId: sModelsId,
      getSqlDropDownData: props.getSqlDropDownData,
      getSqlCondition: props.getSqlCondition,
      handleSqlDropDownNewRecord: props.handleSqlDropDownNewRecord,
      getFloatNum: props.getFloatNum,
      getDateFormat: props.getDateFormat,
      onChange: (...args) => {
        loginInfo = { ...loginInfo, ...args[2] };
      },
      showConfig: { ...item, sDropDownType: "" },
      formItemLayout: { labelCol: { span: 0 }, wrapperCol: { span: 24 } },
      textArea: false,
      enabled: enabledNew,
      dataValue: masterData[item.sName],
      bTable: item.sName !== "sPassWord",
      bViewTable: true,
      onFilterDropDownData: props.onFilterDropDownData,
      onSaveState: props.onSaveState,
      bPassWord: item.sName === "sPassWord",
      style: { backgroundColor: "#eaeaea" }
    };
    return (
      <Form.Item
        label={item.sName === "sUserName" ? "账号" : item.showName}
        key={item.sName}
      >
        <ShowType {...showTypeProps} />
      </Form.Item>
    );
  };
  const getFaceResult = async () => {
    let faceResult = false;
    const loginType = await new Promise(resolve => {
      Modal.confirm({
        title: "温馨提示：",
        content: "请选择验证方式",
        closable: true,
        maskClosable: true,
        wrapClassName: "mesCommonModal",
        cancelText: "账号密码",
        okText: "人脸识别",
        onOk() {
          resolve(1);
        },
        onCancel(e) {
          if (e.name) {
            resolve(2);
            Modal.destroyAll();
          } else {
            resolve(0);
          }
        }
      });
    });

    if (loginType === 1) {
      // 人脸识别
      faceResult = await new Promise(resolve => {
        const modal = Modal.info({
          title: "人脸识别",
          keyboard: false,
          content: (
            <FaceDetect
              loginAfterInit
              onIdentifySuccess={e => {
                const resultRowData = e.dataset.rows[0];
                resolve(resultRowData);
                modal.destroy();
              }}
              actionType={"identifyFace"}
            />
          ),
          wrapClassName: "xlyFaceAuthModal",
          okText: "取消",
          onOk() {
            resolve(false);
          }
        });
      });
    } else if (loginType === 2) {
      // 账号密码登陆
      let loginConfig;
      const configUrl = `${commonConfig.server_host
        }business/getModelBysId/${sModelsId}?sModelsId=${sModelsId}&sName=/commonAuto`;
      const configReturn = (await commonServices.getService("", configUrl))
        .data;
      if (configReturn.code === 1) {
        const dataReturn = configReturn.dataset.rows;
        if (commonUtils.isNotEmptyArr(dataReturn)) {
          const { formData } = dataReturn[0];
          if (commonUtils.isNotEmptyArr(formData)) {
            loginConfig = formData[0].gdsconfigformslave.filter(
              item =>
                item.bVisible &&
                item.sName &&
                ["sUserName", "sPassWord"].includes(item.sName)
            );
          }
        }
      } else {
        message.error(configReturn.msg);
      }

      faceResult = await new Promise(resolve => {
        loginInfo = {};
        Modal.confirm({
          title: "请输入账号密码：",
          content: (
            <Form layout="vertical" size="large">
              {loginConfig.map(item => handleGetFormItem(props, item))}
            </Form>
          ),
          wrapClassName: "mesCommonModal mesLoginForm",
          cancelText: "取消",
          okText: "确定",
          onOk(e) {
            if (e.name) {
              if (!loginInfo.sUserNo && !loginInfo.sUserName) {
                message.error("账号/姓名不能为空！");
                return;
              }

              if (!loginInfo.sPassWord) {
                message.error("密码不能为空！");
                return;
              }

              const { sBrandsId, sSubsidiaryId } = mesSysbrands;
              const url = `${commonConfig.server_host
                }userloginUserNo/${sBrandsId}/${sSubsidiaryId}`;
              const value = {
                username: loginInfo.sUserNo || loginInfo.sUserName,
                password: loginInfo.sPassWord
              };

              commonServices
                .postValueService(null, value, url)
                .then(({ data: dataReturn }) => {
                  const { msg, code, dataset } = dataReturn;
                  if (code !== 1) {
                    message.error(msg);
                    return;
                  }

                  if (commonUtils.isNotEmptyObject(msg)) {
                    message.warning(msg, 6);
                  }

                  const result = dataset.rows[0];

                  resolve(result);
                });
            }
          },
          onCancel() {
            resolve(false);
          }
        });
      });
    }
    Modal.destroyAll();
    return faceResult;
  };

  // 上下班事件
  const handleChangeWorkState = async (params, workState) => {
    // 如果是上班，需要人脸识别
    let faceResult = false;
    // if (workState == "on") {
    const tempFaceData = localStorage.getItem("tempFaceData");
    if (tempFaceData) {
      faceResult = commonUtils.convertStrToObj(tempFaceData, {});
    } else {
      faceResult = await getFaceResult();
    }

    if (!faceResult) return;
    // }

    const { config, record, name } = params;

    if (workState === "off") {
      if (faceResult.sEmployeeNo !== record.sActualEmployeeNo) {
        message.error("下班人员与上班人员不一致!");
        return;
      }
    }

    props.onProcedureCall({
      btnConfig: config,
      tableData: [record],
      faceData: { sEmployeeNo: faceResult.sEmployeeNo },
      onSuccess: () => {
        handleRefreshDataByTableName(name, props);
      },
      onConfirm: () => { },
      onError: () => { }
    });

    // const tableDataNew = [...tableData];
    // tableDataNew[index].workState = 'on';
    // props.onSaveState({ [`${tableName}Data`]: tableDataNew });
  };

  // 通过表名刷新数据
  const handleRefreshDataByTableName = (tableName, props) => {
    const { [`${tableName}Config`]: config } = props;
    handleGetData([{ ...config, specifyTableName: tableName }]);
    props.onSaveState({ mesRefresh: true })
  };

  //   props.setLoading(false)

  // 刷新指定表格
  const { refreshTableList = [] } = props;
  useEffect(
    async () => {
      if (!refreshTableList.length) return;

      let addState = {
        refreshTableList: []
      };

      const formDataNew = formData.filter(item =>
        refreshTableList.includes(item.sGrd)
      );

      addState = {
        ...addState,
        ...(await handleGetData(formDataNew, true))
      };
      props.onSaveState(addState);
    },
    [refreshTableList.length]
  );

  // 监听slave0表数据，看是否有人上班
  const { slave0Data = [] } = props;
  const bStartWork =
    slave0Data.filter(item => item.sActualEmployeeName).length > 0;

  useEffect(
    () => {
      if (!props.bFinish) return;
      const userinfo = commonUtils.getAppData("userinfo");
      const userinfoNew = { ...userinfo, bStartWork };
      props.dispatch({
        type: "app/saveUserinfo",
        payload: userinfoNew
      });
    },
    [bStartWork]
  );

  return {
    ...props,
    //  其他对象
    onChangeWorkState: handleChangeWorkState
  };
};

// 班组信息
const TeamInfo = baseProps => {
  const bManuals = baseProps?.app?.userinfo?.bManual
  const [faceModal, setFaceModal] = useState(false);
  const { userinfo } = baseProps?.app
  const props = useTeamInfoEvent(
    useCommonBase({ ...baseProps, sModelsId: bManuals ? '172117190122117691507197360' : teamInfoSid })
  );
  const { formData = [] } = props;
  if (!formData.length) return "";

  const tableBaseProps = commonBusiness.getTableTypes("slave0", props);
  const { config: slave0Config } = tableBaseProps;

  // 上班按钮配置
  const BtnEnventStartWorkConfig =
    slave0Config?.gdsconfigformslave?.find(
      item => item.sControlName === "BtnEnventStartWork"
    ) || {};
  // 下班按钮配置
  const BtnEnventOfftWorkConfig =
    slave0Config?.gdsconfigformslave?.find(
      item => item.sControlName === "BtnEnventOfftWork"
    ) || {};

  const tableProps = {
    ...tableBaseProps,
    tableProps: {
      onChange: () => { }
      // AutoTableHeight: 400,
    },
    fixedHeight: "calc(25vh - 80px)",
    tableBtnsConfig: params => {
      const { record } = params;
      const {
        workState = "off",
        sTeamEmployeeName,
        sActualEmployeeName = ""
      } = record;
      // console.log(record)

      return [
        {
          ...BtnEnventStartWorkConfig,
          btnBgColor: sActualEmployeeName ? "#AAAAAA" : "#FAAD14"
        },
        {
          ...BtnEnventOfftWorkConfig,
          btnBgColor: !sActualEmployeeName ? "#AAAAAA" : "#FAAD14"
        }
      ];
    },
    tableBtnsWidth: "190px",
    // tableBtnsConfig:[
    //     { btnBgColor:"#AAAAAA" , showName:'上班' },
    //     { btnBgColor:"#FAAD14" , showName:'下班' }
    // ],
    onTableBtnClick: item => {
      const { record, config } = item;
      if (config.showName === "上班") {
        if (record.sActualEmployeeName) {
          message.info("当前正在上班中...", 3);
          return;
        }
        props.onChangeWorkState(item, "on");
      } else if (config.showName === "下班") {
        if (!record.sActualEmployeeName) {
          message.info("请先上班", 3);
          return;
        }
        props.onChangeWorkState(item, "off");
      }
    }
  };

  const { sForemanName = "", sIpqcName = "", sEmployeeName = "" } =
    props.slaveData && props.slaveData.length !== 0 ? props.slaveData[0] : {};

  const bManual = userinfo?.bManual;

  const { sTeamEmployeeNo = "" } = props.slave0Data?.[0] || {};

  const foremanConfig = props.slaveConfig?.gdsconfigformslave.find(item => item.sName === 'sForemanName') || {};
  const ipqcConfig = props.slaveConfig?.gdsconfigformslave.find(item => item.sName === "sIpqcName") || {};



  const operationBarProps = {
    ...props,
    sName: "slave0",
    bManual
  };
  const tableHeight = bManual ? "calc(88vh - 80px)" : "calc(25vh - 80px)";

  let faceProps = {
    ...props,
    faceModal,
    setFaceModal,

  };
  let bManualTableProps = null;
  let bManualSlaveTableProps = null;

  if (bManual) {
    // 获取主表和从表的基础配置
    const tableBaseProps = commonBusiness.getTableTypes("slave", props);
    const slaveTableBaseProps = commonBusiness.getTableTypes("slave1", props);

    // 初始化主表 props
    bManualTableProps = {
      ...tableBaseProps,
      fixedHeight: "calc(50vh - 218px)",
      tableBtnsWidth: "180px",
    };

    // 如果主表没有 selectedRowKeys，设为第一行 sId
    if (
      !bManualTableProps.selectedRowKeys ||
      bManualTableProps.selectedRowKeys.length === 0
    ) {
      const firstId = bManualTableProps.data?.[0]?.sId;
      if (firstId !== undefined) {
        bManualTableProps.selectedRowKeys = [firstId];
        // 可选：同步到父状态（如果需要）
        // props.onSaveState?.({ selectedRowKeys: [firstId] });
      }
    }

    // 获取当前选中的主表 sId
    const selectedParentId = bManualTableProps.selectedRowKeys?.[0];

    // 过滤从表数据：只保留 sParentId 匹配的项
    const filteredSlaveData = slaveTableBaseProps?.data?.filter(
      item => item.sParentId === selectedParentId
    ) || [];

    // 构建从表 props
    bManualSlaveTableProps = {
      ...slaveTableBaseProps,
      data: filteredSlaveData,
      fixedHeight: "calc(50vh - 126px)",
    };

    // 更新 faceProps 的 config
    faceProps = {
      ...faceProps,
      gdsconfigformslave: slaveTableBaseProps?.config?.gdsconfigformslave,
    };
  }

  const handleSave = (props) => {
    props.onExecInstructSet({
      btnConfig: {
        showName: "保存",
        sInstruct: JSON.stringify([
          {
            opr: "save",
          },
          {
            opr: "refresh",
          },
        ])
      },
      inscallback: () => {
        props.onSaveState({
          currentId: props.masterData.sId, enabled: false
        });
      }
    });
  }
  const { sMachineNameStr } = props?.app || {}
  const isSMachineNameStr = sMachineNameStr && sMachineNameStr.includes('礼盒')
  return (
    <div className={styles.teamInfo}>
      {bManual ? (
        // bManual = true 时的布局：左右结构
        <div className="teamInfoManual" >
          <div className="teamInfoRight">
            <div className="postList">
              <Spin spinning={props.loadings} delay={500}>
                <StaticEditTable {...tableProps} fixedHeight={tableHeight} />
                <CommonOperationBarComponent {...operationBarProps} />
              </Spin>
            </div>
          </div>
          {
            bManuals ?
              <div className="teamInfoLefts">
                <Spin spinning={props.loadings} delay={500}>
                  <div className="teamInfoTops" >
                    <div className={styles.boxFlex}><h2>
                      <img src={teaIcon} />
                      {bManualTableProps?.config?.showName}
                    </h2>

                    </div>
                    <StaticEditTable {...bManualTableProps} />
                    <div style={{ marginBottom: '28px' }}></div>
                    {/* <Button
                      type="primary"
                      style={{ position: 'absolute', right: '10px', bottom: ' 4px', }}
                      onClick={() => {
                        handleSave(props)
                      }}

                    >
                      {'保存'}
                    </Button> */}
                  </div>
                </Spin>
                <Spin spinning={props.loadings} delay={500}>
                  <div className="teamInfoTops" >
                    <div className={styles.boxFlex}><h2>
                      <img src={teaIcon} />
                      {bManualSlaveTableProps?.config?.showName}
                    </h2>
                      <Button
                        type="primary"
                        onClick={() => {

                          if (props.masterData && !props.masterData.length) {
                            return message.warning('请先添加一条班组信息！')
                          }
                          // setFaceModal(true);
                          const btnsConfig =
                            bManualSlaveTableProps?.config?.gdsconfigformslave.find(
                              item => item.sControlName?.toLowerCase().includes("btnenventinsertwork")
                            ) || {};
                          props.onExecInstructSet({
                            btnConfig: {
                              ...btnsConfig,
                              sInstruct: btnsConfig.sInstruct
                            },
                            nextProps: {
                              ...props,
                            }
                          });
                        }}

                      >
                        {'扫脸添加'}
                      </Button>
                    </div>
                    <StaticEditTable {...bManualSlaveTableProps} />
                    <div style={{ marginBottom: '28px' }}></div>
                    {/* <Button
                      type="primary"
                      style={{ position: 'absolute', right: '10px', bottom: ' 4px', }}
                      onClick={() => {
                        handleSave(props)
                      }}

                    >
                      {'保存'}
                    </Button> */}
                  </div>
                </Spin>
              </div>
              : <div className="teamInfoLeft">
                <div className="teamInfoTop">
                  <h2>
                    <img src={teaIcon} />
                    班组信息
                  </h2>
                  <div className="userWorkBox">
                    <div className="workTop">
                      {props.app.userinfo.sJzPicturePath ? (
                        <img
                          src={`${commonConfig.file_host}file/download?savePathStr=${props.app.userinfo.sJzPicturePath}&sModelsId=100&token=${props.token}`}
                          onError={event => {
                            event.target.src = userImgs;
                          }}
                        />
                      ) : (
                        <img src={userImgs} />
                      )}
                      <ul>
                        <li>
                          <label>机长</label>
                          <span>{sEmployeeName}</span>
                        </li>
                        <li>
                          <label>班组</label>
                          <span>{props.app.userinfo?.sTeamNo}</span>
                        </li>
                        <li>
                          <label>班次</label>
                          <span>
                            {props.app.userinfo?.sShift == "1"
                              ? "白班"
                              : props.app.userinfo?.sShift == "2"
                                ? "夜班"
                                : ""}
                          </span>
                        </li>
                      </ul>
                    </div>
                    <ul>
                      <li>
                        <label>{foremanConfig.showName}</label>
                        <span>{sForemanName}</span>
                      </li>
                      <li>
                        <label>
                          {props.app.userinfo?.iInterface == 10
                            ? "OQC/姓名"
                            : ipqcConfig.showName}
                        </label>
                        <span>{sIpqcName}</span>
                      </li>
                    </ul>
                  </div>
                </div>
                <div className="teamInfoLeftdiv">
                  <TeamJoinInfo {...props} />
                </div>
              </div>
          }

        </div>
      ) : (
        // bManual = false 时的布局：维持原样
        <>
          <div className="teamPost" style={{ height: isSMachineNameStr ? '50%' : '31%' }}>
            <div className="teamInfo">
              <h2>
                <img src={teaIcon} />
                班组信息
              </h2>
              <div className="userWorkBox">
                <div className="workTop">
                  {props.app.userinfo.sJzPicturePath ? (
                    <img
                      src={`${commonConfig.file_host}file/download?savePathStr=${props.app.userinfo.sJzPicturePath}&sModelsId=100&token=${props.token}`}
                      onError={event => {
                        event.target.src = userImgs;
                      }}
                    />
                  ) : (
                    <img src={userImgs} />
                  )}
                  <ul>
                    <li>
                      <label>机长</label>
                      <span>{sEmployeeName}</span>
                    </li>
                    <li>
                      <label>班组</label>
                      <span>{props.app.userinfo?.sTeamNo}</span>
                    </li>
                    <li>
                      <label>班次</label>
                      <span>
                        {props.app.userinfo?.sShift == "1"
                          ? "白班"
                          : props.app.userinfo?.sShift == "2"
                            ? "夜班"
                            : ""}
                      </span>
                    </li>
                  </ul>
                </div>
                <ul>
                  <li>
                    <label>{foremanConfig.showName}</label>
                    <span>{sForemanName}</span>
                  </li>
                  <li>
                    <label>
                      {props.app.userinfo?.iInterface == 10
                        ? "OQC/姓名"
                        : ipqcConfig.showName}
                    </label>
                    <span>{sIpqcName}</span>
                  </li>
                </ul>
              </div>
            </div>
            <div className="postList">
              <Spin spinning={props.loadings} delay={500}>
                <StaticEditTable {...tableProps} fixedHeight={isSMachineNameStr ? 300 : 130} />
                <CommonOperationBarComponent {...operationBarProps} />
              </Spin>
            </div>
          </div>
          <TeamJoinInfo {...props} />
        </>
      )}

      {/* 刷脸 */}
      <FaceLoginModal {...faceProps} />
    </div>
  );
};

// 人脸登录弹窗
const FaceLoginModal = props => {
  const { faceModal, setFaceModal, gdsconfigformslave } = props;
  if (!faceModal) return "";

  // 人脸登录成功回调
  const handleIdentifySuccess = e => {
    const { sSubsidiaryId: sId, sEmployeeNo } = e.dataset.rows[0];
    // ZY023
    const { slave1Data = [] } = props
    const faceData = { ...e.dataset.rows[0], handleType: 'add', sParentId: props.slaveSelectedRowKeys?.[0] || '' };
    const list = [
      ...slave1Data,
      faceData,

    ]
    // props.onSaveState({ slave1Data: list });
    const btnsConfig =
      gdsconfigformslave.find(
        item => item.sControlName?.toLowerCase().includes("btnenventinsertwork")
      ) || {};
    props.onExecInstructSet({
      btnConfig: {
        ...btnsConfig,
        sInstruct: btnsConfig.sInstruct
      },
      nextProps: {
        ...props,
      }
    });
    setFaceModal(false)

    // handleSubmit(value);
  };

  return (
    <Modal
      title="刷脸上岗"
      open={faceModal}
      width={334}
      style={{
        top: "calc(50vh - 220px)"
      }}
      footer={null}
      onCancel={() => {
        setFaceModal(false);
      }}
    >
      <div className={styles.faceLogin}>
        <FaceDetect
          loginAfterInit
          onIdentifySuccess={handleIdentifySuccess}
          actionType="identifyFace"
        />
      </div>
    </Modal>
  );
};

const TeamJoinInfo = props => {
  const { slave1Config, slave1Data } = props;
  const { app } = props;
  const { userinfo } = app;
  const bManual = userinfo?.bManual;

  const joinInfoData = commonUtils.filteredArr(
    slave1Config?.gdsconfigformslave.map(e => {
      if (e.bVisible) {
        return e;
      }
    })
  );

  const joinInfoTableData = commonUtils
    .filteredArr(
      props.formData?.map((e, i) => {
        if (i >= 3 && i <= 5) {
          return { showName: e.showName, tableName: e.sGrd };
        }
      })
    )
    ?.filter(item => item.tableName !== "slave3");
  const { sMachineNameStr } = props?.app || {}
  const isSMachineNameStr = sMachineNameStr && sMachineNameStr.includes('礼盒')
  const tableProps = tableName => {
    const result = {
      ...commonBusiness.getTableTypes(tableName, props),
      tableProps: {
        onChange: () => { }
      },
      onTableBtnClick: props.onTableBtnClick,
      fixedHeight: isSMachineNameStr ? (tableName === "slave4" ? "100px" : "80px") : tableName === "slave4" ? "230px" : "160px"
    };

    result.tableBtnsConfig = result.config?.gdsconfigformslave
      ?.filter(
        item => item.bVisible && item.sControlName === "BtnTable.confirm"
      )
      .map(item => ({ ...item, btnBgColor: "#1890ff" }));
    return result;
  };

  const handleOk = () => {
    // 将当前选中行保存到全局
    props.dispatch({
      type: "app/saveGlobalData",
      payload: {
        bStartWork: true // 开工
      }
    });
    props.onChangeRouter({ type: "name", path: ["计划任务", "机台任务"] });
  };
  const workHandoverInformation = commonFunc.showLocalMessage(props, 'workHandoverInformation', '上班交接信息');

  return (
    <div className="joinInfo" style={{ height: isSMachineNameStr ? '49%' : '68%' }}>
      <Row className="teamTitle">
        <h2 style={{ color: "#1890ff", margin: 0 }}>
          <img src={joinIcon} />
          {workHandoverInformation}
        </h2>
      </Row>
      <Row className="teamInfoBox">
        {bManual ? (
          // bManual = true 时的布局：teamInfoLeft占据整个宽度
          <Col span={24} className="teamInfoLeft">
            {joinInfoData?.map((item, i) => (
              <div key={i} className="infoBox">
                <h2>{item.showName}</h2>
                <div className="infoBorBox">
                  {slave1Data.length > 0 ? slave1Data[0][item.sName] : ""}
                </div>
              </div>
            ))}
          </Col>
        ) : (
          // bManual = false 时的布局：维持原有左右布局
          <>
            <Col span={6} className="teamInfoLeft">
              {joinInfoData?.map((item, i) => (
                <div key={i} className="infoBox">
                  <h2>{item.showName}</h2>
                  <div className="infoBorBox">
                    {slave1Data.length > 0 ? slave1Data[0][item.sName] : ""}
                  </div>
                </div>
              ))}
            </Col>
            <Col span={18} className="teamInfoRight">
              {joinInfoTableData?.map((item, i) => (
                <div key={i} className="infoBox">
                  <h2>{item.showName}</h2>
                  <div className="infoBorBox">
                    <Spin spinning={props.loadings} delay={500}>
                      <StaticEditTable {...tableProps(item.tableName)} />
                    </Spin>
                  </div>
                </div>
              ))}
            </Col>
          </>
        )}
      </Row>
      {/* <Row className="teamFoot">
                <Col span={24} className='teamBtn'>
                    <DraggableConfirmModal
                        btnText='确认'
                        content={'请再次确认提交的内容'}
                        onOk={() => {
                            handleOk();
                            console.log('点击确定')
                        }}
                        onCancel={() => {
                            console.log('点击取消')
                        }}
                    />
                </Col>
            </Row> */}
    </div>
  );
};

export default TeamInfo;