From 9a11e62adeb8d435b52a361eb62d5b59e1deef2a Mon Sep 17 00:00:00 2001 From: king <18310653075@163.com> Date: 星期四, 23 五月 2024 21:14:50 +0800 Subject: [PATCH] 2024-05-23 --- src/mob/modalconfig/index.jsx | 250 ++++++++++++++----------------------------------- 1 files changed, 73 insertions(+), 177 deletions(-) diff --git a/src/mob/modalconfig/index.jsx b/src/mob/modalconfig/index.jsx index 6bc2fbb..8ef83d0 100644 --- a/src/mob/modalconfig/index.jsx +++ b/src/mob/modalconfig/index.jsx @@ -3,14 +3,10 @@ import { is, fromJS } from 'immutable' import { DndProvider } from 'react-dnd' import HTML5Backend from 'react-dnd-html5-backend' -import moment from 'moment' -import { Button, Modal, Collapse, notification, Switch } from 'antd' +import { Button, Modal, Collapse, Switch, message } from 'antd' import { LeftOutlined } from '@ant-design/icons' -import Api from '@/api' -import Utils from '@/utils/utils.js' import { getModalForm } from '@/templates/zshare/formconfig' - import SourceElement from '@/templates/modalconfig/dragelement/source' import SettingForm from '@/templates/modalconfig/settingform' import asyncComponent from '@/utils/asyncComponent' @@ -20,8 +16,9 @@ const { Panel } = Collapse const { confirm } = Modal -const PasteComponent = asyncComponent(() => import('./pastecomponent')) +const TableComponent = asyncComponent(() => import('@/menu/modalconfig/tablecomponent')) const ModalForm = asyncComponent(() => import('@/templates/zshare/modalform')) +const PasteForms = asyncComponent(() => import('@/menu/components/share/pasteforms')) const DragElement = asyncComponent(() => import('@/mob/components/formdragelement')) const FieldsComponent = asyncComponent(() => import('@/templates/sharecomponent/fieldscomponent')) @@ -41,7 +38,6 @@ originConfig: null, // 鍘熷鑿滃崟 sqlVerifing: false, // sql楠岃瘉 showField: false, // 鏄剧ず琛ㄥ崟瀛楁鍊� - standardform: null, saving: false } @@ -61,7 +57,7 @@ } componentDidMount () { - MKEmitter.addListener('submitStyle', this.getStyle) + window.GLOB.formId = '' MKEmitter.addListener('completeSave', this.completeSave) } @@ -72,30 +68,11 @@ this.setState = () => { return } - MKEmitter.removeListener('submitStyle', this.getStyle) MKEmitter.removeListener('completeSave', this.completeSave) } completeSave = () => { this.setState({saving: false}) - } - - getStyle = (comIds, style) => { - const { config } = this.state - - if (comIds[0] !== 'form') return - - let Index = config.fields.findIndex(n => n.uuid === comIds[1]) - - if (Index === -1) return - - let _config = fromJS(config).toJS() - - _config.fields[Index].style = style - - this.setState({ - config: _config - }) } /** @@ -127,103 +104,20 @@ * 3銆佽缃紪杈戝弬鏁伴」-formlist */ handleForm = (_card) => { - const { componentConfig } = this.props + const { componentConfig, btn } = this.props const { config } = this.state + let card = fromJS(_card).toJS() - let _inputfields = [] - let _tabfields = [] - let _linkableFields = [] - let _linksupFields = [] - let standardform = null - let uniq = new Map() - let index = null - uniq.set(card.field, true) - - let _inputIndex = 1 - let _tabIndex = 1 - let _linkIndex = 1 - config.fields.forEach((item, i) => { - if (card.uuid === item.uuid) { - index = i - } - - let label = item.label || '' - if (item.field && item.field.toLowerCase() !== label.toLowerCase()) { - label = label + ' (' + item.field + ')' - } - - if (['text', 'number', 'textarea', 'color'].includes(item.type) && card.field !== item.field) { - _inputfields.push({ - field: item.field, - label: _inputIndex + '銆�' + label - }) - _inputIndex++ - } - if (card.field !== item.field && item.hidden !== 'true' && ['text', 'number', 'select', 'link'].includes(item.type)) { - _tabfields.push({ - field: item.field, - label: _tabIndex + '銆�' + label - }) - _tabIndex++ - } - - if (item.type === 'switch') { - _linksupFields.push({ - field: item.field, - label: _linkIndex + '銆�' + label - }) - } - - if (!['select', 'link', 'radio', 'checkcard'].includes(item.type)) return - if (item.type === 'checkcard' && item.multiple === 'true') return // 閫夐」鍗″閫� - if (item.field && !uniq.has(item.field)) { - uniq.set(item.field, true) - - _linkableFields.push({ - field: item.field, - label: _linkIndex + '銆�' + item.label + ' (琛ㄥ崟)' - }) - _linksupFields.push({ - field: item.field, - label: _linkIndex + '銆�' + label - }) - _linkIndex++ - } - }) - - _tabfields.unshift({field: '', label: '鍘熻〃鍗�'}) - - if (index !== null) { - if (index === 0) { - standardform = config.fields[index + 1] || null - } else { - standardform = config.fields[index - 1] || null - } - } - - componentConfig.columns.forEach(col => { - if (col.field && !uniq.has(col.field)) { - uniq.set(col.field, true) - - _linkableFields.push({ - field: col.field, - label: _linkIndex + '銆�' + col.label + ' (鏄剧ず鍒�)' - }) - _linkIndex++ - } - }) - - if (card.linkSubField && card.linkSubField.length > 0) { - let fields = _inputfields.map(item => item.field) - card.linkSubField = card.linkSubField.filter(item => fields.includes(item)) + let columns = componentConfig.columns + if (btn.$sub) { + columns = componentConfig.subColumns || [] } this.setState({ - standardform, visible: true, card: card, - formlist: getModalForm(card, _inputfields, _tabfields, _linkableFields, _linksupFields, componentConfig.columns) + formlist: getModalForm(card, config.fields, columns) }) } @@ -234,70 +128,33 @@ * 3銆侀�氳繃loading鍒锋柊 */ handleSubmit = () => { - this.formRef.handleConfirm().then(res => { - let _config = fromJS(this.state.config).toJS() - let fieldrepet = false // 瀛楁閲嶅 + let _config = fromJS(this.state.config).toJS() + this.formRef.handleConfirm(_config.fields).then(res => { _config.fields = _config.fields.map(item => { - if (item.uuid !== res.uuid && res.field && item.field && item.field.toLowerCase() === res.field.toLowerCase()) { - fieldrepet = true - } + delete item.focus - if (item.uuid === res.uuid) { - if (item.style) { - res.style = item.style - } - return res + if (item.uuid === res.values.uuid) { + return res.values } else { return item } }) - if (fieldrepet) { - notification.warning({ - top: 92, - message: '瀛楁宸插瓨鍦紒', - duration: 10 - }) - return - } - - if (['select', 'multiselect', 'link', 'checkbox', 'radio', 'checkcard'].includes(res.type) && res.resourceType === '1' && /\s/.test(res.dataSource)) { + if (res.loading) { this.setState({ sqlVerifing: true }) - let param = { - func: 's_debug_sql', - exec_type: 'y', - LText: res.dataSource - } - - param.timestamp = moment().format('YYYY-MM-DD HH:mm:ss') - param.LText = param.LText.replace(/@\$|\$@/ig, '').replace(/@(BID|ID|LoginUID|SessionUid|UserID|Appkey|time_id)@/ig, `'${param.timestamp}'`) - - param.LText = Utils.formatOptions(param.LText) - param.secretkey = Utils.encrypt('', param.timestamp) - - if (window.GLOB.mainSystemApi && res.database === 'sso') { - param.rduri = window.GLOB.mainSystemApi - } - - Api.genericInterface(param).then(result => { - if (result.status) { - this.setState({ - sqlVerifing: false, - config: _config, - card: null, - visible: false - }) - } else { - this.setState({sqlVerifing: false}) - - Modal.error({ - title: result.message - }) - } + res.promise().then(() => { + this.setState({ + sqlVerifing: false, + config: _config, + card: null, + visible: false + }) + }, () => { + this.setState({sqlVerifing: false}) }) } else { this.setState({ @@ -416,12 +273,46 @@ }) } - insert = (config) => { + pasteFields = (items) => { + let _config = fromJS(this.state.config).toJS() + _config.fields = items + this.setState({ - config - }, () => { - this.handleForm(config.fields[config.fields.length - 1]) + config: _config }) + } + + triggerCopy = () => { + const { config } = this.state + + let val = { + copyType: 'forms', + fields: config.fields || [] + } + + if (val.fields.length === 0) { + message.warning('琛ㄥ崟鍏冪礌涓嶅彲涓虹┖锛�') + return + } + + try { + val = window.btoa(window.encodeURIComponent(JSON.stringify(val))) + } catch (e) { + console.warn(e) + message.warning('澶嶅埗澶辫触锛岃閲嶈瘯锛�') + val = '' + } + + if (val) { + let oInput = document.createElement('input') + oInput.value = val + document.body.appendChild(oInput) + oInput.select() + document.execCommand('Copy') + document.body.removeChild(oInput) + + message.success('澶嶅埗鎴愬姛銆�') + } } clearConfig = () => { @@ -439,13 +330,16 @@ render () { const { btn } = this.props - const { config, saving } = this.state + const { config, saving, card } = this.state return ( <div className="mob-form-board"> <DndProvider backend={HTML5Backend}> <div className="tools"> <Collapse accordion defaultActiveKey="1" bordered={false}> + <Panel header="鍩烘湰淇℃伅" key="0"> + <TableComponent /> + </Panel> <Panel header="琛ㄥ崟" key="1"> <div className="search-element"> {SearchItems.map((item, index) => { @@ -460,7 +354,8 @@ <Button icon="setting" onClick={this.changeSetting}>璁剧疆</Button> <Button type="primary" id="save-modal-config" loading={saving} onClick={this.submitConfig}>淇濆瓨</Button> <Button onClick={this.cancelConfig}>杩斿洖</Button> - <PasteComponent config={config} updateConfig={this.insert} /> + <Button type="primary" style={{background: '#26C281', border: 'none'}} onClick={this.triggerCopy}>澶嶅埗</Button> + <PasteForms type="toolbar" config={config} update={this.pasteFields}/> <Button type="danger" onClick={this.clearConfig}>娓呯┖</Button> <Switch checkedChildren="寮�" unCheckedChildren="鍏�" defaultChecked={this.state.showField} onChange={(val) => this.setState({showField: val})} /> </div> @@ -487,7 +382,8 @@ </div> </DndProvider> <Modal - title="缂栬緫" + title={card && card.$copy ? '澶嶅埗' : '缂栬緫'} + wrapClassName="mk-scroll-modal" visible={this.state.visible} width={950} maskClosable={false} @@ -497,10 +393,10 @@ destroyOnClose > <ModalForm - card={this.state.card} + card={card} formlist={this.state.formlist} inputSubmit={this.handleSubmit} - standardform={this.state.standardform} + fields={config.fields} wrappedComponentRef={(inst) => this.formRef = inst} /> </Modal> -- Gitblit v1.8.0