import React, { useEffect, useState } from "react";
import { cloneDeep } from "lodash";
import { Form, Button, message } from "antd";

import * as commonConfig from "@/utils/config";
import * as commonServices from "@/services/services";
import * as commonUtils from "@/utils/utils";
import * as commonFunc from "@/components/Common/commonFunc";
import useCommonBase from "@/components/Common/CommonHooks/useCommonBase";
import ShowType from "@/components/Common/CommonComponent";
import FaceDetect from "@/components/FaceDetect";

import styles from "./index.less";
import { Modal } from "antd";

const initValue = {
  sModelsId: "16034339700006038392152714521000"
};

// 事件层
const useLoginEvent = props => {
  const [companys, setCompanys] = useState([]); // 添加这行
  // 清除浏览器缓存
  useEffect(() => {
    const ipAddress = localStorage.ipAddress;
    const tempFaceData = localStorage.tempFaceData;
    props.dispatch({
      type: "app/saveCurrentMesPane",
      payload: {}
    });
    sessionStorage.clear();
    localStorage.clear();
    ipAddress && localStorage.setItem("ipAddress", ipAddress);
    tempFaceData && localStorage.setItem("tempFaceData", tempFaceData);
  }, []);

    // 获取公司信息
  useEffect(async () => {
    const companysConfigUrl = `${
      commonConfig.server_host
    }sysbrands/getSysbrands`;
    const companysConfigReturn = (await commonServices.getService(
      null,
      companysConfigUrl
    )).data;
    if (companysConfigReturn.code === 1) {
      const rows = companysConfigReturn.dataset.rows;
      const { sParentId, sId } = rows[0];
      localStorage.setItem(
        "mesSysbrands",
        JSON.stringify({ sBrandsId: sParentId, sSubsidiaryId: sId })
      );
      /* 测试英文版本 默认英文 */
      // if(companysConfigReturn.dataset.rows) {
      //   companysConfigReturn.dataset.rows[0].sLanguage = 'sEnglish';
      // }
      setCompanys(companysConfigReturn.dataset.rows); // 修改这行2

      props.onSaveState({
        masterData: { sBrandsId: sParentId, sSubsidiaryId: sId }
      });
    } else {
      message.error(companysConfigReturn.msg);
    }
  }, []);

  // 获取登录配置
  const [loginConfig, setLoginConfig] = useState([]);
  useEffect(async () => {
    if (!companys.length) return; // 确保companys已获取
    const { sModelsId } = initValue;
    const sLanguage = companys[0]?.sLanguage || 'sEnglish';
    const configUrl = `${
      commonConfig.server_host
    }business/getModelBysId/${sModelsId}?sLanguage=${sLanguage}&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)) {
          setLoginConfig(formData[0]);
        }
      }
    } else {
      message.error(configReturn.msg);
    }
  },  [companys]);

  // 根据登录配置过滤登录页字段
  const [configs, setConfigs] = useState([]);
  useEffect(
    () => {
      if (!commonUtils.isNotEmptyObject(loginConfig)) {
        return;
      }

      const { gdsconfigformslave } = loginConfig;
      if (!commonUtils.isNotEmptyArr(gdsconfigformslave)) {
        return;
      }

      const tempConfig = gdsconfigformslave.filter(
        item => item.bVisible && item.sName
      );
      setConfigs(tempConfig);
    },
    [loginConfig]
  );



  // 获取开工人员信息
  const handleGetTeamEmployee = async (sTeamId, token) => {
    const url = `${
      commonConfig.server_host
    }oee/getTeamEmployee/${sTeamId}?sModelsId=100`;
    const dataReturn = (await commonServices.getService(token, url)).data;
    if (dataReturn.code === 1) {
      const returnData = dataReturn.dataset.rows;
      localStorage.setItem(
        `${commonConfig.prefix}oeeEmployeeData_${sTeamId}`,
        JSON.stringify(returnData)
      );
    } else {
      message.error(dataReturn.msg);
    }
  };

  const handleUserlogin = param => {
    const { dispatch } = props;
    dispatch({
      type: "loginMes/login",
      payload: { ...param, dispatch }
    });
  };

  // 登录事件
  const handleSubmit = async ({ faceLoginValue = {}, sEmployeeNo } = {}, configsData) => {
    const bFaceLogin = commonUtils.isNotEmptyObject(faceLoginValue);

    let dataReturn = {};
    if (!bFaceLogin) {
      // 账号密码登录
      const { masterData, companys } = props;
      // 新增方法：根据sName过滤configs
      const getConfigByName = (name, configs, sLanguage) => {
        const configObj = configs.find(item => item.sName === name);
        const showName = sLanguage === 'sChinese' ? configObj?.sChinese : sLanguage ==='sEnglish' ? configObj?.sEnglish :
          sLanguage === 'sBig5' ? configObj?.sBig5 : configObj?.sChinese;
        return showName;
      };
      const sLanguage = commonUtils.isNotEmptyArr(companys) ? companys[0].sLanguage : 'sEnglish';

      const pleaseSelectUser = getConfigByName('pleaseSelectUser', configsData,  sLanguage);

      const pleaseInputPassword = getConfigByName('pleaseInputPassword', configsData,  sLanguage) || 'Please Input Password';

      const pleaseSelectTeam = getConfigByName('pleaseSelectTeam', configsData,  sLanguage) || 'Please Select Team' ;

      const pleaseselectShift = getConfigByName('pleaseselectShift', configsData,  sLanguage) || 'Please Select Shift';

      const pleaseSelectMachine = getConfigByName('pleaseSelectMachine', configsData,  sLanguage) || 'Please Select Machine';


      const {
        sUserId: userId,
        sUserNo: username,
        sUserName: userShowName,
        sPassWord: password,
        sBrandsId: sParentId,
        sSubsidiaryId: sId,
        sTeamId,
        sTeamName,
        sMachineId,
        sMachineName,
        iPlcNo,
        sShift
      } = masterData;

      const value = {
        userId,
        // username,
        userShowName,
        password,
        sParentId,
        sId,
        sTeamId,
        sTeamName,
        sMachineId,
        sMachineName,
        iPlcNo,
        sShift,
        sEmployeeNo
      };

      if (!sEmployeeNo) {
        value.username = username;
      } else {
        delete value.username;
        delete value.password;
      }

      if (!username) {
        message.error(pleaseSelectUser || 'Please Select User');
        return;
      }
      if (!sEmployeeNo && !password) {
        message.error(pleaseInputPassword);
        return;
      }
      if (sShift === undefined) {
        message.error(pleaseselectShift);
        return;
      }
      if (!sTeamId) {
        message.error(pleaseSelectTeam);
        return;
      }
      if (!sMachineId) {
        message.error(pleaseSelectMachine);
        return;
      }

      const url = `${
        commonConfig.server_host
      }userOeelogin/${sParentId}/${sId}/${sTeamId}/${sMachineId}`;
      dataReturn = (await commonServices.postValueService(null, value, url))
        .data;
    } else {
      // 人脸登录
      const { sBrandsId, sSubsidiaryId, sEmployeeNo } = faceLoginValue;
      const url = `${
        commonConfig.server_host
      }userOeelogin/${sBrandsId}/${sSubsidiaryId}`;
      const value = { sEmployeeNo, sParentId: sBrandsId, sId: sSubsidiaryId };
      dataReturn = (await commonServices.postValueService(null, value, url))
        .data;
    }

    if (dataReturn.code !== 1) {
      message.error(dataReturn.msg);
      return;
    }

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

    const {
      token,
      gdslogininfo = {},
      teamInfo = {},
      systemData,
      commonConst,
      rxtx,
      plcMachinedata,
      statusData,
      managementData,
      fileData,
      bDelayedOvertime
    } = dataReturn.dataset.rows[0];



    gdslogininfo.bDelayedOvertime = bDelayedOvertime;
    const userinfo = { ...teamInfo, ...gdslogininfo };
    const {
      sTeamShift: sShift1,
      sShift: sShift2,
      sTeamId,
      sTeamNo,
      sMachineGuid,
      sMachineId: sMachineIdOld,
      sMachineName,
      iPlcNo = ""
    } = userinfo;

    const sShift = sShift2 || sShift1 || "1";

    userinfo.sShift = sShift;
    userinfo.sUserNameBak = userinfo.sUserName;
    userinfo.sUserNoBak = userinfo.sUserNo;

    const sMachineId = sMachineGuid || sMachineIdOld;

    // 数字保留位数
    const decimals = {};
    if (systemData !== undefined) {
      const dNetPrice = systemData.filter(item => item.sName === "NetPrice")[0];
      const dNetMoney = systemData.filter(item => item.sName === "NetMoney")[0];
      const dNumAlign = systemData.filter(
        item => item.sName === "CkxNumAlign"
      )[0];
      decimals.dNetPrice =
        dNetPrice && dNetPrice.sValue ? dNetPrice.sValue * 1 : 6;
      decimals.dNetMoney =
        dNetMoney && dNetMoney.sValue ? dNetMoney.sValue * 1 : 6;
      decimals.dNumAlign = dNumAlign && dNumAlign.sValue ? dNumAlign.sValue : 0;
    }

    handleGetTeamEmployee(sTeamId, token);

    // 记住登录信息
    localStorage.setItem(
      `${commonConfig.prefix}userlogin`,
      JSON.stringify(userinfo)
    );
    localStorage.setItem(
      `${commonConfig.prefix}plcMachinedata_${sMachineId}`,
      JSON.stringify(plcMachinedata)
    );
    localStorage.setItem(
      `${commonConfig.prefix}statusData_${sMachineId}`,
      JSON.stringify(statusData)
    );

    handleUserlogin({
      token,
      systemData,
      rxtx,
      commonConst,
      userinfo,
      decimals,
      dateFormat: commonFunc.getDateFormat(systemData),
      sTeamNameSId: sTeamId,
      sTeamNameSName: sTeamNo,
      sMachineNameStr: sMachineName,
      sMachineNameSId: sMachineId,
      iPlcNo,
      managementData,
      fileData,
      sShift
    });
  };

  // 人脸登录
  const handleFaceLogin = () => {
    props.onSaveState({
      faceLoginModalVisible: true
    });
  };

  // 人脸登录成功回调
  const handleIdentifySuccess = e => {
    const faceLoginValue = e.dataset.rows[0];
    props.onSaveState({
      faceLoginModalVisible: false,
      faceLoginValue,
      faceLoginAfterModalVisible: true
    });
  };

  return {
    ...props,
    companys, // 确保返回companys
    configs,
    onSubmit: handleSubmit,
    onFaceLogin: handleFaceLogin,
    onIdentifySuccess: handleIdentifySuccess
  };
};

// 遍历登录文本组件
const handleGetFormItem = (props, item) => {
  const { sModelsId } = initValue;
  const { masterData = {}, companys } = props;
  const sLanguage = commonUtils.isNotEmptyArr(companys) && companys[0].sLanguage || 'sEnglish';
  let enabledNew = true;
  if(item.sName?.includes('please') || item.sName?.includes('请')) {
    return;
  }
  if (item.iTag === 1) {
    enabledNew = false;
  } else if (item.iTag === 3) {
    enabledNew = true;
  }
  const showTypeProps = {
    bNewForm: true,
    iColValue: 24,
    record: masterData,
    name: "master",
    formId: sModelsId,
    getSqlDropDownData: props.getSqlDropDownData,
    getSqlCondition: props.getSqlCondition,
    handleSqlDropDownNewRecord: props.handleSqlDropDownNewRecord,
    getFloatNum: props.getFloatNum,
    getDateFormat: props.getDateFormat,
    onChange: (...args) => {
      const [, sFieldsName, value = {}] = args;
      if (
        sFieldsName === "sUserName" &&
        value.sMachineName &&
        (value.sMachineName.indexOf("切纸") > -1 ||
          value.sMachineName.toLowerCase().indexOf("cu") > -1)
      ) {
        args[2].sMachineName = "";
        args[2].sMachineId = "";
      }
      props.onChange(...args);
    },
    showConfig: item,
    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" }
  };
  const showName = sLanguage === 'sChinese' ? item.sChinese :  sLanguage ==='sEnglish'  ? item.sEnglish
    : item.sBig5;
  return (
    <Form.Item label={showName} key={item.sName}>
      <ShowType {...showTypeProps} />
    </Form.Item>
  );
};

// 主入口
const login = baseProps => {
  const props = useLoginEvent(useCommonBase(baseProps));
  const { configs , app, companys } = props;
  const sysObj = commonUtils.isNotEmptyArr(companys) ?  companys[0] : [];

  const sLanguage = sysObj?.sLanguage || 'sEnglish';

  const oeeTitle =
    sLanguage === "sChinese" ? "小羚羊生产执行系统" : sLanguage === "sEnglish" ? "Manufacturing Execution System" : "小羚羊生產執行系統";

  const bannerTitle =
    sLanguage === "sChinese" ? "小羚羊生产执行系统" : sLanguage === "sEnglish" ? "XLY Manufacturing Execution System" : "小羚羊生產執行系統";

  const pleaseInputUserName =
    sLanguage === "sChinese"
      ? "用户名"
      : sLanguage === "sEnglish"
        ? "UserName"
        : "用戶名"; /* 用戶名 */
  const pleaseInputPassword =
    sLanguage === "sChinese"
      ? "密码"
      : sLanguage === "sEnglish"
        ? "Password"
        : "密碼"; /* 密码 */
  const teamName =
    sLanguage === "sChinese"
      ? "班组名称"
      : sLanguage === "sEnglish"
        ? "Team Name"
        : "班組名稱"; /* 班组名称 */
  const equipmentName =
    sLanguage === "sChinese"
      ? "设备名称"
      : sLanguage === "sEnglish"
        ? "Equipment Name"
        : "設備名稱"; /* 班组名称 */
  const btnLogin =
    sLanguage === "sChinese"
      ? "登 录"
      : sLanguage === "sEnglish"
        ? "Login"
        : "登 錄"; /* 登 陆 */
  const btnClose =
    sLanguage === "sChinese"
      ? "关 闭"
      : sLanguage === "sEnglish"
        ? "Close"
        : "關 閉"; /* 关 闭 */
  const btnFace = sLanguage === "sChinese"? "人 脸 登 录" : sLanguage === "sEnglish" ? "FaceLogin" : "人 臉 登 錄"; /* 人 脸 */

  const btnNormal =
    sLanguage === "sChinese"
      ? "普 通 登 录"
      : sLanguage === "sEnglish"
        ? "CommonLogin"
        : "普 通 人 臉"; /* 普 通 */

  const chooseBranchCompany =
    sLanguage === "sChinese"
      ? "请选择分公司名称"
      : sLanguage === "sEnglish"
        ? "Please select branch name"
        : "請選擇分公司名稱"; /* 请选择分公司名称 */



  const [form] = Form.useForm();

  return (
    <div className={styles.login}>
      {/*<div className="loginTitle">*/}
      {/*  <div className="loginTitle1">Enterprise Business Capability MES</div>*/}
      {/*  <div className="loginTitle2">{bannerTitle}</div>*/}
      {/*  <div className="loginTitle3">EBC-MES</div>*/}
      {/*</div>*/}
      <div className="loginBox">
        <div className="logo">{oeeTitle}</div>
        <Form form={form} layout="vertical" size="large">
          {configs.map(item => handleGetFormItem(props, item))}
          <Form.Item>
            <Button
              className="submitBtn"
              type="primary"
              block
              onClick={() => {
                props.onSubmit({}, configs);
              }}
            >
              {btnLogin}
            </Button>
          </Form.Item>
        </Form>
        <div className="faceLogin">
          <div
            className="faceImg"
            onClick={() => {
              props.onFaceLogin();
            }}
          />
          <div
            className="text"
            onClick={() => {
              props.onFaceLogin();
            }}
          >
            {btnFace}
          </div>
        </div>
        {/* <div style={{ width: "100%", height: 60 }} /> */}
      </div>
      <FaceLoginModal {...props} />
      <FaceLoginAfterModal {...props} />
    </div>
  );
};

// 人脸登录弹窗
const FaceLoginModal = props => {
  const { faceLoginModalVisible } = props;

  if (!faceLoginModalVisible) return "";
  const { companys } = props;
  const sLanguage = commonUtils.isNotEmptyArr(companys) ? companys[0].sLanguage : 'English';
  const btnFace = sLanguage === "sChinese"? "人 脸 登 录" : sLanguage === "sEnglish" ? "FaceLogin" : "人 臉 登 錄"; /* 人 脸 */

  return (
    <Modal
      title={btnFace}
      open={faceLoginModalVisible}
      width={800}
      height={800}
      className={styles.xlyFaceAuthLogin}
      style={{
        top: "calc(50vh - 400px)"
      }}
      footer={null}
      onCancel={() => {
        props.onSaveState({
          faceLoginModalVisible: false
        });
      }}
    >
      <div className={styles.faceLogin}>
        <FaceDetect
          loginAfterInit
          onIdentifySuccess={props.onIdentifySuccess}
          actionType="identifyFace"
        />
      </div>
    </Modal>
  );
};

// 人脸弹窗后选择其他内容
const FaceLoginAfterModal = props => {
  const { faceLoginAfterModalVisible , companys } = props;

  if (!faceLoginAfterModalVisible) return "";
  const sLanguage = commonUtils.isNotEmptyArr(companys) ? companys[0].sLanguage : 'English';
  const sLoginConfirm = sLanguage === "sChinese"? "登陆信息确认" : sLanguage === "sEnglish" ? "Login Information Confirmation" : "登陸信息確認"; /* 人 脸 */
  const btnConfirm = sLanguage === "sChinese"? "确认" : sLanguage === "sEnglish" ? "Confirm" : "確認"; /* 人 脸 */
  const btnCancel = sLanguage === "sChinese"? "确认" : sLanguage === "sEnglish" ? "Cancel" : "取消"; /* 取消 */


  const {
    configs: configOld = [],
    masterData = {},
    faceLoginValue = {}
  } = props;
  const { sModelsId } = initValue;
  const { name, sParentId, sEmployeeNo } = faceLoginValue;

  const configs = cloneDeep(configOld);
  const showConfig = configs.find(item => item.sName === "sUserName");
  showConfig.iTag = 1;

  useEffect(async () => {
    let returnData =
      (await props.getSqlDropDownData(
        sModelsId,
        "master",
        showConfig,
        masterData,
        name,
        1
      )) || {};

    if (commonUtils.isEmptyObject(returnData.dropDownData)) {
      returnData =
        (await props.getSqlDropDownData(
          sModelsId,
          "master",
          showConfig,
          masterData,
          sEmployeeNo,
          1
        )) || {};
    }

    const { dropDownData = [] } = returnData;

    let userData = {};
    const dropDownDataFilter = dropDownData.filter(
      item => item.sUserId === sParentId
    );
    if (dropDownDataFilter.length === 1) {
      userData = dropDownDataFilter[0];
    } else if (dropDownDataFilter.length > 1) {
      userData = dropDownDataFilter.find(item => item.sUserId === sParentId);
    }
    props.onChange("master", "sUserName", userData, undefined, [userData]);
  }, []);

  const [form] = Form.useForm();
  return (
    <Modal
      title={sLoginConfirm}
      open={faceLoginAfterModalVisible}
      width={500}
      height={800}
      className={styles.xlyFaceAuthLogin}
      style={{
        top: "calc(50vh - 400px)"
      }}
      footer={
        <>
          <Button
            type="primary"
            size="large"
            onClick={() => {
              props.onSubmit({ sEmployeeNo });
            }}
          >
            {btnConfirm}
          </Button>
          <Button
            size="large"
            onClick={() => {
              props.onSaveState({
                masterData: {
                  sBrandsId: masterData.sBrandsId,
                  sSubsidiaryId: masterData.sSubsidiaryId
                },
                faceLoginAfterModalVisible: false
              });
            }}
          >
            {btnCancel}
          </Button>
        </>
      }
      onCancel={() => {
        props.onSaveState({
          masterData: {
            sBrandsId: masterData.sBrandsId,
            sSubsidiaryId: masterData.sSubsidiaryId
          },
          faceLoginAfterModalVisible: false
        });
      }}
    >
      <div className={styles.faceLogin1}>
        <Form form={form} layout="vertical" size="large">
          {configs
            .filter(item => item.sName !== "sPassWord")
            .map(item => handleGetFormItem(props, item))}
        </Form>
      </div>
    </Modal>
  );
};

export default login;