From 2fa29571295210f731a450b8efacab6f11fcddf4 Mon Sep 17 00:00:00 2001
From: MustangDeng <670124965@qq.com>
Date: Thu, 24 Mar 2022 16:58:57 +0800
Subject: [PATCH] =?UTF-8?q?=E8=96=AA=E8=B5=84=E9=A1=B9=E7=9B=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 pc4mobx/hrmSalary/apis/ledger.js              |  18 +-
 pc4mobx/hrmSalary/pages/ledger/index.js       |  59 ++++--
 pc4mobx/hrmSalary/pages/ledger/options.js     | 184 ++++++++++++++++++
 .../hrmSalary/pages/ledger/slideBaseForm.js   | 121 +++++-------
 pc4mobx/hrmSalary/stores/ledger.js            |  25 +++
 5 files changed, 313 insertions(+), 94 deletions(-)
 create mode 100644 pc4mobx/hrmSalary/pages/ledger/options.js

diff --git a/pc4mobx/hrmSalary/apis/ledger.js b/pc4mobx/hrmSalary/apis/ledger.js
index 6e293bc3..b76c799b 100644
--- a/pc4mobx/hrmSalary/apis/ledger.js
+++ b/pc4mobx/hrmSalary/apis/ledger.js
@@ -39,7 +39,14 @@ export const duplicateLedger = params => {
 
 //删除薪资帐套
 export const deleteLedger = params => {
-    return WeaTools.callApi('/api/bs/hrmsalary/salarysob/delete', 'POST', params);
+    return fetch('/api/bs/hrmsalary/salarysob/delete', {
+        method: 'POST',
+        mode: 'cors',
+        headers: {
+            'Content-Type': 'application/json'
+        }, 
+        body: JSON.stringify(params)
+    }).then(res => res.json())
 }
 
 //薪资帐套基本信息表单
@@ -49,7 +56,14 @@ export const getLedgerBasicForm = params => {
 
 //保存薪资帐套基本信息
 export const saveLedgerBasic = params => {
-    return WeaTools.callApi('/api/bs/hrmsalary/salarysob/basic/save', 'POST', params);
+    return fetch('/api/bs/hrmsalary/salarysob/basic/save', {
+        method: 'POST',
+        mode: 'cors',
+        headers: {
+            'Content-Type': 'application/json'
+        }, 
+        body: JSON.stringify(params)
+    }).then(res => res.json())
 }
 
 //薪资帐套人员范围（包含）列表
diff --git a/pc4mobx/hrmSalary/pages/ledger/index.js b/pc4mobx/hrmSalary/pages/ledger/index.js
index a449d3fb..96384407 100644
--- a/pc4mobx/hrmSalary/pages/ledger/index.js
+++ b/pc4mobx/hrmSalary/pages/ledger/index.js
@@ -35,20 +35,20 @@ export default class Ledger extends React.Component {
       stepSlideVisible: false,
       editSlideVisible: false,
       copyFormVisible: false,
-      currentStep: 4,
+      currentStep: 0,
       selectedTab: 0,
       currentReocrd: {},
-      columns: columns.map(item => {
-        if(item.dataIndex == "cz") {
-          item.render = () => <div>
-            <a style={{marginRight: "10px"}} onClick={() => this.refereUser()}>关联人员</a>
-            <a style={{marginRight: "10px"}} >删除</a>
-            <a style={{marginRight: "10px"}} onClick={() => this.onEdit()}>编辑</a>
-            <a style={{marginRight: "10px"}} onClick={() => this.setState({copyFormVisible: true})}>复制</a>
-            <a style={{marginRight: "10px"}}>操作日志</a>
-        </div>
-        }
-      })
+      step1Request: {
+        name: "",
+        taxableItems: "1",
+        salaryCycleType: "1",
+        salaryCycleFromDay: "1",
+        taxCycleType: "1",
+        attendCycleType: "1",
+        attendCycleFromDay: "1",
+        socialSecurityCycleType: "1",
+        description: ""
+      }
     }
   }
 
@@ -71,6 +71,20 @@ export default class Ledger extends React.Component {
   }
 
 
+  handleItemStatusChange(value, record) {
+    const { ledgerStore: { changeLedgerStatus }} = this.props;
+    changeLedgerStatus(record.id, value ? 0 : 1);
+  }
+
+
+  handleItemClick(record) {
+    this.setState({
+      editSlideVisible: true,
+      currentReocrd: record
+    })
+
+  }
+
   // 增加编辑功能，重写columns绑定事件
   getColumns = (columns) => {
     let newColumns = '';
@@ -79,8 +93,10 @@ export default class Ledger extends React.Component {
       newColumn.render = (text, record, index) => { //前端元素转义
         let valueSpan = record[newColumn.dataIndex + "span"] !== undefined ? record[newColumn.dataIndex + "span"] : record[newColumn.dataIndex];
         switch(newColumn.dataIndex) {
+          case 'name':
+            return <a onClick={() => {this.handleItemClick(record)}}>{text}</a>
           case "disable":
-            return <Switch checked={text == 0}/>
+            return <Switch checked={text == 0} onChange={(value) => {this.handleItemStatusChange(value, record)}}/>
           default:
             return <div dangerouslySetInnerHTML={{ __html: valueSpan }} />
         }
@@ -92,6 +108,7 @@ export default class Ledger extends React.Component {
 
 
   onOperatesClick = (record, index, operate, flag) => {
+    const { ledgerStore: { deleteLedger }} = this.props;
     switch(operate.index.toString()){
       case '1': // 复制
         this.setState({
@@ -99,6 +116,9 @@ export default class Ledger extends React.Component {
           currentReocrd: record
         })
         break;
+      case "4": // 删除
+        deleteLedger([record.id])
+        break;
     }
   };
 
@@ -165,8 +185,13 @@ export default class Ledger extends React.Component {
       "校验规则",
     ]
 
+    const handleStep1Save = () => {
+      const { ledgerStore: {saveLedgerBasic} } = this.props;
+      saveLedgerBasic(this.state.step1Request)
+      nextStep()
+    }
+
     return (
-      
       <div className="mySalaryBenefitsWrapper">
         <WeaRightMenu
           datas={rightMenu} // 右键菜单
@@ -205,7 +230,7 @@ export default class Ledger extends React.Component {
               customOperate = {
                 <div style={{display: "inline-block"}}>
                     {
-                        currentStep == 0 && <Button type="primary" onClick={() => {nextStep()}}>保存并进入下一步</Button>
+                        currentStep == 0 && <Button type="primary" onClick={() => {handleStep1Save()}}>保存并进入下一步</Button>
                     }
                     {
                         currentStep == 1 && <div style={{display: "inline-block"}}>
@@ -234,7 +259,7 @@ export default class Ledger extends React.Component {
               content={
                 <div>
                   {
-                    currentStep == 0 && <SlideBaseForm />
+                    currentStep == 0 && <SlideBaseForm record={this.state.currentReocrd} onChange={(value) => {this.setState({step1Request: value})}}/>
                   }
                   {
                     currentStep == 1 && <SlideRefereUser />
@@ -276,7 +301,7 @@ export default class Ledger extends React.Component {
                 }
                 content={<div>
                   {
-                    selectedTab == 0 && <SlideBaseForm />
+                    selectedTab == 0 && <SlideBaseForm record={this.state.currentReocrd} onChange={(value) => {this.setState({step1Request: value})}}/>
                   }
                   {
                     selectedTab == 1 && <SlideRefereUser />
diff --git a/pc4mobx/hrmSalary/pages/ledger/options.js b/pc4mobx/hrmSalary/pages/ledger/options.js
new file mode 100644
index 00000000..4d1beb6f
--- /dev/null
+++ b/pc4mobx/hrmSalary/pages/ledger/options.js
@@ -0,0 +1,184 @@
+// 日期options
+export const daysOptions = [
+    {
+        key: '1',
+        selected: false,
+        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号'
+    }
+];
+
+
+
+// 薪资周期
+export const cycleTypeOption = [
+    {
+        key: '1',
+        selected: false,
+        showname: '上上月'
+    },
+    {
+        key: '2',
+        selected: false,
+        showname: '上月'
+    },
+    {
+        key: '3',
+        selected: false,
+        showname: '本月'
+    },
+    {
+        key: '4',
+        selected: false,
+        showname: '下月'
+    },
+]
diff --git a/pc4mobx/hrmSalary/pages/ledger/slideBaseForm.js b/pc4mobx/hrmSalary/pages/ledger/slideBaseForm.js
index ba617cdc..4c940646 100644
--- a/pc4mobx/hrmSalary/pages/ledger/slideBaseForm.js
+++ b/pc4mobx/hrmSalary/pages/ledger/slideBaseForm.js
@@ -1,28 +1,43 @@
 import React from 'react'
 import { Row, Col } from 'antd'
-import { WeaSelect, WeaTextarea, WeaInput } from "ecCom"
+import { WeaSelect, WeaTextarea, WeaInput, WeaCheckbox } from "ecCom"
 import "./index.less"
 import TipLabel from '../../components/TipLabel'
-
-
-const options = [
-    {
-        key: "1",
-        selected: true,
-        showname: "111"
-    },{
-        key: "2",
-        selected: false,
-        showname: "222"
-    },{
-        key: "3",
-        selected: false,
-        showname: "333"
-    }
-];
+import { daysOptions, cycleTypeOption } from './options'
 
 export default class SlideBaseForm extends React.Component {
+    constructor(props) {
+        super(props)
+        this.state = {
+            name: "",
+            taxableItems: 1,
+            request: {
+                name: "",
+                taxableItems: "1",
+                salaryCycleType: "1",
+                salaryCycleFromDay: "1",
+                taxCycleType: "1",
+                attendCycleType: "1",
+                attendCycleFromDay: "1",
+                socialSecurityCycleType: "1",
+                description: ""
+            }
+
+        }
+    }
+
+    handleChange(params) {
+        let request = {...this.props.record, ...params}
+        this.setState({request})
+        this.props.onChange(request)
+    }
+
+
     render() {
+        const { record } = this.props;
+        const { name, taxableItems, salaryCycleType, salaryCycleFromDay,
+        taxCycleType, attendCycleType, attendCycleFromDay, socialSecurityCycleType,
+        description} = record
         return (
             <div className="slideBaseForm">
                 <Row>
@@ -31,7 +46,7 @@ export default class SlideBaseForm extends React.Component {
                             <Row className="formItem">
                                 <Col span={6}>账套名称</Col>
                                 <Col span={18}>
-                                    <WeaInput style={{width: "190px"}}/>
+                                    <WeaInput style={{width: "190px"}} value={name} onChange={(value) => {this.handleChange({name: value})}}/>
                                 </Col>
                             </Row>
                             <Row className="formItem">
@@ -40,93 +55,49 @@ export default class SlideBaseForm extends React.Component {
                                     <WeaSelect options={[{
                                         key: "1",
                                         selected: true,
-                                        showname: "工资薪金"
-                                    }]} style={{width: "190px"}}/>
+                                        showname: "正常工资薪金所得"
+                                    }]} style={{width: "190px"}} value={taxableItems} onChange={(value) => {this.handleChange({taxableItems: value})}}/>
                                 </Col>
                             </Row>
                             <Row className="formItem">
                                 <Col span={6}>薪资周期</Col>
                                 <Col span={18}>
-                                    <WeaSelect options={[
-                                        {
-                                            key: "1",
-                                            selected: true,
-                                            showname: "本月"
-                                        }]} style={{width: "90px"}}/>
-                                    <WeaSelect options={[
-                                        {
-                                            key: "1",
-                                            selected: true,
-                                            showname: "1号"
-                                        }]} style={{width: "90px", marginLeft: '10px'}}/>
+                                    <WeaSelect options={cycleTypeOption} style={{width: "90px"}} value={salaryCycleType} onChange={(value) => {this.handleChange({salaryCycleType: value})}}/>
+                                    <WeaSelect options={daysOptions} style={{width: "90px", marginLeft: '10px'}} value={salaryCycleFromDay} onChange={(value) => {this.handleChange({salaryCycleFromDay: value})}}/>
                                     <span style={{marginLeft: "10px"}}>至本月最后一天</span>
                                 </Col>
                             </Row>
                             <Row className="formItem">
                                 <Col span={6}>税款所属期</Col>
                                 <Col span={18}>
-                                    <WeaSelect options={[
-                                        {
-                                            key: "1",
-                                            selected: true,
-                                            showname: "下月"
-                                        }]} style={{width: "90px"}}/>
+                                    <WeaSelect options={cycleTypeOption} style={{width: "90px"}} value={taxCycleType} onChange={(value) => {this.handleChange({taxCycleType: value})}}/>
                                 </Col>
                             </Row>
                             <Row className="formItem">
                                 <Col span={6}>考勤周期</Col>
                                 <Col span={18}>
-                                    <WeaSelect options={[
-                                        {
-                                            key: "1",
-                                            selected: true,
-                                            showname: "本月"
-                                        }]} style={{width: "90px"}}/>
-                                    <WeaSelect options={[{
-                                            key: "1",
-                                            selected: true,
-                                            showname: "1号"
-                                        }]} style={{width: "90px", marginLeft: "10px"}}/>
+                                    <WeaSelect options={cycleTypeOption} style={{width: "90px"}} value={attendCycleType} onChange={(value) => {this.handleChange({attendCycleType: value})}}/>
+                                    <WeaSelect options={daysOptions} style={{width: "90px", marginLeft: "10px"}} value={attendCycleFromDay} onChange={(value) => {this.handleChange({attendCycleFromDay: value})}}/>
                                     <span style={{marginLeft: "10px"}}>至本月最后一天</span>
                                 </Col>
                             </Row>
                             <Row className="formItem">
                                 <Col span={6}>福利台账月份</Col>
                                 <Col span={18}>
-                                    <WeaSelect options={[
-                                        {
-                                            key: "1",
-                                            selected: true,
-                                            showname: "本月"
-                                        }]} style={{width: "90px"}}/>
+                                    <WeaSelect options={cycleTypeOption} style={{width: "90px"}} value={socialSecurityCycleType} onChange={(value) => {this.handleChange({socialSecurityCycleType: value})}}/>
                                 </Col>
                             </Row>
+
                             <Row className="formItem">
-                                <Col span={6}>福利台账月份</Col>
+                                <Col span={6}>核算人员范围</Col>
                                 <Col span={18}>
-                                    <WeaSelect options={[
-                                        {
-                                            key: "1",
-                                            selected: true,
-                                            showname: "本月"
-                                        }]} style={{width: "90px"}}/>
-                                </Col>
-                            </Row>
-                            <Row className="formItem">
-                                <Col span={6}>异动人员核算规则</Col>
-                                <Col span={18}>
-                                    <WeaSelect options={[
-                                        {
-                                            key: "1",
-                                            selected: true,
-                                            showname: "核算方案"
-                                        }]} style={{width: "190px"}}/>
+                                    <WeaCheckbox value={true} viewAttr={1} content="【入职日期≤薪资周期止】且【离职日期≥薪资周期起】" />
                                 </Col>
                             </Row>
                             <Row className="formItem">
                                 <Col span={6}>备注</Col>
                                 <Col span={18}>
-                                <WeaTextarea style={{width: "190px"}}/>
+                                <WeaTextarea style={{width: "190px"}} value={description} onChange={(value) => {this.handleChange({description: value})}} />
                                 </Col>
                             </Row>
                         </div>
diff --git a/pc4mobx/hrmSalary/stores/ledger.js b/pc4mobx/hrmSalary/stores/ledger.js
index 7ce5a070..d435fd92 100644
--- a/pc4mobx/hrmSalary/stores/ledger.js
+++ b/pc4mobx/hrmSalary/stores/ledger.js
@@ -75,6 +75,7 @@ export class LedgerStore {
   changeLedgerStatus = (id, disable) => {
     API.changeLedgerStatus({id, disable}).then(res => {
       if(res.status) {
+        this.getTableDatas({});
         message.success("修改成功")
       } else {
         message.error(res.errormsg || "修改失败")
@@ -82,5 +83,29 @@ export class LedgerStore {
     })
   }
 
+  //保存薪资帐套基本信息
+  @action
+  saveLedgerBasic = (params) => {
+    API.saveLedgerBasic(params).then(res => {
+      if(res.status) {
+        message.success("保存成功")
+      } else {
+        message.error(res.errormsg || "保存失败")
+      }
+    })
+  }
+
+  //删除薪资帐套
+  @action
+  deleteLedger = (params) => {
+    API.deleteLedger(params).then(res => {
+      if(res.status) {
+        message.success("删除成功")
+        this.getTableDatas({});
+      } else {
+        message.error(res.errormsg || "删除失败")
+      }
+    })
+  }
 
 }
\ No newline at end of file