From e8edfdadb561cd83bf6e1c3e00d55b8cc2aee6d5 Mon Sep 17 00:00:00 2001 From: king <18310653075@163.com> Date: 星期一, 17 十月 2022 17:57:34 +0800 Subject: [PATCH] 2022-10-17 --- src/templates/formtabconfig/settingform/index.jsx | 243 ++++++++++++++++++++++++++---------------------- 1 files changed, 132 insertions(+), 111 deletions(-) diff --git a/src/templates/formtabconfig/settingform/index.jsx b/src/templates/formtabconfig/settingform/index.jsx index c724b8b..bc10e56 100644 --- a/src/templates/formtabconfig/settingform/index.jsx +++ b/src/templates/formtabconfig/settingform/index.jsx @@ -1,40 +1,35 @@ import React, {Component} from 'react' import PropTypes from 'prop-types' -import { Form, Row, Col, Input, Radio, Select, Tooltip, Icon, notification } from 'antd' +import { Form, Row, Col, Input, Radio, Select, Tooltip, notification, InputNumber } from 'antd' +import { QuestionCircleOutlined } from '@ant-design/icons' + import { formRule } from '@/utils/option.js' +import Utils from '@/utils/utils.js' import './index.scss' const { TextArea } = Input class SettingForm extends Component { static propTpyes = { - dict: PropTypes.object, // 瀛楀吀椤� menu: PropTypes.object, config: PropTypes.object, - usefulFields: PropTypes.array + inputSubmit: PropTypes.any // 鍥炶溅鎻愪氦浜嬩欢 } state = { interType: (this.props.config.setting && this.props.config.setting.interType) || 'inner', columns: null, - currentTabs: null, - selectTabs: [], - interReadonly: false + usefulFields: [], + interReadonly: false, } UNSAFE_componentWillMount() { - const { config, menu } = this.props + const { config } = this.props - let _tabs = [] - let _select = [] - let _tabMap = new Map() let _columns = [] let _setting = config.setting try { - if (menu && menu.LongParam) { - _columns = menu.LongParam.columns.filter(item => item.field && item.type !== 'colspan') - } config.groups.forEach(group => { let list = group.sublist.filter(item => item.field) _columns = [..._columns, ...list] @@ -49,35 +44,32 @@ return true } }) - } catch { + } catch (e) { notification.warning({ top: 92, message: '鑿滃崟淇℃伅閿欒锛�', - duration: 10 + duration: 5 }) } - config.tabgroups.forEach(groupname => { - config[groupname].forEach(tab => { - if (tab.origin) return - - _tabs.push(tab) - _tabMap.set(tab.uuid, true) - }) - }) - - _setting.subtabs && _setting.subtabs.forEach(tabId => { - if (_tabMap.has(tabId)) { - _select.push(tabId) + let usefulFields = sessionStorage.getItem('permFuncField') + if (usefulFields) { + try { + usefulFields = JSON.parse(usefulFields) + } catch (e) { + usefulFields = [] } - }) + } else { + usefulFields = [] + } this.setState({ - currentTabs: _tabs, - selectTabs: _select, columns: _columns, setting: _setting, - interReadonly: _setting.sysInterface === 'true' + interType: _setting.interType || 'inner', + interReadonly: _setting.sysInterface === 'true', + datatype: _setting.datatype || 'maintable', + usefulFields }) } @@ -86,6 +78,17 @@ return new Promise((resolve, reject) => { this.props.form.validateFieldsAndScroll((err, values) => { if (!err) { + let error = Utils.verifySql(values.dataresource) + + if (error) { + notification.warning({ + top: 92, + message: '鏁版嵁婧愪腑涓嶅彲浣跨敤' + error, + duration: 5 + }) + return + } + resolve(values) } else { reject(err) @@ -97,7 +100,7 @@ onSysChange = (e) => { if (e.target.value === 'true') { this.props.form.setFieldsValue({ - interface: window.GLOB.mainSystemApi || window.GLOB.subSystemApi + interface: window.GLOB.mainSystemApi || '' }) this.setState({ interReadonly: true @@ -118,7 +121,7 @@ let _type = this.props.form.getFieldValue('sysInterface') if (_type === 'true') { this.props.form.setFieldsValue({ - interface: window.GLOB.mainSystemApi || window.GLOB.subSystemApi + interface: window.GLOB.mainSystemApi || '' }) this.setState({ interReadonly: true @@ -131,10 +134,42 @@ }) } + sourceChange = (e) => { + const { interType } = this.state + + this.setState({ + datatype: e.target.value + }, () => { + if (interType === 'inner') return + + let _type = this.props.form.getFieldValue('sysInterface') + if (_type === 'true') { + this.props.form.setFieldsValue({ + interface: window.GLOB.mainSystemApi || '' + }) + this.setState({ + interReadonly: true + }) + } else { + this.setState({ + interReadonly: false + }) + } + }) + } + + handleSubmit = (e) => { + e.preventDefault() + + if (this.props.inputSubmit) { + this.props.inputSubmit() + } + } + render() { - const { dict, usefulFields, menu } = this.props + const { menu } = this.props const { getFieldDecorator } = this.props.form - const { interType, columns, selectTabs, setting } = this.state + const { interType, setting, datatype, usefulFields } = this.state const formItemLayout = { labelCol: { @@ -145,17 +180,6 @@ xs: { span: 24 }, sm: { span: 16 } } - } - - let primaryKey = setting.primaryKey - if (primaryKey) { - let field = columns.filter(column => column.field === primaryKey) - if (field.length !== 1) { - primaryKey = '' - } - } - if (!primaryKey && columns.length === 0) { - primaryKey = 'ID' } let str = '^(' + usefulFields.join('|') + ')' @@ -171,14 +195,14 @@ rules: [ { required: true, - message: dict['form.required.input'] + '琛ㄥ悕!' + message: '璇疯緭鍏ヨ〃鍚�!' }, { - max: formRule.input.max, - message: formRule.input.message + max: 50, + message: '琛ㄥ悕鏈�闀夸负50涓瓧绗�!' } ] - })(<Input placeholder="" autoComplete="off" />)} + })(<Input placeholder="" autoComplete="off" onPressEnter={this.handleSubmit} />)} </Form.Item> </Col> <Col span={12}> @@ -190,56 +214,76 @@ <Select.Option value="1">1鍒�</Select.Option> <Select.Option value="2">2鍒�</Select.Option> <Select.Option value="3">3鍒�</Select.Option> + <Select.Option value="4">4鍒�</Select.Option> </Select> )} </Form.Item> </Col> <Col span={12}> - <Form.Item label={dict['header.form.intertype']}> - {getFieldDecorator('interType', { - initialValue: setting.interType || 'inner' + <Form.Item label="鏁版嵁鏉ユ簮"> + {getFieldDecorator('datatype', { + initialValue: setting.datatype || 'query' })( - <Radio.Group onChange={this.onChange}> - <Radio value="inner">{dict['header.form.interface.inner']}</Radio> - <Radio value="outer">{dict['header.form.interface.outer']}</Radio> + <Radio.Group onChange={this.sourceChange}> + <Radio value="maintable">涓昏〃</Radio> + <Radio value="query">鏌ヨ</Radio> </Radio.Group> )} </Form.Item> </Col> - {interType === 'outer' ? <Col span={12}> - <Form.Item label={dict['header.form.sysInterface']}> - {getFieldDecorator('sysInterface', { - initialValue: setting.sysInterface || 'false' + <Col span={12}> + <Form.Item label="涓婚敭"> + {getFieldDecorator('primaryKey', { + initialValue: setting.primaryKey + })(<Input placeholder="" autoComplete="off" disabled/>)} + </Form.Item> + </Col> + {datatype === 'query' ? <Col span={12}> + <Form.Item label="鎺ュ彛绫诲瀷"> + {getFieldDecorator('interType', { + initialValue: interType })( - <Radio.Group onChange={this.onSysChange}> - <Radio value="true">{dict['header.form.true']}</Radio> - <Radio value="false">{dict['header.form.false']}</Radio> + <Radio.Group onChange={this.onChange}> + <Radio value="inner">鍐呴儴</Radio> + <Radio value="outer">澶栭儴</Radio> </Radio.Group> )} </Form.Item> </Col> : null} - {interType === 'outer' ? <Col span={12}> - <Form.Item label={dict['header.form.interface']}> + {datatype === 'query' && interType === 'outer' ? <Col span={12}> + <Form.Item label="绯荤粺鎺ュ彛"> + {getFieldDecorator('sysInterface', { + initialValue: setting.sysInterface || 'false' + })( + <Radio.Group onChange={this.onSysChange}> + <Radio value="true">鏄�</Radio> + <Radio value="false">鍚�</Radio> + </Radio.Group> + )} + </Form.Item> + </Col> : null} + {datatype === 'query' && interType === 'outer' ? <Col span={12}> + <Form.Item label="鎺ュ彛鍦板潃"> {getFieldDecorator('interface', { - initialValue: setting.sysInterface === 'true' ? (window.GLOB.mainSystemApi || window.GLOB.subSystemApi) : (setting.interface || ''), + initialValue: setting.sysInterface === 'true' ? (window.GLOB.mainSystemApi || '') : (setting.interface || ''), rules: [ { required: true, - message: dict['form.required.input'] + dict['header.form.interface'] + '!' + message: '璇疯緭鍏ユ帴鍙e湴鍧�!' }, { max: formRule.input.max, message: formRule.input.message } ] - })(<Input placeholder="" autoComplete="off" disabled={this.state.interReadonly} />)} + })(<Input placeholder="" autoComplete="off" disabled={this.state.interReadonly} onPressEnter={this.handleSubmit} />)} </Form.Item> </Col> : null} - {interType !== 'outer' ? <Col span={12}> + {datatype === 'query' && interType !== 'outer' ? <Col span={12}> <Form.Item label={ <Tooltip placement="topLeft" overlayClassName="middle" title={`鍙嚜瀹氫箟鏁版嵁澶勭悊鍑芥暟锛屽嚱鏁板悕绉伴渶浠�${usefulFields.join(', ')}绛夊瓧绗﹀紑濮嬶紱鏈缃椂浼氳皟鐢ㄧ郴缁熷嚱鏁帮紝浣跨敤绯荤粺鍑芥暟闇�瀹屽杽鏁版嵁婧愩�俙}> - <Icon type="question-circle" /> - {dict['header.form.innerFunc']} + <QuestionCircleOutlined className="mk-form-tip" /> + 鍐呴儴鍑芥暟 </Tooltip> }> {getFieldDecorator('innerFunc', { @@ -253,14 +297,14 @@ message: formRule.func.maxMessage } ] - })(<Input placeholder="" autoComplete="off" />)} + })(<Input placeholder="" autoComplete="off" onPressEnter={this.handleSubmit} />)} </Form.Item> </Col> : null} - {interType !== 'outer' ? <Col span={24}> + {datatype === 'query' && interType !== 'outer' ? <Col span={24}> <Form.Item help={'鏁版嵁ID锛�' + menu.MenuID} label={ <Tooltip placement="topLeft" title="浣跨敤绯荤粺鍑芥暟鏃讹紝闇�濉啓鏁版嵁婧愶紝鑷畾涔夊嚱鏁版椂锛屽彲蹇界暐銆�"> - <Icon type="question-circle" /> - {'鏁版嵁婧�'} + <QuestionCircleOutlined className="mk-form-tip" /> + 鏁版嵁婧� </Tooltip> } className="textarea"> {getFieldDecorator('dataresource', { @@ -268,8 +312,8 @@ })(<TextArea rows={4} />)} </Form.Item> </Col> : null} - {interType === 'outer' ? <Col span={12}> - <Form.Item label={dict['header.form.outerFunc']}> + {datatype === 'query' && interType === 'outer' ? <Col span={12}> + <Form.Item label="澶栭儴鍑芥暟"> {getFieldDecorator('outerFunc', { initialValue: setting.outerFunc || '', rules: [ @@ -281,47 +325,24 @@ message: formRule.func.maxMessage } ] - })(<Input placeholder="" autoComplete="off" />)} + })(<Input placeholder="" autoComplete="off" onPressEnter={this.handleSubmit} />)} </Form.Item> </Col> : null} - <Col span={12}> - <Form.Item label="涓婚敭"> - {getFieldDecorator('primaryKey', { - initialValue: primaryKey - })( - <Select - getPopupContainer={() => document.getElementById('commontable-setting-form')} - > - <Select.Option key='unset' value="">涓嶈缃�</Select.Option> - {columns.length === 0 ? - <Select.Option key='id' value="ID">ID</Select.Option> : null - } - {columns.map((option, index) => - <Select.Option id={option.uuid} title={option.label} key={index} value={option.field}>{option.label}</Select.Option> - )} - </Select> - )} + <Form.Item label="瀹藉害"> + {getFieldDecorator('width', { + initialValue: setting.width || 100 + })(<InputNumber min={10} max={100} precision={0} />)} </Form.Item> </Col> <Col span={12}> - <Form.Item label={ - <Tooltip placement="topLeft" title="涓昏〃鍙�夊彇鍏宠仈鏍囩锛屾爣绛惧叧鑱斿悗锛屼富琛ㄦ暟鎹垏鎹㈡椂锛屼笅绾ф爣绛句細璺熼殢涓昏〃涓婚敭鍊煎彉鍖栥��"> - <Icon type="question-circle" /> - {'涓嬬骇鏍囩'} - </Tooltip> - }> - {getFieldDecorator('subtabs', { - initialValue: selectTabs + <Form.Item label="鍒濆鍖�"> + {getFieldDecorator('onload', { + initialValue: setting.onload || 'true' })( - <Select - mode="multiple" - style={{ width: '100%' }} - placeholder="Please select" - > - {this.state.currentTabs.map((option, index) => - <Select.Option id={option.uuid} title={option.label} key={index} value={option.uuid}>{option.label}</Select.Option> - )} + <Select> + <Select.Option value="true">鍔犺浇鏁版嵁</Select.Option> + <Select.Option value="false">涓嶅姞杞芥暟鎹�</Select.Option> </Select> )} </Form.Item> -- Gitblit v1.8.0