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, WeaSearchGroup, WeaSelect, WeaTextarea } from "ecCom";
import { salaryItemFields, valTakeOptions } from "./columns";

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

  componentDidMount() {
    const { salaryItemFieldsList } = this.state;
    const { request, editable, record, isAdd, taxAgentAdminOption } = this.props;
    const { systemType, sharedType, valueType } = request;
    this.setState({
      salaryItemFieldsList: _.map(salaryItemFieldsList, item => {
        const { key } = item;
        switch (key) {
          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 "valueType":
            return {
              ...item,
              viewAttr: isAdd ? 2 : 1
            };
          case "formulaContent":
            return {
              ...item,
              display: valueType === "2" || valueType === "3",
              viewAttr: (editable && record.canEdit) || isAdd ? 2 : 1
            };
          default:
            break;
        }
        return {
          ...item,
          viewAttr: (key === "name" && ((editable && record.canEdit) || 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 === "valueType" && item.key === "formulaContent") {
          return {
            ...item,
            label: v === "2" ? "公式" : v === "3" ? "SQL" : "",
            display: v === "2" || v === "3"
          };
        }
        return { ...item };
      })
    }, () => {
      if (key === "valueType") {
        onChangeFieldsItem({ formulaContent: "", formulaId: 0, valueType: v });
      } else {
        onChangeFieldsItem({ [key]: (key === "useDefault" || key === "useInEmployeeSalary") ? 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 } = 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 === "formulaContent" && onShowFormal()}
                              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> : null
              }
            </React.Fragment>;
          })
        }
      </WeaSearchGroup>
    );
  }
}

export default SalaryItemForm;