salary-management-front/pc4mobx/hrmSalary/pages/salary/components/taxAgentSlide.js

/*
 * Author: 黎永顺
 * name: 新增/编辑个税扣缴义务人
 * Description:
 * Date: 2022/11/29
 */
import React, { Component } from "react";
import { inject, observer } from "mobx-react";
import { Button, message } from "antd";
import { WeaLocaleProvider, WeaSlideModal, WeaSteps } from "ecCom";
import SlideModalTitle from "../../../components/slideModalTitle";
import { decentralizationConditions, editConditions } from "../../taxAgent/editConditions";
import BaseSettings, { convertConditon } from "./baseSettings";
import PersonalScope from "./personalScope";
import TaxDeclarationInfo from "./taxDeclarationInfo";
import * as API from "../../../apis/taxAgent";
import "./index.less";

const { getLabel } = WeaLocaleProvider;
const Step = WeaSteps.Step;

@inject("taxAgentStore")
@observer
class TaxAgentSlide extends Component {
  constructor(props) {
    super(props);
    this.state = {
      current: 0,
      loading: false,
      taxAgentId: ""
    };
    this.taxInfoRef = null;
  }

  componentWillReceiveProps(nextProps, nextContext) {
    if (nextProps.visible !== this.props.visible || nextProps.decentralization !== this.props.decentralization) {
      const { taxAgentStore: { salarytaxAgentForm }, decentralization, isChief } = nextProps;
      decentralization === "0" ?
        salarytaxAgentForm.setCondition(convertConditon(decentralizationConditions, !isChief), true) :
        salarytaxAgentForm.setCondition(convertConditon(editConditions, !isChief), true);
      this.setState({ current: nextProps.current, taxAgentId: nextProps.taxAgentId }, () => {
        if (this.state.taxAgentId) this.getTaxAgentForm();
      });
    }
  }

  getTaxAgentForm = () => {
    const { taxAgentId } = this.state;
    const { taxAgentStore: { salarytaxAgentForm } } = this.props;
    API.getTaxAgentForm({ id: taxAgentId }).then(({ status, data }) => {
      if (status) {
        const { name, description, adminUserIds, sortedIndex } = data;
        salarytaxAgentForm.updateFields({
          name: { value: name },
          adminUserIds: {
            value: _.map(adminUserIds, it => it.id.toString()).join(","),
            valueSpan: _.map(adminUserIds, it => it.content).join(",")
          },
          sortedIndex: { value: sortedIndex },
          description: { value: description }
        });
      }
    });
  };
  /*
   * Author: 黎永顺
   * Description: 保存个税扣缴义务人
   * Params:
   * Date: 2022/12/1
   */
  saveTaxAgent = (payload) => {
    const { onOk, salaryOn } = this.props;
    const { current } = this.state;
    this.setState({ loading: true });
    API.saveTaxAgent(payload).then(({ status, data, errormsg }) => {
      this.setState({ loading: false });
      if (status) {
        message.success(getLabel(22619, "保存成功"));
        this.setState({
          current: !salaryOn ? current + 2 : current + 1,
          taxAgentId: data
        }, () => onOk());
      } else {
        message.error(errormsg || getLabel(22620, "保存失败"));
      }
    }).catch(() => this.setState({ loading: false }));
  };
  /*
   * Author: 黎永顺
   * Description: 编辑个税扣缴义务人
   * Params:
   * Date: 2022/12/1
   */
  updateTaxAgent = (payload) => {
    const { onCancel } = this.props;
    this.setState({ loading: true });
    API.updateTaxAgent(payload).then(({ status, data, errormsg }) => {
      this.setState({ loading: false });
      if (status) {
        message.success(getLabel(31439, "更新成功"));
        onCancel(true);
      } else {
        message.error(errormsg || getLabel(31825, "更新失败"));
      }
    }).catch(() => this.setState({ loading: false }));
  };

  handleSave = () => {
    const { taxAgentStore: { salarytaxAgentForm } } = this.props;
    const { taxAgentId } = this.state;
    salarytaxAgentForm.validateForm().then((f) => {
      if (f.isValid) {
        const formData = salarytaxAgentForm.getFormParams();
        const payload = {
          ...formData,
          adminUserIds: formData.adminUserIds ? formData.adminUserIds.split(",") : []
        };
        taxAgentId ? this.updateTaxAgent({ ...payload, id: taxAgentId }) : this.saveTaxAgent(payload);
      } else {
        f.showErrors();
      }
    });
  };
  handleSaveAndVerify = () => {
    console.log(this.taxInfoRef);
  };
  renderChildren = () => {
    const { current, taxAgentId } = this.state;
    const { decentralization, isChief } = this.props;
    let CurrentDom = null;
    switch (current) {
      case 0:
        CurrentDom = <BaseSettings decentralization={decentralization} isChief={isChief}/>;
        break;
      case 1:
        CurrentDom = <TaxDeclarationInfo ref={dom => this.taxInfoRef = dom} taxAgentId={taxAgentId}/>;
        break;
      case 2:
        CurrentDom = <PersonalScope taxAgentId={taxAgentId}/>;
        break;
      default:
        CurrentDom = null;
        break;
    }
    return CurrentDom;
  };
  renderCustomOperate = () => {
    const { isChief, isEdit } = this.props;
    const { current, loading } = this.state;
    let CurrentDom = [];
    //总管理员权限
    if (isChief) {
      switch (current) {
        case 0:
          CurrentDom = [
            <Button type="primary" onClick={this.handleSave}
                    loading={loading}>{isEdit ? getLabel(537558, "保存") : getLabel(33199, "保存并进入下一步")}</Button>
          ];
          break;
        case 1:
          const tmpV = [<Button type="primary"
                                onClick={this.handleSaveAndVerify}>{getLabel(111, "保存并验证")}</Button>];
          const tmpJ = [
            <Button type="ghost">{getLabel(543470, "完成，跳过所有步骤")}</Button>,
            <Button type="ghost"
                    onClick={() => this.setState({ current: current + 1 })}>{getLabel(1402, "下一步")}</Button>
          ];
          CurrentDom = isEdit ? tmpV : [...tmpV, ...tmpJ];
          break;
        case 2:
          CurrentDom = (!isEdit && false) ?
            [<Button type="ghost"
                     onClick={() => this.setState({ current: current - 1 })}>{getLabel(1876, "上一步")}</Button>]
            : [];
          break;
        default:
          break;
      }
    }
    return CurrentDom;
  };
  handleChangeSlideTab = (current) => {
    this.setState({ current: Number(current) });
  };

  render() {
    const tabs = [
      { key: 0, title: getLabel(82751, "基础设置") },
      { key: 1, title: getLabel(544342, "报税信息") },
      { key: 2, title: getLabel(124810, "人员范围") }
    ];
    const { isEdit, title, visible, onCancel, salaryOn, taxAgentStore: { showOperateBtn } } = this.props;
    const { current, taxAgentId } = this.state;
    const tabData = !salaryOn ? _.filter(tabs, it => it.key !== 1) : tabs;
    return (
      <WeaSlideModal
        className="slideOuterWrapper"
        visible={visible}
        top={0}
        width={65}
        height={100}
        direction="right"
        measure="%"
        title={
          <SlideModalTitle
            subtitle={title}
            tabs={isEdit ? tabData : []}
            loading={false}
            showOperateBtn={showOperateBtn}
            editable={false}
            onSave={() => {
            }}
            selectedTab={current}
            customOperate={this.renderCustomOperate()}
            subItemChange={this.handleChangeSlideTab}
          />
        }
        content={
          <div className="taxAgentSlideContent">
            {
              !isEdit &&
              <WeaSteps current={current} style={{ margin: "20px 0" }}>
                {
                  _.map(tabData, item => {
                    const { key, title } = item;
                    return <Step description={title} key={key}/>;
                  })
                }
              </WeaSteps>
            }
            {
              this.renderChildren()
            }
          </div>
        }
        onClose={() => onCancel()}
      />
    );
  }
}

export default TaxAgentSlide;