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 | 536 +++++++++++++++++++++++++++++++++++++++++------------------ 1 files changed, 370 insertions(+), 166 deletions(-) diff --git a/src/menu/components/share/actioncomponent/index.jsx b/src/menu/components/share/actioncomponent/index.jsx index 1504bbf..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' @@ -21,23 +19,23 @@ const VerifyPrint = asyncSpinComponent(() => import('@/templates/sharecomponent/actioncomponent/verifyprint')) const VerifyExcelIn = asyncSpinComponent(() => import('@/templates/sharecomponent/actioncomponent/verifyexcelin')) const VerifyExcelOut = asyncSpinComponent(() => import('@/templates/sharecomponent/actioncomponent/verifyexcelout')) +const VerifyMegvii = asyncSpinComponent(() => import('@/templates/sharecomponent/actioncomponent/verifymegvii')) class ActionComponent extends Component { static propTpyes = { - type: PropTypes.string, // 鑿滃崟绫诲瀷锛屼富琛ㄦ垨瀛愯〃 config: PropTypes.object, // 鑿滃崟閰嶇疆淇℃伅 setSubConfig: PropTypes.func, // 璁剧疆瀛愰厤缃俊鎭� updateaction: PropTypes.func // 鑿滃崟閰嶇疆鏇存柊 } state = { - dict: sessionStorage.getItem('lang') !== 'en-US' ? zhCN : enUS, appType: sessionStorage.getItem('appType'), card: null, // 缂栬緫涓厓绱� formlist: null, // 琛ㄥ崟淇℃伅 actionlist: null, // 鎸夐挳缁� visible: false, // 妯℃�佹鎺у埗 - profVisible: false // 楠岃瘉淇℃伅妯℃�佹 + profVisible: false, // 楠岃瘉淇℃伅妯℃�佹 + record: null } /** @@ -62,18 +60,9 @@ } componentDidMount () { + MKEmitter.addListener('revertBtn', this.revertBtn) MKEmitter.addListener('addButton', this.addButton) - MKEmitter.addListener('submitStyle', this.getStyle) - } - - /** - * @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,15 +76,48 @@ this.setState = () => { return } + MKEmitter.removeListener('revertBtn', this.revertBtn) MKEmitter.removeListener('addButton', this.addButton) - MKEmitter.removeListener('submitStyle', this.getStyle) + MKEmitter.removeListener('submitModal', this.handleSave) } - getStyle = (comIds, style) => { + 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) => { const { config } = this.props const { card, actionlist } = this.state - - if (comIds[0] !== config.uuid || comIds[1] !== 'actionlist') return let _card = fromJS(card).toJS() _card.style = style @@ -113,16 +135,14 @@ } changeBtnStyle = (element) => { - const { config } = this.props - 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 }) - MKEmitter.emit('changeStyle', [config.uuid, 'actionlist', element.uuid], options, _style) + MKEmitter.emit('changeStyle', options, _style, this.getStyle) } addButton = (cardId, element) => { @@ -168,28 +188,46 @@ } 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> - - let menulist = sessionStorage.getItem('fstMenuList') - if (menulist) { - try { - menulist = JSON.parse(menulist) - } catch (e) { - menulist = [] - } - } else { - menulist = [] - } - let modules = MenuUtils.getSubModules(window.GLOB.customMenu.components, config.uuid) || [] + if (!ableField) { // 鏃犲瓧娈甸檺鍒� + functip = '' + } - this.setState({ - visible: true, - card: card, - formlist: getActionForm(card, functip, config, usefulFields, this.props.type, menulist, modules) - }) + let supId = '' + if (config.setting && config.setting.supModule) { + let pid = config.setting.supModule[config.setting.supModule.length - 1] + if (pid && pid !== 'empty') { + supId = pid + } else { + supId = '' + } + } + + 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) + }) + } } /** @@ -221,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 => { @@ -234,17 +399,51 @@ } if (item.uuid === btn.uuid) { - btn.style = item.style || {} - - if (btn.class !== item.class || btn.show !== item.show || !btn.style.color) { - if (btn.show === 'link' || 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 @@ -274,31 +473,20 @@ */ 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() _actionlist = _actionlist.filter(item => item.uuid !== card.uuid) - let btnlog = config.btnlog || [] - if (card.OpenType === 'popview' || card.verify || card.modal) { - btnlog.push(card) - } - _this.setState({ actionlist: _actionlist }, () => { - _this.props.updateaction({...config, action: _actionlist, btnlog}) + _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() {} }) @@ -328,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 @@ -346,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) + }) }) } @@ -410,9 +587,9 @@ if (element.OpenType === 'pop' || element.OpenType === 'popview' || element.execMode === 'pop') { this.props.setSubConfig(element) - } else if (element.OpenType === 'innerpage' && element.pageTemplate === 'page') { - MKEmitter.emit('changeEditMenu', {MenuID: element.uuid, copyMenuId: element.copyMenuId}) } else if (element.OpenType === 'innerpage' && element.pageTemplate === 'linkpage') { + MKEmitter.emit('changeEditMenu', {MenuID: element.linkmenu}) + } else if (element.OpenType === 'funcbutton' && (element.funcType === 'copyurl' || element.funcType === 'scan') && element.linkmenu) { MKEmitter.emit('changeEditMenu', {MenuID: element.linkmenu}) } else { this.handleAction(element) @@ -423,23 +600,44 @@ let config = fromJS(this.props.config).toJS() let btn = null - if (config.subtype === 'normaltable') { + let _col = null + 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) { btn = item + _col = col } 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 }) } if (!btn) return - btn.Ot = 'requiredSgl' config.action.push(btn) + + MKEmitter.emit('cardDelElement', _col.uuid, btn.uuid) this.setState({ actionlist: config.action @@ -448,15 +646,54 @@ }) } + getVerify = (card) => { + const { config } = this.props + + if (!card) return null + + if (['pop', 'prompt', 'exec'].includes(card.OpenType)) { + return <VerifyCard + card={card} + config={config} + columns={config.columns} + wrappedComponentRef={(inst) => this.verifyRef = inst} + /> + } else if (card.OpenType === 'excelIn') { + return <VerifyExcelIn + card={card} + columns={config.columns} + wrappedComponentRef={(inst) => this.verifyRef = inst} + /> + } else if (card.OpenType === 'excelOut') { + return <VerifyExcelOut + card={card} + config={config} + wrappedComponentRef={(inst) => this.verifyRef = inst} + /> + } else if (card.OpenType === 'funcbutton' && card.funcType === 'print') { + return <VerifyPrint + card={card} + columns={config.columns} + wrappedComponentRef={(inst) => this.verifyRef = inst} + /> + } else if (card.OpenType === 'funcbutton' && card.funcType === 'megvii') { + return <VerifyMegvii + card={card} + columns={config.columns} + wrappedComponentRef={(inst) => this.verifyRef = inst} + /> + } + } + render() { - const { config, type } = this.props - const { actionlist, visible, appType, card, dict, profVisible } = this.state + const { config } = this.props + const { actionlist, visible, appType, card, profVisible, record } = this.state return ( - <div className={'model-menu-action-list'}> + <div className={'model-menu-action-list length' + actionlist.length}> <DragElement list={actionlist} - type={appType === 'mob' ? (type || '') : ''} + type={appType === 'mob' || config.subtype === 'basetable' ? config.subtype : ''} handleList={this.handleList} dropButton={this.dropButton} handleMenu={this.handleAction} @@ -467,36 +704,35 @@ /> {/* 缂栬緫鎸夐挳锛氬鍒躲�佺紪杈� */} <Modal - // title={dict['model.action'] + '-' + (card && card.copyType === 'action' ? dict['model.copy'] : dict['model.edit'])} title="鎸夐挳路缂栬緫" + wrapClassName="mk-scroll-modal" visible={visible} - width={850} + width={920} maskClosable={false} onCancel={this.editModalCancel} footer={[ - <CreateFunc key="create" dict={dict} ref="btnCreatFunc" trigger={this.creatFunc}/>, - <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} setting={config.setting} + updRecord={(record) => this.setState({record: fromJS(record).toJS()})} wrappedComponentRef={(inst) => this.actionFormRef = inst} /> </Modal> {/* 鎸夐挳浣跨敤绯荤粺瀛樺偍杩囩▼鏃讹紝楠岃瘉淇℃伅妯℃�佹 */} <Modal - wrapClassName="model-table-action-verify-modal" - title={(card && card.label ? card.label + ' - ' : '') + '楠岃瘉淇℃伅'} + wrapClassName="mk-pop-modal" visible={profVisible} width={'90vw'} maskClosable={false} - okText={dict['model.submit']} + okText="鎻愪氦" onOk={this.verifySubmit} onCancel={() => { if (this.verifyRef.handleCancel) { @@ -509,39 +745,7 @@ }} destroyOnClose > - {card && !card.execMode && card.OpenType !== 'excelIn' && card.OpenType !== 'excelOut' ? - <VerifyCard - card={card} - dict={dict} - config={config} - columns={config.columns} - wrappedComponentRef={(inst) => this.verifyRef = inst} - /> : null - } - {card && card.execMode ? - <VerifyPrint - card={card} - dict={dict} - columns={config.columns} - wrappedComponentRef={(inst) => this.verifyRef = inst} - /> : null - } - {card && card.OpenType === 'excelIn' ? - <VerifyExcelIn - card={card} - dict={dict} - columns={config.columns} - wrappedComponentRef={(inst) => this.verifyRef = inst} - /> : null - } - {card && card.OpenType === 'excelOut' ? - <VerifyExcelOut - card={card} - dict={dict} - config={config} - wrappedComponentRef={(inst) => this.verifyRef = inst} - /> : null - } + {this.getVerify(card)} </Modal> </div> ) -- Gitblit v1.8.0