账套

pc4mobx/hrmSalary/apis/ledger.js

@@ -68,12 +68,26 @@ export const saveLedgerBasic = params => {
 
 //薪资帐套人员范围（包含）列表
 export const getLedgerPersonRangeInclude = params => {
-    return WeaTools.callApi('/api/bs/hrmsalary/salarysob/range/listInclude', 'POST', params);
+    return fetch('/api/bs/hrmsalary/salarysob/range/listInclude', {
+        method: 'POST',
+        mode: 'cors',
+        headers: {
+            'Content-Type': 'application/json'
+        }, 
+        body: JSON.stringify(params)
+    }).then(res => res.json())
 }
 
 //薪资帐套人员范围（排除）列表
 export const getLedgerPersonRangeExclude = params => {
-    return WeaTools.callApi('/api/bs/hrmsalary/salarysob/range/listExclude', 'POST', params);
+    return fetch('/api/bs/hrmsalary/salarysob/range/listExclude', {
+        method: 'POST',
+        mode: 'cors',
+        headers: {
+            'Content-Type': 'application/json'
+        }, 
+        body: JSON.stringify(params)
+    }).then(res => res.json())
 }
 
 //薪资帐套人员范围表单
@@ -83,12 +97,26 @@ export const getLedgerPersonRangeForm = params => {
 
 //保存薪资帐套人员范围
 export const saveLedgerPersonRange = params => {
-    return WeaTools.callApi('/api/bs/hrmsalary/salarysob/range/save', 'POST', params);
+    return fetch('/api/bs/hrmsalary/salarysob/range/save', {
+        method: 'POST',
+        mode: 'cors',
+        headers: {
+            'Content-Type': 'application/json'
+        }, 
+        body: JSON.stringify(params)
+    }).then(res => res.json())
 }
 
 //删除薪资帐套人员范围
 export const deleteLedgerPersonRange = params => {
-    return WeaTools.callApi('/api/bs/hrmsalary/salarysob/range/delete', 'POST', params);
+    return fetch('/api/bs/hrmsalary/salarysob/range/delete', {
+        method: 'POST',
+        mode: 'cors',
+        headers: {
+            'Content-Type': 'application/json'
+        }, 
+        body: JSON.stringify(params)
+    }).then(res => res.json())
 }
 
 //薪资帐套项目分组的详情

pc4mobx/hrmSalary/pages/ledger/addUserModal.js

@@ -0,0 +1,120 @@
+import React from 'react'
+import { Modal, Button, Row, Col, Radio } from 'antd'
+import { WeaSelect, WeaBrowser } from "ecCom"
+import { inject, observer } from 'mobx-react';
+
+const objectOptions = [
+    {
+        key: "EMPLOYEE",
+        showname: "人员",
+        selected: false
+    },
+    {
+        key: "DEPT",
+        showname: "部门",
+        selected: false
+    },
+    {
+        key: "POSITION",
+        showname: "岗位",
+        selected: false
+    }
+    
+]
+
+@inject('ledgerStore')
+@observer
+export default class AddUserModal extends React.Component {
+    constructor(props) {
+        super(props)
+        this.state = {
+            selectedKey: "EMPLOYEE",
+            radioValue: "ALL",
+            ids: ""
+        }
+    }
+
+    onRadioChange(e) {
+        this.setState({radioValue: e.target.value})
+    }
+
+    handleSave() {
+        const { ledgerStore: {saveLedgerPersonRange, salarySobId, includeType} } = this.props;
+        saveLedgerPersonRange({
+            salarySobId: salarySobId,
+            includeType: includeType,
+            employeeStatus: this.state.radioValue,
+            targetParams: this.state.ids.split(",").map(id => ({targetType: this.state.selectedKey, targetId: id}))
+        })
+    }
+
+    render() {
+        return (
+            <Modal visible={this.props.visible} onCancel={() => {this.props.onCancel()}} width={600} 
+                title="关联人员"
+                footer={
+                    <div style={{display:"inlne-block"}}>
+                        <Button type="primary" onClick={() => {this.handleSave()}}>保存</Button>
+                        <Button type="default" >重置</Button>
+                    </div>
+                }
+            >
+                <div style={{padding: "20px"}}>
+                    <Row style={{lineHeight: "40px"}}>
+                        <Col span={8}>对象类型</Col>
+                        <Col span={16}>
+                            <div style={{display: "inline-block", verticalAlign: "top"}}>
+                                <WeaSelect style={{height: "30px", marginRight: "10px"}} options={objectOptions} value={this.state.selectedKey} onChange={(value) => {
+                                    this.setState({selectedKey: value, ids: ""})
+                                    }}/>
+                            </div>
+                            <div style={{display: "inline-block", verticalAlign: "middle"}}>
+                                {
+                                    this.state.selectedKey == "EMPLOYEE" && <WeaBrowser
+                                    type={17}
+                                    title={"人员选择"}
+                                    inputStyle={{ width: 200 }}
+                                        onChange={(ids, names, datas) => {
+                                            this.setState({ids})
+                                        }}
+                                    />
+                                }
+                                {
+                                    this.state.selectedKey == "DEPT" && <WeaBrowser
+                                    type={57}
+                                    title={"部门选择"}
+                                    inputStyle={{ width: 200 }}
+                                    onChange={(ids, names, datas) => {
+                                        this.setState({ids})
+                                    }}
+                                    />
+                                }
+                                {
+                                    this.state.selectedKey == "POSITION" && <WeaBrowser
+                                    type={278}
+                                    title={"岗位选择"}
+                                    inputStyle={{ width: 200 }}
+                                    onChange={(ids, names, datas) => {
+                                        this.setState({ids})
+                                    }}
+                                    />
+                                }
+                            </div>
+                        </Col>
+                    </Row>
+                    <Row style={{lineHeight: "40px"}}>
+                        <Col span={8}>选择员工状态</Col>
+                        <Col span={16}>
+                        <Radio.Group onChange={(e) => this.onRadioChange(e)} value={this.state.radioValue}>
+                            <Radio value={"ALL"}>全部</Radio>
+                            <Radio value={"NORMAL"}>在职</Radio>
+                            <Radio value={"UNAVAILABLE"}>离职</Radio>
+                        </Radio.Group>
+                        </Col>
+                    </Row>
+                </div>
+                
+            </Modal>
+        )
+    }
+}

pc4mobx/hrmSalary/pages/ledger/index.js

@@ -80,9 +80,12 @@ export default class Ledger extends React.Component {
   handleItemClick(record) {
     this.setState({
       editSlideVisible: true,
-      currentReocrd: record
+      request: record
     })
 
+    const { ledgerStore:  {setSalarySobId} } = this.props;
+    setSalarySobId(record.id)
+
   }
 
   // 增加编辑功能，重写columns绑定事件
@@ -259,7 +262,7 @@ export default class Ledger extends React.Component {
               content={
                 <div>
                   {
-                    currentStep == 0 && <SlideBaseForm record={this.state.currentReocrd} onChange={(value) => {this.setState({step1Request: value})}}/>
+                    currentStep == 0 && <SlideBaseForm request={this.state.step1Request} onChange={(value) => {this.setState({step1Request: value})}}/>
                   }
                   {
                     currentStep == 1 && <SlideRefereUser />
@@ -301,7 +304,7 @@ export default class Ledger extends React.Component {
                 }
                 content={<div>
                   {
-                    selectedTab == 0 && <SlideBaseForm record={this.state.currentReocrd} onChange={(value) => {this.setState({step1Request: value})}}/>
+                    selectedTab == 0 && <SlideBaseForm request={this.state.step1Request} onChange={(value) => {this.setState({step1Request: value})}}/>
                   }
                   {
                     selectedTab == 1 && <SlideRefereUser />

pc4mobx/hrmSalary/pages/ledger/index.less

@@ -27,6 +27,9 @@
 }
 
 .slideRefereUser {
+    .tabItem {
+        cursor: pointer;
+    }
     .refereUserHeader {
         height: 47px;
         line-height: 47px;

pc4mobx/hrmSalary/pages/ledger/slideBaseForm.js

@@ -27,17 +27,17 @@ export default class SlideBaseForm extends React.Component {
     }
 
     handleChange(params) {
-        let request = {...this.props.record, ...params}
+        let request = {...this.props.request, ...params}
         this.setState({request})
         this.props.onChange(request)
     }
 
 
     render() {
-        const { record } = this.props;
+        const { request } = this.props;
         const { name, taxableItems, salaryCycleType, salaryCycleFromDay,
         taxCycleType, attendCycleType, attendCycleFromDay, socialSecurityCycleType,
-        description} = record
+        description} = request
         return (
             <div className="slideBaseForm">
                 <Row>

pc4mobx/hrmSalary/pages/ledger/slideRefereUser.js

@@ -1,23 +1,98 @@
 import React from 'react';
+import { inject, observer } from 'mobx-react';
 import { Icon, Table  } from 'antd';
 import { WeaInputSearch } from "ecCom"
 import { slideStep2Columns, dataSource } from './columns'
+import AddUserModal from './addUserModal'
 
+@inject('ledgerStore')
+@observer
 export default class SlideRefereUser extends React.Component {
+    constructor(props) {
+        super(props)
+        this.state = {
+            addUserModalVisible: false,
+            selectedRowKeys: [],
+            searchValue: ""
+        }
+    }
+
+    handleTabClick(tab) {
+        const { ledgerStore: {setIncludeType, getLedgerPersonRangeInclude, salarySobId, getLedgerPersonRangeExclude}} = this.props;
+        setIncludeType(tab)
+        if(tab == 1) {
+            getLedgerPersonRangeInclude({salarySobId: salarySobId})
+        } else {
+            getLedgerPersonRangeExclude({salarySobId: salarySobId})
+        }
+    }
+
+    componentWillMount() {
+        const { ledgerStore: {getLedgerPersonRangeInclude, salarySobId}} = this.props;
+        getLedgerPersonRangeInclude({salarySobId: salarySobId})
+    }
+
+    onSelectChange = selectedRowKeys => {
+        this.setState({ selectedRowKeys });
+    };
+
+
+    handleTabDelete = () => {
+        const {ledgerStore: {deleteLedgerPersonRange}} = this.props;
+        if(this.state.selectedRowKeys.length == 0) {
+            message.warning("未选择条目")
+            return
+        }
+        deleteLedgerPersonRange(this.state.selectedRowKeys)
+    }
+
+    handleSearch = (value) => {
+        const { ledgerStore: {includeType, salarySobId, getLedgerPersonRangeInclude, getLedgerPersonRangeExclude}} = this.props;
+        if(includeType == 1) {
+            getLedgerPersonRangeInclude({salarySobId: salarySobId, name: value})
+        } else {
+            getLedgerPersonRangeExclude({salarySobId: salarySobId, name: value})
+        }
+    }
+
     render() {
+        const { ledgerStore: {includeType, userTableStore, addUserModalVisible, setAddUserModalVisible}} = this.props;
+        let { columns, list} = userTableStore
+        const { selectedRowKeys } = this.state
+        columns = columns || []
+        list = list || []
+
+        list.map(item => item.key = item.id)
+
+        const rowSelection = {
+            selectedRowKeys,
+            onChange: this.onSelectChange,
+        };
+
         return (
             <div className="slideRefereUser">
                 <div className="refereUserHeader">
-                    <div className="headerLeft"><span className="selectedCrumbs">关联人员范围</span> {'  '} | {'  '} <span>从范围中排除</span></div>
-                    <WeaInputSearch className="searchInput"/>
+                    <div className="headerLeft"><span className={includeType == 1 ? "selectedCrumbs" : "tabItem"} onClick={() => {this.handleTabClick(1)}}>关联人员范围</span> {'  '} | {'  '} <span  className={includeType == 0 ? "selectedCrumbs" : "tabItem"} onClick={() => {this.handleTabClick(0)}}>从范围中排除</span></div>
+                    <WeaInputSearch className="searchInput" value={this.state.searchValue} onChange={(value) => {this.setState({searchValue: value})}} onSearch={(value) => {this.handleSearch(value)}}/>
                     <div className="headerIcon">
-                        <Icon className="iconItem" type="minus-square"/>
-                        <Icon className="iconItem" type="plus-square" />
+                        <Icon className="iconItem" type="minus-square" onClick={() => {this.handleTabDelete()}}/>
+                        <Icon className="iconItem" type="plus-square" onClick={() => {setAddUserModalVisible(true)}}/>
                     </div>
                 </div>
                 <div>
-                    <Table dataSource={dataSource} columns={slideStep2Columns}/>
+                    <Table rowSelection={rowSelection} dataSource={list} columns={columns} pagination={{
+                        total: userTableStore.total,
+                        current: userTableStore.pageNum
+                    }}/>
                 </div>
+
+                {
+                    addUserModalVisible && <AddUserModal 
+                        visible={addUserModalVisible}
+                        onCancel={() => {setAddUserModalVisible(false)}}
+                    />
+                }
+
             </div>
         )
     }

pc4mobx/hrmSalary/stores/ledger.js

@@ -13,6 +13,22 @@ export class LedgerStore {
   @observable hasRight = true; // 判断用户是有权限查看当前页面： 没有权限渲染无权限页面，有权限渲染数据
   @observable showSearchAd = false; // 高级搜索面板显示
   @observable loading = true; // 数据加载状态
+  @observable salarySobId = "";
+  @observable includeType=1; // 0：排除、1：包含
+  @observable userTableStore = {};
+  @observable addUserModalVisible = false;
+
+  @action
+  setAddUserModalVisible = addUserModalVisible => this.addUserModalVisible = addUserModalVisible;
+
+  @action
+  setUserTableStore = userTableStore => this.userTableStore = userTableStore;
+
+  @action
+  setIncludeType = includeType => this.includeType = includeType
+
+  @action
+  setSalarySobId = salarySobId => this.salarySobId = salarySobId;
 
   // 初始化操作
   @action
@@ -108,4 +124,61 @@ export class LedgerStore {
     })
   }
 
+  //保存薪资帐套人员范围
+  @action
+  saveLedgerPersonRange = (params) => {
+    API.saveLedgerPersonRange(params).then(res => {
+      if(res.status) {
+        if(this.includeType == 1) {
+          this.getLedgerPersonRangeInclude({salarySobId: this.salarySobId})
+        } else {
+          this.getLedgerPersonRangeExclude({salarySobId: this.salarySobId})
+        }
+        this.addUserModalVisible = false;
+        message.success("添加成功")
+      } else {
+        message.error(res.errormsg || "添加失败")
+      }
+    })
+  }
+
+  //薪资帐套人员范围（包含）列表
+  getLedgerPersonRangeInclude = (params) => {
+    API.getLedgerPersonRangeInclude(params).then(res => {
+      if(res.status) {
+        this.setUserTableStore(res.data)
+      } else {
+        message.error(res.errormsg || "获取失败")
+      }
+    })
+  }
+
+  //薪资帐套人员范围（排除）列表
+  getLedgerPersonRangeExclude = (params) => {
+    API.getLedgerPersonRangeExclude(params).then(res => {
+      if(res.status) {
+        this.setUserTableStore(res.data)
+      } else {
+        message.error(res.errormsg || "获取失败")
+      }
+    })
+  }
+
+  //删除薪资帐套人员范围
+  deleteLedgerPersonRange = (params) => {
+    API.deleteLedgerPersonRange(params).then(res => {
+      if(res.status) {
+        if(this.includeType == 1) {
+          this.getLedgerPersonRangeInclude({salarySobId: this.salarySobId})
+        } else {
+          this.getLedgerPersonRangeExclude({salarySobId: this.salarySobId})
+        }
+        message.success("删除成功")
+      } else {
+        message.error(res.errormsg || "删除失败")
+      }
+    })
+  }
+
+
 }

pc4mobx/hrmSalary/stores/salaryItem.js

@@ -144,13 +144,11 @@ export class SalaryItemStore {
 
   // 对象值转string
   convertToString(data) {
-    alert("data1:" + JSON.stringify(data))
     Object.keys(data).map(k => {
       if(typeof(data[k]) == "number") {
         data[k] = data[k].toString();
       }
     })
-    alert("data2:" + JSON.stringify(data))
     return data;
   }