个税扣缴义务人页面重构2

2022-12-01 11:47:20 +08:00 · 2022-12-01 11:47:20 +08:00 · e11631e6ba
parent 2899e32909
commit e11631e6ba
4 changed files with 107 additions and 35 deletions
--- a/pc4mobx/hrmSalary/pages/salary/components/personalScope.js
+++ b/pc4mobx/hrmSalary/pages/salary/components/personalScope.js
@ -26,7 +26,6 @@ class PersonalScope extends Component {
        visible: false,
        title: "关联人员",
        includeType: "",
-        taxAgentId: ""
      }
    };
    this.personalScopeTableRef = null;
@ -71,20 +70,18 @@ class PersonalScope extends Component {
   */
  handleAddPersonal = () => {
    const { personalAddModal, selectedKey } = this.state;
-    const { taxAgentId } = this.props;
    this.setState({
      personalAddModal: {
        ...personalAddModal,
        visible: true,
        includeType: selectedKey === "listInclude" ? 1 : 0,
-        taxAgentId
      }
    });
  };

  render() {
    const { selectedKey, searchValue, rowKeys, personalAddModal } = this.state;
-    const { taxAgentStore: { hideIconInTax, showSalaryItemBtn } } = this.props;
+    const { taxAgentStore: { hideIconInTax, showSalaryItemBtn }, taxAgentId } = this.props;
    const topTab = [
      {
        title: "管理范围",
@ -128,19 +125,20 @@ class PersonalScope extends Component {
        />
        <PersonalScopeTable
          ref={dom => this.personalScopeTableRef = dom}
+          taxAgentId={taxAgentId}
          tabActive={selectedKey}
          searchValue={searchValue}
          onChangeSelectKey={rowKeys => this.setState({ rowKeys })}
        />
        <PersonalScopeModal
          {...personalAddModal}
+          taxAgentId={taxAgentId}
          onSuccess={() => this.personalScopeTableRef.getPersonalScopeList()}
          onCancel={() =>
            this.setState({
              personalAddModal: {
                ...personalAddModal,
                visible: false,
-                taxAgentId: "",
                includeType: ""
              }
            })
--- a/pc4mobx/hrmSalary/pages/salary/components/personalScopeTable.js
+++ b/pc4mobx/hrmSalary/pages/salary/components/personalScopeTable.js
@ -47,9 +47,10 @@ class PersonalScopeTable extends Component {
  }

  getPersonalScopeList = (tabActive = this.props.tabActive) => {
-    const { searchValue } = this.props;
+    const { searchValue, taxAgentId } = this.props;
    const { pageInfo, loading } = this.state;
    const payload = {
+      taxAgentId,
      targetName: searchValue,
      ...pageInfo
    };
--- a/pc4mobx/hrmSalary/pages/salary/components/taxAgentSlide.js
+++ b/pc4mobx/hrmSalary/pages/salary/components/taxAgentSlide.js
@ -6,12 +6,13 @@
 */
 import React, { Component } from "react";
 import { inject, observer } from "mobx-react";
-import { Button } from "antd";
+import { Button, message } from "antd";
 import { WeaSlideModal, WeaSteps } from "ecCom";
 import SlideModalTitle from "../../../components/slideModalTitle";
 import { decentralizationConditions, editConditions } from "../../taxAgent/editConditions";
 import BaseSettings from "./baseSettings";
 import PersonalScope from "./personalScope";
+import * as API from "../../../apis/taxAgent";
 import "./index.less";

 const Step = WeaSteps.Step;
@ -27,7 +28,9 @@ class TaxAgentSlide extends Component {
  constructor(props) {
    super(props);
    this.state = {
-      current: 0
+      current: 0,
+      loading: false,
+      taxAgentId: ""
    };
  }

@ -37,24 +40,83 @@ class TaxAgentSlide extends Component {
      decentralization === "0" ?
        salarytaxAgentForm.setCondition(decentralizationConditions, true) :
        salarytaxAgentForm.setCondition(editConditions, true);
-      this.setState({ current: nextProps.current });
+      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 } = data;
+        salarytaxAgentForm.updateFields({
+          name: { value: name, viewAttr: 1 },
+          adminUserIds: {
+            value: _.map(adminUserIds, it => it.id.toString()).join(","),
+            valueSpan: _.map(adminUserIds, it => it.content).join(",")
+          },
+          description: { value: description }
+        });
+      }
+    });
+  };
+  /*
+   * Author: 黎永顺
+   * Description: 保存个税扣缴义务人
+   * Params:
+   * Date: 2022/12/1
+   */
+  saveTaxAgent = (payload) => {
+    const { onOk } = 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("保存成功");
+        this.setState({
+          current: current + 1,
+          taxAgentId: data
+        }, () => onOk());
+      } else {
+        message.error(errormsg || "保存失败");
+      }
+    }).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("更新成功");
+        onCancel(true);
+      } else {
+        message.error(errormsg || "更新失败");
+      }
+    }).catch(() => this.setState({ loading: false }));
+  };
+
  handleSave = () => {
    const { taxAgentStore: { salarytaxAgentForm } } = this.props;
-    // salarytaxAgentForm.updateFields({
-    //   name: { value: "data.name" },
-    //   description: { value: "123", hide: true },
-    // });
-    // salarytaxAgentForm.setField("adminUserIds", {
-    //   hide: true
-    // });
-
+    const { taxAgentId } = this.state;
    salarytaxAgentForm.validateForm().then((f) => {
      if (f.isValid) {
        const formData = salarytaxAgentForm.getFormParams();
-        console.log(formData);
+        const payload = {
+          ...formData,
+          adminUserIds: formData.adminUserIds ? formData.adminUserIds.split(",") : []
+        };
+        taxAgentId ? this.updateTaxAgent({ ...payload, id: taxAgentId }) : this.saveTaxAgent(payload);
      } else {
        f.showErrors();
      }
@ -62,7 +124,8 @@ class TaxAgentSlide extends Component {
  };
  renderChildren = () => {
    const { current } = this.state;
-    const { decentralization, taxAgentId } = this.props;
+    const { decentralization } = this.props;
+    const { taxAgentId } = this.state;
    let CurrentDom = null;
    switch (current) {
      case 0:
@ -78,27 +141,30 @@ class TaxAgentSlide extends Component {
    return CurrentDom;
  };
  renderCustomOperate = () => {
-    const { taxAgentId, isChief } = this.props;
-    const { current, per } = this.state;
+    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}>{taxAgentId ? "保存" : "保存并进入下一步"}</Button>
+            <Button type="primary" onClick={this.handleSave}
+                    loading={loading}>{isEdit ? "保存" : "保存并进入下一步"}</Button>
          ];
          break;
        case 1:
          const tmpV = [<Button type="primary">保存并验证</Button>];
          const tmpJ = [
            <Button type="ghost">完成，跳过所有步骤</Button>,
-            <Button type="ghost">下一步</Button>
+            <Button type="ghost" onClick={() => this.setState({ current: current + 1 })}>下一步</Button>
          ];
-          CurrentDom = taxAgentId ? tmpV : [...tmpV, ...tmpJ];
+          CurrentDom = isEdit ? tmpV : [...tmpV, ...tmpJ];
          break;
        case 2:
-          CurrentDom = !taxAgentId ? [<Button type="ghost">上一步</Button>] : [];
+          CurrentDom = !isEdit ?
+            [<Button type="ghost" onClick={() => this.setState({ current: current - 1 })}>上一步</Button>]
+            : [];
          break;
        default:
          break;
@ -111,8 +177,8 @@ class TaxAgentSlide extends Component {
  };

  render() {
-    const { title, visible, onCancel, taxAgentId, taxAgentStore: { showOperateBtn } } = this.props;
-    const { current } = this.state;
+    const { title, visible, onCancel, taxAgentStore: { showOperateBtn } } = this.props;
+    const { current, taxAgentId } = this.state;
    return (
      <WeaSlideModal
        className="slideOuterWrapper"
--- a/pc4mobx/hrmSalary/pages/salary/taxAgent.js
+++ b/pc4mobx/hrmSalary/pages/salary/taxAgent.js
@ -19,6 +19,7 @@ class TaxAgent extends Component {
      decentralization: "0", //启用分权
      permission: {},
      taxAgentSlideProps: {
+        isEdit: false,
        visible: false,
        title: "新增个税扣缴义务人",
        taxAgentId: "",
@ -115,18 +116,22 @@ class TaxAgent extends Component {
      }
    });
  };
-  handelResetSlide = () => {
+  handelResetSlide = (isUpdate = false) => {
    const { taxAgentStore } = this.props;
    const { salarytaxAgentForm } = taxAgentStore;
    this.setState({
      taxAgentSlideProps: {
        ...this.state.taxAgentSlideProps,
+        isEdit: false,
        visible: false,
        title: "新增个税扣缴义务人",
        taxAgentId: "",
        current: 0
      }
-    }, () => salarytaxAgentForm.resetForm());
+    }, () => {
+      isUpdate && this.taxAgentTableRef.getTaxAgentList();
+      salarytaxAgentForm.resetForm();
+    });
  };
  handleOperate = (type, itemId, current = 0) => {
    switch (type) {
@ -135,7 +140,7 @@ class TaxAgent extends Component {
          taxAgentSlideProps: {
            ...this.state.taxAgentSlideProps,
            visible: true, title: "编辑个税扣缴义务人",
-            taxAgentId: itemId, current
+            taxAgentId: itemId, current, isEdit: true
          }
        });
        break;
@ -145,11 +150,12 @@ class TaxAgent extends Component {
  };

  render() {
-    const { searchValue, decentralization, taxAgentSlideProps, permission, syncLoading } = this.state;
-    const { taxAgentStore: { showOperateBtn } } = this.props;
+    const {
+      searchValue, decentralization, taxAgentSlideProps,
+      permission, syncLoading
+    } = this.state;
    const btns = [
-      <Button type="primary" disabled={!showOperateBtn} onClick={this.taxAgentRangeSync}
-              loading={syncLoading}>同步人员范围</Button>,
+      <Button type="primary" onClick={this.taxAgentRangeSync} loading={syncLoading}>同步人员范围</Button>,
      <WeaInputSearch
        style={{ width: 220 }}
        value={searchValue}
@ -194,7 +200,8 @@ class TaxAgent extends Component {
            {...taxAgentSlideProps}
            isChief={permission.isChief}
            decentralization={decentralization} //是否开启分权 0：否 1：是 ;开启分权才有管理员的添加
-            onCancel={this.handelResetSlide}
+            onOk={() => this.taxAgentTableRef.getTaxAgentList()}
+            onCancel={(isUpdate = false) => this.handelResetSlide(isUpdate)}
          />
        </WeaTop>
      </div>