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

pc4mobx/hrmSalary/pages/payrollRelease/components/conditions.js

@@ -83,9 +83,7 @@ export const tempBaseSetConditions = [
         labelcol: 6,
         options: [],
         value: "",
-        rules: "required|string",
-        hide: true,
-        viewAttr: 3
+        hide: true
       },
       {
         colSpan: 1,
@@ -167,7 +165,7 @@ export const tempBaseSetFbConditions = [
         value: 7,
         viewAttr: 3,
         hide: false,
-        rules: "required|string"
+        rules: "required"
       },
       {
         colSpan: 1,

pc4mobx/hrmSalary/pages/payrollRelease/components/payrollTempBaseSet/index.js

@@ -21,15 +21,16 @@ class Index extends Component {
     this.state = {
       conditions: [], salaryMonthOptions: [], fbConditions: [],
       formData: {
-        autoSendDayOfMonth: "",
-        autoSendTimeOfDay: "",
-        autoSendCycleType: ""
+        autoSendDayOfMonth: "1",
+        autoSendTimeOfDay: "09:00",
+        autoSendCycleType: "1"
       }
     };
   }
 
   componentDidMount() {
     this.commonEnumList();
+    this.props.visible && this.getPayrollBaseForm(this.props);
   }
 
   componentWillReceiveProps(nextProps, nextContext) {
@@ -129,6 +130,8 @@ class Index extends Component {
                 if (getKey(o) === "replenishRule") {
                   return {
                     ...o, hide: params[key].value === "0",
+                    rules: (!_.isEmpty(replenishRuleOptions) && reissueRule === "1") ? "required|string" : "",
+                    viewAttr: (!_.isEmpty(replenishRuleOptions) && reissueRule === "1") ? 3 : 2,
                     options: _.map(replenishRuleOptions, t => ({ key: t.id, showname: t.content }))
                   };
                 }
@@ -140,6 +143,7 @@ class Index extends Component {
         })
       }, () => {
         payrollTempForm.initFormFields(this.state.conditions);
+        this.resetRequiredForm();
       });
     } else if (key === "salarySobId") {
       this.setState({
@@ -149,7 +153,9 @@ class Index extends Component {
               ...it, items: _.map(it.items, o => {
                 if (getKey(o) === "replenishRule") {
                   return {
-                    ...o, options: _.map(replenishRuleOptions, t => ({ key: t.id, showname: t.content }))
+                    ...o, options: _.map(replenishRuleOptions, t => ({ key: t.id, showname: t.content })),
+                    rules: (!_.isEmpty(replenishRuleOptions) && reissueRule === "1") ? "required|string" : "",
+                    viewAttr: (!_.isEmpty(replenishRuleOptions) && reissueRule === "1") ? 3 : 2
                   };
                 }
                 return { ...o };
@@ -165,12 +171,17 @@ class Index extends Component {
           name: salarySob.valueSpan,
           replenishName: salarySob.valueSpan + "-补发工资单"
         });
+        this.resetRequiredForm();
       });
-    } else if (key === "autoSendStatus") {
-
     }
     this.forceUpdate();
   };
+  resetRequiredForm = () => {
+    const { payrollStore: { payrollTempForm } } = this.props;
+    const reissueRule = payrollTempForm.getFormParams().reissueRule;
+    if (reissueRule === "0") payrollTempForm.updateFields({ replenishRule: "0" });
+    if (reissueRule === "1") payrollTempForm.updateFields({ replenishRule: "" });
+  };
   handleFbChange = (params) => {
     const { payrollStore: { payrollTempFeedbackForm } } = this.props;
     const key = _.keys(params)[0];
@@ -193,6 +204,8 @@ class Index extends Component {
         })
       }, () => {
         payrollTempFeedbackForm.initFormFields(this.state.fbConditions);
+        const ackFeedbackStatus = payrollTempFeedbackForm.getFormParams().ackFeedbackStatus;
+        if (ackFeedbackStatus === "0") payrollTempFeedbackForm.updateFields({ autoAckDays: "7", feedbackUrl: "/" });
       });
     }
     this.forceUpdate();
@@ -210,6 +223,7 @@ class Index extends Component {
           <WeaFormItem className="sendTime-outer" label={getLabel(18961, "发送时间")} labelCol={{ span: 6 }}
                        wrapperCol={{ span: 16 }}>
             <SendTimeComp salaryMonthOptions={salaryMonthOptions} value={{ ...formData }}
+                          onChange={(v) => this.setState({ formData: { ...formData, ...v } })}
             />
           </WeaFormItem>
         }

pc4mobx/hrmSalary/pages/payrollRelease/components/updatePayrollTemplateSlide/index.js

@@ -7,8 +7,9 @@
 import React, { Component } from "react";
 import { inject, observer } from "mobx-react";
 import { WeaLocaleProvider, WeaSlideModal, WeaSteps } from "ecCom";
+import { Button, message } from "antd";
 import PayrollTempBaseSet from "../payrollTempBaseSet";
-import { Button } from "antd";
+import { savePayroll } from "../../../../apis/payroll";
 
 const Step = WeaSteps.Step;
 const getLabel = WeaLocaleProvider.getLabel;
@@ -19,12 +20,56 @@ class Index extends Component {
   constructor(props) {
     super(props);
     this.state = {
-      current: 0
+      current: 0, loading: false
     };
+    this.tmpBaseSetRef = null;
   }
 
+  save = async () => {
+    const {
+      payrollStore: {
+        payrollTempForm, payrollTempFeedbackForm, initPayrollTempForm, initPayrollTempFeedbackForm
+      }
+    } = this.props;
+    const [tempFormm, fbForm] = await Promise.all([payrollTempForm.validateForm(), payrollTempFeedbackForm.validateForm()]);
+    if (tempFormm.isValid && fbForm.isValid) {
+      const { replenishRule, autoSendStatus, emailStatus, msgStatus, ...extraBs } = payrollTempForm.getFormParams(),
+        { ackFeedbackStatus, autoAckDays, ...extraFb } = payrollTempFeedbackForm.getFormParams(),
+        { formData } = this.tmpBaseSetRef.state;
+      const payload = {
+        ...extraFb, ...formData, ...extraBs,
+        ackFeedbackStatus: ackFeedbackStatus === "1",
+        autoSendStatus: autoSendStatus === "1",
+        emailStatus: emailStatus === "1",
+        msgStatus: msgStatus === "1",
+        autoAckDays: Number(autoAckDays),
+        replenishRule: replenishRule === "0" ? "" : replenishRule
+      };
+      this.setState({
+        current: this.state.current + 1
+      }, () => {
+        initPayrollTempForm();
+        initPayrollTempFeedbackForm();
+      });
+    } else {
+      tempFormm.showErrors();
+      fbForm.showErrors();
+      this.forceUpdate();
+    }
+  };
+  savePayroll = (payload) => {
+    this.setState({ loading: true });
+    savePayroll(payload).then(({ status, errormsg }) => {
+      this.setState({ loading: false });
+      if (status) {
+        message.success(getLabel(30700, "操作成功！"));
+      } else {
+        message.error(errormsg);
+      }
+    }).catch(() => this.setState({ loading: false }));
+  };
   renderTitle = () => {
-    const { tmplId } = this.props, { current } = this.state;
+    const { tmplId } = this.props, { current, loading } = this.state;
     return <div className="payroll-title-flex titleDialog">
       <div className="titleCol titleLeftBox">
         <div className="titleIcon"><i className="icon-coms-fa"/></div>
@@ -33,15 +78,17 @@ class Index extends Component {
       <div className="titleCol titleRightBox">
         {
           current === 0 ?
-            <Button type="primary">{getLabel(1402, "下一步")}</Button> :
+            <Button type="primary" loading={loading} onClick={this.save}>{getLabel(1402, "下一步")}</Button> :
             current === 1 ?
               <React.Fragment>
-                <Button type="ghost">{getLabel(1876, "上一步")}</Button>
+                <Button type="ghost"
+                        onClick={() => this.setState({ current: current - 1 })}>{getLabel(1876, "上一步")}</Button>
                 <Button type="primary">{getLabel(1402, "下一步")}</Button>
                 <Button type="ghost">{getLabel(221, "预览")}</Button>
               </React.Fragment> :
               <React.Fragment>
-                <Button type="ghost">{getLabel(1876, "上一步")}</Button>
+                <Button type="ghost"
+                        onClick={() => this.setState({ current: current - 1 })}>{getLabel(1876, "上一步")}</Button>
                 <Button type="primary">{getLabel(537558, "保存")}</Button>
               </React.Fragment>
         }
@@ -53,7 +100,7 @@ class Index extends Component {
     let dom = null;
     switch (current) {
       case 0:
-        dom = <PayrollTempBaseSet {...this.props}/>;
+        dom = <PayrollTempBaseSet {...this.props} ref={dom => this.tmpBaseSetRef = dom}/>;
         break;
       default:
         break;

pc4mobx/hrmSalary/pages/payrollRelease/index.less

@@ -70,6 +70,10 @@
 
       .titleRightBox {
         justify-content: flex-end;
+
+        & > button:not(:last-child) {
+          margin-right: 10px;
+        }
       }
     }