From 49f09cc6f8ff8c30a75ed1a9d6f510b69b73962a Mon Sep 17 00:00:00 2001 From: king <18310653075@163.com> Date: 星期二, 12 十二月 2023 21:05:37 +0800 Subject: [PATCH] 2023-12-12 --- src/menu/components/card/cardsimplecomponent/index.jsx | 95 ++++++++++++++++++++++++++--------------------- 1 files changed, 52 insertions(+), 43 deletions(-) diff --git a/src/menu/components/card/cardsimplecomponent/index.jsx b/src/menu/components/card/cardsimplecomponent/index.jsx index eea36ff..2eb816e 100644 --- a/src/menu/components/card/cardsimplecomponent/index.jsx +++ b/src/menu/components/card/cardsimplecomponent/index.jsx @@ -10,12 +10,13 @@ import { getTableSetting, getCarouselSetting } from './options' import Utils from '@/utils/utils.js' import MKEmitter from '@/utils/events.js' -// import './index.scss' +import './index.scss' const NormalForm = asyncIconComponent(() => import('@/components/normalform')) const NodesWrap = asyncComponent(() => import('./node-wrap')) const CardCellComponent = asyncComponent(() => import('../cardcellcomponent')) const CopyComponent = asyncIconComponent(() => import('@/menu/components/share/copycomponent')) +const PasteController = asyncIconComponent(() => import('@/components/paste')) class CardBoxComponent extends Component { static propTpyes = { @@ -43,10 +44,6 @@ }) } - componentDidMount () { - MKEmitter.addListener('submitStyle', this.getStyle) - } - shouldComponentUpdate (nextProps, nextState) { return !is(fromJS(this.props.cards), fromJS(nextProps.cards)) || !is(fromJS(this.state), fromJS(nextState)) } @@ -58,14 +55,10 @@ this.setState = () => { return } - MKEmitter.removeListener('submitStyle', this.getStyle) } - getStyle = (comIds, style) => { - const { cards } = this.props + getStyle = (style) => { const { card } = this.state - - if (comIds.length !== 2 || comIds[0] !== cards.uuid || comIds[1] !== card.uuid) return let _card = fromJS(card).toJS() _card.style = style @@ -90,7 +83,6 @@ } addElement = () => { - const { cards } = this.props const { card } = this.state let newcard = {} @@ -106,11 +98,10 @@ window.GLOB.$lock = false // 娉ㄥ唽浜嬩欢-娣诲姞鍏冪礌 - MKEmitter.emit('cardAddElement', [cards.uuid, card.uuid], newcard) + MKEmitter.emit('cardAddElement', card.uuid, newcard) } addButton = () => { - const { cards } = this.props const { card } = this.state let newcard = {eleType: 'button', label: 'button', verify: null, show: 'link', sqlType: '', Ot: 'requiredSgl', OpenType: 'prompt', icon: '', class: 'primary', intertype: 'system', execSuccess: 'grid', execError: 'never', popClose: 'never'} @@ -119,7 +110,7 @@ // 娉ㄥ唽浜嬩欢-娣诲姞鍏冪礌 - MKEmitter.emit('cardAddElement', [cards.uuid, card.uuid], newcard) + MKEmitter.emit('cardAddElement', card.uuid, newcard) } changeStyle = () => { @@ -134,7 +125,7 @@ options = ['background', 'border', 'padding', 'margin', 'shadow'] } - MKEmitter.emit('changeStyle', [cards.uuid, card.uuid], options, _style) + MKEmitter.emit('changeStyle', options, _style, this.getStyle) } getSettingForms = () => { @@ -196,6 +187,25 @@ this.props.updateElement(_card) } + paste = (element, resolve) => { + const { card } = this.state + + let _uuid = Utils.getuuid() + + if (element.copyType === 'action') { + element.eleType = 'button' + element.width = element.width || 12 + } + + element.uuid = _uuid + element.focus = true + + resolve({status: true}) + + // 娉ㄥ唽浜嬩欢-娣诲姞鍏冪礌 + MKEmitter.emit('cardAddElement', card.uuid, element) + } + render() { const { cards } = this.props const { card } = this.state @@ -203,7 +213,7 @@ let _style = {...card.style} if (cards.type === 'carousel') { - _style.height = cards.style.height + _style.height = cards.wrap.height } let control = true @@ -214,33 +224,32 @@ _style = resetStyle(_style) return ( - <div className="ant-col ant-col-24"> - <div className="card-item" style={_style}> - <CardCellComponent cards={cards} cardCell={card} elements={card.elements} updateElement={this.updateCard}/> - <div className="card-control"> - <Popover overlayClassName="mk-popover-control-wrap" mouseLeaveDelay={0.2} mouseEnterDelay={0.2} content={ - <div className="mk-popover-control"> - <PlusOutlined className="plus" title="娣诲姞鍏冪礌" onClick={this.addElement}/> - <PlusSquareOutlined className="plus" title="娣诲姞鎸夐挳" onClick={this.addButton}/> - {cards.type !== 'timeline' ? <NormalForm title="鍗$墖璁剧疆" width={800} update={this.updateSetting} getForms={this.getSettingForms}> - <EditOutlined style={{color: '#1890ff'}} title="缂栬緫"/> - </NormalForm> : <NodesWrap card={card} updateMenus={this.updateNodes}/>} - {cards.type !== 'timeline' ? <CopyComponent type="cardcell" card={card}/> : null} - <FontColorsOutlined className="style" title="璋冩暣鏍峰紡" onClick={this.changeStyle}/> - {control ? <Popover overlayClassName="mk-popover-control-wrap" mouseLeaveDelay={0.2} mouseEnterDelay={0.2} content={ - <div className="mk-popover-control"> - <ArrowLeftOutlined className="plus" title="鍓嶇Щ" onClick={() => this.props.move(card, 'left')} /> - <ArrowRightOutlined className="close" title="鍚庣Щ" onClick={() => this.props.move(card, 'right')} /> - </div> - } trigger="hover" getPopupContainer={() => document.getElementById(card.uuid + 'swap')}> - <SwapOutlined id={card.uuid + 'swap'}/> - </Popover> : null} - {control ? <DeleteOutlined className="close" title="鍒犻櫎鍗$墖" onClick={() => this.props.deleteElement(card)} /> : null} - </div> - } trigger="hover"> - <ToolOutlined/> - </Popover> - </div> + <div className="card-item" style={_style}> + <CardCellComponent cards={cards} cardCell={card} elements={card.elements} updateElement={this.updateCard}/> + <div className="card-control"> + <Popover overlayClassName="mk-popover-control-wrap" mouseLeaveDelay={0.2} mouseEnterDelay={0.2} content={ + <div className="mk-popover-control"> + <PlusOutlined className="plus" title="娣诲姞鍏冪礌" onClick={this.addElement}/> + <PlusSquareOutlined className="plus" title="娣诲姞鎸夐挳" onClick={this.addButton}/> + {cards.type !== 'timeline' ? <NormalForm title="鍗$墖璁剧疆" width={800} update={this.updateSetting} getForms={this.getSettingForms}> + <EditOutlined style={{color: '#1890ff'}} title="缂栬緫"/> + </NormalForm> : <NodesWrap card={card} updateMenus={this.updateNodes}/>} + {cards.type !== 'timeline' ? <CopyComponent type="cardcell" card={card}/> : null} + <PasteController options={['action', 'customCardElement']} updateConfig={this.paste} /> + <FontColorsOutlined className="style" title="璋冩暣鏍峰紡" onClick={this.changeStyle}/> + {control ? <Popover overlayClassName="mk-popover-control-wrap" mouseLeaveDelay={0.2} mouseEnterDelay={0.2} content={ + <div className="mk-popover-control"> + <ArrowLeftOutlined className="plus" title="鍓嶇Щ" onClick={() => this.props.move(card, 'left')} /> + <ArrowRightOutlined className="close" title="鍚庣Щ" onClick={() => this.props.move(card, 'right')} /> + </div> + } trigger="hover" getPopupContainer={() => document.getElementById(card.uuid + 'swap')}> + <SwapOutlined id={card.uuid + 'swap'}/> + </Popover> : null} + {control ? <DeleteOutlined className="close" title="鍒犻櫎鍗$墖" onClick={() => this.props.deleteElement(card)} /> : null} + </div> + } trigger="hover"> + <ToolOutlined/> + </Popover> </div> </div> ) -- Gitblit v1.8.0