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 | 454 +++++++++++++++++++++++++++++++++++++++----------------- 1 files changed, 314 insertions(+), 140 deletions(-) diff --git a/src/menu/components/share/actioncomponent/index.jsx b/src/menu/components/share/actioncomponent/index.jsx index aed95d3..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' @@ -25,14 +23,12 @@ 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, // 琛ㄥ崟淇℃伅 @@ -64,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) { @@ -89,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 @@ -115,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) => { @@ -170,19 +188,13 @@ } 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 = [] + + if (!ableField) { // 鏃犲瓧娈甸檺鍒� + functip = '' } let supId = '' @@ -194,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, this.props.type, menulist, 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) + }) + } } /** @@ -234,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 => { @@ -247,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 @@ -287,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() {} }) @@ -325,7 +500,6 @@ profVisible: true, card: element }) - MKEmitter.emit('modalStatus', '楠岃瘉淇℃伅') } /** @@ -342,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 @@ -353,7 +528,6 @@ }, () => { this.props.updateaction({...config, action: _actionlist}) }) - MKEmitter.emit('modalStatus', false) }) } @@ -361,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) + }) }) } @@ -438,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 @@ -465,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} @@ -480,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} /> @@ -509,14 +686,14 @@ } render() { - const { config, type } = this.props - const { actionlist, visible, appType, card, dict, profVisible, record } = 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} @@ -528,19 +705,19 @@ {/* 缂栬緫鎸夐挳锛氬鍒躲�佺紪杈� */} <Modal title="鎸夐挳路缂栬緫" + wrapClassName="mk-scroll-modal" visible={visible} - width={850} + 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} @@ -551,22 +728,19 @@ </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) { 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