salary-management-front/pc4mobx/hrmSalary/pages/salaryItem/salaryItemForm.js

/*
 * Author: 黎永顺
 * name: 薪资项目管理-新增自定义项表单
 * Description:
 * Date: 2023/2/9
 */
import React, { Component } from "react";
import {
  WeaCheckbox,
  WeaFormItem,
  WeaInput,
  WeaInputNumber,
  WeaLocaleProvider,
  WeaSearchGroup,
  WeaSelect,
  WeaTextarea
} from "ecCom";
import { salaryItemFields, valTakeOptions } from "./columns";

const getLabel = WeaLocaleProvider.getLabel;

class SalaryItemForm extends Component {
  constructor(props) {
    super(props);
    this.state = {
      salaryItemFieldsList: salaryItemFields
    };
  }

  componentDidMount() {
    const { salaryItemFieldsList } = this.state;
    const { request, editable, record, isAdd = false, taxAgentAdminOption, isLedger = false } = this.props;
    const { systemType = "", sharedType, valueType, useInEmployeeSalary, dataType, pattern } = request;
    this.setState({
      salaryItemFieldsList: _.map(salaryItemFieldsList, item => {
        const { key } = item;
        switch (key) {
          case "useDefault":
          case "dataType":
          case "description":
            return {
              ...item,
              viewAttr: (!isLedger && ((editable && record.canEdit) || isAdd)) ? 2 : 1,
              display: !isLedger
            };
          case "pattern":
          case "roundingMode":
            return { ...item, display: dataType === "number" };
          case "width":
          case "sortedIndex":
            return {
              ...item,
              label: getLabel(item.lanId, item.label),
              display: !isLedger
            };
          case "useInEmployeeSalary":
            return {
              ...item,
              viewAttr: (editable && record.canEdit) || isAdd ? 2 : 1,
              display: !isAdd
            };
          case "sharedType":
            return {
              ...item,
              viewAttr: (editable && record.canEdit) || isAdd ? 2 : 1,
              display: systemType.toString() === "0" || isAdd
            };
          case "taxAgentIds":
            return {
              ...item,
              multiple: true,
              viewAttr: (editable && record.canEdit) || isAdd ? 3 : 1,
              display: (!_.isNil(sharedType) && sharedType.toString() === "1") && (!_.isNil(systemType) && systemType.toString() === "0"),
              options: taxAgentAdminOption
            };
          case "hideDefault":
            return {
              ...item,
              viewAttr: 2,
              tip: isLedger ? getLabel(111, "开启后，薪资核算不会展示该项目，但是不影响该项目的核算值") : item.tip
            };
          case "valueType":
            return {
              ...item,
              viewAttr: (useInEmployeeSalary.toString() === "0" && ((isLedger && record.canEdit) || (editable && record.canEdit) || isAdd)) ? 2 : 1
            };
          case "defaultValue":
            return {
              ...item,
              precision: pattern ? pattern : item.precision,
              type: dataType === "number" ? "INPUTNUMBER" : "INPUT",
              display: valueType && valueType.toString() === "1" && useInEmployeeSalary == 0,
              viewAttr: (isLedger && record.canEdit) || (editable && record.canEdit) || isAdd ? 2 : 1
            };
          case "formulaContent":
            return {
              ...item,
              key: valueType.toString() === "3" ? "originSqlContent" : "originFormulaContent",
              display: useInEmployeeSalary.toString() === "0" && valueType && (valueType.toString() === "2" || valueType.toString() === "3"),
              viewAttr: (isLedger && record.canEdit) || (editable && record.canEdit) || isAdd ? 2 : 1
            };
          default:
            break;
        }
        return {
          ...item,
          viewAttr: (key === "name" && ((editable && record.canEdit && !isLedger) || isAdd)) ? 3 : (key !== "name" && ((editable && record.canEdit) || isAdd)) ? 2 : 1
        };
      })
    });
  }

  handleChangeSalaryFiledItems = (key, v) => {
    const { onChangeFieldsItem } = this.props;
    const { salaryItemFieldsList } = this.state;
    this.setState({
      salaryItemFieldsList: _.map(salaryItemFieldsList, item => {
        if (key === "sharedType" && item.key === "taxAgentIds") {
          return { ...item, display: v === "1", viewAttr: 3 };
        } else if (key === "dataType" && (item.key === "roundingMode" || item.key === "pattern")) {
          return { ...item, display: v === "number" };
        } else if (key === "dataType" && (item.key === "defaultValue")) {
          return { ...item, type: v === "number" ? "INPUTNUMBER" : "INPUT" };
        } else if (key === "valueType" && item.key === "defaultValue") {
          return { ...item, display: v === "1" };
        } else if (key === "pattern" && item.key === "defaultValue") {
          return { ...item, precision: parseInt(v) };
        } else if (key === "valueType" && (item.key === "originSqlContent" || item.key === "originFormulaContent")) {
          return {
            ...item,
            key: v === "3" ? "originSqlContent" : "originFormulaContent",
            label: v === "2" ? "公式" : v === "3" ? "SQL" : "",
            display: v === "2" || v === "3"
          };
        }
        return { ...item };
      })
    }, () => {
      if (key === "dataType") {
        onChangeFieldsItem({ [key]: v, defaultValue: "" });
      } else {
        onChangeFieldsItem({ [key]: (key === "useDefault" || key === "useInEmployeeSalary" || key === "hideDefault") ? Number(v) : v });
      }
    });
  };

  render() {
    const { userStatusList, request, onShowFormal } = this.props;
    const { salaryItemFieldsList } = this.state;
    return (
      <WeaSearchGroup showGroup needTigger={false}>
        {
          _.map(salaryItemFieldsList, item => {
            const { key, label, type, viewAttr, tip, options, display = true, multiple = false, precision = 0 } = item;
            const value = !_.isNil(request[key]) ? request[key].toString() : "";
            return <React.Fragment>
              {
                (type === "INPUT" && display) ?
                  <WeaFormItem label={label} labelCol={{ span: 6 }} wrapperCol={{ span: 12 }}>
                    <WeaInput viewAttr={viewAttr} value={value}
                              onClick={() => (key === "originSqlContent" || key === "originFormulaContent") && onShowFormal(request["name"])}
                              onChange={v => this.handleChangeSalaryFiledItems(key, v)}/></WeaFormItem> :
                  (type === "SWITCH" && display) ?
                    <WeaFormItem label={label} labelCol={{ span: 6 }} wrapperCol={{ span: 12 }}>
                      <WeaCheckbox value={value} helpfulTip={tip} display="switch" viewAttr={viewAttr}
                                   onChange={v => this.handleChangeSalaryFiledItems(key, v)}/>
                    </WeaFormItem> :
                    (type === "SELECT" && display) ?
                      <WeaFormItem label={label} labelCol={{ span: 6 }} wrapperCol={{ span: 12 }}>
                        <WeaSelect value={value} options={key !== "sharedType" ? options : userStatusList}
                                   multiple={multiple} viewAttr={viewAttr}
                                   onChange={v => this.handleChangeSalaryFiledItems(key, v)}/>
                      </WeaFormItem> :
                      (type === "RADIO" && display) ?
                        <WeaFormItem label={label} labelCol={{ span: 6 }} wrapperCol={{ span: 12 }}>
                          <WeaSelect value={value} options={valTakeOptions} detailtype={3} viewAttr={viewAttr}
                                     onChange={v => this.handleChangeSalaryFiledItems(key, v)}/>
                        </WeaFormItem> :
                        (type === "TEXTAREA" && display) ?
                          <WeaFormItem label={label} labelCol={{ span: 6 }} wrapperCol={{ span: 12 }}>
                            <WeaTextarea value={value} viewAttr={viewAttr} minRows={3}
                                         onChange={v => this.handleChangeSalaryFiledItems(key, v)}/>
                          </WeaFormItem> :
                          (type === "INPUTNUMBER" && display) ?
                            <WeaFormItem label={label} labelCol={{ span: 6 }} wrapperCol={{ span: 12 }}>
                              <React.Fragment>
                                <WeaInputNumber
                                  value={key === "width" && value ? parseInt(value) : value}
                                  precision={precision} viewAttr={viewAttr}
                                  onChange={v => this.handleChangeSalaryFiledItems(key, v)}/>
                                {key === "width" && display &&
                                  <span style={{ paddingLeft: 10, position: "absolute", marginTop: 4 }}>px</span>}
                              </React.Fragment>
                            </WeaFormItem> : null
              }
            </React.Fragment>;
          })
        }
      </WeaSearchGroup>
    );
  }
}

export default SalaryItemForm;