From 6c44bc79e5edc338b44fdc469220ddf0e3fc4028 Mon Sep 17 00:00:00 2001 From: king <18310653075@163.com> Date: 星期二, 14 九月 2021 22:51:27 +0800 Subject: [PATCH] 2021-09-14 --- src/menu/components/share/actioncomponent/actionform/index.jsx | 187 ++++++++++++++++++++++++++++++++++++---------- 1 files changed, 146 insertions(+), 41 deletions(-) diff --git a/src/menu/components/share/actioncomponent/actionform/index.jsx b/src/menu/components/share/actioncomponent/actionform/index.jsx index e584aea..9bf061d 100644 --- a/src/menu/components/share/actioncomponent/actionform/index.jsx +++ b/src/menu/components/share/actioncomponent/actionform/index.jsx @@ -2,24 +2,26 @@ import PropTypes from 'prop-types' import { fromJS } from 'immutable' import { Form, Row, Col, Input, Select, Icon, Radio, notification, Tooltip, InputNumber, Cascader } from 'antd' -import { btnIcons, btnCustomClasses, formRule } from '@/utils/option.js' +import { btnCustomClasses, formRule } from '@/utils/option.js' +import asyncComponent from '@/utils/asyncComponent' import './index.scss' const { TextArea } = Input +const MkIcon = asyncComponent(() => import('@/components/mkIcon')) const actionTypeOptions = { - pop: ['label', 'OpenType', 'intertype', 'Ot', 'show', 'icon', 'class', 'execSuccess', 'execError', 'resetPageIndex', 'syncComponent', 'width'], - prompt: ['label', 'OpenType', 'intertype', 'Ot', 'show', 'icon', 'class', 'execSuccess', 'execError', 'resetPageIndex', 'syncComponent', 'width'], - exec: ['label', 'OpenType', 'intertype', 'Ot', 'show', 'icon', 'class', 'execSuccess', 'execError', 'resetPageIndex', 'syncComponent', 'width'], + pop: ['label', 'OpenType', 'intertype', 'Ot', 'show', 'icon', 'class', 'execSuccess', 'execError', 'resetPageIndex', 'syncComponent', 'width', 'openmenu', 'open', 'output', 'refreshTab'], + prompt: ['label', 'OpenType', 'intertype', 'Ot', 'show', 'icon', 'class', 'execSuccess', 'execError', 'resetPageIndex', 'syncComponent', 'width', 'openmenu', 'open', 'output', 'refreshTab'], + exec: ['label', 'OpenType', 'intertype', 'Ot', 'show', 'icon', 'class', 'execSuccess', 'execError', 'resetPageIndex', 'syncComponent', 'width', 'openmenu', 'open', 'output', 'refreshTab'], excelIn: ['label', 'Ot', 'OpenType', 'intertype', 'show', 'icon', 'class', 'sheet', 'execSuccess', 'execError', 'resetPageIndex', 'syncComponent', 'width'], excelOut: ['label', 'OpenType', 'intertype', 'show', 'icon', 'class', 'execSuccess', 'execError', 'syncComponent', 'resetPageIndex', 'pagination', 'search', 'width'], - popview: ['label', 'Ot', 'OpenType', 'show', 'icon', 'class', 'popClose', 'resetPageIndex', 'width'], + popview: ['label', 'Ot', 'OpenType', 'show', 'icon', 'class', 'popClose', 'resetPageIndex', 'width', 'display', 'ratio', 'placement'], tab: ['label', 'Ot', 'OpenType', 'show', 'icon', 'class', 'linkmenu', 'width'], - innerpage: ['label', 'Ot', 'OpenType', 'pageTemplate', 'show', 'icon', 'class', 'width'], + innerpage: ['label', 'Ot', 'OpenType', 'pageTemplate', 'show', 'icon', 'class', 'width', 'open'], funcbutton: ['label', 'OpenType', 'funcType', 'show', 'icon', 'class', 'width'] } -class MainSearch extends Component { +class ActionForm extends Component { static propTpyes = { dict: PropTypes.object, // 瀛楀吀椤� type: PropTypes.any, // type涓�"card"鏃讹紝鍙彲閫夊崟琛屾垨涓嶉�夎 @@ -35,6 +37,9 @@ interType: null, // 鎺ュ彛绫诲瀷锛氬唴閮ㄣ�佸閮� funcType: null, // 鍔熻兘绫诲瀷 procMode: null, // 鍙傛暟鏂瑰紡 + pageTemplate: null, + appType: sessionStorage.getItem('appType'), + Ot: null, requireOptions: [{ value: 'notRequired', text: this.props.dict['header.form.notRequired'] @@ -89,16 +94,20 @@ let _opentype = card.OpenType // 鎵撳紑鏂瑰紡 let _intertype = card.intertype || 'system' // 鎺ュ彛绫诲瀷 - let _funcType = card.funcType || 'print' // 鍔熻兘鎸夐挳榛樿绫诲瀷 - let _procMode = card.procMode || 'system' // 鍙傛暟璇锋眰鏂瑰紡 + let _funcType = card.funcType || '' // 鍔熻兘鎸夐挳榛樿绫诲瀷 + let _procMode = card.procMode || 'system' + let _Ot = card.Ot || 'requiredSgl' + let _pageTemplate = card.pageTemplate || '' - let _options = this.getOptions(_opentype, _intertype, _funcType, card.pageTemplate, _procMode) + let _options = this.getOptions(_opentype, _intertype, _funcType, _pageTemplate, _procMode, _Ot) this.setState({ + Ot: _Ot, openType: _opentype, interType: _intertype, procMode: _procMode, funcType: _funcType, + pageTemplate: _pageTemplate, formlist: this.props.formlist.map(item => { if (item.key === 'class') { item.options = btnCustomClasses @@ -107,14 +116,12 @@ } else if (item.key === 'intertype') { let iscustom = ['pop', 'prompt', 'exec'].includes(_opentype) item.options = this.state.interTypeOptions.filter(op => (iscustom || op.value !== 'custom')) - } else if (item.key === 'icon') { - item.options = btnIcons } else if (item.key === 'Ot') { if (type === 'card') { item.options = this.state.requireOptions.filter(op => ['notRequired', 'requiredSgl'].includes(op.value)) - } else if (card.pageTemplate === 'pay') { // 琛岀骇鎸夐挳銆佹敮浠樻寜閽紝鍙兘閫夊崟琛� + } else if (_pageTemplate === 'pay') { // 琛岀骇鎸夐挳銆佹敮浠樻寜閽紝鍙兘閫夊崟琛� item.options = this.state.requireOptions.filter(op => ['requiredSgl'].includes(op.value)) - } else if (['innerpage', 'blank', 'tab', 'popview', 'excelIn'].includes(_opentype)) { + } else if (['innerpage', 'tab', 'popview', 'excelIn'].includes(_opentype)) { item.options = this.state.requireOptions.filter(op => ['notRequired', 'requiredSgl'].includes(op.value)) } else if (card.sqlType === 'insert') { item.options = this.state.requireOptions.filter(op => ['notRequired', 'requiredSgl', 'required'].includes(op.value)) @@ -137,12 +144,16 @@ }) } - getOptions = (_opentype, _intertype, _funcType, _pageTemplate, _procMode) => { - let _options = fromJS(actionTypeOptions[_opentype]).toJS() // 閫夐」鍒楄〃 + getOptions = (_opentype, _intertype, _funcType, _pageTemplate, _procMode, _Ot) => { + let _options = actionTypeOptions[_opentype] ? fromJS(actionTypeOptions[_opentype]).toJS() : [] // 閫夐」鍒楄〃 if (_opentype === 'innerpage') { // 鏂伴〉闈紝鍙�夋ā鏉�(鑷畾涔夋椂锛屽彲濉叆澶栭儴閾炬帴) if (_pageTemplate === 'custom') { _options.push('url', 'joint') + } else if (_pageTemplate === 'page') { + _options.push('copyMenuId', 'joint') + } else if (_pageTemplate === 'linkpage') { + _options.push('linkmenu', 'joint') } } else if (_opentype === 'excelOut') { // 瀵煎叆瀵煎嚭 if (_intertype === 'outer') { @@ -158,16 +169,21 @@ } } else if (_opentype === 'funcbutton') { if (_funcType === 'print') { - _options.push('execMode', 'intertype', 'Ot', 'execSuccess', 'execError', 'resetPageIndex') + _options.push('execMode', 'intertype', 'Ot', 'execSuccess', 'execError', 'resetPageIndex', 'controlField', 'controlVal') if (_intertype === 'outer') { _options.push('innerFunc', 'sysInterface', 'interface', 'proInterface', 'outerFunc', 'callbackFunc') } else if (_intertype === 'inner') { _options.push('innerFunc') } + } else if (_funcType === 'mkBinding' || _funcType === 'mkUnBinding') { + _options.push('execSuccess', 'execError') + } else if (_funcType === 'closetab') { + _options.push('refreshTab') } } else if (_opentype !== 'popview' && _opentype !== 'tab') { if (_intertype === 'custom') { - _options.push('procMode', 'interface', 'callbackType', 'cbTable', 'proInterface', 'method') + _options = _options.filter(m => m !== 'output') + _options.push('procMode', 'interface', 'callbackType', 'cbTable', 'proInterface', 'method', 'cross') if (_procMode === 'system') { _options.push('sql', 'sqlType') } else { @@ -182,6 +198,13 @@ } } + if (_Ot !== 'notRequired' && _opentype !== 'excelOut' && _opentype !== 'funcbutton') { + _options.push('controlField', 'controlVal') + } + if (_Ot === 'requiredSgl' && ['pop', 'prompt', 'exec'].includes(_opentype)) { + _options.push('swipe') + } + return _options } @@ -192,7 +215,7 @@ try { let _form = document.getElementById('label') _form && _form.select() - } catch { + } catch (e) { console.warn('琛ㄥ崟focus澶辫触锛�') } } @@ -206,13 +229,12 @@ */ optionChange = (key, value) => { const { card, type } = this.props - const { openType, procMode } = this.state + const { openType, procMode, Ot, pageTemplate } = this.state if (key === 'OpenType') { - let _options = this.getOptions(value, 'system', this.state.funcType, card.pageTemplate, 'system') + let _options = this.getOptions(value, 'system', this.state.funcType, '', 'system', Ot) let _fieldval = {} - let _formlist = this.state.formlist.map(item => { item.hidden = !_options.includes(item.key) @@ -228,7 +250,7 @@ } else if (item.key === 'Ot') { if (type === 'card') { item.options = this.state.requireOptions.filter(op => ['notRequired', 'requiredSgl'].includes(op.value)) - } else if (['innerpage', 'blank', 'tab', 'popview'].includes(value)) { + } else if (['innerpage', 'tab', 'popview'].includes(value)) { item.options = this.state.requireOptions.filter(op => ['notRequired', 'requiredSgl'].includes(op.value)) _fieldval.Ot = 'requiredSgl' } else if (value === 'excelIn') { @@ -244,6 +266,8 @@ item.options = this.state.insertUpdateOptions } _fieldval.sqlType = '' + } else if (item.key === 'pageTemplate') { + item.initVal = '' } return item @@ -253,6 +277,7 @@ openType: value, intertype: 'system', procMode: 'system', + pageTemplate: '', formlist: _formlist }, () => { if (value === 'excelIn') { @@ -266,7 +291,7 @@ this.props.form.setFieldsValue(_fieldval) }) } else if (key === 'funcType') { - let _options = this.getOptions(this.state.openType, this.state.interType, value, card.pageTemplate, procMode) + let _options = this.getOptions(openType, this.state.interType, value, pageTemplate, procMode, Ot) let _fieldval = {} this.setState({ @@ -314,7 +339,7 @@ _fieldval.Ot = 'requiredSgl' } else if (value === 'audit') { _fieldval.label = '瀹℃牳' - _fieldval.class = 'purple' + _fieldval.class = 'primary' _fieldval.Ot = 'requiredSgl' } else if (value === 'LogicDelete' || value === 'delete') { _fieldval.label = '鍒犻櫎' @@ -330,10 +355,10 @@ }) } else if (key === 'pageTemplate') { let _fieldval = {} - let _options = this.getOptions(this.state.openType, this.state.interType, this.state.funcType, value, procMode) + let _options = this.getOptions(openType, this.state.interType, this.state.funcType, value, procMode, Ot) this.setState({ - openType: value, + pageTemplate: value, formlist: this.state.formlist.map(item => { item.hidden = !_options.includes(item.key) @@ -354,7 +379,7 @@ this.props.form.setFieldsValue(_fieldval) }) } else if (key === 'intertype') { - let _options = this.getOptions(openType, value, this.state.funcType, '', procMode) + let _options = this.getOptions(openType, value, this.state.funcType, pageTemplate, procMode, Ot) this.setState({ interType: value, @@ -376,7 +401,7 @@ }) }) } else if (key === 'procMode') { - let _options = this.getOptions(openType, this.state.interType, this.state.funcType, '', value) + let _options = this.getOptions(openType, this.state.interType, this.state.funcType, pageTemplate, value, Ot) this.setState({ procMode: value, @@ -386,6 +411,16 @@ if (item.key === 'innerFunc') { item.required = true } + return item + }) + }) + } else if (key === 'Ot') { + let _options = this.getOptions(openType, this.state.interType, this.state.funcType, pageTemplate, procMode, value) + + this.setState({ + Ot: value, + formlist: this.state.formlist.map(item => { + item.hidden = !_options.includes(item.key) return item }) }) @@ -471,6 +506,14 @@ </Form.Item> </Col> ) + } else if (item.type === 'tip') { + fields.push( + <Col span={12} key={index}> + <Form.Item label={item.label}> + {item} + </Form.Item> + </Col> + ) } else if (item.type === 'number') { fields.push( <Col span={12} key={index}> @@ -492,7 +535,7 @@ </Form.Item> </Col> ) - } else if (item.type === 'select') { // 涓嬫媺鎼滅储 + } else if (item.type === 'select') { fields.push( <Col span={12} key={index}> <Form.Item label={item.tooltip ? @@ -512,13 +555,14 @@ })( <Select showSearch - filterOption={(input, option) => option.props.children[2].toLowerCase().indexOf(input.toLowerCase()) >= 0} + allowClear={item.allowClear === true} + filterOption={(input, option) => option.props.children.toLowerCase().indexOf(input.toLowerCase()) >= 0} onChange={(value) => {this.optionChange(item.key, value)}} getPopupContainer={() => document.getElementById('winter')} > {item.options.map((option, index) => - <Select.Option id={`${index}`} title={option.text} key={`${index}`} value={option.value}> - {item.key === 'icon' && option.value && <Icon type={option.value} />} {option.text} + <Select.Option key={index} value={(option.value || option.field)}> + {(option.text || option.label)} </Select.Option> )} </Select> @@ -529,7 +573,12 @@ } else if (item.type === 'radio') { fields.push( <Col span={12} key={index}> - <Form.Item label={item.label}> + <Form.Item label={item.tooltip ? + <Tooltip placement="topLeft" overlayClassName={item.tooltipClass} title={item.tooltip}> + <Icon type="question-circle" /> + {item.label} + </Tooltip> : item.label + }> {getFieldDecorator(item.key, { initialValue: item.initVal, rules: [ @@ -571,7 +620,12 @@ } else if (item.type === 'cascader') { // 澶氶�� fields.push( <Col span={12} key={index}> - <Form.Item label={item.label}> + <Form.Item label={item.tooltip ? + <Tooltip placement="topLeft" overlayClassName={item.tooltipClass} title={item.tooltip}> + <Icon type="question-circle" /> + {item.label} + </Tooltip> : item.label + }> {getFieldDecorator(item.key, { initialValue: item.initVal || [], rules: [ @@ -586,10 +640,33 @@ </Form.Item> </Col> ) - } else if (item.type === 'mcascader') { + } else if (item.type === 'icon') { fields.push( <Col span={12} key={index}> <Form.Item label={item.label}> + {getFieldDecorator(item.key, { + initialValue: item.initVal, + rules: [ + { + required: !!item.required, + message: this.props.dict['form.required.select'] + item.label + '!' + } + ] + })( + <MkIcon allowClear/> + )} + </Form.Item> + </Col> + ) + } else if (item.type === 'mcascader') { + fields.push( + <Col span={12} key={index}> + <Form.Item label={item.tooltip ? + <Tooltip placement="topLeft" overlayClassName={item.tooltipClass} title={item.tooltip}> + <Icon type="question-circle" /> + {item.label} + </Tooltip> : item.label + }> {getFieldDecorator(item.key, { initialValue: item.initVal })( @@ -604,13 +681,14 @@ } handleConfirm = () => { - const { setting } = this.props + const { setting, card } = this.props // 琛ㄥ崟鎻愪氦鏃舵鏌ヨ緭鍏ュ�兼槸鍚︽纭� return new Promise((resolve, reject) => { this.props.form.validateFieldsAndScroll((err, values) => { if (!err) { - values.uuid = this.props.card.uuid - values.verify = this.props.card.verify || null + values.uuid = card.uuid + values.verify = card.verify || null + values.modal = card.modal || null if (values.show === 'icon' && !values.icon) { notification.warning({ @@ -631,8 +709,35 @@ values.Ot = 'notRequired' } else if (['pop', 'prompt', 'exec'].includes(values.OpenType) && values.verify) { - if ((values.Ot === 'requiredOnce' || this.props.card.Ot === 'requiredOnce') && this.props.card.Ot !== values.Ot) { + if ((values.Ot === 'requiredOnce' || card.Ot === 'requiredOnce') && card.Ot !== values.Ot) { values.verify.uniques = [] + } + if (card.Ot !== values.Ot) { + if (values.Ot === 'notRequired') { + values.verify.invalid = 'false' + } else if (card.Ot === 'notRequired' && values.Ot !== 'notRequired') { + values.verify.invalid = 'true' + } + } + } else if (values.OpenType === 'tab' && values.linkmenu) { + if (sessionStorage.getItem('thdMenuList')) { + let list = null + try { + list = JSON.parse(sessionStorage.getItem('thdMenuList')) || [] + } catch (e) { + list = [] + } + + let id = values.linkmenu[values.linkmenu.length - 1] + + list.forEach(item => { + if (item.MenuID === id) { + values.MenuID = id + values.MenuName = item.MenuName + values.MenuNo = item.MenuNo + values.tabType = item.type + } + }) } } @@ -663,4 +768,4 @@ } } -export default Form.create()(MainSearch) \ No newline at end of file +export default Form.create()(ActionForm) \ No newline at end of file -- Gitblit v1.8.0