From fc8c8d714687a22f711d642d192bd4149f3b7e88 Mon Sep 17 00:00:00 2001 From: king <18310653075@163.com> Date: 星期一, 22 四月 2024 11:15:14 +0800 Subject: [PATCH] 2024-04-22 --- src/tabviews/custom/components/chart/antv-X6/nodeupdate/nodeform.jsx | 161 ++++++++++++++++++++++++++++++++++++----------------- 1 files changed, 108 insertions(+), 53 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 cec9966..7980951 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' @@ -15,14 +15,57 @@ } state = { - flowType: this.props.data.flowType || 'approval', - execCondition: this.props.data.execCondition === 'open', + flowType: 'approval', + execCondition: 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 === 'endEdge') { + options = ['approvalMethod'] + } 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'] + } + + this.setState({ + flowType: data.flowType || 'approval', + execCondition: options.includes('execCondition') && data.execCondition === 'open', + approvalMethod: data.approvalMethod || 'orsign', + options, + readOnly + }) } handleConfirm = () => { 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 + } + if (values.execCondition === true) { values.execCondition = 'open' } else if (values.execCondition === false) { @@ -41,9 +84,9 @@ } render() { - const { node, orgs } = this.props + const { orgs } = this.props const { getFieldDecorator } = this.props.form - const { flowType, execCondition } = this.state + const { flowType, execCondition, approvalMethod, readOnly, options } = this.state const formItemLayout = { labelCol: { xs: { span: 24 }, @@ -55,32 +98,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') ? <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 === 'start' || nodetype === 'startEdge'} precision={0} onPressEnter={() => this.props.handleSubmit()}/> + <InputNumber readOnly={readOnly} precision={0} onPressEnter={() => this.props.handleSubmit()}/> )} </Form.Item> </Col> @@ -93,7 +126,7 @@ )} </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" /> @@ -107,7 +140,7 @@ )} </Form.Item> </Col> : null} - {nodetype === 'edge' ? <Col span={12}> + {options.includes('flowType') ? <Col span={12}> <Form.Item label="鎿嶄綔绫诲瀷"> {getFieldDecorator('flowType', { initialValue: flowType @@ -119,7 +152,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' @@ -132,32 +206,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 || [] @@ -166,7 +227,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', @@ -176,7 +240,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 || '=' @@ -192,7 +256,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" /> @@ -206,15 +270,6 @@ )} </Form.Item> </Col> : null} - <Col span={24}> - <Form.Item label="澶囨敞"> - {getFieldDecorator('remark', { - initialValue: data.remark || '' - })( - <TextArea rows={2}/> - )} - </Form.Item> - </Col> </Row> </Form> ) -- Gitblit v1.8.0