salary-management-front/pc4mobx/hrmSalary/pages/dataAcquisition/attendance/itemMangeFormModal.js

123 lines
4.4 KiB
JavaScript

import React from 'react'
import { Modal, Row, Col, Button,Switch, Select } from 'antd'
import { inject, observer } from 'mobx-react';
import { WeaInput, WeaSelect } from 'ecCom'
import SelectItemModal, { items } from '../../../components/selectItemsModal/selectItemsWrapper';
@inject('attendanceStore')
@observer
export default class ItemMangeFormModal extends React.Component {
componentWillMount() {
const { attendanceStore: {currentItem, currentItemOperate}} = this.props;
if(currentItemOperate == "add") {
this.state = {
request: {
fieldName: "",
fieldType: "1",
enableStatus: 0,
description: ''
}
}
} else {
this.state = {
request: currentItem
}
}
}
handleChange(params) {
const { request } = this.state
let result = {...request, ...params}
this.setState({request: result})
}
convertFieldType=(fileTypeStr)=> {
if(fileTypeStr == "数值") {
return "1"
} else if(fileTypeStr == "文本"){
return "2"
} else if(fileTypeStr == "1" || fileTypeStr == "2") {
return fileTypeStr;
}
return ""
}
render() {
const options = [
{
key: "1",
selected: true,
showname: "数值"
},
{
key: "2",
selected: false,
showname: "文本"
}
]
const { request } = this.state;
const {fieldName, fieldType, enableStatus, description} = request
let fileTypeKey = this.convertFieldType(fieldType)
const { attendanceStore : {currentItemOperate}} = this.props;
return (
<Modal width={600} visible={this.props.visible} onCancel={this.props.onCancel}
title={"新建自定义字段"}
footer={
<Button type="primary" onClick={() => {
currentItemOperate == "add" ? this.props.onSave(this.state.request) :
this.props.onUpdate(this.state.request)
}
}>保存</Button>
}>
<div style={{padding: "20px"}}>
<Row gutter={[10, 10]} style={{marginBottom: "10px"}}>
<Col span={8}>
字段名称
</Col>
<Col span={16}>
<WeaInput style={{width: "200px"}} value={fieldName} onChange={(v) => {
this.handleChange({fieldName: v})
}}/>
</Col>
</Row>
<Row gutter={[10, 10]} style={{marginBottom: "10px"}}>
<Col span={8}>
类型
</Col>
<Col span={16}>
<WeaSelect style={{width: "200px"}} options={options} value={fileTypeKey}
onChange={(v) => this.handleChange({fieldType: v})}
/>
</Col>
</Row>
<Row gutter={[10, 10]} style={{marginBottom: "10px"}}>
<Col span={8}>
是否启用
</Col>
<Col span={16}>
<Switch checked={enableStatus == 1} onChange={(value) => {
let enableStatus = 0
if(value) {
enableStatus = 1
}
this.handleChange({enableStatus})
}}/>
</Col>
</Row>
<Row gutter={[10, 10]} style={{marginBottom: "10px"}}>
<Col span={8}>
备注
</Col>
<Col span={16}>
<WeaInput style={{width: "200px"}} value={description} onChange={(v) => {
this.handleChange({description: v})
}}/>
</Col>
</Row>
</div>
</Modal>
)
}
}