社保福利档案新增编辑页面重构

pc4mobx/hrmSalary/pages/socialSecurityBenefits/archives/accumulationFundForm.js

@@ -1,9 +1,15 @@
 import React from "react";
 import { inject, observer } from "mobx-react";
-import { Col, Row } from "antd";
-import { WeaCheckbox, WeaDatePicker, WeaInput, WeaInputNumber, WeaSelect } from "ecCom";
-import GroupCard from "../../../components/groupCard";
-import cs from "classnames";
+import { toJS } from "mobx";
+import { WeaSearchGroup } from "ecCom";
+import {
+  ConsistentWelfare,
+  SocialDatePicker,
+  SocialEditInput,
+  SocialInputNumber,
+  SocialSelect,
+  SocialTitle
+} from "./socialSecurityForm";
 import "./index.less";
 
 @inject("archivesStore")
@@ -16,172 +22,110 @@ export default class AccumulationFundForm extends React.Component {
     getPaymentForm(this.props.employeeId, "ACCUMULATION_FUND", this.props.record.fundSchemeId, this.props.record.paymentOrganization);
   }
 
-  // 表单变化
-  handleFormChange(params) {
+  handleFormChange = ({ key, value }) => {
+    const params = { [key]: value };
     const { archivesStore: { accumulationFundForm, setAccumulationFundForm }, onChangeRecordFundSchemeId } = this.props;
     const { data } = accumulationFundForm;
     let request = { ...data, ...params };
-    request.fundName = request.fundSchemeId;
     let form = { ...accumulationFundForm };
     form.data = request;
     setAccumulationFundForm(form);
-    Object.keys(params).length>1 &&
-    onChangeRecordFundSchemeId(params.fundSchemeId)
-  }
+    key === "fundSchemeId" && this.handleFetchPaymentForm(value);
+    key === "fundSchemeId" && onChangeRecordFundSchemeId(value);
+  };
 
   // 获取基数表单
-  handleFetchPaymentForm(fundName) {
+  handleFetchPaymentForm = (fundName) => {
     const { archivesStore: { getPaymentForm } } = this.props;
     getPaymentForm(this.props.employeeId, "ACCUMULATION_FUND", fundName, this.props.record.paymentOrganization);
-  }
-
-
-  //基数变化
-  handlePaymentChange(params) {
+  };
+  handlePaymentChange = ({ key, value }) => {
+    const params = { [key]: value };
     const { archivesStore: { accumulationFundPaymentForm, setAccumulationFundPaymentForm } } = this.props;
     const { data } = accumulationFundPaymentForm;
     let request = { ...data, ...params };
     let form = { ...accumulationFundPaymentForm };
     form.data = request;
     setAccumulationFundPaymentForm(form);
-  }
+  };
 
   render() {
     const { archivesStore: { accumulationFundForm, accumulationFundPaymentForm } } = this.props;
-    const { items } = accumulationFundForm;
-    let baseData = accumulationFundForm.data;
-    let paymentData = accumulationFundPaymentForm.data;
-    let paymentItems = accumulationFundPaymentForm.items;
-    let data = { ...baseData };
-    // Integer数据转为string
-    if (data) {
-      Object.keys(data).map(key => {
-        if (data[key]) {
-          data[key] = data[key].toString();
-        }
-      });
-    }
+    const { items, data: foundData } = accumulationFundForm;
+    const paymentData = accumulationFundPaymentForm.data;
+    const paymentItems = accumulationFundPaymentForm.items;
+    const {
+      nonPayment = "", fundAccount = "", supplementFundAccount = "", fundStartTime = "", fundEndTime = "",
+      fundSchemeId = ""
+    } = foundData || {};
+    const foundItems = !_.isNil(toJS(items)) ? [
+      ..._.map(_.filter(toJS(items)[0].items, it => it.domkey[0] !== "paymentOrganization"),
+        item => ({
+          com: SocialSelect({
+            key: item["domkey"][0],
+            label: item.label,
+            value: !_.isNil(foundData[item["domkey"][0]]) ? foundData[item["domkey"][0]].toString() : "",
+            options: item.options,
+            onChange: this.handleFormChange
+          })
+        })),
+      {
+        com: SocialDatePicker({
+          key: "fundStartTime",
+          label: "公积金起始缴纳月",
+          viewAttr: fundSchemeId ? 3 : 2,
+          value: fundStartTime,
+          onChange: this.handleFormChange
+        })
+      },
+      {
+        com: SocialEditInput({
+          key: "fundAccount",
+          label: "公积金账号",
+          value: fundAccount,
+          onChange: this.handleFormChange
+        })
+      },
+      {
+        com: SocialDatePicker({
+          key: "fundEndTime",
+          label: "公积金最后缴纳月",
+          value: fundEndTime,
+          onChange: this.handleFormChange
+        })
+      },
+      {
+        com: SocialEditInput({
+          key: "supplementFundAccount",
+          label: "补充公积金账号",
+          value: supplementFundAccount,
+          onChange: this.handleFormChange
+        })
+      }
+    ] : [];
     return (
       <div className="socialFormWrapper">
-        <div style={{ overflow: "hidden" }}>
-          <WeaCheckbox style={{ float: "right", marginRight: "10px", marginTop: "10px" }}
-                       value={data && data.nonPayment} id="nonPayment" content="暂不缴纳" onChange={(value) => {
-            this.handleFormChange({ nonPayment: value });
-          }}/>
-        </div>
-        <GroupCard title="公积金基础信息">
-          <Row>
-            <Col span={6} className="formItem borderR-none borderB-none">公积金起始缴纳月：</Col>
-            <Col span={6} className="formItem borderR-none borderB-none">
-              <WeaDatePicker
-                viewAttr={(accumulationFundForm.data && accumulationFundForm.data.fundSchemeId) ? 3 : 2}
-                format="yyyy-MM"
-                value={data && data.fundStartTime}
-                onChange={value => this.handleFormChange({ fundStartTime: value })}
-              />
-
-            </Col>
-            <Col span={6} className="formItem borderR-none borderB-none">公积金方案名称：</Col>
-            <Col span={6} className="formItem borderB-none">
-              <WeaSelect
-                options={
-                  (items && items[0].items && items[0].items[0]) ? [{
-                    key: "",
-                    showname: ""
-                  }, ...items[0].items[0].options] : []
-                }
-                value={data && data.fundSchemeId}
-                style={{ width: "100%" }}
-                onChange={(value, showname) => {
-                  this.handleFormChange({ fundSchemeId: value, fundName: showname });
-                  this.handleFetchPaymentForm(value);
-                }}
-              />
-            </Col>
-          </Row>
-          <Row>
-            <Col span={6} className="formItem borderR-none borderB-none">公积金最后缴纳月：</Col>
-            <Col span={6} className="formItem borderR-none borderB-none">
-              <WeaDatePicker
-                format="yyyy-MM"
-                value={data && data.fundEndTime}
-                onChange={value => this.handleFormChange({ fundEndTime: value })}
-              />
-            </Col>
-            <Col span={6} className="formItem borderR-none borderB-none">公积金账号：</Col>
-            <Col span={6} className="formItem borderB-none">
-              <WeaInput
-                value={data && data.fundAccount}
-                onChange={(value) => this.handleFormChange({ fundAccount: value })}/>
-            </Col>
-          </Row>
-          <Row>
-            <Col span={6} className="formItem borderR-none">补充公积金账号：</Col>
-            <Col span={6} className="formItem borderR-none">
-              <WeaInput value={data && data.supplementFundAccount}
-                        onChange={(value) => this.handleFormChange({ supplementFundAccount: value })}/>
-            </Col>
-            <Col span={6} className="formItem borderR-none">公积金个人实际承担方：</Col>
-            <Col span={6} className="formItem">
-              <WeaSelect
-                options={(items && items[0].items && items[0].items[2]) ? items[0].items[2].options : []}
-                value={data && data.underTake}
-                style={{ width: "100%" }}
-                onChange={(value) => {
-                  this.handleFormChange({ underTake: value });
-                }}
-              />
-            </Col>
-          </Row>
-          {/*<Row>*/}
-          {/*<Col span={6} className="formItem">公积金缴纳组织：</Col>*/}
-          {/*<Col span={6} className="formItem">*/}
-          {/*  <Select defaultValue={data && data.paymentOrganization}*/}
-          {/*          notFoundContent="暂无数据" value={data && data.paymentOrganization} style={{ width: "100%" }}*/}
-          {/*          onChange={(value) => this.handleFormChange({ paymentOrganization: value })}>*/}
-          {/*    {*/}
-          {/*      items && items[0].items && items[0].items[1] && items[0].items[1].options.map(item => (*/}
-          {/*        <Option value={item.key}>{item.showname}</Option>*/}
-          {/*      ))*/}
-          {/*    }*/}
-          {/*  </Select>*/}
-          {/*</Col>*/}
-          {/*</Row>*/}
-        </GroupCard>
+        <WeaSearchGroup
+          title="公积金基础信息"
+          customComponent={<SocialTitle keyname="nonPayment" value={nonPayment.toString()}
+                                        onChange={this.handleFormChange}/>}
+          items={foundItems} col={2} showGroup needTigger={false}/>
         {
-          data.fundSchemeId && paymentItems && paymentItems.map(group => (
-            <div>
-              {
-                group.items && group.items.length > 0 && <GroupCard title={group.title}>
-                  <Row>
-                    {
-                      group.items && group.items.map((item, idx) => (
-                        <Col span={12}>
-                          <Row>
-                            <Col span={12}
-                                 className={cs("formItem", "borderR-none")}>{item.label}：</Col>
-                            <Col span={12}
-                                 className={cs("formItem", { "borderR-none": idx === 0 })}>
-                              <WeaInputNumber
-                                min={0}
-                                precision={2}
-                                value={(paymentData && paymentData[item.domkey[0]]) ? Number(paymentData[item.domkey[0]]) : 0}
-                                onChange={(value) => {
-                                  this.handlePaymentChange({ [item.domkey[0]]: value ? String(value) : '0' });
-                                }}
-                              />
-                            </Col>
-                          </Row>
-                        </Col>
-                      ))
-                    }
-                  </Row>
-                </GroupCard>
-              }
-            </div>
-
-
-          ))
+          !_.isEmpty(fundSchemeId) && !_.isEmpty(toJS(paymentItems)) && _.map(toJS(paymentItems), item => {
+            const { title, items } = item;
+            return <WeaSearchGroup
+              items={_.map(items, child => ({
+                com: SocialInputNumber({
+                  key: child["domkey"][0],
+                  label: child.label,
+                  value: !_.isNil(paymentData[child["domkey"][0]]) ? paymentData[child["domkey"][0]].toString() : "",
+                  onChange: this.handlePaymentChange
+                })
+              }))}
+              customComponent={<ConsistentWelfare/>}
+              title={title} col={2} showGroup
+            />;
+          })
         }
       </div>
     );

pc4mobx/hrmSalary/pages/socialSecurityBenefits/archives/index.js

@@ -214,8 +214,8 @@ export default class Archives extends React.Component {
         const { archivesStore: { save, socialSecurityForm, accumulationFundForm, otherForm } } = this.props;
         if (selectedTab == 1) {
           const { data } = socialSecurityForm;
-          const { socialName, socialStartTime } = data;
-          if (socialName && !socialStartTime) {
+          const { socialSchemeId, socialStartTime } = data;
+          if (socialSchemeId && !socialStartTime) {
             Modal.warning({
               title: "信息确认",
               content: "必要信息不完整，红色*为必填项！"

pc4mobx/hrmSalary/pages/socialSecurityBenefits/archives/otherForm.js

@@ -1,9 +1,14 @@
 import React from "react";
 import { inject, observer } from "mobx-react";
-import {toJS} from 'mobx';
-import { Col, Row } from "antd";
-import { WeaCheckbox, WeaDatePicker, WeaInputNumber, WeaSelect } from "ecCom";
-import GroupCard from "../../../components/groupCard";
+import { WeaSearchGroup } from "ecCom";
+import { toJS } from "mobx";
+import {
+  ConsistentWelfare,
+  SocialDatePicker,
+  SocialInputNumber,
+  SocialSelect,
+  SocialTitle
+} from "./socialSecurityForm";
 import "./index.less";
 
 @inject("archivesStore")
@@ -23,151 +28,89 @@ export default class OtherForm extends React.Component {
   }
 
   // 获取基数表单
-  handleFetchPaymentForm(value) {
+  handleFetchPaymentForm = (value) => {
     const { archivesStore: { getPaymentForm } } = this.props;
     getPaymentForm(this.props.employeeId, "OTHER", value, this.props.record.paymentOrganization);
-  }
-
-  // 表单变化
-  handleFormChange(params) {
+  };
+  handleFormChange = ({ key, value }) => {
+    const params = { [key]: value };
     const { archivesStore: { otherForm, setOtherForm }, onChangeRecordOtherSchemeId } = this.props;
     const { data } = otherForm;
     let request = { ...data, ...params };
     let form = { ...otherForm };
     form.data = request;
     setOtherForm(form);
-    Object.keys(params).length>1 &&
-    onChangeRecordOtherSchemeId(params.otherSchemeId)
-  }
-
-  //基数变化
-  handlePaymentChange(params) {
+    key === "otherSchemeId" && this.handleFetchPaymentForm(value);
+    key === "otherSchemeId" && onChangeRecordOtherSchemeId(value);
+  };
+  handlePaymentChange = ({ key, value }) => {
+    const params = { [key]: value };
     const { archivesStore: { otherPaymentForm, setOtherPaymentForm } } = this.props;
     const { data } = otherPaymentForm;
     let request = { ...data, ...params };
     let form = { ...otherPaymentForm };
     form.data = request;
     setOtherPaymentForm(form);
-  }
+  };
 
   render() {
     const { archivesStore: { otherForm, otherPaymentForm } } = this.props;
-    const { items } = otherForm;
-    let baseData = otherForm.data;
-    let data = { ...baseData };
+    const { items, data: otherData } = otherForm;
     let paymentData = otherPaymentForm.data;
     let paymentItems = otherPaymentForm.items;
-    // Integer数据转为string
-    if (data) {
-      Object.keys(data).map(key => {
-        if (data[key]) {
-          data[key] = data[key].toString();
-        }
-      });
-    }
+    const { nonPayment = "", otherStartTime = "", otherEndTime = "", otherSchemeId = "" } = otherData || {};
+    const otherItems = !_.isNil(toJS(items)) ? [
+      ..._.map(_.filter(toJS(items)[0].items, it => it.domkey[0] !== "paymentOrganization"),
+        item => ({
+          com: SocialSelect({
+            key: item["domkey"][0],
+            label: item.label,
+            value: !_.isNil(otherData[item["domkey"][0]]) ? otherData[item["domkey"][0]].toString() : "",
+            options: item.options,
+            onChange: this.handleFormChange
+          })
+        })),
+      {
+        com: SocialDatePicker({
+          key: "otherStartTime",
+          label: "其他福利起始缴纳月",
+          viewAttr: otherSchemeId ? 3 : 2,
+          value: otherStartTime,
+          onChange: this.handleFormChange
+        })
+      },
+      {
+        com: SocialDatePicker({
+          key: "otherEndTime",
+          label: "其他福利最后缴纳月",
+          value: otherEndTime,
+          onChange: this.handleFormChange
+        })
+      }
+    ] : [];
     return (
       <div className="socialFormWrapper">
-        <div style={{ overflow: "hidden" }}>
-          <WeaCheckbox style={{ float: "right", marginRight: "10px", marginTop: "10px" }}
-                       value={data && data.nonPayment} id="nonPayment" content="暂不缴纳" onChange={(value) => {
-            this.handleFormChange({ nonPayment: value });
-          }}/>
-        </div>
-        <GroupCard title="其他福利基础信息">
-          <Row>
-            <Col span={6} className="formItem borderR-none borderB-none">其他福利起始缴纳月：</Col>
-            <Col span={6} className="formItem borderR-none borderB-none">
-              <WeaDatePicker
-                viewAttr={(otherForm.data && otherForm.data.otherSchemeId) ? 3 : 2}
-                format="yyyy-MM"
-                value={data && data.otherStartTime}
-                onChange={value => this.handleFormChange({ otherStartTime: value })}
-              />
-            </Col>
-            <Col span={6} className="formItem borderR-none borderB-none">其他福利方案名称：</Col>
-            <Col span={6} className="formItem borderB-none">
-              <WeaSelect
-                options={(items && items[0].items && items[0].items[0]) ? [{
-                  key: "",
-                  showname: ""
-                }, ...items[0].items[0].options] : []}
-                value={data && data.otherSchemeId}
-                style={{ width: "100%" }}
-                onChange={(value, showname) => {
-                  this.handleFormChange({ otherName: showname, otherSchemeId: value });
-                  this.handleFetchPaymentForm(value);
-                }}/>
-            </Col>
-          </Row>
-          <Row>
-            <Col span={6} className="formItem borderR-none">其他福利最后缴纳月：</Col>
-            <Col span={6} className="formItem borderR-none">
-              <WeaDatePicker
-                format="yyyy-MM"
-                value={data && data.otherEndTime}
-                onChange={value => this.handleFormChange({ otherEndTime: value })}
-              />
-            </Col>
-            <Col span={6} className="formItem borderR-none"><span
-              title="其他福利个人实际承担方">其他福利个人实际承担方：</span></Col>
-            <Col span={6} className="formItem">
-              <WeaSelect
-                options={(items && items[0].items && items[0].items[2]) ? items[0].items[2].options : []}
-                value={data && data.underTake}
-                style={{ width: "100%" }}
-                onChange={(value) => {
-                  this.handleFormChange({ underTake: value });
-                }}
-              />
-            </Col>
-          </Row>
-          {/*<Row>*/}
-          {/*<Col span={6} className="formItem">社保缴纳组织：</Col>*/}
-          {/*<Col span={6} className="formItem">*/}
-          {/*    <Select defaultValue={data && data.paymentOrganization} */}
-          {/*        notFoundContent="暂无数据" value={data && data.paymentOrganization} style={{ width: "100%" }} onChange={(value) => this.handleFormChange({paymentOrganization: value})}>*/}
-          {/*        {*/}
-          {/*            items && items[0].items &&items[0].items[1] && items[0].items[1].options.map(item => (*/}
-          {/*                <Option value={item.key}>{item.showname}</Option>*/}
-          {/*            ))*/}
-          {/*        }*/}
-          {/*    </Select>*/}
-          {/*    */}
-          {/*</Col>*/}
-          {/*</Row>*/}
-
-        </GroupCard>
+        <WeaSearchGroup
+          title="其他福利基础信息"
+          customComponent={<SocialTitle keyname="nonPayment" value={nonPayment.toString()}
+                                        onChange={this.handleFormChange}/>}
+          items={otherItems} col={2} showGroup needTigger={false}/>
         {
-          data.otherSchemeId && paymentItems && paymentItems.map(group => (
-            <div>
-              {
-                group.items && group.items.length > 0 && <GroupCard title={group.title}>
-                  <Row>
-                    {
-                      group.items && group.items.map(item => (
-                        <Col span={12}>
-                          <Row>
-                            <Col span={12} className="formItem">{item.label}：</Col>
-                            <Col span={12} className="formItem">
-                              <WeaInputNumber
-                                min={0}
-                                precision={2}
-                                value={(paymentData && paymentData[item.domkey[0]]) ? Number(paymentData[item.domkey[0]]) : 0}
-                                onChange={(value) => {
-                                  this.handlePaymentChange({ [item.domkey[0]]: value ? String(value) : '0' });
-                                }}
-                              />
-                            </Col>
-                          </Row>
-                        </Col>
-                      ))
-                    }
-                  </Row>
-                </GroupCard>
-              }
-            </div>
-
-          ))
+          !_.isEmpty(otherSchemeId) && !_.isEmpty(toJS(paymentItems)) && _.map(toJS(paymentItems), item => {
+            const { title, items } = item;
+            return <WeaSearchGroup
+              items={_.map(items, child => ({
+                com: SocialInputNumber({
+                  key: child["domkey"][0],
+                  label: child.label,
+                  value: !_.isNil(paymentData[child["domkey"][0]]) ? paymentData[child["domkey"][0]].toString() : "",
+                  onChange: this.handlePaymentChange
+                })
+              }))}
+              customComponent={<ConsistentWelfare/>}
+              title={title} col={2} showGroup
+            />;
+          })
         }
       </div>
     );

pc4mobx/hrmSalary/pages/socialSecurityBenefits/archives/socialSecurityForm.js

@@ -23,8 +23,8 @@ export default class SocialSecurityForm extends React.Component {
     let form = { ...socialSecurityForm };
     form.data = request;
     setSocialSecurityForm(form);
-    key === "socialName" && this.handleFetchPaymentForm(value);
-    key === "socialName" && onChangeRecordSchemeId(value);
+    key === "socialSchemeId" && this.handleFetchPaymentForm(value);
+    key === "socialSchemeId" && onChangeRecordSchemeId(value);
   };
 
   handleFetchPaymentForm = (value) => {
@@ -50,7 +50,7 @@ export default class SocialSecurityForm extends React.Component {
     const paymentItems = socialSecurityPaymentForm.items;
     const {
       nonPayment = "", schemeAccount = "", socialStartTime = "", socialEndTime = "",
-      socialName = ""
+      socialSchemeId = ""
     } = socialData || {};
     const socialItems = !_.isNil(toJS(items)) ? [
       ..._.map(_.filter(toJS(items)[0].items, it => it.domkey[0] !== "paymentOrganization"),
@@ -67,6 +67,7 @@ export default class SocialSecurityForm extends React.Component {
         com: SocialDatePicker({
           key: "socialStartTime",
           label: "社保起始缴纳月",
+          viewAttr: socialSchemeId ? 3 : 2,
           value: socialStartTime,
           onChange: this.handleFormChange
         })
@@ -96,7 +97,7 @@ export default class SocialSecurityForm extends React.Component {
                                         onChange={this.handleFormChange}/>}
           items={socialItems} col={2} showGroup needTigger={false}/>
         {
-          !_.isEmpty(socialName) && !_.isEmpty(toJS(paymentItems)) && _.map(toJS(paymentItems), item => {
+          !_.isEmpty(socialSchemeId) && !_.isEmpty(toJS(paymentItems)) && _.map(toJS(paymentItems), item => {
             const { title, items } = item;
             return <WeaSearchGroup
               items={_.map(items, child => ({
@@ -116,7 +117,7 @@ export default class SocialSecurityForm extends React.Component {
     );
   }
 }
-const ConsistentWelfare = (props) => {
+export const ConsistentWelfare = (props) => {
   const { value, onChange, key } = props;
   return <div className="welfareBaseWrapper">
     <span className="title">各项福利基数一致：</span>
@@ -127,17 +128,17 @@ const ConsistentWelfare = (props) => {
     />
   </div>;
 };
-const SocialTitle = (props) => {
+export const SocialTitle = (props) => {
   const { value, onChange, keyname: key } = props;
   return <WeaCheckbox value={value} content="暂不缴纳" onChange={(val) => onChange({ key, value: val })}/>;
 };
-const SocialSelect = (props) => {
+export const SocialSelect = (props) => {
   const { key, value, onChange, options, label, labelColSpan = 12, wrapperColSpan = 12 } = props;
   return <WeaFormItem label={label} labelCol={{ span: labelColSpan }} wrapperCol={{ span: wrapperColSpan }}>
     <WeaSelect value={value} options={options} onChange={(val) => onChange({ key, value: val })}/>
   </WeaFormItem>;
 };
-const SocialEditInput = (props) => {
+export const SocialEditInput = (props) => {
   const { key, value, onChange, label, labelColSpan = 12, wrapperColSpan = 12 } = props;
   return (
     <WeaFormItem label={label} labelCol={{ span: labelColSpan }} wrapperCol={{ span: wrapperColSpan }}>
@@ -145,7 +146,7 @@ const SocialEditInput = (props) => {
     </WeaFormItem>
   );
 };
-const SocialInputNumber = (props) => {
+export const SocialInputNumber = (props) => {
   const { key, value, onChange, label, labelColSpan = 12, wrapperColSpan = 12 } = props;
   return (
     <WeaFormItem label={label} labelCol={{ span: labelColSpan }} wrapperCol={{ span: wrapperColSpan }}>
@@ -153,7 +154,7 @@ const SocialInputNumber = (props) => {
     </WeaFormItem>
   );
 };
-const SocialDatePicker = (props) => {
+export const SocialDatePicker = (props) => {
   const {
     key,
     value,

pc4mobx/hrmSalary/stores/archives.js

@@ -205,13 +205,13 @@ export class ArchivesStore {
   save = (welfareType) => {
     let baseForm = "";
     let paymentForm = "";
-    if (welfareType == "SOCIAL_SECURITY") {
+    if (welfareType === "SOCIAL_SECURITY") {
       baseForm = JSON.stringify(this.socialSecurityForm.data);
-      paymentForm = this.socialSecurityForm.data.socialName ? JSON.stringify(this.socialSecurityPaymentForm.data) : "";
-    } else if (welfareType == "ACCUMULATION_FUND") {
+      paymentForm = this.socialSecurityForm.data.socialSchemeId ? JSON.stringify(this.socialSecurityPaymentForm.data) : "";
+    } else if (welfareType === "ACCUMULATION_FUND") {
       baseForm = JSON.stringify(this.accumulationFundForm.data);
       paymentForm = this.accumulationFundForm.data.fundSchemeId ? JSON.stringify(this.accumulationFundPaymentForm.data) : "";
-    } else if (welfareType == "OTHER") {
+    } else if (welfareType === "OTHER") {
       baseForm = JSON.stringify(this.otherForm.data);
       paymentForm = this.otherForm.data.otherSchemeId ? JSON.stringify(this.otherPaymentForm.data) : "";
     }