From 7c8dabaf8d0a8ab6ae9505c64d51656350557b02 Mon Sep 17 00:00:00 2001
From: MustangDeng <670124965@qq.com>
Date: Tue, 22 Mar 2022 16:53:39 +0800
Subject: [PATCH] =?UTF-8?q?=E8=87=AA=E5=AE=9A=E4=B9=89=E7=A6=8F=E5=88=A9?=
 =?UTF-8?q?=E8=A1=A8=E5=8D=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../hrmSalary/components/customForm/index.js  | 49 +++++++++++++++++++
 .../programme/customNewModal.js               | 16 ++++++
 .../socialSecurityBenefits/programme/index.js | 33 +++++++++++--
 pc4mobx/hrmSalary/stores/programme.js         | 38 +++++++++-----
 pc4mobx/hrmSalary/util/index.js               | 44 +++++++++++++++++
 5 files changed, 165 insertions(+), 15 deletions(-)
 create mode 100644 pc4mobx/hrmSalary/components/customForm/index.js
 create mode 100644 pc4mobx/hrmSalary/pages/socialSecurityBenefits/programme/customNewModal.js

diff --git a/pc4mobx/hrmSalary/components/customForm/index.js b/pc4mobx/hrmSalary/components/customForm/index.js
new file mode 100644
index 00000000..534e8e6a
--- /dev/null
+++ b/pc4mobx/hrmSalary/components/customForm/index.js
@@ -0,0 +1,49 @@
+import React from 'react'
+import { Checkbox, Radio, Row, Col } from "antd"
+import { WeaInput } from "ecCom"
+const CheckboxGroup = Checkbox.Group;
+
+export default class CustomForm extends React.Component {
+    
+    render() {
+        return (
+            <div style={{padding: "20px"}}>
+                {
+                    this.props.condition.map(item => {
+                        return (
+                            <Row style={{lineHeight: "40px"}}>
+                                <Col span={6}>
+                                    {item.label} : 
+                                </Col>
+                                <Col span={18}>
+                                    {
+                                        item.conditionType == "INPUT" &&
+                                        <WeaInput value={item.value} />
+                                    }
+
+                                    {
+                                        item.conditionType == "RADIO" && item.options &&
+                                        <Radio.Group>
+                                            {
+                                                item.options.map(o => (
+                                                    <Radio value={o.key}>{o.showname}</Radio>
+                                                ))
+                                            }
+                                        </Radio.Group>
+                                    }
+
+                                    {
+                                        item.conditionType == "CHECKBOX" && 
+                                        item.options && 
+                                        <CheckboxGroup options={item.options.map(o => ({label: o.showname, value: o.key}))} />
+                                    }
+                                </Col>
+                            </Row>
+                        )
+                    })
+                }
+                
+            </div>
+        )
+    }
+}
\ No newline at end of file
diff --git a/pc4mobx/hrmSalary/pages/socialSecurityBenefits/programme/customNewModal.js b/pc4mobx/hrmSalary/pages/socialSecurityBenefits/programme/customNewModal.js
new file mode 100644
index 00000000..0ced8ca3
--- /dev/null
+++ b/pc4mobx/hrmSalary/pages/socialSecurityBenefits/programme/customNewModal.js
@@ -0,0 +1,16 @@
+import React from 'react'
+import { getCustomSearchs, getSearchs } from '../../../util';
+import { Modal } from  'antd'
+import { observable, action, toJS } from 'mobx';
+import CustomForm from '../../../components/customForm'
+
+export default class CustomNewModal extends React.Component {
+    render() {
+        return (
+            <Modal visible={this.props.visible} onCancel={() => {this.props.onCancel()}} title="新建自定义福利">
+                {/* {getCustomSearchs(this.props.form, toJS(this.props.condition), 1)} */}
+                <CustomForm condition={this.props.condition}/>
+            </Modal>
+        )
+    }
+}
\ No newline at end of file
diff --git a/pc4mobx/hrmSalary/pages/socialSecurityBenefits/programme/index.js b/pc4mobx/hrmSalary/pages/socialSecurityBenefits/programme/index.js
index fa130d84..3461ee76 100644
--- a/pc4mobx/hrmSalary/pages/socialSecurityBenefits/programme/index.js
+++ b/pc4mobx/hrmSalary/pages/socialSecurityBenefits/programme/index.js
@@ -5,6 +5,7 @@ import { toJS } from 'mobx';
 import { Button, Table, DatePicker, Row, Col } from 'antd';
 
 import { WeaTop, WeaTab, WeaRightMenu, WeaRangePicker, WeaInputSearch, WeaSlideModal, WeaSelect } from 'ecCom';
+
 import { WeaTableNew } from "comsMobx"
 
 import "./index.less";
@@ -16,6 +17,7 @@ import ContentWrapper from '../../../components/contentWrapper';
 import SlideModalTitle from '../../../components/slideModalTitle';
 import TipLabel from '../../../components/TipLabel'
 import DefaultSlideForm from './defaultSlideForm'
+import CustomNewModal from './customNewModal'
 
 
 import {
@@ -42,6 +44,7 @@ export default class Programme extends React.Component {
       currentOperate: "add",
       copyModalValue: "",
       copyId: "",
+      customNewVisible: false
     }
   }
 
@@ -102,7 +105,8 @@ export default class Programme extends React.Component {
   render() {
     const { programmeStore } = this.props;
     const { loading, hasRight, form, condition, tableStore, showSearchAd, getTableDatas, doSearch, setShowSearchAd } = programmeStore;
-    const { selectedKey, setSelectedKey, getCustomCategoryList, customTableStore, customSelectkey, setCustomSelectkey, requestParams, setRequestParams } = programmeStore;
+    const { selectedKey, setSelectedKey, getCustomCategoryList, customTableStore, 
+      customSelectkey, setCustomSelectkey, requestParams, setRequestParams, formCondition } = programmeStore;
     if (!hasRight && !loading) { // 无权限处理
       return renderNoright();
     }
@@ -166,9 +170,23 @@ export default class Programme extends React.Component {
       this.setState({ slideVisiable: true, currentOperate: "add" })
     }
 
+    const handleCustomNewClick = () => {
+      const { programmeStore : { getCustomForm, getCumCustomForm }} = this.props;
+      getCustomForm()
+      this.setState({ customNewVisible: true})
+
+    }
+
     const renderSearchOperationItem = () => {
       return <div>
-        <Button type="primary" style={{ marginRight: '10px' }} onClick={() => { handleNewClick() }}>新建</Button>
+        <Button type="primary" style={{ marginRight: '10px' }} onClick={() => { 
+          if(selectedKey == "custom") {
+            handleCustomNewClick()
+          } else {
+            handleNewClick()
+          }
+          
+         }}>新建</Button>
       
         {
           selectedKey == "custom" &&  <WeaSelect
@@ -244,10 +262,10 @@ export default class Programme extends React.Component {
                 renderSearchOperationItem()
               }
               onChange={(v) => {
+                setSelectedKey(v)
                 if(v == "custom") { // 自定义福利
                   getCustomCategoryList()
                 } else {
-                  setSelectedKey(v)
                   getTableDatas(v)
                 }
               }}
@@ -309,6 +327,15 @@ export default class Programme extends React.Component {
             }
             />
           }
+
+          {
+            this.state.customNewVisible && <CustomNewModal 
+              visible={this.state.customNewVisible}
+              condition={formCondition}
+              form={form}
+              onCancel={() => {this.setState({customNewVisible: false})}}
+            />
+          }
       </div>
     )
   }
diff --git a/pc4mobx/hrmSalary/stores/programme.js b/pc4mobx/hrmSalary/stores/programme.js
index 1cd1f86f..1695f80b 100644
--- a/pc4mobx/hrmSalary/stores/programme.js
+++ b/pc4mobx/hrmSalary/stores/programme.js
@@ -3,12 +3,12 @@ import { message } from 'antd';
 import { WeaForm, WeaTableNew } from 'comsMobx';
 
 import * as API from '../apis/welfareScheme'; // 引入API接口文件
+import * as CumAPI from '../apis/cumDeduct'
 
 const { TableStore } = WeaTableNew;
 
 export class ProgrammeStore {
   @observable tableStore = new TableStore(); // new table
-  @observable form = new WeaForm(); // nrew 一个form
   @observable condition = []; // 存储后台得到的form数据
   @observable hasRight = true; // 判断用户是有权限查看当前页面： 没有权限渲染无权限页面，有权限渲染数据
   @observable showSearchAd = false; // 高级搜索面板显示
@@ -22,6 +22,8 @@ export class ProgrammeStore {
     remarks: "",
     paymentArea: "1"
   }
+  @observable form = new WeaForm(); 
+  @observable formCondition = []; // 存储后台得到的form数据
 
   @action
   setRequestParams = requestParams => this.requestParams = requestParams;
@@ -46,17 +48,17 @@ export class ProgrammeStore {
   }
 
   // 获得高级搜索表单数据
-  @action
-  getCondition = () => {
-    API.getForm().then(action(res => {
-      if (res.status) { // 接口请求成功/失败处理
-        this.condition = res.condition;
-        this.form.initFormFields(res.condition); // 渲染高级搜索form表单
-      } else {
-        message.error(res.msg || '接口调用失败！')
-      }
-    }));
-  }
+  // @action
+  // getCondition = () => {
+  //   API.getForm().then(action(res => {
+  //     if (res.status) { // 接口请求成功/失败处理
+  //       this.condition = res.condition;
+  //       this.form.initFormFields(res.condition); // 渲染高级搜索form表单
+  //     } else {
+  //       message.error(res.msg || '接口调用失败！')
+  //     }
+  //   }));
+  // }
 
   // 渲染table数据
   @action
@@ -147,4 +149,16 @@ export class ProgrammeStore {
     })
   }
 
+  @action getCustomForm = (params) => {
+    API.getCustomCategoryForm(params).then(res => {
+      if(res.status) {
+        let condition = res.data.item;
+        let items = Object.keys(condition).map(item => {
+          return condition[item]
+        })
+        let fieldCondtion = items
+        this.formCondition = fieldCondtion;
+      }
+    })
+  }
 }
\ No newline at end of file
diff --git a/pc4mobx/hrmSalary/util/index.js b/pc4mobx/hrmSalary/util/index.js
index 6aef0a40..f1a8f4c9 100644
--- a/pc4mobx/hrmSalary/util/index.js
+++ b/pc4mobx/hrmSalary/util/index.js
@@ -3,11 +3,55 @@ import { WeaSwitch } from 'comsMobx';
 import { WeaLocaleProvider, WeaAlertPage, WeaSearchGroup, WeaFormItem } from 'ecCom';
 const getLabel = WeaLocaleProvider.getLabel;
 
+// 渲染form表单: 一般对form的渲染都统一使用该方法
+export const getCustomSearchs = (form, condition, col, isCenter) => {
+  const { isFormInit } = form;
+  const formParams = form.getFormParams();
+  let items = [];
+  let group = [];
+  isFormInit && condition && 
+  condition.map(c =>{
+    c.items.map(fields => {
+      items.push({
+        com:(
+          <WeaFormItem
+            label={`${fields.label}`} // label 标签的文本
+            labelCol={{span: `${fields.labelcol}`}} // label标签占一行比例
+            wrapperCol={{span: `${fields.fieldcol}`}} // 右侧控件占一行比例
+            error={form.getError(fields)} // 错误提示: 处理表单中有必填项,保存的校验
+            tipPosition="bottom" // 错误提示的显示位置: top/bottom
+          >
+            <WeaSwitch
+              fieldConfig={fields}
+              form={form}
+              formParams={formParams}
+            />
+          </WeaFormItem>),
+        colSpan:1,
+      })
+    });
+  });
+
+  if(items.length > 0) {
+    group.push(
+      <WeaSearchGroup
+        col={col || 1} // 高级搜索列布局列数
+        needTigger={true} // 是否开启收缩
+        title={''} // 高级搜索标题
+        showGroup={true} // 是否开启面板
+        items={items} // 条目数组数据
+        center={isCenter || false} // 内容是否居中：一般弹框需要
+      />)
+    return group;
+  }
+}
+
 // 渲染form表单: 一般对form的渲染都统一使用该方法
 export const getSearchs = (form, condition, col, isCenter) => {
   const { isFormInit } = form;
   const formParams = form.getFormParams();
   let group = [];
+  alert("isFormInit: " + isFormInit)
   isFormInit && condition && condition.map(c =>{
     let items = [];
     c.items.map(fields => {