feature/2.9.42310.01-工资单发放页面重构

2023-10-13 14:52:59 +08:00 · 2023-10-13 14:52:59 +08:00 · 53ddc607b3
parent 79a3f460e7
commit 53ddc607b3
7 changed files with 312 additions and 2 deletions
--- a/pc4mobx/hrmSalary/pages/payrollRelease/components/conditions.js
+++ b/pc4mobx/hrmSalary/pages/payrollRelease/components/conditions.js
@ -0,0 +1,20 @@
+export const copyConditions = [
+  {
+    items: [
+      {
+        colSpan: 1,
+        conditionType: "INPUT",
+        domkey: ["name"],
+        fieldcol: 14,
+        label: "工资单名称",
+        lanId: 536726,
+        labelcol: 6,
+        value: "",
+        rules: "required|string",
+        viewAttr: 3
+      }
+    ],
+    defaultshow: true,
+    title: ""
+  }
+];
--- a/pc4mobx/hrmSalary/pages/payrollRelease/components/payrollCopyDialog/index.js
+++ b/pc4mobx/hrmSalary/pages/payrollRelease/components/payrollCopyDialog/index.js
@ -0,0 +1,69 @@
+/*
+ * Author: 黎永顺
+ * name:工资单发放-重构页面-工资单模板复制
+ * Description:
+ * Date: 2023/10/13
+ */
+import React, { Component } from "react";
+import { inject, observer } from "mobx-react";
+import { WeaDialog, WeaLocaleProvider } from "ecCom";
+import { Button, message } from "antd";
+import { getSearchs } from "../../../../util";
+import { copyConditions } from "../conditions";
+import { duplicatePayroll } from "../../../../apis/payroll";
+
+const getLabel = WeaLocaleProvider.getLabel;
+
+@inject("payrollStore")
+@observer
+class Index extends Component {
+  constructor(props) {
+    super(props);
+    this.state = {
+      loading: false
+    };
+  }
+
+  componentWillReceiveProps(nextProps, nextContext) {
+    if (nextProps.visible !== this.props.visible && nextProps.visible) nextProps.payrollStore.payrollCopyForm.initFormFields(copyConditions);
+    if (nextProps.visible !== this.props.visible && !nextProps.visible) nextProps.payrollStore.initPayrollCopyForm();
+  }
+
+  save = () => {
+    const { payrollStore: { payrollCopyForm }, copyId: id } = this.props;
+    payrollCopyForm.validateForm().then(f => {
+      if (f.isValid) {
+        const payload = payrollCopyForm.getFormParams();
+        this.setState({ loading: true });
+        duplicatePayroll({ id, ...payload }).then(({ status, errormsg }) => {
+          this.setState({ loading: false });
+          if (status) {
+            message.success(getLabel(30700, "操作成功！"));
+            this.props.onCancel("refresh");
+          } else {
+            message.error(errormsg);
+          }
+        });
+      } else {
+        f.showErrors();
+      }
+    }).catch(() => this.setState({ loading: false }));
+  };
+
+  render() {
+    const { loading } = this.state;
+    const { payrollStore: { payrollCopyForm } } = this.props;
+    return (
+      <WeaDialog
+        {...this.props} style={{ width: 480 }} initLoadCss
+        buttons={[
+          <Button type="primary" onClick={this.save} loading={loading}>{getLabel(537558, "保存")}</Button>
+        ]}
+      >
+        <div className="payroll-dialog-layout">{getSearchs(payrollCopyForm, copyConditions, 1, false)}</div>
+      </WeaDialog>
+    );
+  }
+}
+
+export default Index;
--- a/pc4mobx/hrmSalary/pages/payrollRelease/components/payrollTemplateTableList/index.js
+++ b/pc4mobx/hrmSalary/pages/payrollRelease/components/payrollTemplateTableList/index.js
@ -0,0 +1,157 @@
+/*
+ * Author: 黎永顺
+ * name:工资单发放-重构页面-工资单模板设置
+ * Description:
+ * Date: 2023/10/13
+ */
+import React, { Component } from "react";
+import { inject, observer } from "mobx-react";
+import { WeaLocaleProvider, WeaSelect, WeaTable } from "ecCom";
+import { Dropdown, Menu, message } from "antd";
+import { changePayrollDefaultUse, getPayrollTemplateList } from "../../../../apis/payroll";
+import PayrollCopyDialog from "../payrollCopyDialog";
+
+const getLabel = WeaLocaleProvider.getLabel;
+
+@inject("taxAgentStore")
+@observer
+class Index extends Component {
+  constructor(props) {
+    super(props);
+    this.state = {
+      loading: false, columns: [], dataSource: [],
+      pageInfo: { current: 1, pageSize: 10, total: 0 },
+      copyDialog: { visible: false, title: "", copyId: "" }
+    };
+  }
+
+  componentDidMount() {
+    this.getPayrollTemplateList(this.props);
+  }
+
+  componentWillReceiveProps(nextProps, nextContext) {
+    if (nextProps.isRefresh !== this.props.isRefresh) this.getPayrollTemplateList(nextProps);
+  }
+
+  getPayrollTemplateList = (props) => {
+    const { pageInfo } = this.state;
+    const { queryParams } = props;
+    const { salarySobId, name } = queryParams;
+    const payload = { ...pageInfo, salarySobId, name };
+    this.setState({ loading: true });
+    getPayrollTemplateList(payload).then(({ status, data }) => {
+      this.setState({ loading: false });
+      if (status) {
+        const { columns, list: dataSource, pageNum, pageSize, total } = data;
+        this.setState({
+          dataSource, pageInfo: { ...pageInfo, pageNum, pageSize, total },
+          columns: _.map(_.filter(columns, it => !!it.display), o => {
+            const { dataIndex } = o;
+            if (dataIndex === "useType") {
+              return {
+                ...o, width: "20%", render: (useType, record) => {
+                  return <WeaSelect detailtype={3} value={useType || "0"} options={[{ key: "1", showname: "" }]}
+                                    onChange={v => this.handleSwitchUsetype(v, record)}
+                  />;
+                }
+              };
+            }
+            return { ...o, width: "20%" };
+          })
+        });
+      }
+    }).catch(() => this.setState({ loading: false }));
+  };
+  handleSwitchUsetype = (v, record) => {
+    const { id } = record;
+    changePayrollDefaultUse({ id }).then(({ status, errormsg }) => {
+      if (status) {
+        message.success(getLabel(30700, "操作成功！"));
+        this.getPayrollTemplateList(this.props);
+      } else {
+        message.error(errormsg);
+      }
+    });
+  };
+  handleOpts = ({ key }, record) => {
+    const { copyDialog } = this.state;
+    const { id, templateId } = record;
+    switch (key) {
+      case "edit":
+        console.log(templateId);
+        break;
+      case "copy":
+        this.setState({
+          copyDialog: { ...copyDialog, visible: true, copyId: id, title: getLabel(543599, "复制工资单") }
+        });
+        break;
+      case "del":
+        console.log(templateId);
+        break;
+      default:
+        break;
+    }
+  };
+
+  render() {
+    const { loading, dataSource, columns, pageInfo, copyDialog } = this.state;
+    const { taxAgentStore: { showOperateBtn } } = this.props;
+    const pagination = {
+      ...pageInfo,
+      showTotal: total => `${getLabel(18609, "共")} ${total} ${getLabel(18256, "条")}`,
+      showQuickJumper: true,
+      showSizeChanger: true,
+      pageSizeOptions: ["10", "20", "50", "100"],
+      onShowSizeChange: (current, pageSize) => {
+        this.setState({
+          pageInfo: { ...pageInfo, current, pageSize }
+        }, () => this.getPayrollTemplateList(this.props));
+      },
+      onChange: current => {
+        this.setState({
+          pageInfo: { ...pageInfo, current }
+        }, () => this.getPayrollTemplateList(this.props));
+      }
+    };
+    return (
+      <React.Fragment>
+        <WeaTable
+          rowKey="id"
+          dataSource={dataSource} loading={loading} pagination={pagination}
+          columns={[
+            ...columns,
+            {
+              dataIndex: "operate", title: getLabel(30585, "操作"), width: 170,
+              render: (__, record) => {
+                const {} = record;
+                //显示更新模板
+                return showOperateBtn ? <React.Fragment>
+                  <a href="javascript:void(0);" onClick={() => this.handleOpts({ key: "edit" }, record)}
+                     style={{ marginRight: 10 }}>{getLabel(501169, "编辑")}</a>
+                  <a href="javascript:void(0);" style={{ marginRight: 10 }}
+                     onClick={() => this.handleOpts({ key: "copy" }, record)}
+                  >{getLabel(77, "复制")}</a>
+                  <Dropdown
+                    overlay={<Menu onClick={e => this.handleOpts(e, record)}>
+                      <Menu.Item key="del">{getLabel(535052, "删除")}</Menu.Item>
+                    </Menu>
+                    }
+                  >
+                    <a href="javascript:void(0);"><i className="icon-coms-more"/></a>
+                  </Dropdown>
+                </React.Fragment> : <a href="javascript:void(0);">{getLabel(83110, "查看详情")}</a>;
+              }
+            }
+          ]}
+        />
+        <PayrollCopyDialog {...copyDialog}
+                           onCancel={v => this.setState({
+                             copyDialog: { ...copyDialog, visible: false, copyId: "" }
+                           }, () => v === "refresh" && this.getPayrollTemplateList(this.props))}
+        />
+      </React.Fragment>
+    );
+  }
+}
+
+export default Index;
--- a/pc4mobx/hrmSalary/pages/payrollRelease/components/updatePayrollTemplateSlide/index.js
+++ b/pc4mobx/hrmSalary/pages/payrollRelease/components/updatePayrollTemplateSlide/index.js
@ -0,0 +1,19 @@
+/*
+ * Author: 黎永顺
+ * name: 工资单发放-重构页面编辑模板
+ * Description:
+ * Date: 2023/10/13
+ */
+import React, { Component } from "react";
+
+class Index extends Component {
+  render() {
+    return (
+      <div>
+
+      </div>
+    );
+  }
+}
+
+export default Index;
--- a/pc4mobx/hrmSalary/pages/payrollRelease/index.js
+++ b/pc4mobx/hrmSalary/pages/payrollRelease/index.js
@ -10,6 +10,7 @@ import { WeaLocaleProvider, WeaReqTop } from "ecCom";
 import GrantQuery from "./components/reqQuery/grantQuery";
 import TemplateQuery from "./components/reqQuery/templateQuery";
 import GrantTableList from "./components/grantTableList";
+import PayrollTemplateTableList from "./components/payrollTemplateTableList";
 import { Button } from "antd";
 import moment from "moment";
 import "./index.less";
@ -53,9 +54,9 @@ class Index extends Component {
          <Button type="ghost">{getLabel(32136, "批量删除")}</Button>
        ];
        const queryBtns = [
-          <TemplateQuery queryParams={queryParams}
+          <TemplateQuery queryParams={queryParams} onSearch={() => this.setState({ isRefresh: !isRefresh })}
                         onChange={v => this.setState({
-                           isRefresh: !isRefresh,
+                           isRefresh: _.keys(v)[0] === "name" ? isRefresh : !isRefresh,
                           queryParams: { ...queryParams, ...v }
                         })}/>
        ];
@ -73,6 +74,9 @@ class Index extends Component {
      case "grant":
        dom = <GrantTableList queryParams={queryParams} isRefresh={isRefresh}/>;
        break;
+      case "template":
+        dom = <PayrollTemplateTableList queryParams={queryParams} isRefresh={isRefresh}/>;
+        break;
      default:
        break;
    }
--- a/pc4mobx/hrmSalary/pages/payrollRelease/index.less
+++ b/pc4mobx/hrmSalary/pages/payrollRelease/index.less
@ -31,3 +31,39 @@
    }
  }
 }
+
+.payroll-dialog-layout {
+  background: #f6f6f6;
+
+  .wea-search-group {
+    padding: 16px;
+  }
+
+  .wea-select, .ant-select-selection, .ant-select {
+    width: 100%;
+  }
+
+  .wea-select {
+    display: inline-block;
+    position: relative;
+  }
+
+  .ant-select-selection {
+    height: 30px;
+    border-radius: 0;
+  }
+
+  .wea-content {
+    padding: 0;
+
+    .wea-form-cell-wrapper {
+      background: #FFF;
+      border: 1px solid #e5e5e5;
+      border-bottom: none;
+
+      .wea-form-cell {
+        border-bottom: 1px solid #e5e5e5;
+      }
+    }
+  }
+}
--- a/pc4mobx/hrmSalary/stores/payroll.js
+++ b/pc4mobx/hrmSalary/stores/payroll.js
@ -9,6 +9,11 @@ import { removePropertyCondition } from "../util/response";
 const { TableStore } = WeaTableNew;

 export class payrollStore {
+  //工资单重构页面
+  @observable payrollCopyForm = new WeaForm(); //模板复制form
+  @action initPayrollCopyForm = () => this.payrollCopyForm = new WeaForm();
+
+
  @observable tableStore = new TableStore(); // new table
  @observable form = new WeaForm(); // nrew 一个form
  @observable condition = []; // 存储后台得到的form数据