From 6d9787d924a18ffe9e201bb18b78d9b6f3608f3e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E9=BB=8E=E6=B0=B8=E9=A1=BA?= <971387674@qq.com>
Date: Mon, 12 Dec 2022 16:10:11 +0800
Subject: [PATCH] =?UTF-8?q?=E8=96=AA=E8=B5=84=E8=B4=A6=E5=A5=97=E9=A1=B5?=
 =?UTF-8?q?=E9=9D=A2=E9=87=8D=E6=9E=84?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../pages/ledgerPage/components/index.less    |  34 ++++
 .../components/ledgerAdjustRuleAddModal.js    | 149 +++++++++++++++++
 .../components/ledgerSalaryAdjustmentRules.js |  61 ++++++-
 pc4mobx/hrmSalary/pages/ledgerPage/config.js  | 157 ++++++++++++++++++
 4 files changed, 394 insertions(+), 7 deletions(-)
 create mode 100644 pc4mobx/hrmSalary/pages/ledgerPage/components/ledgerAdjustRuleAddModal.js

diff --git a/pc4mobx/hrmSalary/pages/ledgerPage/components/index.less b/pc4mobx/hrmSalary/pages/ledgerPage/components/index.less
index 6d697700..f24e52f2 100644
--- a/pc4mobx/hrmSalary/pages/ledgerPage/components/index.less
+++ b/pc4mobx/hrmSalary/pages/ledgerPage/components/index.less
@@ -76,3 +76,37 @@
     }
   }
 }
+
+//调薪计薪规则弹框
+.adjustRuleModalWrapper {
+  .titleTipWrapper {
+    display: flex;
+    align-items: center;
+
+    .title {
+      margin-right: 4px;
+    }
+  }
+
+  .adjustRuleDetailWrapper{
+    display: flex;
+    flex-direction: column;
+    .adjustSalaryFlex{
+      display: flex;
+    }
+  }
+
+  .wea-select, .ant-select-selection, .ant-select {
+    width: 100%;
+  }
+
+  .wea-select {
+    display: inline-block;
+    position: relative;
+  }
+
+  .ant-select-selection {
+    height: 30px;
+    border-radius: 0;
+  }
+}
diff --git a/pc4mobx/hrmSalary/pages/ledgerPage/components/ledgerAdjustRuleAddModal.js b/pc4mobx/hrmSalary/pages/ledgerPage/components/ledgerAdjustRuleAddModal.js
new file mode 100644
index 00000000..81fc8739
--- /dev/null
+++ b/pc4mobx/hrmSalary/pages/ledgerPage/components/ledgerAdjustRuleAddModal.js
@@ -0,0 +1,149 @@
+/*
+ * Author: 黎永顺
+ * name: 新增调薪计薪规
+ * Description:
+ * Date: 2022/12/12
+ */
+import React, { Component } from "react";
+import { WeaDialog, WeaFormItem, WeaHelpfulTip, WeaSearchGroup, WeaSelect } from "ecCom";
+import { Button, Radio } from "antd";
+import { monthDays } from "../config";
+import { listSalarySobItem } from "../../../apis/ledger";
+import "./index.less";
+
+class LedgerAdjustRuleAddModal extends Component {
+  constructor(props) {
+    super(props);
+    this.state = {
+      beforeAdjustmentType: "",
+      afterAdjustmentType: "",
+      salaryItemId: "",
+      salaryItemName: "",
+      dayOfMonth: "",
+      salaryItemOptions: []
+    };
+  }
+
+  componentWillReceiveProps(nextProps, nextContext) {
+    if (nextProps.visible !== this.props.visible && !nextProps.salarySobId) this.listSalarySobItem();
+  }
+
+  listSalarySobItem = () => {
+    const { salarySobId } = this.props;
+    const payload = {
+      excludeSalaryItemIds: [],
+      salarySobId
+    };
+    listSalarySobItem(payload).then(({ status, data }) => {
+      if (status) {
+        this.setState({
+          salaryItemOptions: _.map(data, it => ({ key: it.id, showname: it.content }))
+        });
+      }
+    });
+  };
+
+  render() {
+    const {
+      salaryItemId,
+      salaryItemOptions,
+      dayOfMonth,
+      beforeAdjustmentType,
+      afterAdjustmentType
+    } = this.state;
+    const { onCancel, title, visible } = this.props;
+    const buttons = [<Button type="primary">保存</Button>];
+    return (
+      <WeaDialog
+        initLoadCss
+        className="adjustRuleModalWrapper"
+        title={title}
+        visible={visible}
+        style={{ width: 680 }}
+        buttons={buttons}
+        onCancel={onCancel}
+      >
+        <WeaSearchGroup col={1} needTigger title="" showGroup center>
+          <WeaFormItem label="薪资项目" labelCol={{ span: 6 }} wrapperCol={{ span: 18 }}>
+            <WeaSelect
+              viewAttr={3}
+              value={salaryItemId}
+              options={salaryItemOptions}
+              onChange={(salaryItemId, salaryItemName) => this.setState({ salaryItemId, salaryItemName })}
+            />
+          </WeaFormItem>
+          <WeaFormItem label={<AdjustTitle/>} labelCol={{ span: 6 }} wrapperCol={{ span: 18 }}>
+            <div className="adjustRuleDetailWrapper">
+              <div className="adjustSalaryFlex">
+                <span>如果：调薪生效日期在</span>
+                <WeaSelect
+                  viewAttr={3}
+                  value={dayOfMonth}
+                  options={monthDays}
+                  onChange={(dayOfMonth) => this.setState({ dayOfMonth })}
+                />
+                <span>（含）之前</span>
+              </div>
+              <div className="adjustSalaryFlex">
+                <span>计薪规则为：</span>
+                <Radio.Group onChange={(value) => {
+                  console.log(value);
+                }} value={beforeAdjustmentType}>
+                  <Radio value={2}>取调整后薪资</Radio>
+                  <Radio value={4}>分段计薪<WeaHelpfulTip
+                    style={{ marginLeft: "10px" }}
+                    width={200}
+                    title="=调整前薪资/当月自然日天数*调整前自然日天数+调整后薪资/当月自然日天数*调整后自然日天数"
+                    placement="topLeft"
+                  /></Radio>
+                  <Radio value={3}>取平均<WeaHelpfulTip
+                    style={{ marginLeft: "10px" }}
+                    width={200}
+                    title="=（调整前薪资+调整后薪资）/2"
+                    placement="topLeft"
+                  />
+                  </Radio>
+                </Radio.Group>
+              </div>
+              <div>否则：调薪生效日期在{dayOfMonth}号之后</div>
+              <div className="adjustSalaryFlex">
+                <span>计薪规则为：</span>
+                <Radio.Group onChange={(value) => {
+                  console.log(value);
+                }} value={afterAdjustmentType}>
+                  <Radio value={1}>取调整前薪资</Radio>
+                  <Radio value={4}>分段计薪<WeaHelpfulTip
+                    style={{ marginLeft: "10px" }}
+                    width={200}
+                    title="=调整前薪资/当月自然日天数*调整前自然日天数+调整后薪资/当月自然日天数*调整后自然日天数"
+                    placement="topLeft"
+                  /></Radio>
+                  <Radio value={3}>取平均<WeaHelpfulTip
+                    style={{ marginLeft: "10px" }}
+                    width={200}
+                    title="=（调整前薪资+调整后薪资）/2"
+                    placement="topLeft"
+                  />
+                  </Radio>
+                </Radio.Group>
+              </div>
+            </div>
+          </WeaFormItem>
+        </WeaSearchGroup>
+      </WeaDialog>
+    );
+  }
+}
+
+export default LedgerAdjustRuleAddModal;
+
+const AdjustTitle = () => {
+  return <div className="titleTipWrapper">
+    <span className="title">计薪规则</span>
+    <WeaHelpfulTip
+      width={200}
+      title="该规则适用于一个薪资核算周期内只调整一次薪资或个税扣缴义务人的情况，其他情况默认按照分段计薪规则核算"
+      placement="topLeft"
+    />
+  </div>;
+};
diff --git a/pc4mobx/hrmSalary/pages/ledgerPage/components/ledgerSalaryAdjustmentRules.js b/pc4mobx/hrmSalary/pages/ledgerPage/components/ledgerSalaryAdjustmentRules.js
index 9f63cc90..47d2c529 100644
--- a/pc4mobx/hrmSalary/pages/ledgerPage/components/ledgerSalaryAdjustmentRules.js
+++ b/pc4mobx/hrmSalary/pages/ledgerPage/components/ledgerSalaryAdjustmentRules.js
@@ -5,18 +5,65 @@
  * Date: 2022/12/12
  */
 import React, { Component } from "react";
-import { WeaButtonIcon, WeaInputSearch, WeaTab } from "ecCom";
+import { inject, observer } from "mobx-react";
+import { WeaButtonIcon, WeaTab, WeaTable } from "ecCom";
+import LedgerAdjustRuleAddModal from "./ledgerAdjustRuleAddModal";
 
+@inject("taxAgentStore")
+@observer
 class LedgerSalaryAdjustmentRules extends Component {
+  constructor(props) {
+    super(props);
+    this.state = {
+      dataSource: [],
+      columns: [],
+      adjustRuleAddModal: {
+        visible: false,
+        title: "调薪计薪规则项",
+        salarySobId: ""
+      }
+    };
+  }
+
+  handleAddAdjustRule = () => {
+    const { adjustRuleAddModal } = this.state;
+    const { editId } = this.props;
+    this.setState({
+      adjustRuleAddModal: {
+        ...adjustRuleAddModal,
+        visible: true,
+        salarySobId: editId
+      }
+    });
+  };
+  handleCloseModal = () => {
+    const { adjustRuleAddModal } = this.state;
+    this.setState({
+      adjustRuleAddModal: {
+        ...adjustRuleAddModal,
+        visible: false,
+        salarySobId: ""
+      }
+    });
+  };
+
   render() {
+    const { taxAgentStore: { showOperateBtn }, editId, adjustRuleAddModal } = this.props;
+    const btns = showOperateBtn ? [
+      <WeaButtonIcon buttonType="add" type="primary" onClick={this.handleAddAdjustRule}/>
+    ] : [];
     return (
       <div>
-        <WeaTab
-          datas={[]}
-          keyParam="viewcondition" //主键
-          selectedKey={selectedKey}
-          buttons={btns}
-          onChange={selectedKey => this.setState({ selectedKey })}
+        <WeaTab datas={[]} keyParam="viewcondition" buttons={btns}/>
+        <WeaTable
+          rowKey="id"
+          dataSource={dataSource}
+          columns={columns}
+          pagination={false}
+        />
+        <LedgerAdjustRuleAddModal
+          {...adjustRuleAddModal}
+          onCancel={this.handleCloseModal}
         />
       </div>
     );
diff --git a/pc4mobx/hrmSalary/pages/ledgerPage/config.js b/pc4mobx/hrmSalary/pages/ledgerPage/config.js
index 62e7bc19..01fb9d44 100644
--- a/pc4mobx/hrmSalary/pages/ledgerPage/config.js
+++ b/pc4mobx/hrmSalary/pages/ledgerPage/config.js
@@ -509,3 +509,160 @@ export const baseSettingFormItem = [
     type: "TEXTAREA"
   }
 ];
+export const monthDays = [
+  {
+    key: "1",
+    selected: true,
+    showname: "1号"
+  },
+  {
+    key: "2",
+    selected: false,
+    showname: "2号"
+  },
+  {
+    key: "3",
+    selected: false,
+    showname: "3号"
+  },
+  {
+    key: "4",
+    selected: false,
+    showname: "4号"
+  },
+  {
+    key: "5",
+    selected: false,
+    showname: "5号"
+  },
+  {
+    key: "6",
+    selected: false,
+    showname: "6号"
+  },
+  {
+    key: "7",
+    selected: false,
+    showname: "7号"
+  },
+  {
+    key: "8",
+    selected: false,
+    showname: "8号"
+  },
+  {
+    key: "9",
+    selected: false,
+    showname: "9号"
+  },
+  {
+    key: "10",
+    selected: false,
+    showname: "10号"
+  },
+  {
+    key: "11",
+    selected: false,
+    showname: "11号"
+  },
+  {
+    key: "12",
+    selected: false,
+    showname: "12号"
+  },
+  {
+    key: "13",
+    selected: false,
+    showname: "13号"
+  },
+  {
+    key: "14",
+    selected: false,
+    showname: "14号"
+  },
+  {
+    key: "15",
+    selected: false,
+    showname: "15号"
+  },
+  {
+    key: "16",
+    selected: false,
+    showname: "16号"
+  },
+  {
+    key: "17",
+    selected: false,
+    showname: "17号"
+  },
+  {
+    key: "18",
+    selected: false,
+    showname: "18号"
+  },
+  {
+    key: "19",
+    selected: false,
+    showname: "19号"
+  },
+  {
+    key: "20",
+    selected: false,
+    showname: "20号"
+  },
+  {
+    key: "21",
+    selected: false,
+    showname: "21号"
+  },
+  {
+    key: "22",
+    selected: false,
+    showname: "22号"
+  },
+  {
+    key: "23",
+    selected: false,
+    showname: "23号"
+  },
+  {
+    key: "24",
+    selected: false,
+    showname: "24号"
+  },
+  {
+    key: "25",
+    selected: false,
+    showname: "25号"
+  },
+  {
+    key: "26",
+    selected: false,
+    showname: "26号"
+  },
+  {
+    key: "27",
+    selected: false,
+    showname: "27号"
+  },
+  {
+    key: "28",
+    selected: false,
+    showname: "28号"
+  },
+  {
+    key: "29",
+    selected: false,
+    showname: "29号"
+  },
+  {
+    key: "30",
+    selected: false,
+    showname: "30号"
+  },
+  {
+    key: "31",
+    selected: false,
+    showname: "31号"
+  }
+];