From cbeffcc0902631909c0373f274752a97ddaf2d4e Mon Sep 17 00:00:00 2001 From: king <18310653075@163.com> Date: 星期六, 06 八月 2022 01:41:54 +0800 Subject: [PATCH] 2022-08-06 --- src/menu/components/card/cardcellcomponent/index.jsx | 348 ++++++++++++++++++++++++++++++++++++--------------------- 1 files changed, 221 insertions(+), 127 deletions(-) diff --git a/src/menu/components/card/cardcellcomponent/index.jsx b/src/menu/components/card/cardcellcomponent/index.jsx index e46935d..cd73458 100644 --- a/src/menu/components/card/cardcellcomponent/index.jsx +++ b/src/menu/components/card/cardcellcomponent/index.jsx @@ -12,6 +12,7 @@ import MKEmitter from '@/utils/events.js' import MenuUtils from '@/utils/utils-custom.js' import ElementForm from './elementform' +import CreateFunc from '@/templates/zshare/createfunc' import DragElement from './dragaction' import './index.scss' @@ -41,6 +42,7 @@ visible: false, // 妯℃�佹鎺у埗 actvisible: false, // 鎸夐挳缂栬緫妯℃�佹 profVisible: false, // 楠岃瘉淇℃伅缂栬緫 + record: null } /** @@ -124,6 +126,12 @@ const { cards, cardCell } = this.props if (!ids || ids.length !== 2 || ids[0] !== cards.uuid || ids[1] !== cardCell.uuid) return + if (window.GLOB.$lock) return + + window.GLOB.$lock = true + setTimeout(() => { + window.GLOB.$lock = false + }, 200) const { elements } = this.state @@ -139,9 +147,18 @@ let options = ['font', 'border', 'padding', 'margin', 'background'] if (element.eleType === 'button') { - options.push('width', 'float') + if (element.OpenType === 'form') { + options = ['margin', 'float'] + } else { + options.push('width', 'minHeight', 'float') + } + if (element.wrapStyle) { + _style.float = element.wrapStyle.textAlign || 'left' + } } else if (element.eleType === 'picture') { options = ['border', 'margin'] + } else if (element.eleType === 'text') { + options[0] = 'font2' } else if (element.eleType === 'slider') { options = ['padding', 'margin'] } else if (element.eleType === 'splitline') { @@ -161,6 +178,12 @@ if (comIds.length !== 3 || comIds[0] !== cards.uuid || comIds[1] !== cardCell.uuid || !card) return + // if (card.eleType === 'button') { + // if ((style.paddingLeft || style.paddingRight) && !style.width) { + // style.width = 'auto' + // } + // } + let _card = this.resetCardStyle(card, style) let _elements = elements.map(cell => { @@ -178,7 +201,7 @@ resetCardStyle = (card, style) => { let _card = fromJS(card).toJS() - if (_card.eleType === 'text' || _card.eleType === 'number') { + if (['text', 'number', 'formula'].includes(_card.eleType)) { _card.style = style let fontSize = 14 @@ -217,7 +240,12 @@ _card.innerHeight = _card.barHeight + (_card.displayValue === 'true' ? fontSize + 2 : 0) } else if (_card.eleType === 'button') { // 鎷嗗垎style - _card.style = style + _card.style = fromJS(style).toJS() + + if (style.float) { + _card.wrapStyle = {textAlign: style.float} + delete _card.style.float + } } else { _card.style = style } @@ -243,10 +271,12 @@ if (card.eleType === 'button') { this.handleAction(card) } else { + let anchors = MenuUtils.getAnchors(window.GLOB.customMenu.components, cards.uuid) || [] + this.setState({ visible: true, card: card, - formlist: getCardCellForm(card, cards.type, cards.subtype, cardCell) + formlist: getCardCellForm(card, cards.type, cards.subtype, cardCell, anchors) }) } } @@ -261,7 +291,7 @@ if (usefulFields) { try { usefulFields = JSON.parse(usefulFields) - } catch { + } catch (e) { usefulFields = [] } } else { @@ -277,19 +307,30 @@ if (menulist) { try { menulist = JSON.parse(menulist) - } catch { + } catch (e) { menulist = [] } } else { menulist = [] } - let modules = MenuUtils.getSubModules(window.GLOB.customMenu.components, cards.uuid) + let supId = '' + if (cards.setting && cards.setting.supModule) { + let pid = cards.setting.supModule[cards.setting.supModule.length - 1] + if (pid && pid !== 'empty') { + supId = pid + } else { + supId = '' + } + } + + let modules = MenuUtils.getSubModules(window.GLOB.customMenu.components, cards.uuid, supId) || [] + let anchors = MenuUtils.getAnchors(window.GLOB.customMenu.components, cards.uuid) || [] this.setState({ actvisible: true, card: card, - formlist: getActionForm(card, functip, cards, usefulFields, 'card', menulist, modules) + formlist: getActionForm(card, functip, cards, usefulFields, 'card', menulist, modules, anchors) }) } @@ -297,11 +338,15 @@ * @description 鍙栨秷淇濆瓨锛屽鏋滃厓绱犱负鏂版坊鍏冪礌锛屽垯浠庡簭鍒椾腑鍒犻櫎 */ editModalCancel = () => { - const { card, elements } = this.state + const { card, elements, appType } = this.state let _elements = null if (card.focus) { _elements = elements.filter(item => item.uuid !== card.uuid) + + if (card.OpenType === 'popview' && appType !== 'mob') { // 寮圭獥鏍囩鎸夐挳锛屼粠澶嶅埗鍒楄〃涓垹闄� + MKEmitter.emit('delButtons', [card.uuid]) + } } else { _elements = elements } @@ -311,6 +356,8 @@ elements: _elements, visible: false, actvisible: false + }, () => { + this.props.updateElement(_elements) }) } @@ -324,11 +371,10 @@ let _elements = elements.map(cell => { if (cell.uuid === res.uuid) { res.style = cell.style || {} - res.$type = cell.$type || '' if (res.eleType === 'splitline' && cell.eleType !== 'splitline') { res.style.paddingTop = '5px' res.style.paddingBottom = '5px' - } else if (res.eleType === 'text' || res.eleType === 'number') { + } else if (['text', 'number', 'formula'].includes(res.eleType)) { let fontSize = 14 let lineHeight = 1.5 let line = res.height || null @@ -381,11 +427,24 @@ this.actionFormRef.handleConfirm().then(res => { let _elements = elements.map(cell => { if (cell.uuid === res.uuid) { - res = {...cell, ...res} - delete res.focus - let style = {} + res.eleType = cell.eleType || null + res.style = cell.style || null + res.modal = cell.modal || null + // res = {...cell, ...res} - if (res.class !== cell.class || res.show !== cell.show || !res.style) { + // if (!res.control) { + // delete res.controlField + // delete res.controlVal + // } + + // delete res.focus + + if (res.OpenType === 'form') { + if (cell.OpenType !== 'form') { + res.style = {} + } + } else if (res.class !== cell.class || res.show !== cell.show || !res.style) { + let style = {} if (res.show === 'link' || res.show === 'icon') { style.color = color[res.class] style.backgroundColor = 'transparent' @@ -393,8 +452,8 @@ style.color = '#ffffff' style.backgroundColor = color[res.class] } + res.style = {...res.style, ...style} } - res.style = {...res.style, ...style} return res } @@ -414,7 +473,7 @@ * @description 鎸夐挳鍒犻櫎 */ deleteElement = (card) => { - const { cards, cardCell, side } = this.props + const { cardCell, side } = this.props const { dict, elements, appType } = this.state let _this = this @@ -427,7 +486,7 @@ card.$parentId = cardCell.uuid card.$side = side || '' - MKEmitter.emit('logButton', cards.uuid, card) + // MKEmitter.emit('logButton', cards.uuid, card) } _this.setState({ @@ -453,6 +512,7 @@ profVisible: true, card: element }) + MKEmitter.emit('modalStatus', '楠岃瘉淇℃伅') } /** @@ -476,6 +536,8 @@ }, () => { this.props.updateElement(_elements) }) + + MKEmitter.emit('modalStatus', false) }) } @@ -486,31 +548,25 @@ if ((sessionStorage.getItem('style-control') && sessionStorage.getItem('style-control') === 'true')) return - if (btn.eleType === 'button') { - if (btn.OpenType === 'pop') { - if (!btn.modal) { - btn.modal = { - setting: { title: btn.label, width: appType === 'mob' ? 100 : 60, cols: '2', container: 'view', focus: '', finish: 'close', clickouter: 'unclose', display: 'modal' }, - tables: [], - groups: [], - fields: [] - } + if (btn.OpenType === 'pop' || btn.execMode === 'pop') { + if (!btn.modal) { + btn.modal = { + setting: { title: btn.label, width: appType === 'mob' ? 100 : 60, cols: '2', container: 'view', focus: '', finish: 'close', clickouter: 'unclose', display: 'modal' }, + tables: [], + groups: [], + fields: [] } - - MKEmitter.emit('changeModal', cards, btn) - } else if (btn.OpenType === 'popview') { - MKEmitter.emit('changePopview', cards, btn) - } else if (btn.OpenType === 'innerpage' && btn.pageTemplate === 'page') { - MKEmitter.emit('changeEditMenu', {MenuID: btn.uuid, copyMenuId: btn.copyMenuId}) - } else if (btn.OpenType === 'innerpage' && btn.pageTemplate === 'linkpage') { - MKEmitter.emit('changeEditMenu', {MenuID: btn.linkmenu}) } + + MKEmitter.emit('changeModal', cards, btn) + } else if (btn.OpenType === 'popview') { + MKEmitter.emit('changePopview', cards, btn) + } else if (btn.OpenType === 'innerpage' && btn.pageTemplate === 'linkpage') { + MKEmitter.emit('changeEditMenu', {MenuID: btn.linkmenu}) + } else if (btn.OpenType === 'funcbutton' && (btn.funcType === 'copyurl' || btn.funcType === 'scan') && btn.linkmenu) { + MKEmitter.emit('changeEditMenu', {MenuID: btn.linkmenu}) } else { - if (btn.link === 'page') { - MKEmitter.emit('changeEditMenu', {MenuID: btn.uuid, copyMenuId: btn.copyMenuId}) - } else if (btn.link === 'linkpage') { - MKEmitter.emit('changeEditMenu', {MenuID: btn.linkmenu}) - } + this.handleElement(item) } } @@ -566,19 +622,75 @@ let btn = cards.action[index] btn.eleType = 'button' + if (!btn.width) { + btn.width = 12 + } + if (btn.color) { + btn.style = btn.style || {} + btn.style.color = '#ffffff' + if (btn.color === 'primary') { + btn.style.backgroundColor = '#1677ff' + } else if (btn.color === 'danger') { + btn.style.backgroundColor = '#ff3141' + } else if (btn.color === 'warning') { + btn.style.backgroundColor = '#ff8f1f' + } else if (btn.color === 'success') { + btn.style.backgroundColor = '#00b578' + } else if (btn.color === 'light') { + btn.style.backgroundColor = '#cccccc' + } + } + let _elements = [...this.state.elements, btn] - let _action = cards.action.filter(item => item.uuid !== id) this.setState({ elements: _elements }, () => { - this.props.updateElement(_elements, _action) + this.props.updateElement(_elements, btn) }) + } + + getVerify = (card) => { + const { cards } = this.props + const { dict } = this.state + + if (!card) return null + + if (['pop', 'prompt', 'exec'].includes(card.OpenType)) { + return <VerifyCard + card={card} + dict={dict} + config={cards} + columns={cards.columns} + wrappedComponentRef={(inst) => this.verifyRef = inst} + /> + } else if (card.OpenType === 'excelIn') { + return <VerifyExcelIn + card={card} + dict={dict} + columns={cards.columns} + wrappedComponentRef={(inst) => this.verifyRef = inst} + /> + } else if (card.OpenType === 'excelOut') { + return <VerifyExcelOut + card={card} + dict={dict} + config={cards} + wrappedComponentRef={(inst) => this.verifyRef = inst} + /> + } else if (card.OpenType === 'funcbutton' && card.funcType === 'print') { + return <VerifyPrint + card={card} + dict={dict} + columns={cards.columns} + wrappedComponentRef={(inst) => this.verifyRef = inst} + /> + } } render() { const { cards, cardCell } = this.props - const { elements, visible, actvisible, profVisible, card, dict } = this.state + const { elements, visible, actvisible, profVisible, card, dict, record } = this.state return ( <div className="model-menu-card-cell-list"> @@ -595,94 +707,76 @@ handleSubConfig={this.handleSubConfig} deleteMenu={this.deleteElement} /> - {/* 缂栬緫鎸夐挳锛氬鍒躲�佺紪杈� */} - <Modal - title={'缂栬緫鍏冪礌'} - visible={visible} - width={800} - maskClosable={false} - onCancel={this.editModalCancel} - onOk={this.handleSubmit} - destroyOnClose - > - <ElementForm - dict={dict} - card={card} - formlist={this.state.formlist} - inputSubmit={this.handleSubmit} - config={cards} - wrappedComponentRef={(inst) => this.elementFormRef = inst} - /> - </Modal> - {/* 缂栬緫鎸夐挳锛氬鍒躲�佺紪杈� */} - <Modal - title={dict['model.action'] + '-' + (card && card.copyType === 'action' ? dict['model.copy'] : dict['model.edit'])} - visible={actvisible} - width={800} - maskClosable={false} - onCancel={this.editModalCancel} - footer={[ - <Button key="cancel" onClick={this.editModalCancel}>{dict['model.cancel']}</Button>, - <Button key="confirm" type="primary" onClick={this.handleActionSubmit}>{dict['model.confirm']}</Button> - ]} - destroyOnClose - > - <ActionForm - dict={dict} - type={cards.type === 'balcony' ? '' : 'card'} - card={card} - formlist={this.state.formlist} - inputSubmit={this.handleActionSubmit} - setting={cards.setting} - wrappedComponentRef={(inst) => this.actionFormRef = inst} - /> - </Modal> - {/* 鎸夐挳浣跨敤绯荤粺瀛樺偍杩囩▼鏃讹紝楠岃瘉淇℃伅妯℃�佹 */} - <Modal - wrapClassName="model-table-action-verify-modal" - title={'楠岃瘉淇℃伅'} - visible={profVisible} - width={'75vw'} - maskClosable={false} - okText={dict['model.submit']} - onOk={this.verifySubmit} - onCancel={() => { this.setState({ profVisible: false }) }} - destroyOnClose - > - {card && !card.execMode && card.OpenType !== 'excelIn' && card.OpenType !== 'excelOut' ? - <VerifyCard - card={card} + <div onDoubleClick={(e) => e.stopPropagation()}> + {/* 缂栬緫鎸夐挳锛氬鍒躲�佺紪杈� */} + <Modal + title="缂栬緫鍏冪礌" + visible={visible} + width={850} + maskClosable={false} + onCancel={this.editModalCancel} + onOk={this.handleSubmit} + destroyOnClose + > + <ElementForm dict={dict} + card={card} + formlist={this.state.formlist} + inputSubmit={this.handleSubmit} config={cards} - columns={cards.columns} - wrappedComponentRef={(inst) => this.verifyRef = inst} - /> : null - } - {card && card.execMode ? - <VerifyPrint - card={card} + wrappedComponentRef={(inst) => this.elementFormRef = inst} + /> + </Modal> + {/* 缂栬緫鎸夐挳锛氬鍒躲�佺紪杈� */} + <Modal + title="鎸夐挳路缂栬緫" + visible={actvisible} + 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.handleActionSubmit}>{dict['model.confirm']}</Button> + ]} + destroyOnClose + > + <ActionForm dict={dict} - columns={cards.columns} - wrappedComponentRef={(inst) => this.verifyRef = inst} - /> : null - } - {card && card.OpenType === 'excelIn' ? - <VerifyExcelIn + type={cards.type === 'balcony' ? '' : 'card'} card={card} - dict={dict} - columns={cards.columns} - wrappedComponentRef={(inst) => this.verifyRef = inst} - /> : null - } - {card && card.OpenType === 'excelOut' ? - <VerifyExcelOut - card={card} - dict={dict} - config={cards} - wrappedComponentRef={(inst) => this.verifyRef = inst} - /> : null - } - </Modal> + formlist={this.state.formlist} + inputSubmit={this.handleActionSubmit} + setting={cards.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 + ' - ' : '') + '楠岃瘉淇℃伅'} + visible={profVisible} + width={'90vw'} + maskClosable={false} + okText={dict['model.submit']} + 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 + > + {this.getVerify(card)} + </Modal> + </div> </div> ) } -- Gitblit v1.8.0