From 8a1ee7d651500f848a3c2f05c7fe3be2b7114a43 Mon Sep 17 00:00:00 2001 From: king <18310653075@163.com> Date: 星期三, 10 四月 2024 00:47:56 +0800 Subject: [PATCH] 2024-04-10 --- src/menu/components/card/doublecardcomponent/index.jsx | 128 ++++++++++++++++++++++++++++++++++++++++-- 1 files changed, 121 insertions(+), 7 deletions(-) diff --git a/src/menu/components/card/doublecardcomponent/index.jsx b/src/menu/components/card/doublecardcomponent/index.jsx index cc2e64a..0507417 100644 --- a/src/menu/components/card/doublecardcomponent/index.jsx +++ b/src/menu/components/card/doublecardcomponent/index.jsx @@ -1,7 +1,7 @@ import React, {Component} from 'react' import PropTypes from 'prop-types' import { is, fromJS } from 'immutable' -import { Popover, Col } from 'antd' +import { Popover, Col, Modal, Button } from 'antd' import { UpOutlined, PlusOutlined, PlusSquareOutlined, EditOutlined, ToolOutlined, FontColorsOutlined } from '@ant-design/icons' import asyncComponent from '@/utils/asyncComponent' @@ -11,6 +11,8 @@ import Utils from '@/utils/utils.js' import MKEmitter from '@/utils/events.js' import './index.scss' + +const { confirm } = Modal const NormalForm = asyncIconComponent(() => import('@/components/normalform')) const CardCellComponent = asyncComponent(() => import('@/menu/components/card/cardcellcomponent')) @@ -28,6 +30,7 @@ card: null, // 鍗$墖淇℃伅锛屽寘鎷鍙嶉潰 appType: sessionStorage.getItem('appType'), visible: false, + timestamp: '', side: '' } @@ -38,7 +41,8 @@ const { card } = this.props this.setState({ - card: fromJS(card).toJS() + card: fromJS(card).toJS(), + timestamp: new Date().getTime() + '' }) } @@ -208,8 +212,118 @@ this.props.updateElement(_card) } + updateFields = (elements, resolve, position, type) => { + const { card } = this.state + + let items = elements + + if (type === 'form') { + items = [] + + elements.forEach(item => { + let cell = { + uuid: Utils.getuuid(), + eleType: 'text', + height: 1, + innerHeight: 21, + prefix: item.label ? item.label + ': ' : '', + datatype: item.field ? 'dynamic' : 'static', + field: item.field || '', + width: item.span || 12, + value: '', + style: {marginBottom: '15px'} + } + + if (item.type === 'number') { + cell.eleType = 'number' + cell.decimal = typeof(item.decimal) === 'number' ? item.decimal : '' + } + + items.push(cell) + }) + } + + if (items.length === 0) { + resolve({status: false, message: '鍏冪礌涓嶅彲涓虹┖锛�'}) + return + } + + let _card = { ...card } + let _card2 = { ...card } + let pass = false + + if (position === 'sub') { + if (_card.backElements.length === 0) { + _card.backElements = items + pass = true + } else { + _card.backElements = items + _card2.backElements = [...card.backElements, ...items] + } + } else { + if (_card.elements.length === 0) { + _card.elements = items + pass = true + } else { + _card.elements = items + _card2.elements = [...card.elements, ...items] + } + } + + if (pass) { + this.setState({ + card: _card, + timestamp: new Date().getTime() + '' + }) + + this.props.updateElement(_card) + } else { + const that = this + const _modal = confirm({ + title: '鍗$墖涓凡瀛樺湪鍏冪礌锛岃閫夋嫨瑕佽繘琛岀殑鎿嶄綔銆�', + className: 'mk-confirm-modal', + content: <div className="footer"> + <Button key="cancel" onClick={() => _modal.destroy()}>鍙栨秷</Button> + <Button key="replace" className="mk-border-purple" onClick={() => { + that.setState({ + card: _card, + timestamp: new Date().getTime() + '' + }) + + that.props.updateElement(_card) + _modal.destroy() + }}>鏇挎崲</Button> + <Button key="confirm" className="mk-border-green" onClick={() => { + that.setState({ + card: _card2, + timestamp: new Date().getTime() + '' + }) + + that.props.updateElement(_card2) + _modal.destroy() + }}>娣诲姞</Button> + </div> + }) + } + + resolve({status: true}) + } + paste = (element, resolve, type) => { const { card } = this.state + + if (['simpleform', 'forms', 'formgroup', 'cardcell'].includes(element.copyType)) { + if (element.copyType === 'simpleform') { + this.updateFields(element.subcards[0].fields, resolve, type, 'form') + } else if (element.copyType === 'forms') { + this.updateFields(element.fields, resolve, type, 'form') + } else if (element.copyType === 'formgroup') { + this.updateFields(element.fields, resolve, type, 'form') + } else { + this.updateFields(element.elements, resolve, type) + } + return + } let _uuid = Utils.getuuid() @@ -238,7 +352,7 @@ render() { const { cards } = this.props - const { card } = this.state + const { card, timestamp } = this.state let _style = {...card.style} let _backStyle = {...card.backStyle} @@ -288,14 +402,14 @@ <EditOutlined className="edit" title="缂栬緫"/> </NormalForm> <CopyComponent type="cardcell" card={{...card, backElements: []}}/> - <PasteController options={['action', 'customCardElement']} updateConfig={(element, resolve) => this.paste(element, resolve, 'main')} /> + <PasteController options={['action', 'customCardElement', 'simpleform', 'forms', 'formgroup', 'cardcell']} updateConfig={(element, resolve) => this.paste(element, resolve, 'main')} /> <FontColorsOutlined className="style" title="璋冩暣鏍峰紡" onClick={() => this.changeStyle()} /> </div> } trigger="hover"> <ToolOutlined /> </Popover> </div> - <CardCellComponent cards={cards} cardCell={card} side="main" elements={card.elements} updateElement={(elements, btn) => this.updateCard(elements, btn)}/> + <CardCellComponent cards={cards} cardCell={card} side="main" timestamp={timestamp} elements={card.elements} updateElement={(elements, btn) => this.updateCard(elements, btn)}/> </div> <Col span={card.backSetting.width || 24}> <div className={'card-item ' + (card.backSetting.btnControl || '')} style={_backStyle} onDoubleClick={(e) => {e.stopPropagation(); this.doubleClickCard('sub')}} id={card.uuid}> @@ -308,14 +422,14 @@ <EditOutlined className="edit" title="缂栬緫"/> </NormalForm> <CopyComponent type="cardcell" card={{...card, elements: card.backElements, backElements: []}}/> - <PasteController options={['action', 'customCardElement']} updateConfig={(element, resolve) => this.paste(element, resolve, 'sub')} /> + <PasteController options={['action', 'customCardElement', 'simpleform', 'forms', 'formgroup', 'cardcell']} updateConfig={(element, resolve) => this.paste(element, resolve, 'sub')} /> <FontColorsOutlined className="style" title="璋冩暣鏍峰紡" onClick={() => this.changeStyle('sub')} /> </div> } trigger="hover"> <ToolOutlined /> </Popover> </div> - <CardCellComponent cards={cards} cardCell={card} side="sub" elements={card.backElements} updateElement={(elements, btn) => this.updateCard(elements, btn, 'sub')}/> + <CardCellComponent cards={cards} cardCell={card} side="sub" timestamp={timestamp} elements={card.backElements} updateElement={(elements, btn) => this.updateCard(elements, btn, 'sub')}/> </div> </Col> </div> -- Gitblit v1.8.0