From 1f5c6ac307a134dfa45b64c5723f2481ead9f213 Mon Sep 17 00:00:00 2001 From: king <18310653075@163.com> Date: 星期日, 16 七月 2023 16:23:09 +0800 Subject: [PATCH] 2023-07-16 --- src/templates/modalconfig/index.jsx | 184 ++++++++++++++++++++++++++++----------------- 1 files changed, 114 insertions(+), 70 deletions(-) diff --git a/src/templates/modalconfig/index.jsx b/src/templates/modalconfig/index.jsx index d6da3a8..5e51140 100644 --- a/src/templates/modalconfig/index.jsx +++ b/src/templates/modalconfig/index.jsx @@ -1,6 +1,5 @@ import React, {Component} from 'react' import PropTypes from 'prop-types' -import {connect} from 'react-redux' import { is, fromJS } from 'immutable' import { DndProvider } from 'react-dnd' import HTML5Backend from 'react-dnd-html5-backend' @@ -10,8 +9,6 @@ import Api from '@/api' import Utils from '@/utils/utils.js' -import zhCN from '@/locales/zh-CN/model.js' -import enUS from '@/locales/en-US/model.js' import { getModalForm } from '@/templates/zshare/formconfig' import SourceElement from './dragelement/source' @@ -20,14 +17,15 @@ import asyncComponent from '@/utils/asyncComponent' import { BaseConfig, SearchItems } from './source' import { updateForm } from '@/utils/utils-update.js' +import MKEmitter from '@/utils/events.js' import './index.scss' const { Panel } = Collapse const { confirm } = Modal -const CommonDict = sessionStorage.getItem('lang') !== 'en-US' ? zhCN : enUS const Versions = asyncComponent(() => import('@/menu/versions')) const ReplaceField = asyncComponent(() => import('@/menu/replaceField')) +const StyleController = asyncComponent(() => import('@/menu/stylecontroller')) const ModalForm = asyncComponent(() => import('@/templates/zshare/modalform')) const EditComponent = asyncComponent(() => import('@/templates/zshare/editcomponent')) const DragElement = asyncComponent(() => import('./dragelement')) @@ -50,7 +48,6 @@ state = { menu: null, // 涓婄骇鑿滃崟锛屼笁绾ц彍鍗曟垨鏍囩 - dict: CommonDict, // 瀛楀吀 config: null, // 椤甸潰閰嶇疆锛屽寘鎷ā鏉跨被鍨嬨�佹ā鎬佹璁剧疆銆佹坊鍔犺〃鍚嶃�佽〃鍗曞垪琛� visible: false, // 琛ㄥ崟缂栬緫妯℃�佹锛屾樉绀烘帶鍒� modalformlist: null, // 鍩烘湰淇℃伅琛ㄥ崟瀛楁 @@ -111,7 +108,7 @@ { type: 'text', key: 'supMenu', - label: this.state.dict['model.super'] + this.state.dict['model.menu'], + label: '涓婄骇鑿滃崟', initVal: _menu.MenuName, required: true, readonly: true @@ -128,13 +125,46 @@ }) } + componentDidMount() { + window.GLOB.formId = '' + MKEmitter.addListener('submitStyle', this.getStyle) + document.onkeydown = (event) => { + let e = event || window.event + let keyCode = e.keyCode || e.which || e.charCode + let preKey = '' + + if (e.ctrlKey) { + preKey = 'ctrl' + } + if (e.shiftKey) { + preKey = 'shift' + } else if (e.altKey) { + preKey = 'alt' + } + + if (!preKey || !keyCode) return + + let _shortcut = `${preKey}+${keyCode}` + + if (_shortcut === 'ctrl+83') { + let node = document.getElementById('save-config') + if (node && node.click) { + node.click() + } + return false + } + } + } + /** * @description 缁勪欢閿�姣侊紝娓呴櫎state鏇存柊 */ componentWillUnmount () { + MKEmitter.removeListener('submitStyle', this.getStyle) this.setState = () => { return } + document.onkeydown = () => {} } // 椤甸潰杩斿洖 @@ -157,6 +187,24 @@ } this.props.handleView(param) + } + + 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 + }) } /** @@ -195,56 +243,58 @@ let _inputfields = [] let _tabfields = [] let _linkableFields = [] - let _linksupFields = [{ - field: '', - label: '绌�' - }] + 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 } + if (!item.field) return + if (['text', 'number', 'textarea', 'color'].includes(item.type) && card.field !== item.field) { _inputfields.push({ field: item.field, - label: _inputIndex + '銆�' + item.label + label: item.label }) - _inputIndex++ } if (card.field !== item.field && item.hidden !== 'true' && ['text', 'number', 'select', 'link'].includes(item.type)) { _tabfields.push({ field: item.field, - label: _tabIndex + '銆�' + item.label + label: item.label }) - _tabIndex++ } - if (!['select', 'link', 'radio', ''].includes(item.type)) return - if (item.field && !uniq.has(item.field)) { + if (item.type === 'switch' || item.type === 'check') { + _linksupFields.push({ + field: item.field, + label: item.label + }) + } + + if (!['select', 'link', 'radio', 'checkcard', 'multiselect'].includes(item.type)) return + + _linksupFields.push({ + field: item.field, + label: item.label + }) + + if (item.type === 'multiselect' || (item.type === 'checkcard' && item.multiple === 'true')) return + + if (!uniq.has(item.field)) { uniq.set(item.field, true) _linkableFields.push({ field: item.field, - label: _linkIndex + '銆�' + item.label + ' (琛ㄥ崟)' + label: item.label + '-琛ㄥ崟' }) - _linksupFields.push({ - field: item.field, - label: _linkIndex + '銆�' + item.label - }) - _linkIndex++ } }) - - _tabfields.unshift({field: '', label: '鍘熻〃鍗�'}) if (index !== null) { if (index === 0) { @@ -261,9 +311,8 @@ _linkableFields.push({ field: col.field, - label: _linkIndex + '銆�' + col.label + ' (鏄剧ず鍒�)' + label: col.label + '-鏄剧ず鍒�' }) - _linkIndex++ } }) } else if (tabConfig) { @@ -273,9 +322,8 @@ _linkableFields.push({ field: col.field, - label: _linkIndex + '銆�' + col.label + ' (鏄剧ず鍒�)' + label: col.label + '-鏄剧ず鍒�' }) - _linkIndex++ } }) } else if (menu.LongParam) { @@ -285,9 +333,8 @@ _linkableFields.push({ field: col.field, - label: _linkIndex + '銆�' + col.label + ' (鏄剧ず鍒�)' + label: col.label + '-鏄剧ず鍒�' }) - _linkIndex++ } }) } @@ -300,6 +347,9 @@ if (!card.span && standardform && standardform.span) { card.span = standardform.span card.labelwidth = standardform.labelwidth + } else if (!card.span) { + card.span = 12 + card.labelwidth = 33.3 } this.setState({ @@ -327,6 +377,9 @@ } if (item.uuid === res.uuid) { + if (item.style) { + res.style = item.style + } return res } else { return item @@ -344,6 +397,8 @@ _config.fields = _config.fields.filter(item => !item.origin) + window.GLOB.formId = res.uuid + if (['select', 'multiselect', 'link', 'checkbox', 'radio', 'checkcard'].includes(res.type) && res.resourceType === '1' && /\s/.test(res.dataSource)) { this.setState({ sqlVerifing: true @@ -352,20 +407,22 @@ let param = { func: 's_debug_sql', exec_type: 'y', - LText: res.dataSource + LText: `declare @mk_departmentcode nvarchar(512),@mk_organization nvarchar(512),@mk_user_type nvarchar(20) + ${res.dataSource}` } - param.LText = param.LText.replace(/@\$|\$@/ig, '') + 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 = param.LText.replace(/\n/g, ' ') param.LText = Utils.formatOptions(param.LText) - param.timestamp = moment().format('YYYY-MM-DD HH:mm:ss') param.secretkey = Utils.encrypt('', param.timestamp) if (window.GLOB.mainSystemApi && res.database === 'sso') { param.rduri = window.GLOB.mainSystemApi } - Api.getLocalConfig(param).then(result => { + Api.genericInterface(param).then(result => { if (result.status) { this.setState({ sqlVerifing: false, @@ -684,10 +741,9 @@ }) } - render () { const { editAction } = this.props - const { config, dict, openEdition } = this.state + const { config, openEdition } = this.state if (!config) return null @@ -696,11 +752,8 @@ <DndProvider backend={HTML5Backend}> <div className="tools"> <Collapse accordion defaultActiveKey="1" bordered={false}> - <Panel forceRender={true} header={dict['header.menu.basedata']} key="0" id="modal-basedata"> - <MenuForm - dict={dict} - formlist={this.state.modalformlist} - /> + <Panel forceRender={true} header="鍩烘湰淇℃伅" key="0" id="modal-basedata"> + <MenuForm formlist={this.state.modalformlist}/> {/* 琛ㄥ悕娣诲姞 */} <TableComponent config={config} @@ -708,7 +761,7 @@ updatetable={this.updateconfig} /> </Panel> - <Panel header={dict['header.menu.form']} key="1"> + <Panel header="琛ㄥ崟" key="1"> <div className="search-element"> {SearchItems.map((item, index) => { return (<SourceElement key={index} content={item}/>) @@ -724,20 +777,20 @@ <Button type="danger" onClick={this.clearConfig}>娓呯┖</Button> <Versions MenuId={editAction.uuid} open_edition={openEdition} updateConfig={this.refreshConfig}/> <ReplaceField type="form" config={config} updateConfig={this.updateconfig}/> - <EditComponent dict={dict} options={['form']} config={this.state.config} plusFields={this.plusFields}/> - <Button type="primary" onClick={this.submitConfig} loading={this.state.menuloading}>{dict['model.save']}</Button> - <Button onClick={this.cancelConfig}>{dict['model.back']}</Button> + <EditComponent options={['form']} type="formboard" config={this.state.config} plusFields={this.plusFields}/> + <Button type="primary" id="save-config" onClick={this.submitConfig} loading={this.state.menuloading}>淇濆瓨</Button> + <Button onClick={this.cancelConfig}>杩斿洖</Button> </div> } style={{ width: '100%' }}> <SettingOutlined onClick={this.changeSetting} /> - <div className="ant-modal-content" style={{width: config.setting.width + '%'}}> + <div className="ant-modal-content" style={{width: config.setting.width > 100 ? config.setting.width : config.setting.width + '%'}}> <div className="ant-modal-header"> <div className="ant-modal-title">{config.setting.title}</div> <Button className="mk-cols-change" onClick={() => this.changecols(1)}>1鍒�</Button> <Button className="mk-cols-change" onClick={() => this.changecols(2)}>2鍒�</Button> <Button className="mk-cols-change" onClick={() => this.changecols(3)}>3鍒�</Button> <Button className="mk-cols-change" onClick={() => this.changecols(4)}>4鍒�</Button> - <Switch checkedChildren={dict['model.switch.open']} unCheckedChildren={dict['model.switch.close']} defaultChecked={this.state.showField} onChange={(val) => this.setState({showField: val})} /> + <Switch checkedChildren="寮�" unCheckedChildren="鍏�" defaultChecked={this.state.showField} onChange={(val) => this.setState({showField: val})} /> </div> <div className="ant-modal-body"> <div className="modal-form"> @@ -745,7 +798,6 @@ list={config.fields} setting={config.setting} showField={this.state.showField} - placeholder={dict['header.form.modal.placeholder']} handleList={this.handleList} handleForm={this.handleForm} closeForm={this.closeForm} @@ -755,10 +807,10 @@ <div className="ant-modal-footer"> <div> <button type="button" className="ant-btn"> - <span>{dict['model.cancel']}</span> + <span>鍙栨秷</span> </button> <button type="button" className="ant-btn ant-btn-primary"> - <span>{dict['model.confirm']}</span> + <span>纭畾</span> </button> </div> <div className="action-mask"></div> @@ -768,9 +820,9 @@ </div> </DndProvider> <Modal - title={dict['model.edit']} + title="缂栬緫" visible={this.state.visible} - width={850} + width={950} maskClosable={false} onCancel={this.editModalCancel} onOk={this.handleSubmit} @@ -778,7 +830,6 @@ destroyOnClose > <ModalForm - dict={dict} card={this.state.card} formlist={this.state.formlist} inputSubmit={this.handleSubmit} @@ -787,7 +838,7 @@ /> </Modal> <Modal - title={dict['model.edit']} + title="缂栬緫" visible={this.state.settingVisible} width={900} maskClosable={false} @@ -809,25 +860,18 @@ visible={this.state.closeVisible} onCancel={() => { this.setState({closeVisible: false}) }} footer={[ - <Button key="save" className="mk-btn mk-green" loading={this.state.closeloading} onClick={this.submitConfig}>{dict['model.save']}</Button>, - <Button key="confirm" className="mk-btn mk-yellow" onClick={this.handleViewBack}>{dict['model.notsave']}</Button>, - <Button key="cancel" onClick={() => { this.setState({closeVisible: false}) }}>{dict['model.cancel']}</Button> + <Button key="save" className="mk-btn mk-green" loading={this.state.closeloading} onClick={this.submitConfig}>淇濆瓨</Button>, + <Button key="confirm" className="mk-btn mk-yellow" onClick={this.handleViewBack}>涓嶄繚瀛�</Button>, + <Button key="cancel" onClick={() => { this.setState({closeVisible: false}) }}>鍙栨秷</Button> ]} destroyOnClose > - {dict['header.menu.config.placeholder']} + 閰嶇疆宸蹭慨鏀癸紝鏄惁淇濆瓨閰嶇疆淇℃伅锛� </Modal> + <StyleController /> </div> ) } } -const mapStateToProps = () => { - return {} -} - -const mapDispatchToProps = () => { - return {} -} - -export default connect(mapStateToProps, mapDispatchToProps)(ComModalConfig) \ No newline at end of file +export default ComModalConfig \ No newline at end of file -- Gitblit v1.8.0