feature/2.9.42309.01-薪资核算详情页面列表改造（页面编辑）

2023-09-25 15:35:11 +08:00 · 2023-09-25 15:35:11 +08:00 · ff3dd0ea60
parent 2c56e8dc06
commit ff3dd0ea60
4 changed files with 132 additions and 22 deletions
--- a/pc4mobx/hrmSalary/components/importDialog/components/impStep1.js
+++ b/pc4mobx/hrmSalary/components/importDialog/components/impStep1.js
@ -61,8 +61,15 @@ class ImpStep1 extends Component {
          <div>{getLabel(27577, "操作步骤")}</div>
          <p>
            <span>{`1. ${getLabel(30907, "第一步")},${getLabel(543205, "请选择导出的Excel文件或")}`}</span>&nbsp;&nbsp;
-            <a href={this.props.link} className="weapp-salary-link"
-               target="_blank">{getLabel(543207, "点击这里下载模板")}</a>&nbsp;&nbsp;
+            {
+              typeof this.props.link === "string" ?
+                <a href={this.props.link} className="weapp-salary-link"
+                   target="_blank">{getLabel(543207, "点击这里下载模板")}</a> :
+                <a className="weapp-salary-link"
+                   onClick={this.props.link}
+                >{getLabel(543207, "点击这里下载模板")}</a>
+            }
+            &nbsp;&nbsp;
            {this.props.exportDataDom}
          </p>
          <p>{`2. ${getLabel(543211, "第二步")},${getLabel(543212, "请一定要确定Excel文档中的格式是模板中的格式")},${getLabel(543213, "没有被修改掉")}；`}</p>
--- a/pc4mobx/hrmSalary/components/importDialog/components/impStep2.js
+++ b/pc4mobx/hrmSalary/components/importDialog/components/impStep2.js
@ -21,8 +21,8 @@ class ImpStep2 extends Component {
  }

  init = () => {
-    const { previewUrl, imageId } = this.props;
-    const payload = { imageId };
+    const { previewUrl, imageId, extraPreview = {} } = this.props;
+    const payload = { imageId, ...extraPreview };
    this.setState({ loading: true });
    postFetch(previewUrl, payload).then(({ status, data }) => {
      this.setState({ loading: false });
--- a/pc4mobx/hrmSalary/pages/calculate/doCalc/components/salaryEditCalcImport/index.js
+++ b/pc4mobx/hrmSalary/pages/calculate/doCalc/components/salaryEditCalcImport/index.js
@ -5,9 +5,12 @@
 * Date: 2023/9/18
 */
 import React, { Component } from "react";
-import { WeaLocaleProvider } from "ecCom";
-import { Badge, Button } from "antd";
+import { WeaCheckbox, WeaLocaleProvider } from "ecCom";
+import { Badge, Button, message } from "antd";
 import ImportDialog from "../../../../../components/importDialog";
+import { cacheImportField, getImportField, importAcctResult } from "../../../../../apis/calculate";
+import AddHeaderFieldsModal from "../../../../calculateDetail/acctResult/importModal/addHeaderFieldsModal";
+import { convertToUrlString, getURLParameters } from "../../../../../util/url";

 const getLabel = WeaLocaleProvider.getLabel;

@ -16,24 +19,85 @@ class Index extends Component {
    super(props);
    this.state = {
      salaryItemIds: "", //选择的导入表单项
+      exportTempUrl: "", //导出模板url
+      headerFieldsDialog: { visible: false, itemsByGroup: [], selectItems: "" },
      importDialog: {
        visible: false, title: "", nextloading: false,
-        link: "", importResult: {}, imageId: ""
+        link: null, importResult: {}, imageId: "",
+        previewUrl: "/api/bs/hrmsalary/salaryacct/acctresult/preview",
+        extraPreview: { salaryAcctRecordId: "", salaryItemIds: "" }
      }
    };
  }

-  componentWillReceiveProps(nextProps, nextContext) {
+  async componentWillReceiveProps(nextProps, nextContext) {
    if (nextProps.visible !== this.props.visible) {
+      if (nextProps.salaryAcctRecordId && nextProps.visible) {
+        const { data } = await getImportField({ salaryAcctRecordId: nextProps.salaryAcctRecordId });
+        const { checkItems, itemsByGroup } = data;
+        const payload = {
+          exportData: false, salaryAcctRecordId: nextProps.salaryAcctRecordId,
+          salaryItemIds: checkItems.join(",")
+        };
+        this.setState({
+          exportTempUrl: `/api/bs/hrmsalary/salaryacct/acctresult/importtemplate/export?${convertToUrlString(payload)}`,
+          importDialog: {
+            ...this.state.importDialog,
+            extraPreview: { salaryAcctRecordId: nextProps.salaryAcctRecordId, salaryItemIds: checkItems.join(",") }
+          },
+          headerFieldsDialog: {
+            ...this.state.headerFieldsDialog,
+            selectItems: checkItems.join(","),
+            itemsByGroup: _.map(itemsByGroup, item => {
+              return {
+                ...item,
+                salaryItems: _.map(item.salaryItems, it => ({
+                  ...it,
+                  checked: false
+                }))
+              };
+            })
+          }
+        });
+      }
      this.setState({
        importDialog: {
-          ...this.state.importDialog,
+          ...this.state.importDialog, link: this.handleExportTemp,
          visible: nextProps.visible, title: nextProps.title
        }
      });
    }
  }

+  handleImport = (payload) => {
+    const { headerFieldsDialog: { selectItems: salaryItemIds }, importDialog } = this.state;
+    const { salaryAcctRecordId } = this.props;
+    this.setState({ importDialog: { ...importDialog, nextloading: true } });
+    importAcctResult({ ...payload, salaryItemIds, salaryAcctRecordId })
+      .then(({ data, status }) => {
+        this.setState({ importDialog: { ...importDialog, nextloading: false } });
+        if (status) {
+          this.setState({
+            importDialog: { ...importDialog, ...payload, importResult: data }
+          });
+        }
+      }).catch(() => this.setState({ importDialog: { ...importDialog, nextloading: false } }));
+  };
+  handleExportTemp = () => {
+    const { headerFieldsDialog: { selectItems }, exportTempUrl } = this.state;
+    if (!selectItems) {
+      message.error(getLabel(111, "请选择表头字段"));
+    } else {
+      window.open(exportTempUrl, "_blank");
+    }
+  };
+  handleSelectedField = () => {
+    this.setState({
+      headerFieldsDialog: {
+        ...this.state.headerFieldsDialog, visible: true
+      }
+    });
+  };
  /*
   * Author: 黎永顺
   * Description:表单选项
@ -41,25 +105,60 @@ class Index extends Component {
   * Date: 2023/9/18
   */
  renderFormComponent = () => {
+    const { selectItems } = this.state.headerFieldsDialog;
    return <div style={{ padding: "8px 16px", border: "1px solid #e5e5e5", margin: "4px 0" }}>
      <Badge
-        count={!_.isEmpty(this.state.salaryItemIds) ? this.state.salaryItemIds.split(",").length : 0}>
+        count={!_.isEmpty(selectItems) ? selectItems.split(",").length : 0}>
        <Button onClick={this.handleSelectedField}>{getLabel(111, "请选择表头字段")}</Button>
      </Badge>
    </div>;
  };

  render() {
-    const { importDialog } = this.state;
+    const { importDialog, headerFieldsDialog, exportTempUrl } = this.state;
+    const { salaryAcctRecordId } = this.props;
    return (
-      <ImportDialog
-        {...importDialog} onCancel={this.props.onCancel}
-        importParams={this.renderFormComponent()}
-        onResetImportResult={() => this.setState(({
-          importDialog: { ...importDialog, importResult: {}, imageId: "" }
-        }))}
-        nextCallback={imageId => this.handleImport({ imageId })}
-      />
+      <React.Fragment>
+        <ImportDialog
+          {...importDialog} onCancel={this.props.onCancel}
+          importParams={this.renderFormComponent()}
+          onResetImportResult={() => this.setState(({
+            importDialog: { ...importDialog, importResult: {}, imageId: "" }
+          }))}
+          exportDataDom={
+            <WeaCheckbox
+              content={getLabel(543208, "导出现有数据")}
+              value={getURLParameters(exportTempUrl).exportData === "true" ? "1" : "0"}
+              helpfulTip={getLabel(111, "提示：建议先导出现有最新数据，修改后再导入")}
+              onChange={val => {
+                const payload = {
+                  exportData: val === "1", salaryAcctRecordId,
+                  salaryItemIds: headerFieldsDialog.selectItems
+                };
+                this.setState(({
+                  exportTempUrl: `/api/bs/hrmsalary/salaryacct/acctresult/importtemplate/export?${convertToUrlString(payload)}`
+                }));
+              }}
+            />
+          }
+          nextCallback={imageId => this.handleImport({ imageId })}
+        />
+        <AddHeaderFieldsModal
+          {...headerFieldsDialog}
+          onCancel={() => this.setState({
+            headerFieldsDialog: { ...headerFieldsDialog, visible: false }
+          })}
+          onAdd={selectItems => this.setState({
+            headerFieldsDialog: {
+              ...headerFieldsDialog,
+              visible: false, selectItems: selectItems.join(",")
+            }
+          }, () => {
+            const { selectItems: salaryItems } = this.state.headerFieldsDialog;
+            cacheImportField({ salaryItems: salaryItems ? salaryItems.split(",") : [] }).then();
+          })}
+        />
+      </React.Fragment>
    );
  }
 }
--- a/pc4mobx/hrmSalary/pages/calculate/doCalc/index.js
+++ b/pc4mobx/hrmSalary/pages/calculate/doCalc/index.js
@ -29,7 +29,7 @@ class Index extends Component {
    this.state = {
      selectedKey: "person", progressVisible: false, progress: 0,
      customExpDialog: { visible: false, salaryAcctRecordId: "", checkItems: [], itemsByGroup: [] },
-      salaryImpDialog: { visible: false, title: "" },
+      salaryImpDialog: { visible: false, title: "", salaryAcctRecordId: "" },
      accountExceptInfo: "" //核算报错信息,

    };
@ -119,7 +119,11 @@ class Index extends Component {
        break;
      case "import":
        this.setState({
-          salaryImpDialog: { ...this.state.salaryImpDialog, visible: true, title: getLabel(111, "薪资导入") }
+          salaryImpDialog: {
+            ...this.state.salaryImpDialog,
+            salaryAcctRecordId, visible: true,
+            title: getLabel(111, "薪资导入")
+          }
        });
        break;
      default:
@ -216,7 +220,7 @@ class Index extends Component {
              onCancel={(isFresh) => {
                this.setState({
                  salaryImpDialog: { ...salaryImpDialog, visible: false }
-                });
+                }, () => isFresh && this.calc.onAdSearch(false));
              }}
            />
          </WeaReqTop>