import React, {Component} from 'react'
|
import PropTypes from 'prop-types'
|
import { Form, Row, Col, Input, Radio, Tooltip, InputNumber } from 'antd'
|
import { QuestionCircleOutlined } from '@ant-design/icons'
|
|
import MemberForm from './memberform'
|
const { TextArea } = Input
|
|
class NodeForm extends Component {
|
static propTpyes = {
|
node: PropTypes.any,
|
data: PropTypes.any,
|
orgs: PropTypes.array
|
}
|
|
state = {}
|
|
handleConfirm = () => {
|
return new Promise((resolve, reject) => {
|
this.props.form.validateFieldsAndScroll((err, values) => {
|
if (!err) {
|
resolve(values)
|
} else {
|
reject(err)
|
}
|
})
|
})
|
}
|
|
render() {
|
const { node, orgs } = this.props
|
const { getFieldDecorator } = this.props.form
|
const formItemLayout = {
|
labelCol: {
|
xs: { span: 24 },
|
sm: { span: 8 }
|
},
|
wrapperCol: {
|
xs: { span: 24 },
|
sm: { span: 16 }
|
}
|
}
|
let data = this.props.data || {}
|
let nodetype = node.shape !== 'edge' ? 'node' : 'edge'
|
if (node.mknode === 'start') {
|
nodetype = 'start'
|
} else if (node.mknode === 'end') {
|
nodetype = 'end'
|
}
|
|
return (
|
<Form {...formItemLayout} className="normal-node-form">
|
<Row gutter={24}>
|
<Col span={12}>
|
<Form.Item label="状态值">
|
{getFieldDecorator('status', {
|
initialValue: data.status === undefined ? 0 : data.status,
|
rules: [
|
{
|
required: true,
|
message: '请输入状态值!'
|
}
|
]
|
})(
|
<InputNumber precision={0}/>
|
)}
|
</Form.Item>
|
</Col>
|
<Col span={12}>
|
<Form.Item label="状态名">
|
{getFieldDecorator('statusName', {
|
initialValue: data.statusName || ''
|
})(
|
<Input placeholder="" autoComplete="off"/>
|
)}
|
</Form.Item>
|
</Col>
|
{nodetype === 'node' ? <Col span={12}>
|
<Form.Item label={
|
<Tooltip placement="topLeft" title="标记将作为节点ID">
|
<QuestionCircleOutlined className="mk-form-tip" />
|
标记
|
</Tooltip>
|
}>
|
{getFieldDecorator('sign', {
|
initialValue: data.sign || ''
|
})(
|
<Input placeholder="" autoComplete="off"/>
|
)}
|
</Form.Item>
|
</Col> : null}
|
{nodetype === 'node' ? <Col span={12}>
|
<Form.Item label="设置审批人">
|
{getFieldDecorator('approver', {
|
initialValue: data.approver || 'member'
|
})(
|
<Radio.Group>
|
<Radio value="member">指定成员</Radio>
|
<Radio value="departmentManager">部门主管</Radio>
|
<Radio value="directManager">直属主管</Radio>
|
</Radio.Group>
|
)}
|
</Form.Item>
|
</Col> : null}
|
{nodetype === 'node' ? <Col span={12}>
|
<Form.Item label="审批方式">
|
{getFieldDecorator('approvalMethod', {
|
initialValue: data.approvalMethod || 'countersign'
|
})(
|
<Radio.Group>
|
<Radio value="countersign">会签</Radio>
|
<Radio value="orsign">或签</Radio>
|
</Radio.Group>
|
)}
|
</Form.Item>
|
</Col> : null}
|
<Col span={12}>
|
<Form.Item label="审批人">
|
{getFieldDecorator('members', {
|
initialValue: data.members || [],
|
rules: [{
|
required: true,
|
message: '请添加审批人!'
|
}]
|
})(
|
<MemberForm orgs={orgs} title="审批人"/>
|
)}
|
</Form.Item>
|
</Col>
|
<Col span={12}>
|
<Form.Item label="抄送人">
|
{getFieldDecorator('copys', {
|
initialValue: data.copys || []
|
})(
|
<MemberForm orgs={orgs} title="抄送人"/>
|
)}
|
</Form.Item>
|
</Col>
|
<Col span={24}>
|
<Form.Item label="备注">
|
{getFieldDecorator('remark', {
|
initialValue: data.remark || ''
|
})(
|
<TextArea rows={2}/>
|
)}
|
</Form.Item>
|
</Col>
|
</Row>
|
</Form>
|
)
|
}
|
}
|
|
export default Form.create()(NodeForm)
|
