salary-management-front/pc4mobx/hrmSalary/pages/ledger/addUserModal.js

134 lines
5.1 KiB
JavaScript

import React from 'react'
import { Modal, Button, Row, Col, Radio } from 'antd'
import { WeaSelect, WeaBrowser } from "ecCom"
import { inject, observer } from 'mobx-react';
import RequiredLabelTip from '../../components/requiredLabelTip';
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}))
})
}
// 重置
handleReset() {
this.setState({
selectedKey: "EMPLOYEE",
radioValue: "ALL",
ids: ""
})
}
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" onClick={() => {this.handleReset()}}>重置</Button>
</div>
}
>
<div style={{padding: "20px"}}>
<Row style={{lineHeight: "40px"}}>
<Col span={8}>对象类型<RequiredLabelTip /></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={"人员选择"}
isSingle={false}
inputStyle={{ width: 200 }}
onChange={(ids, names, datas) => {
this.setState({ids})
}}
/>
}
{
this.state.selectedKey == "DEPT" && <WeaBrowser
type={57}
title={"部门选择"}
isSingle={false}
inputStyle={{ width: 200 }}
onChange={(ids, names, datas) => {
this.setState({ids})
}}
/>
}
{
this.state.selectedKey == "POSITION" && <WeaBrowser
type={278}
title={"岗位选择"}
isSingle={false}
inputStyle={{ width: 200 }}
onChange={(ids, names, datas) => {
this.setState({ids})
}}
/>
}
</div>
</Col>
</Row>
<Row style={{lineHeight: "40px"}}>
<Col span={8}>选择员工状态<RequiredLabelTip /></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>
)
}
}