From f0bf8c399c354c22227f8f1a76ed806098db59c0 Mon Sep 17 00:00:00 2001
From: king <18310653075@163.com>
Date: 星期二, 21 五月 2024 16:51:02 +0800
Subject: [PATCH] 2024-05-21
---
src/tabviews/custom/components/chart/antv-X6/nodeupdate/nodeform.jsx | 227 +++++++++++++++++++++++++++++++++++++++++++-------------
1 files changed, 173 insertions(+), 54 deletions(-)
diff --git a/src/tabviews/custom/components/chart/antv-X6/nodeupdate/nodeform.jsx b/src/tabviews/custom/components/chart/antv-X6/nodeupdate/nodeform.jsx
index a400204..c9e04e2 100644
--- a/src/tabviews/custom/components/chart/antv-X6/nodeupdate/nodeform.jsx
+++ b/src/tabviews/custom/components/chart/antv-X6/nodeupdate/nodeform.jsx
@@ -1,6 +1,6 @@
import React, {Component} from 'react'
import PropTypes from 'prop-types'
-import { Form, Row, Col, Input, Radio, Tooltip, InputNumber, Switch } from 'antd'
+import { Form, Row, Col, Input, Radio, Tooltip, InputNumber, Switch, notification } from 'antd'
import { QuestionCircleOutlined } from '@ant-design/icons'
import MemberForm from './memberform'
@@ -10,18 +10,82 @@
static propTpyes = {
node: PropTypes.any,
data: PropTypes.any,
- orgs: PropTypes.array
+ orgs: PropTypes.array,
+ handleSubmit: PropTypes.func
}
state = {
- flowType: this.props.data.flowType || 'approval',
- execCondition: this.props.data.execCondition === 'open',
+ flowType: 'approval',
+ execCondition: false,
+ seniorCondition: false,
+ approvalMethod: 'orsign',
+ readOnly: false,
+ options: []
+ }
+
+ UNSAFE_componentWillMount() {
+ const { node, data } = this.props
+
+ let options = []
+ let readOnly = false
+
+ if (node.mknode === 'start') {
+ readOnly = true
+ } else if (node.mknode === 'end') {
+
+ } else if (node.mknode === 'throughEdge') {
+ options = ['senior']
+ } else if (node.mknode === 'endEdge') {
+ options = ['approvalMethod', 'execCondition']
+ } else if (node.mknode === 'startEdge') {
+ readOnly = true
+ } else if (node.mknode === 'firstEdge') {
+ options = ['approver', 'members', 'copys']
+ } else if (node.shape !== 'edge') { // node
+ options = ['sign']
+ } else {
+ options = ['flowType', 'approvalMethod', 'approver', 'members', 'copys', 'execCondition', 'senior']
+ }
+
+ this.setState({
+ flowType: data.flowType || 'approval',
+ execCondition: options.includes('execCondition') ? data.execCondition === 'open' : false,
+ seniorCondition: options.includes('senior') ? data.seniorCondition === 'open' : false,
+ approvalMethod: data.approvalMethod || 'orsign',
+ options,
+ readOnly
+ })
}
handleConfirm = () => {
+ const { node } = this.props
+
return new Promise((resolve, reject) => {
this.props.form.validateFieldsAndScroll((err, values) => {
if (!err) {
+
+ if (values.approvalMethod === 'countersign' && values.members.length > 5) {
+ notification.warning({
+ top: 92,
+ message: '浼氱鏃跺鎵逛汉涓嶅彲瓒呰繃5浜猴紒',
+ duration: 10
+ })
+ return
+ } else if (node.mknode === 'throughEdge' && values.seniorCondition === false) {
+ notification.warning({
+ top: 92,
+ message: '寮�濮嬩笌缁撴潫鐩磋繛鐨勫垎鏀繀椤昏缃壒娈婂鎵逛汉锛�',
+ duration: 10
+ })
+ return
+ }
+
+ if (values.seniorCondition === true) {
+ values.seniorCondition = 'open'
+ } else if (values.seniorCondition === false) {
+ values.seniorCondition = 'close'
+ }
+
if (values.execCondition === true) {
values.execCondition = 'open'
} else if (values.execCondition === false) {
@@ -40,9 +104,9 @@
}
render() {
- const { node, orgs } = this.props
+ const { orgs } = this.props
const { getFieldDecorator } = this.props.form
- const { flowType, execCondition } = this.state
+ const { flowType, execCondition, seniorCondition, approvalMethod, readOnly, options } = this.state
const formItemLayout = {
labelCol: {
xs: { span: 24 },
@@ -54,32 +118,22 @@
}
}
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'
- } else if (node.mknode === 'endEdge') {
- nodetype = 'endEdge'
- } else if (node.mknode === 'startEdge') {
- nodetype = 'startEdge'
- }
return (
<Form {...formItemLayout} className="normal-node-form">
<Row gutter={24}>
+ {options.includes('approver') || options.includes('execCondition') ? <Col span={24}>
+ <p className="mk-split">鎸夐挳鎵ц鍛戒护</p>
+ </Col> : null}
<Col span={12}>
<Form.Item label="鐘舵�佸��">
{getFieldDecorator('status', {
initialValue: data.status,
rules: [
- {
- required: true,
- message: '璇疯緭鍏ョ姸鎬佸��!'
- }
+ { required: true, message: '璇疯緭鍏ョ姸鎬佸��!' }
]
})(
- <InputNumber readOnly={nodetype !== 'node' && nodetype !== 'edge'} precision={0}/>
+ <InputNumber readOnly={readOnly} precision={0} onPressEnter={() => this.props.handleSubmit()}/>
)}
</Form.Item>
</Col>
@@ -88,11 +142,11 @@
{getFieldDecorator('statusName', {
initialValue: data.statusName || ''
})(
- <Input placeholder="" autoComplete="off"/>
+ <Input autoComplete="off" onPressEnter={() => this.props.handleSubmit()}/>
)}
</Form.Item>
</Col>
- {nodetype === 'node' ? <Col span={12}>
+ {options.includes('sign') ? <Col span={12}>
<Form.Item label={
<Tooltip placement="topLeft" title="鏍囪灏嗕綔涓鸿妭鐐笽D">
<QuestionCircleOutlined className="mk-form-tip" />
@@ -102,11 +156,11 @@
{getFieldDecorator('sign', {
initialValue: data.sign || ''
})(
- <Input placeholder="" autoComplete="off"/>
+ <Input autoComplete="off" onPressEnter={() => this.props.handleSubmit()}/>
)}
</Form.Item>
</Col> : null}
- {nodetype === 'edge' ? <Col span={12}>
+ {options.includes('flowType') ? <Col span={12}>
<Form.Item label="鎿嶄綔绫诲瀷">
{getFieldDecorator('flowType', {
initialValue: flowType
@@ -118,7 +172,48 @@
)}
</Form.Item>
</Col> : null}
- {nodetype === 'edge' ? <Col span={12}>
+ {options.includes('approvalMethod') && flowType !== 'reject' ? <Col span={12}>
+ <Form.Item label="瀹℃壒鏂瑰紡">
+ {getFieldDecorator('approvalMethod', {
+ initialValue: approvalMethod
+ })(
+ <Radio.Group onChange={(e) => this.setState({approvalMethod: e.target.value})}>
+ <Radio value="orsign">鎴栫</Radio>
+ <Radio value="countersign">浼氱</Radio>
+ </Radio.Group>
+ )}
+ </Form.Item>
+ </Col> : null}
+ {options.includes('approvalMethod') && flowType !== 'reject' && approvalMethod === 'countersign' ? <Col span={12}>
+ <Form.Item label={
+ <Tooltip placement="topLeft" title="绀轰緥锛氣�滆储鍔＄粡鐞嗗紶鎬诲凡瀹℃牳鈥濓紝鍏朵腑鈥滃凡瀹℃牳鈥濅负浼氱鏍囪銆�">
+ <QuestionCircleOutlined className="mk-form-tip" />
+ 浼氱鏍囪
+ </Tooltip>
+ }>
+ {getFieldDecorator('mark', {
+ initialValue: data.mark || '宸插鏍�',
+ rules: [
+ { required: true, message: '璇疯緭鍏ヤ細绛炬爣璁�!' }
+ ]
+ })(
+ <Input autoComplete="off" onPressEnter={() => this.props.handleSubmit()}/>
+ )}
+ </Form.Item>
+ </Col> : null}
+ <Col span={24}>
+ <Form.Item label="澶囨敞">
+ {getFieldDecorator('remark', {
+ initialValue: data.remark || ''
+ })(
+ <TextArea rows={2}/>
+ )}
+ </Form.Item>
+ </Col>
+ {options.includes('approver') ? <Col span={24}>
+ <p className="mk-split">涓嬩竴姝ュ鎵规潈闄�</p>
+ </Col> : null}
+ {options.includes('approver') ? <Col span={12}>
<Form.Item label="璁剧疆瀹℃壒浜�">
{getFieldDecorator('approver', {
initialValue: data.approver || 'member'
@@ -131,32 +226,19 @@
)}
</Form.Item>
</Col> : null}
- {nodetype === 'edge' && flowType !== 'reject' ? <Col span={12}>
- <Form.Item label="瀹℃壒鏂瑰紡">
- {getFieldDecorator('approvalMethod', {
- initialValue: data.approvalMethod || 'orsign'
- })(
- <Radio.Group>
- <Radio value="countersign">浼氱</Radio>
- <Radio value="orsign">鎴栫</Radio>
- </Radio.Group>
- )}
- </Form.Item>
- </Col> : null}
- {nodetype === 'edge' ? <Col span={12}>
+ {options.includes('members') ? <Col span={12}>
<Form.Item label="瀹℃壒浜�">
{getFieldDecorator('members', {
initialValue: data.members || [],
- rules: [{
- required: true,
- message: '璇锋坊鍔犲鎵逛汉!'
- }]
+ rules: [
+ { required: true, message: '璇锋坊鍔犲鎵逛汉!' }
+ ]
})(
<MemberForm orgs={orgs} title="瀹℃壒浜�"/>
)}
</Form.Item>
</Col> : null}
- {nodetype === 'edge' ? <Col span={12}>
+ {options.includes('copys') ? <Col span={12}>
<Form.Item label="鎶勯�佷汉">
{getFieldDecorator('copys', {
initialValue: data.copys || []
@@ -165,7 +247,10 @@
)}
</Form.Item>
</Col> : null}
- {nodetype === 'edge' && flowType !== 'reject' ? <Col span={12}>
+ {options.includes('execCondition') && flowType !== 'reject' ? <Col span={24}>
+ <p className="mk-split">鍒嗘敮鎵ц鏉′欢</p>
+ </Col> : null}
+ {options.includes('execCondition') && flowType !== 'reject' ? <Col span={12}>
<Form.Item label="鎵ц鏉′欢">
{getFieldDecorator('execCondition', {
valuePropName: 'checked',
@@ -175,7 +260,7 @@
)}
</Form.Item>
</Col> : null}
- {nodetype === 'edge' && flowType !== 'reject' && execCondition ? <Col span={12}>
+ {flowType !== 'reject' && execCondition ? <Col span={12}>
<Form.Item label="瀵规瘮鏂瑰紡">
{getFieldDecorator('match', {
initialValue: data.match || '='
@@ -191,7 +276,7 @@
)}
</Form.Item>
</Col> : null}
- {nodetype === 'edge' && flowType !== 'reject' && execCondition ? <Col span={12}>
+ {flowType !== 'reject' && execCondition ? <Col span={12}>
<Form.Item label={
<Tooltip placement="topLeft" title="瀵规瘮鍊间腑涓嶅彲鍖呭惈鍒惰〃绗︺�佺┖鏍笺�佹崲琛岀绛夈��">
<QuestionCircleOutlined className="mk-form-tip" />
@@ -201,19 +286,53 @@
{getFieldDecorator('matchVal', {
initialValue: data.matchVal || ''
})(
- <Input placeholder="" autoComplete="off"/>
+ <Input autoComplete="off" onPressEnter={() => this.props.handleSubmit()}/>
)}
</Form.Item>
</Col> : null}
- <Col span={24}>
- <Form.Item label="澶囨敞">
- {getFieldDecorator('remark', {
- initialValue: data.remark || ''
+ {options.includes('senior') && flowType !== 'reject' && approvalMethod !== 'countersign' ? <Col span={24}>
+ <p className="mk-split">楂樼骇璁剧疆<span style={{fontSize: '12px', color: 'rgba(0, 0, 0, 0.45)'}}>锛堝惎鐢ㄧ壒娈婂鎵逛汉鏃讹紝绗﹀悎瀹℃壒浜哄垪琛ㄦ椂锛屼紭鍏堜娇鐢ㄦ鍒嗘敮銆傦級</span></p>
+ </Col> : null}
+ {options.includes('senior') && flowType !== 'reject' && approvalMethod !== 'countersign' ? <Col span={12}>
+ <Form.Item label="鐗规畩浜哄憳">
+ {getFieldDecorator('seniorCondition', {
+ valuePropName: 'checked',
+ initialValue: seniorCondition
})(
- <TextArea rows={2}/>
+ <Switch checkedChildren="鍚敤" unCheckedChildren="绂佺敤" onChange={(val) => this.setState({seniorCondition: val})} />
)}
</Form.Item>
- </Col>
+ </Col> : null}
+ {options.includes('senior') && flowType !== 'reject' && approvalMethod !== 'countersign' && seniorCondition ? <Col span={12}>
+ <Form.Item label="瀹℃壒浜�">
+ {getFieldDecorator('seniorbers', {
+ initialValue: data.seniorbers || [],
+ rules: [
+ { required: true, message: '璇锋坊鍔犲鎵逛汉!' }
+ ]
+ })(
+ <MemberForm orgs={orgs} title="瀹℃壒浜�"/>
+ )}
+ </Form.Item>
+ </Col> : null}
+ {options.includes('senior') && flowType !== 'reject' && approvalMethod !== 'countersign' && seniorCondition ? <Col span={12}>
+ <Form.Item label={
+ <Tooltip placement="topLeft" title="鐢ㄤ簬涓氬姟澶勭悊鏃剁殑鏍囪鍊粿works_flow_sign@銆�">
+ <QuestionCircleOutlined className="mk-form-tip" />
+ 鍒嗘敮鏍囪
+ </Tooltip>
+ }>
+ {getFieldDecorator('seniorSign', {
+ initialValue: data.seniorSign || '',
+ rules: [
+ { required: true, message: '璇锋坊鍔犲垎鏀爣璁�!' },
+ { pattern: /^[0-9a-zA-Z_]+$/, message: '鍙彲杈撳叆鑻辨枃銆佹暟瀛椾互鍙奯銆�' }
+ ]
+ })(
+ <Input autoComplete="off" onPressEnter={() => this.props.handleSubmit()}/>
+ )}
+ </Form.Item>
+ </Col> : null}
</Row>
</Form>
)
--
Gitblit v1.8.0