From a5f41b5d98f23d618dc7519c605ce943b114dfd5 Mon Sep 17 00:00:00 2001 From: king <18310653075@163.com> Date: 星期一, 13 十一月 2023 18:07:51 +0800 Subject: [PATCH] 2023-11-13 --- src/menu/components/form/formaction/actionform/index.jsx | 236 ++++++++++++++++++++++++++++++++++------------------------ 1 files changed, 138 insertions(+), 98 deletions(-) diff --git a/src/menu/components/form/formaction/actionform/index.jsx b/src/menu/components/form/formaction/actionform/index.jsx index f36d0b1..a55b914 100644 --- a/src/menu/components/form/formaction/actionform/index.jsx +++ b/src/menu/components/form/formaction/actionform/index.jsx @@ -1,6 +1,5 @@ import React, {Component} from 'react' import PropTypes from 'prop-types' -// import { fromJS } from 'immutable' import { Form, Row, Col, Input, Select, Radio, Tooltip, InputNumber, Cascader } from 'antd' import { QuestionCircleOutlined } from '@ant-design/icons' import { formRule } from '@/utils/option.js' @@ -11,68 +10,108 @@ class ActionForm extends Component { static propTpyes = { - dict: PropTypes.object, // 瀛楀吀椤� formlist: PropTypes.any, // 琛ㄥ崟淇℃伅 card: PropTypes.any, // 鎸夐挳淇℃伅 inputSubmit: PropTypes.any // 鍥炶溅鎻愪氦浜嬩欢 } state = { - formlist: null, // 琛ㄥ崟淇℃伅 - interType: null, // 鎺ュ彛绫诲瀷锛氬唴閮ㄣ�佸閮� - procMode: null, // 鍙傛暟鏂瑰紡 + formlist: null } + record = {} UNSAFE_componentWillMount () { - const { card } = this.props + this.props.formlist.forEach(item => { + this.record[item.key] = item.initVal + }) - let _intertype = card.intertype || 'system' // 鎺ュ彛绫诲瀷 - let _procMode = card.procMode || 'system' // 鍙傛暟璇锋眰鏂瑰紡 - - let _options = this.getOptions(_intertype, _procMode) + let { shows, reRequired, reReadonly } = this.getMutilOptions() this.setState({ - interType: _intertype, - procMode: _procMode, formlist: this.props.formlist.map(item => { - if (item.key === 'innerFunc' && _procMode === 'inner') { - item.required = true + item.hidden = !shows.includes(item.key) + item.initVal = this.record[item.key] + + if (reRequired[item.key] !== undefined) { + item.required = reRequired[item.key] + } + if (reReadonly[item.key] !== undefined) { + item.readonly = reReadonly[item.key] } - item.hidden = !_options.includes(item.key) return item }) }) } - getOptions = (_intertype, _procMode) => { - const { card } = this.props + getMutilOptions = () => { + let shows = [] + let reRequired = {} + let reReadonly = {} - if (card.type === 'prev') { - return ['type', 'label', 'enable'] - } else if (card.type === 'next') { - return ['type', 'label', 'enable'] - } - let _options = ['type', 'label', 'intertype', 'syncComponent', 'linkmenu', 'open', 'enable', 'output'] // 閫夐」鍒楄〃 - - if (_intertype === 'custom') { - _options.pop() - _options.push('procMode', 'interface', 'callbackType', 'cbTable', 'proInterface', 'method', 'cross') - if (_procMode === 'system') { - _options.push('sql', 'sqlType') - } else { - _options.push('innerFunc') - } - } else if (_intertype === 'outer') { - _options.push('innerFunc', 'sysInterface', 'interface', 'proInterface', 'outerFunc', 'callbackFunc') - } else if (_intertype === 'inner') { - _options.push('innerFunc') + if (this.record.type === 'prev') { + shows = ['typeName', 'label', 'actionType'] + } else if (this.record.type === 'next') { + shows = ['typeName', 'label', 'actionType'] + } else if (this.record.type === 'close' || this.record.type === 'reset') { + shows = ['typeName', 'label'] } else { - _options.push('sql', 'sqlType') + shows = ['typeName', 'label', 'intertype', 'Ot', 'execSuccess', 'syncComponent', 'anchors', 'linkmenu', 'output', 'reload', 'preButton', 'resetForm'] // 閫夐」鍒楄〃 + + if (this.record.intertype === 'custom') { + shows.pop() + shows.push('procMode', 'interface', 'callbackType', 'proInterface', 'method', 'cross', 'stringify', 'ContentType', 'outerBlacklist') + if (this.record.procMode === 'system') { + shows.push('sql', 'sqlType') + } else if (this.record.procMode === 'inner') { + shows.push('innerFunc') + } + if (this.record.callbackType === 'func') { + shows.push('callbackFunc') + } else if (this.record.callbackType !== 'none') { + shows.push('cbTable') + } + } else if (this.record.intertype === 'outer') { + shows.push('procMode', 'sysInterface', 'interface', 'outerFunc', 'callbackType') + if (this.record.procMode === 'system') { + shows.push('sql', 'sqlType') + } else if (this.record.procMode === 'inner') { + shows.push('innerFunc') + } + if (this.record.callbackType === 'func') { + shows.push('callbackFunc') + } else if (this.record.callbackType !== 'none') { + shows.push('cbTable') + } + + reRequired.outerFunc = false + if (this.record.sysInterface === 'false') { + reReadonly.interface = false + reRequired.interface = true + + shows.push('proInterface') + } else if (this.record.sysInterface === 'true') { + reReadonly.interface = true + reRequired.interface = false + reRequired.outerFunc = true + } + } else if (this.record.intertype === 'inner') { + shows.push('innerFunc') + } else { + shows.push('sql', 'sqlType') + } + + if (this.record.linkmenu && this.record.linkmenu !== 'goback') { + shows.push('open') + } } - return _options + return { + shows, + reRequired, + reReadonly + } } /** @@ -82,56 +121,35 @@ * 3銆佸垏鎹㈡爣绛剧被鍨嬶紝閲嶇疆鍙�夋爣绛� */ optionChange = (key, value) => { - const { procMode } = this.state + this.record[key] = value + let _fieldval = {} - if (key === 'intertype') { - let _options = this.getOptions(value, procMode) - - this.setState({ - interType: value, - formlist: this.state.formlist.map(item => { - item.hidden = !_options.includes(item.key) - - if (item.key === 'interface') { - item.readonly = false - } else if (item.key === 'sysInterface') { - item.initVal = 'false' - } - return item - }) - }) - } else if (key === 'procMode') { - let _options = this.getOptions(this.state.interType, value) - - this.setState({ - procMode: value, - formlist: this.state.formlist.map(item => { - item.hidden = !_options.includes(item.key) - - if (item.key === 'innerFunc') { - item.required = true - } - return item - }) - }) - } else if (key === 'sysInterface') { + if (key === 'sysInterface') { if (value === 'true') { - this.props.form.setFieldsValue({ - interface: window.GLOB.mainSystemApi || '' - }) + _fieldval.interface = window.GLOB.mainSystemApi || '' + this.record.interface = window.GLOB.mainSystemApi || '' } - this.setState({ - formlist: this.state.formlist.map(item => { - if (item.key === 'interface' && value === 'true') { - item.readonly = true - } else if (item.key === 'interface') { - item.readonly = false - } - - return item - }) - }) } + + let { shows, reRequired, reReadonly } = this.getMutilOptions() + + this.setState({ + formlist: this.state.formlist.map(item => { + item.hidden = !shows.includes(item.key) + item.initVal = this.record[item.key] + + if (reRequired[item.key] !== undefined) { + item.required = reRequired[item.key] + } + if (reReadonly[item.key] !== undefined) { + item.readonly = reReadonly[item.key] + } + + return item + }) + }, () => { + this.props.form.setFieldsValue(_fieldval) + }) } handleSubmit = (e) => { @@ -144,12 +162,13 @@ getFields() { const { getFieldDecorator } = this.props.form + const { interType, callbackType } = this.state const fields = [] this.state.formlist.forEach((item, index) => { if (item.hidden || item.forbid) return - if (item.type === 'text') { // 鏂囨湰鎼滅储 + if (item.type === 'text') { let _rules = [] if (item.key === 'innerFunc') { let str = '^(' + item.fields.join('|') + ')' @@ -169,6 +188,24 @@ max: formRule.func.max, message: formRule.func.maxMessage }] + } else if (item.key === 'output') { + if (interType === 'system' || ((interType === 'outer' || interType === 'custom') && callbackType === 'script')) { + _rules = [{ + pattern: /^@[0-9a-zA-Z_]+@?$/, + message: '鍙橀噺浠绗﹀紑澶达紝鍙娇鐢ㄥ瓧姣嶃�佹暟瀛椾互鍙奯' + }, { + max: 100, + message: '鏈�澶�100涓瓧绗︺��' + }] + } else { + _rules = [{ + pattern: /^[0-9a-zA-Z_]*$/, + message: '瀛楁鍙娇鐢ㄥ瓧姣嶃�佹暟瀛椾互鍙奯' + }, { + max: 100, + message: '鏈�澶�100涓瓧绗︺��' + }] + } } else { _rules = [{ max: formRule.input.max, @@ -188,7 +225,7 @@ rules: [ { required: item.readonly ? false : !!item.required, - message: this.props.dict['form.required.input'] + item.label + '!' + message: '璇疯緭鍏�' + item.label + '!' }, ..._rules ] @@ -218,17 +255,17 @@ rules: [ { required: item.readonly ? false : !!item.required, - message: this.props.dict['form.required.input'] + item.label + '!' + message: '璇疯緭鍏�' + item.label + '!' } ] - })(<InputNumber min={0} max={10000} precision={0} />)} + })(<InputNumber min={0} max={10000} precision={0} onPressEnter={this.handleSubmit}/>)} </Form.Item> </Col> ) } else if (item.type === 'select') { // 涓嬫媺鎼滅储 fields.push( <Col span={12} key={index}> - <Form.Item label={item.tooltip ? + <Form.Item help={item.help || null} label={item.tooltip ? <Tooltip placement="topLeft" overlayClassName={item.tooltipClass} title={item.tooltip}> <QuestionCircleOutlined className="mk-form-tip" /> {item.label} @@ -239,20 +276,20 @@ rules: [ { required: !!item.required, - message: this.props.dict['form.required.select'] + item.label + '!' + message: '璇烽�夋嫨' + item.label + '!' } ] })( <Select showSearch - filterOption={(input, option) => option.props.children[2].toLowerCase().indexOf(input.toLowerCase()) >= 0} + filterOption={(input, option) => option.props.children.toLowerCase().indexOf(input.toLowerCase()) >= 0} onChange={(value) => {this.optionChange(item.key, value)}} getPopupContainer={() => document.getElementById('winter')} allowClear={item.allowClear} > {item.options.map((option, index) => - <Select.Option id={`${index}`} title={option.text} key={`${index}`} value={option.value}> - {option.text} + <Select.Option title={option.text || option.label} key={index} value={option.value}> + {option.text || option.label} </Select.Option> )} </Select> @@ -274,7 +311,7 @@ rules: [ { required: !!item.required, - message: this.props.dict['form.required.select'] + item.label + '!' + message: '璇烽�夋嫨' + item.label + '!' } ] })( @@ -300,7 +337,7 @@ rules: [ { required: item.readonly ? false : !!item.required, - message: this.props.dict['form.required.input'] + item.label + '!' + message: '璇疯緭鍏�' + item.label + '!' } ] })(<TextArea rows={2} readOnly={item.readonly}/>)} @@ -321,11 +358,11 @@ rules: [ { required: !!item.required, - message: this.props.dict['form.required.select'] + item.label + '!' + message: '璇烽�夋嫨' + item.label + '!' } ] })( - <Cascader options={item.options || []} expandTrigger="hover" placeholder=""/> + <Cascader onChange={(value) => {this.optionChange(item.key, value)}} options={item.options || []} expandTrigger="hover" placeholder=""/> )} </Form.Item> </Col> @@ -340,6 +377,9 @@ return new Promise((resolve, reject) => { this.props.form.validateFieldsAndScroll((err, values) => { if (!err) { + if (values.outerBlacklist) { + values.outerBlacklist = values.outerBlacklist.replace(/\s/ig, '') + } resolve(values) } else { reject(err) @@ -360,7 +400,7 @@ } } return ( - <Form {...formItemLayout} className="menu-action-list-form" id="winter"> + <Form {...formItemLayout} className="menu-form-action-list" id="winter"> <Row gutter={24}>{this.getFields()}</Row> </Form> ) -- Gitblit v1.8.0