From 22b4a468241f236e16ca41adc9306aed27408f8a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E9=BB=8E=E6=B0=B8=E9=A1=BA?= <971387674@qq.com>
Date: Wed, 17 May 2023 14:24:07 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BA=A7=E5=93=81-=E8=96=AA=E9=85=AC=E6=A0=B8?=
 =?UTF-8?q?=E7=AE=97=E9=A1=B5=E9=9D=A2=E7=BC=96=E8=BE=91=E8=96=AA=E8=B5=84?=
 =?UTF-8?q?=E9=A1=B9=E7=9B=AE=E9=A1=B9=E5=90=8C=E6=AD=A5e10=E9=A1=B5?=
 =?UTF-8?q?=E9=9D=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../importModal/acctResultImportModal.js      | 119 +++++++-----------
 .../importModal/addHeaderFieldsModal.js       | 105 ++++++++++++++++
 .../acctResult/importModal/index.less         |  11 ++
 .../calculateDetail/payrollItemsTable.js      |  10 +-
 4 files changed, 168 insertions(+), 77 deletions(-)
 create mode 100644 pc4mobx/hrmSalary/pages/calculateDetail/acctResult/importModal/addHeaderFieldsModal.js
 create mode 100644 pc4mobx/hrmSalary/pages/calculateDetail/acctResult/importModal/index.less

diff --git a/pc4mobx/hrmSalary/pages/calculateDetail/acctResult/importModal/acctResultImportModal.js b/pc4mobx/hrmSalary/pages/calculateDetail/acctResult/importModal/acctResultImportModal.js
index cd2c9c44..766594f7 100644
--- a/pc4mobx/hrmSalary/pages/calculateDetail/acctResult/importModal/acctResultImportModal.js
+++ b/pc4mobx/hrmSalary/pages/calculateDetail/acctResult/importModal/acctResultImportModal.js
@@ -2,8 +2,8 @@ import React from "react";
 import ImportModal from "../../../../components/importModal";
 import { Badge, Button, message } from "antd";
 import { inject, observer } from "mobx-react";
-import SelectFieldModal from "./selectFieldModal";
 import { getQueryString } from "../../../../util/url";
+import AddHeaderFieldsModal from "./addHeaderFieldsModal";
 
 @inject("calculateStore", "standingBookStore")
 @observer
@@ -16,7 +16,10 @@ export default class AcctResultImportModal extends React.Component {
         salaryItemIds: ""
       },
       step: 0,
-      selectFieldVisible: false
+      selectFieldVisible: false,
+      addHeadFields: {
+        visible: false, itemsByGroup: []
+      }
     };
   }
 
@@ -24,11 +27,6 @@ export default class AcctResultImportModal extends React.Component {
     const { id } = this.props;
     if (id) {
       this.getImportField();
-      // let modalParam = { ...this.state.modalParam };
-      // modalParam.salaryAcctRecordId = id;
-      // this.setState({
-      //   modalParam
-      // });
     } else {
       this.setState({
         modalParam: { ...this.state.modalParam, salaryAcctRecordId: "123" }
@@ -36,18 +34,31 @@ export default class AcctResultImportModal extends React.Component {
     }
   }
 
-  getImportField=()=>{
+  getImportField = () => {
     const { calculateStore: { getImportField }, id } = this.props;
+    const { addHeadFields } = this.props;
     getImportField(id).then(data => {
       this.setState({
-        modalParam:{
+        addHeadFields: {
+          ...addHeadFields,
+          itemsByGroup: _.map(data.itemsByGroup, item => {
+            return {
+              ...item,
+              salaryItems: _.map(item.salaryItems, it => ({
+                ...it,
+                checked: false
+              }))
+            };
+          })
+        },
+        modalParam: {
           ...this.state.modalParam,
           salaryAcctRecordId: id,
           salaryItemIds: data.checkItems.join(",")
         }
       });
     });
-  }
+  };
 
   // 获取模板
   handleAccResultTemplateLink() {
@@ -98,58 +109,22 @@ export default class AcctResultImportModal extends React.Component {
   }
 
   // 渲染第一步表单
-  renderFormComponent() {
+  renderFormComponent = () => {
     return <Badge
       count={!_.isEmpty(this.state.modalParam.salaryItemIds) ? this.state.modalParam.salaryItemIds.split(",").length : 0}>
-      <Button onClick={() => {
-        this.handleSelectedField();
-      }}>请选择表单字段</Button>
+      <Button onClick={this.handleSelectedField}>请选择表单字段</Button>
     </Badge>;
-  }
+  };
 
   // 选择表单字段
-  handleSelectedField() {
+  handleSelectedField = () => {
     this.setState({
-      selectFieldVisible: true
+      addHeadFields: {
+        ...this.state.addHeadFields,
+        visible: true
+      }
     });
-  }
-
-  // 添加表头字段
-  handleAdd(fieldDate) {
-    let salaryItemIdsList = [];
-    if (!_.isEmpty(fieldDate.formulaItems)) {
-      fieldDate.formulaItems.map(item => {
-        if (item.checked) {
-          salaryItemIdsList.push(item.salaryItemId);
-        }
-      });
-    }
-    if (!_.isEmpty(fieldDate.inputItems)) {
-      fieldDate.inputItems.map(item => {
-        if (item.checked) {
-          salaryItemIdsList.push(item.salaryItemId);
-        }
-      });
-    }
-    if (!_.isEmpty(fieldDate.sqlItems)) {
-      fieldDate.sqlItems.map(item => {
-        if (item.checked) {
-          salaryItemIdsList.push(item.salaryItemId);
-        }
-      });
-    }
-    let salaryItemIds = "";
-    if (salaryItemIdsList.length > 0) {
-      salaryItemIds = salaryItemIdsList.join(",");
-    }
-
-    let modalParam = { ...this.state.modalParam };
-    modalParam.salaryItemIds = salaryItemIds;
-    this.setState({
-      modalParam
-    });
-    this.props.onAdd(fieldDate);
-  }
+  };
 
   // 初始化Import数据
   handleImportModalInit() {
@@ -197,7 +172,7 @@ export default class AcctResultImportModal extends React.Component {
       importInsuranceAcctDetail,
       importBalanceInsuranceDetail
     } = standingBookStore;
-    const { step, selectFieldVisible, modalParam } = this.state;
+    const { step, modalParam, addHeadFields } = this.state;
     return (
       <div>
         {
@@ -223,7 +198,7 @@ export default class AcctResultImportModal extends React.Component {
               !isStandingBook ?
                 fetchImportAcctResult(params) :
                 standingBookType === "difference" ?
-                  importBalanceInsuranceDetail({...params, billMonth}) :
+                  importBalanceInsuranceDetail({ ...params, billMonth }) :
                   importInsuranceAcctDetail(params);
             }}
             templateLink={() => {
@@ -236,23 +211,19 @@ export default class AcctResultImportModal extends React.Component {
             }}
           />
         }
-        {
-          selectFieldVisible && <SelectFieldModal
-            isStandingBook={isStandingBook}
-            standingBookType={standingBookType}
-            id={this.props.id}
-            visible={selectFieldVisible}
-            fieldData={this.props.fieldData}
-            onAdd={(fieldDate) => {
-              this.handleAdd(fieldDate);
-            }}
-            onCancel={() => {
-              this.setState({
-                selectFieldVisible: false
-              });
-            }}
-          />
-        }
+        <AddHeaderFieldsModal {...addHeadFields} selectItems={modalParam.salaryItemIds}
+                              onCancel={() => this.setState({ addHeadFields: { ...addHeadFields, visible: false } })}
+                              onAdd={(salaryItemIds) => this.setState({
+                                addHeadFields: {
+                                  ...addHeadFields,
+                                  visible: false
+                                },
+                                modalParam: {
+                                  ...modalParam,
+                                  salaryItemIds: salaryItemIds.join(",")
+                                }
+                              })}
+        />
       </div>
     );
   }
diff --git a/pc4mobx/hrmSalary/pages/calculateDetail/acctResult/importModal/addHeaderFieldsModal.js b/pc4mobx/hrmSalary/pages/calculateDetail/acctResult/importModal/addHeaderFieldsModal.js
new file mode 100644
index 00000000..66b00e4c
--- /dev/null
+++ b/pc4mobx/hrmSalary/pages/calculateDetail/acctResult/importModal/addHeaderFieldsModal.js
@@ -0,0 +1,105 @@
+/*
+ * Author: 黎永顺
+ * name: 表头字段添加
+ * Description:
+ * Date: 2023/5/17
+ */
+import React, { Component } from "react";
+import { Button, Col, Row } from "antd";
+import { WeaCheckbox, WeaDialog, WeaLocaleProvider, WeaSearchGroup } from "ecCom";
+import "./index.less";
+
+const { getLabel } = WeaLocaleProvider;
+
+class AddHeaderFieldsModal extends Component {
+  constructor(props) {
+    super(props);
+    this.state = {
+      itemsCheckeds: [],
+      showOnlyChecked: false
+    };
+  }
+
+  componentWillReceiveProps(nextProps, nextContext) {
+    if (nextProps.visible !== this.props.visible && nextProps.visible) {
+      this.setState({
+        itemsCheckeds: nextProps.selectItems ? _.map(nextProps.selectItems.split(","), it => Number(it)) : []
+      });
+    }
+  }
+
+  handleShowOnlyChecked = (showOnlyChecked) => this.setState({ showOnlyChecked: !!Number(showOnlyChecked) });
+  handleSelectGroupAll = (groupId, checked) => {
+    const { itemsCheckeds } = this.state;
+    const { itemsByGroup } = this.props;
+    _.map(itemsByGroup, item => {
+      if (item.salarySobItemGroupId === groupId) {
+        if (!!Number(checked)) {
+          this.setState({
+            itemsCheckeds: [...itemsCheckeds, ..._.map(item.salaryItems, child => child.salaryItemId)]
+          });
+        } else {
+          this.setState({
+            itemsCheckeds: _.differenceWith(itemsCheckeds, _.map(item.salaryItems, child => child.salaryItemId), _.isEqual)
+          });
+        }
+      }
+    });
+  };
+
+  render() {
+    const { showOnlyChecked, itemsCheckeds } = this.state;
+    const { itemsByGroup } = this.props;
+    let dataSource = _.map(itemsByGroup, item => {
+      return {
+        ...item,
+        salaryItems: _.map(item.salaryItems, child => {
+          return { ...child, checked: itemsCheckeds.includes(child.salaryItemId) };
+        })
+      };
+    });
+    if (showOnlyChecked) {
+      dataSource = _.map(dataSource, item => {
+        return { ...item, salaryItems: _.filter(item.salaryItems, it => !!it.checked) };
+      });
+    }
+    return (
+      <WeaDialog
+        {...this.props} hasScroll initLoadCss
+        scalable title={getLabel(111, "添加表头字段")}
+        style={{ width: 700, height: 484 }} className="addHeaderFieldsWrapper"
+        buttons={[
+          <Button type="primary" onClick={() => this.props.onAdd(itemsCheckeds)}>{getLabel(111, "添加")}</Button>,
+          <Button type="ghost" onClick={this.props.onCancel}>{getLabel(111, "取消")}</Button>
+        ]}
+        bottomLeft={<WeaCheckbox content={getLabel(111, "只显示已选中字段")}
+                                 onChange={this.handleShowOnlyChecked}/>}
+      >
+        {
+          _.map(dataSource, item => {
+            const { salarySobItemGroupName, salaryItems, salarySobItemGroupId } = item;
+            const value = _.every(salaryItems, it => !!it.checked) ? "1" : "0";
+            return <WeaSearchGroup showGroup needTigger
+                                   title={<WeaCheckbox content={salarySobItemGroupName} value={value}
+                                                       onChange={(val) => this.handleSelectGroupAll(salarySobItemGroupId, val)}/>}>
+              <Row gutter={16}>
+                {
+                  !_.isEmpty(salaryItems) ?
+                    _.map(salaryItems, it => {
+                      const { salaryItemId, salaryItemName, checked } = it;
+                      return <Col span={8} style={{ marginBottom: 16 }}>
+                        <WeaCheckbox content={salaryItemName} value={checked ? "1" : "0"}
+                                     onChange={() => this.setState({ itemsCheckeds: _.xorWith(itemsCheckeds, [salaryItemId], _.isEqual) })}/>
+                      </Col>;
+                    }) : <Col span={24} style={{ minHeight: 20, padding: "5%", textAlign: "center" }}>暂无数据</Col>
+                }
+              </Row>
+            </WeaSearchGroup>;
+          })
+        }
+      </WeaDialog>
+    );
+  }
+}
+
+export default AddHeaderFieldsModal;
diff --git a/pc4mobx/hrmSalary/pages/calculateDetail/acctResult/importModal/index.less b/pc4mobx/hrmSalary/pages/calculateDetail/acctResult/importModal/index.less
new file mode 100644
index 00000000..1de6458c
--- /dev/null
+++ b/pc4mobx/hrmSalary/pages/calculateDetail/acctResult/importModal/index.less
@@ -0,0 +1,11 @@
+.addHeaderFieldsWrapper {
+  .wea-search-group {
+    .wea-title {
+      padding-left: 0 !important;
+    }
+
+    .wea-content {
+      padding: 8px 16px 0;
+    }
+  }
+}
diff --git a/pc4mobx/hrmSalary/pages/calculateDetail/payrollItemsTable.js b/pc4mobx/hrmSalary/pages/calculateDetail/payrollItemsTable.js
index 86458044..b642d1cb 100644
--- a/pc4mobx/hrmSalary/pages/calculateDetail/payrollItemsTable.js
+++ b/pc4mobx/hrmSalary/pages/calculateDetail/payrollItemsTable.js
@@ -5,7 +5,7 @@
  * Date: 2023/5/16
  */
 import React, { Component } from "react";
-import { WeaHelpfulTip, WeaInputNumber, WeaLocaleProvider, WeaSearchGroup, WeaTable } from "ecCom";
+import { WeaHelpfulTip, WeaInput, WeaInputNumber, WeaLocaleProvider, WeaSearchGroup, WeaTable } from "ecCom";
 
 const { getLabel } = WeaLocaleProvider;
 
@@ -37,13 +37,17 @@ class PayrollItemsTable extends Component {
         </span>,
         width: "20%",
         render: (text, record) => {
-          const { canEdit } = record;
-          return <WeaInputNumber
+          const { canEdit, dataType } = record;
+          return dataType === "number" ? <WeaInputNumber
             disabled={!canEdit}
             min={0}
             precision={2}
             value={text || 0}
             onChange={(value) => onChangeIssueReissueValue(record.salaryItemId, value, "itemsByGroup", salarySobItemGroupId)}
+          /> : <WeaInput
+            disabled={!canEdit}
+            value={text}
+            onChange={(value) => onChangeIssueReissueValue(record.salaryItemId, value, "itemsByGroup", salarySobItemGroupId)}
           />;
         }
       },