From 2a6a3b7d14e3d4f1dcfc72c3f9fbef8dd20238c2 Mon Sep 17 00:00:00 2001 From: king <18310653075@163.com> Date: 星期五, 08 三月 2024 15:16:06 +0800 Subject: [PATCH] 2024-03-08 --- src/menu/components/share/actioncomponent/index.jsx | 408 ++++++++++++++++++++++++++++++++++++++++++--------------- 1 files changed, 300 insertions(+), 108 deletions(-) diff --git a/src/menu/components/share/actioncomponent/index.jsx b/src/menu/components/share/actioncomponent/index.jsx index d7b3e7d..4029b06 100644 --- a/src/menu/components/share/actioncomponent/index.jsx +++ b/src/menu/components/share/actioncomponent/index.jsx @@ -2,13 +2,11 @@ import PropTypes from 'prop-types' import { is, fromJS } from 'immutable' import { Modal, notification, Button } from 'antd' +import moment from 'moment' -import Utils, { FuncUtils } from '@/utils/utils.js' -import zhCN from '@/locales/zh-CN/model.js' -import enUS from '@/locales/en-US/model.js' -import { getActionForm } from './formconfig' +import Utils from '@/utils/utils.js' +import { getActionForm, getBaseTableActionForm } from './formconfig' import asyncSpinComponent from '@/utils/asyncSpinComponent' - import MKEmitter from '@/utils/events.js' import ActionForm from './actionform' import MenuUtils from '@/utils/utils-custom.js' @@ -31,7 +29,6 @@ } state = { - dict: sessionStorage.getItem('lang') !== 'en-US' ? zhCN : enUS, appType: sessionStorage.getItem('appType'), card: null, // 缂栬緫涓厓绱� formlist: null, // 琛ㄥ崟淇℃伅 @@ -63,17 +60,9 @@ } componentDidMount () { + MKEmitter.addListener('revertBtn', this.revertBtn) MKEmitter.addListener('addButton', this.addButton) - } - - /** - * @description 鐩戝惉鍒版寜閽鍒舵椂锛岃Е鍙戞寜閽紪杈� - */ - UNSAFE_componentWillReceiveProps (nextProps) { - const { actionlist } = this.state - if (!is(fromJS(nextProps.config.action), fromJS(this.props.config.action)) && !is(fromJS(nextProps.config.action), fromJS(actionlist))) { - this.setState({actionlist: fromJS(nextProps.config.action).toJS()}) - } + MKEmitter.addListener('submitModal', this.handleSave) } shouldComponentUpdate (nextProps, nextState) { @@ -87,7 +76,43 @@ this.setState = () => { return } + MKEmitter.removeListener('revertBtn', this.revertBtn) MKEmitter.removeListener('addButton', this.addButton) + MKEmitter.removeListener('submitModal', this.handleSave) + } + + revertBtn = (id) => { + if (id && id !== this.props.config.uuid) return + + this.setState({ + actionlist: fromJS(this.props.config.action).toJS() + }) + } + + handleSave = (componentId, btnId, modal) => { + const { config } = this.props + + if (config.uuid !== componentId) return + + const { actionlist } = this.state + + let _index = actionlist.findIndex(cell => cell.uuid === btnId) + + if (_index === -1) return + + let _actionlist = actionlist.map(cell => { + if (cell.uuid === btnId) { + cell.modal = modal + } + + return cell + }) + + this.setState({ + actionlist: _actionlist + }, () => { + this.props.updateaction({...config, action: _actionlist}) + }) } getStyle = (style) => { @@ -111,7 +136,7 @@ changeBtnStyle = (element) => { let _style = element.style ? fromJS(element.style).toJS() : {} - let options = ['font', 'border', 'background', 'margin', 'padding'] + let options = ['font', 'border', 'background', 'margin', 'padding', 'minHeight'] this.setState({ card: element @@ -163,8 +188,9 @@ } let ableField = usefulFields.join(', ') + let msg = `鍑芥暟鍚嶇О闇�浠�${ableField}绛夊瓧绗﹀紑濮�;` let functip = <div> - <p style={{marginBottom: '5px'}}>{this.state.dict['model.tooltip.func.innerface'].replace('@ableField', ableField)}</p> + <p style={{marginBottom: '5px'}}>{msg}</p> </div> if (!ableField) { // 鏃犲瓧娈甸檺鍒� @@ -180,15 +206,28 @@ supId = '' } } - - let modules = MenuUtils.getSubModules(window.GLOB.customMenu.components, config.uuid, supId) || [] - let anchors = MenuUtils.getAnchors(window.GLOB.customMenu.components, config.uuid) || [] - this.setState({ - visible: true, - card: card, - formlist: getActionForm(card, functip, config, usefulFields, modules, anchors) - }) + let menu = window.GLOB.customMenu + + let modules = MenuUtils.getSubModules(menu.components, config.uuid, supId, menu.interfaces || null) + + if (config.subtype === 'basetable') { + delete card.eleType // 鍖哄垎鎸夐挳浣嶇疆 + + this.setState({ + visible: true, + card: card, + formlist: getBaseTableActionForm(card, functip, config, usefulFields, modules) + }) + } else { + let anchors = MenuUtils.getAnchors(menu.components, config.uuid) || [] + + this.setState({ + visible: true, + card: card, + formlist: getActionForm(card, functip, config, usefulFields, modules, anchors) + }) + } } /** @@ -220,11 +259,138 @@ */ handleSubmit = () => { const { config } = this.props - let color = { primary: '#1890ff', yellow: '#c49f47', orange: 'orange', danger: '#ff4d4f', green: '#26C281', dgreen: '#32c5d2', purple: '#8E44AD', cyan: '#13c2c2', gray: '#666666' } + let color = { primary: '#1890ff', yellow: '#c49f47', orange: 'orange', danger: '#ff4d4f', green: '#26C281', dgreen: '#32c5d2', purple: '#8E44AD', cyan: '#13c2c2', gray: '#E7E7EF', default: 'rgba(0, 0, 0, 0.65)' } let _actionlist = fromJS(this.state.actionlist).toJS() this.actionFormRef.handleConfirm().then(btn => { _actionlist = _actionlist.filter(item => !item.origin || item.uuid === btn.uuid) + + if ((btn.OpenType === 'excelIn' || btn.OpenType === 'excelOut') && (!btn.verify || !btn.verify.columns) && (config.subtype === 'basetable' || config.subtype === 'normaltable')) { + let columns = [] + let maps = [] + let labels = {} + if (config.subtype === 'normaltable') { + config.columns.forEach(col => { + labels[col.field] = col.label + }) + } + + if (btn.OpenType === 'excelOut') { + let pushcol = (item) => { + let cell = { + Column: item.field, + Text: item.label, + Width: 20, + abs: 'false', + output: 'true', + required: 'false', + type: 'text', + noValue: 'true', + uuid: Utils.getuuid() + } + + if (item.type === 'number') { + cell.type = 'number' + cell.decimal = item.decimal + + if (item.noValue === 'hide') { + cell.noValue = 'false' + } + } + + columns.push(cell) + } + + config.cols.forEach(item => { + if (item.Hide === 'true') return + + if (config.subtype === 'normaltable') { + if (item.type === 'colspan') { + item.subcols.forEach(cell => { + if (!cell.field || cell.Hide === 'true' || maps.includes(cell.field)) return + maps.push(cell.field) + + pushcol(cell) + }) + } else if (item.type === 'custom') { + item.elements.forEach(cell => { + if (!cell.field || maps.includes(cell.field)) return + maps.push(cell.field) + + pushcol({...cell, label: labels[cell.field]}) + }) + } + } + + if (!item.field || maps.includes(item.field)) return + maps.push(item.field) + + pushcol(item) + }) + + btn.verify = btn.verify || {enable: 'false', dataType: 'default', scripts: []} + btn.verify.columns = columns + } else { + let pushcol = (item) => { + let _type = 'Nvarchar(50)' + let _limit = '50' + if (item.type === 'number' && !item.decimal) { + _type = 'Int' + _limit = '' + } else if (item.type === 'number') { + _type = 'Decimal(18,' + item.decimal + ')' + _limit = item.decimal + } + + let _cell = { + uuid: Utils.getuuid(), + Column: item.field, + Text: item.label, + type: _type, + limit: _limit, + import: 'true', + required: 'true' + } + + if (_type !== 'Nvarchar(50)') { + _cell.min = 0 + _cell.max = 999999 + } + + columns.push(_cell) + } + + config.cols.forEach(item => { + if (item.Hide === 'true') return + + if (config.subtype === 'normaltable') { + if (item.type === 'colspan') { + item.subcols.forEach(cell => { + if (!cell.field || cell.Hide === 'true' || maps.includes(cell.field)) return + maps.push(cell.field) + + pushcol(cell) + }) + } else if (item.type === 'custom') { + item.elements.forEach(cell => { + if (!cell.field || maps.includes(cell.field)) return + maps.push(cell.field) + + pushcol({...cell, label: labels[cell.field]}) + }) + } + } + + if (!item.field || maps.includes(item.field)) return + maps.push(item.field) + + pushcol(item) + }) + + btn.verify = btn.verify || {sheet: 'Sheet1', default: 'true', range: 1, scripts: [], uniques: []} + btn.verify.columns = columns + } + } let labelrepet = false _actionlist = _actionlist.map(item => { @@ -233,16 +399,51 @@ } if (item.uuid === btn.uuid) { - btn.style = item.style || {} - if (btn.class !== item.class || btn.show !== item.show || !btn.style.color || item.focus) { - if (btn.show === 'icon') { - btn.style.color = color[btn.class] - btn.style.backgroundColor = 'transparent' + if (config.subtype === 'basetable') { + let _c = btn.class.replace('border-', '') + if (btn.class === 'default') { + btn.style = {color: 'rgba(0, 0, 0, 0.65)', backgroundColor: '#fff', borderColor: '#d9d9d9', marginRight: '15px'} + } else if (btn.class.indexOf('border') > -1) { + btn.style = {color: color[_c], backgroundColor: '#fff', borderColor: color[_c], marginRight: '15px'} + } else if (btn.class === 'gray') { + btn.style = {color: 'rgba(0, 0, 0, 0.65)', backgroundColor: color[_c], borderColor: color[_c], marginRight: '15px'} } else { - btn.style.color = '#ffffff' - btn.style.backgroundColor = color[btn.class] + btn.style = {color: '#fff', backgroundColor: color[_c], borderColor: color[_c], marginRight: '15px'} + } + } else { + btn.style = item.style || {} + if (btn.class) { + if (btn.class !== item.class || btn.show !== item.show || !btn.style.color || (item.focus && !btn.style.color)) { + // if (btn.show === 'icon') { + // btn.style.color = color[btn.class] + // btn.style.backgroundColor = 'transparent' + // } + if (btn.class === 'default') { + btn.style.color = 'rgba(0, 0, 0, 0.65)' + btn.style.backgroundColor = '#fff' + btn.style.borderColor = '#d9d9d9' + } else if (btn.class.indexOf('border') > -1) { + let _c = btn.class.replace('border-', '') + btn.style.color = color[_c] + btn.style.backgroundColor = '#fff' + btn.style.borderColor = color[_c] + btn.style.borderWidth = '1px' + } else if (btn.class === 'gray') { + btn.style.color = 'rgba(0, 0, 0, 0.65)' + btn.style.backgroundColor = color[btn.class] + btn.style.borderColor = color[btn.class] + } else { + btn.style.color = '#ffffff' + btn.style.backgroundColor = color[btn.class] + btn.style.borderColor = color[btn.class] + } + } + } else if (btn.color) { + btn.style = {} } } + + btn.updateTime = moment().format('YYYY-MM-DD HH:mm') return btn } else { return item @@ -272,11 +473,10 @@ */ deleteElement = (card) => { const { config } = this.props - const { dict, appType } = this.state let _this = this confirm({ - content: dict['model.confirm'] + dict['model.delete'] + ` - ${card.label} 锛焋, + content: `纭畾鍒犻櫎 - ${card.label} 锛焋, onOk() { let _actionlist = fromJS(_this.state.actionlist).toJS() @@ -287,11 +487,6 @@ }, () => { _this.props.updateaction({...config, action: _actionlist}) }) - - if (card.origin || appType === 'mob') return - if (appType === 'pc' && card.OpenType !== 'popview') return - - MKEmitter.emit('delButtons', [card.uuid]) }, onCancel() {} }) @@ -305,7 +500,6 @@ profVisible: true, card: element }) - MKEmitter.emit('modalStatus', '楠岃瘉淇℃伅') } /** @@ -322,6 +516,7 @@ _actionlist = _actionlist.map(item => { if (item.uuid === card.uuid) { item.verify = res + item.updateTime = moment().format('YYYY-MM-DD HH:mm') } return item @@ -333,7 +528,6 @@ }, () => { this.props.updateaction({...config, action: _actionlist}) }) - MKEmitter.emit('modalStatus', false) }) } @@ -341,59 +535,47 @@ * @description 鍒涘缓鎸夐挳瀛樺偍杩囩▼ */ creatFunc = () => { + const { config } = this.props const menu = window.GLOB.customMenu - let _config = fromJS(this.props.config).toJS() - this.actionFormRef.handleConfirm().then(res => { - let btn = res // 鎸夐挳淇℃伅 - let newLText = '' // 鍒涘缓瀛樺偍杩囩▼sql - let DelText = '' // 鍒犻櫎瀛樺偍杩囩▼sql + return new Promise((resolve) => { + this.actionFormRef.handleConfirm().then(res => { + let btn = fromJS(res).toJS() + let _config = fromJS(config).toJS() - // 鍒涘缓瀛樺偍杩囩▼锛屽繀椤诲~鍐欏唴閮ㄥ嚱鏁板悕 - if (btn.intertype !== 'inner') { - notification.warning({ - top: 92, - message: '浣跨敤鍐呴儴鍑芥暟鏃讹紝鎵嶅彲浠ュ垱寤哄瓨鍌ㄨ繃绋嬶紒', - duration: 5 - }) - return - } + if (btn.OpenType === 'excelIn') { + btn.func = btn.innerFunc + btn.menuNo = menu.MenuNo + btn.MenuName = menu.MenuName + _config.name + btn.$type = 'excelIn' - if (btn.OpenType === 'pop') { - let _param = { - funcName: btn.innerFunc, - name: _config.setting.tableName || '', - fields: btn.modal ? btn.modal.fields : [], - menuNo: menu.MenuNo + resolve(btn) + } else if (btn.OpenType === 'excelOut') { + _config.MenuName = menu.MenuName + '-' + _config.name + _config.menuNo = menu.MenuNo + _config.MenuID = menu.MenuID + _config.func = btn.innerFunc + _config.$type = 'table' + + resolve(_config) + } else { + btn.func = btn.innerFunc + btn.name = _config.setting.tableName || '' + btn.menuNo = menu.MenuNo + btn.MenuID = menu.MenuID + btn.MenuName = menu.MenuName + _config.name + btn.fields = [] + btn.columns = _config.columns + btn.primaryKey = _config.setting.primaryKey || 'ID' + btn.$type = 'btn' + + if (btn.OpenType === 'pop') { + btn.fields = btn.modal ? btn.modal.fields : [] + } + + resolve(btn) } - newLText = Utils.formatOptions(FuncUtils.getfunc(_param, btn, menu, _config)) - DelText = Utils.formatOptions(FuncUtils.dropfunc(btn.innerFunc)) - } else if (btn.OpenType === 'excelIn') { - let _param = { - funcName: btn.innerFunc, - menuNo: menu.MenuNo - } - newLText = Utils.formatOptions(FuncUtils.getexcelInfunc(_param, btn, menu)) - DelText = Utils.formatOptions(FuncUtils.dropfunc(btn.innerFunc)) - } else if (btn.OpenType === 'excelOut') { - let _param = { - innerFunc: btn.innerFunc - } - - newLText = Utils.formatOptions(FuncUtils.getTableFunc(_param, menu, _config)) // 鍒涘缓瀛樺偍杩囩▼sql - DelText = Utils.formatOptions(FuncUtils.dropfunc(btn.innerFunc)) - } else { - let _param = { - funcName: btn.innerFunc, - name: _config.setting.tableName || '', - fields: '', - menuNo: menu.MenuNo - } - newLText = Utils.formatOptions(FuncUtils.getfunc(_param, btn, menu, _config)) - DelText = Utils.formatOptions(FuncUtils.dropfunc(btn.innerFunc)) - } - - this.refs.btnCreatFunc.exec(btn.innerFunc, newLText, DelText) + }) }) } @@ -419,9 +601,9 @@ let btn = null let _col = null - if (config.subtype === 'normaltable' || config.subtype === 'editable') { + if (config.type === 'table') { config.cols.forEach(col => { - if (col.type !== 'action') return + if (col.type !== 'custom') return col.elements = col.elements.filter(item => { if (item.uuid === id) { @@ -430,6 +612,24 @@ } return item.uuid !== id }) + }) + } else if (config.type === 'card' && config.subcards) { + config.subcards.forEach(scard => { + scard.elements = scard.elements.filter(item => { + if (item.uuid === id) { + btn = item + _col = scard + } + return item.uuid !== id + }) + scard.backElements = scard.backElements.filter(item => { + if (item.uuid === id) { + btn = item + _col = scard + } + return item.uuid !== id + }) + return scard }) } @@ -448,14 +648,12 @@ getVerify = (card) => { const { config } = this.props - const { dict } = this.state if (!card) return null if (['pop', 'prompt', 'exec'].includes(card.OpenType)) { return <VerifyCard card={card} - dict={dict} config={config} columns={config.columns} wrappedComponentRef={(inst) => this.verifyRef = inst} @@ -463,28 +661,24 @@ } else if (card.OpenType === 'excelIn') { return <VerifyExcelIn card={card} - dict={dict} columns={config.columns} wrappedComponentRef={(inst) => this.verifyRef = inst} /> } else if (card.OpenType === 'excelOut') { return <VerifyExcelOut card={card} - dict={dict} config={config} wrappedComponentRef={(inst) => this.verifyRef = inst} /> } else if (card.OpenType === 'funcbutton' && card.funcType === 'print') { return <VerifyPrint card={card} - dict={dict} columns={config.columns} wrappedComponentRef={(inst) => this.verifyRef = inst} /> } else if (card.OpenType === 'funcbutton' && card.funcType === 'megvii') { return <VerifyMegvii card={card} - dict={dict} columns={config.columns} wrappedComponentRef={(inst) => this.verifyRef = inst} /> @@ -493,13 +687,13 @@ render() { const { config } = this.props - const { actionlist, visible, appType, card, dict, profVisible, record } = this.state + const { actionlist, visible, appType, card, profVisible, record } = this.state return ( <div className={'model-menu-action-list length' + actionlist.length}> <DragElement list={actionlist} - type={appType === 'mob' ? config.subtype : ''} + type={appType === 'mob' || config.subtype === 'basetable' ? config.subtype : ''} handleList={this.handleList} dropButton={this.dropButton} handleMenu={this.handleAction} @@ -511,19 +705,19 @@ {/* 缂栬緫鎸夐挳锛氬鍒躲�佺紪杈� */} <Modal title="鎸夐挳路缂栬緫" + wrapClassName="mk-scroll-modal" visible={visible} width={920} maskClosable={false} onCancel={this.editModalCancel} footer={[ - record && record.intertype === 'inner' ? <CreateFunc key="create" dict={dict} ref="btnCreatFunc" trigger={this.creatFunc}/> : null, - <Button key="cancel" onClick={this.editModalCancel}>{dict['model.cancel']}</Button>, - <Button key="confirm" type="primary" onClick={this.handleSubmit}>{dict['model.confirm']}</Button> + record && record.intertype === 'inner' ? <CreateFunc key="create" getMsg={this.creatFunc}/> : null, + <Button key="cancel" onClick={this.editModalCancel}>鍙栨秷</Button>, + <Button key="confirm" type="primary" onClick={this.handleSubmit}>纭畾</Button> ]} destroyOnClose > <ActionForm - dict={dict} card={card} formlist={this.state.formlist} inputSubmit={this.handleSubmit} @@ -538,17 +732,15 @@ visible={profVisible} width={'90vw'} maskClosable={false} - okText={dict['model.submit']} + okText="鎻愪氦" onOk={this.verifySubmit} onCancel={() => { if (this.verifyRef.handleCancel) { this.verifyRef.handleCancel().then(() => { this.setState({ profVisible: false }) - MKEmitter.emit('modalStatus', false) }) } else { this.setState({ profVisible: false }) - MKEmitter.emit('modalStatus', false) } }} destroyOnClose -- Gitblit v1.8.0