From b438c7318712385a77026885063299958f23356e Mon Sep 17 00:00:00 2001
From: king <18310653075@163.com>
Date: 星期二, 13 七月 2021 17:00:49 +0800
Subject: [PATCH] 2021-07-13
---
src/menu/components/card/balcony/index.jsx | 185 +++++++++++++++-------------------------------
1 files changed, 61 insertions(+), 124 deletions(-)
diff --git a/src/menu/components/card/balcony/index.jsx b/src/menu/components/card/balcony/index.jsx
index acb1fd6..0fc02d5 100644
--- a/src/menu/components/card/balcony/index.jsx
+++ b/src/menu/components/card/balcony/index.jsx
@@ -1,7 +1,7 @@
import React, {Component} from 'react'
import PropTypes from 'prop-types'
import { is, fromJS } from 'immutable'
-import { Icon, Popover, Modal } from 'antd'
+import { Icon, Popover } from 'antd'
import asyncComponent from '@/utils/asyncComponent'
import asyncIconComponent from '@/utils/asyncIconComponent'
@@ -16,12 +16,9 @@
const WrapComponent = asyncIconComponent(() => import('./wrapsetting'))
const CardCellComponent = asyncComponent(() => import('../cardcellcomponent'))
const CopyComponent = asyncIconComponent(() => import('@/menu/components/share/copycomponent'))
-const PasteComponent = asyncIconComponent(() => import('@/menu/components/share/pastecomponent'))
+const PasteComponent = asyncIconComponent(() => import('@/components/paste'))
const UserComponent = asyncIconComponent(() => import('@/menu/components/share/usercomponent'))
const ClockComponent = asyncIconComponent(() => import('@/menu/components/share/clockcomponent'))
-const NormalHeader = asyncComponent(() => import('@/menu/components/share/normalheader'))
-
-const { confirm } = Modal
class BalconyEditComponent extends Component {
static propTpyes = {
@@ -40,7 +37,6 @@
const { card } = this.props
if (card.isNew) {
- // let ismob = sessionStorage.getItem('appType') === 'mob'
let _card = {
uuid: card.uuid,
type: card.type,
@@ -56,7 +52,7 @@
subtype: card.subtype,
setting: { interType: 'system' },
wrap: { name: card.name, width: card.width || 24, linkType: 'static', position: 'relative', datatype: 'static' },
- style: { marginLeft: '0px', marginRight: '0px', marginTop: '8px', marginBottom: '8px' },
+ style: { marginLeft: '0px', marginRight: '0px', marginTop: '0px', marginBottom: '0px' },
columns: [],
scripts: [],
elements: [],
@@ -87,7 +83,6 @@
componentDidMount () {
MKEmitter.addListener('submitStyle', this.getStyle)
- MKEmitter.addListener('submitComponentStyle', this.updateComponentStyle)
}
shouldComponentUpdate (nextProps, nextState) {
@@ -102,24 +97,6 @@
return
}
MKEmitter.removeListener('submitStyle', this.getStyle)
- MKEmitter.removeListener('submitComponentStyle', this.updateComponentStyle)
- }
-
- updateComponentStyle = (parentId, keys, style) => {
- const { card } = this.state
-
- if (card.uuid !== parentId) return
-
- let subcards = card.subcards.map(item => {
- if (keys.includes(item.uuid)) {
- item.style = {...item.style, ...style}
- }
- return item
- })
-
- this.setState({card: {...card, subcards: []}}, () => {
- this.updateComponent({...card, subcards: subcards})
- })
}
/**
@@ -136,52 +113,16 @@
this.props.updateConfig(component)
}
- /**
- * @description 鍗曚釜鍗＄墖淇℃伅鏇存柊
- */
- updateCard = (cell) => {
- let card = fromJS(this.state.card).toJS()
+ updateCard = (elements) => {
+ const { card } = this.state
- card.subcards = card.subcards.map(item => {
- if (item.uuid === cell.uuid) return cell
- return item
+ let _card = {...card, elements: elements}
+
+ this.setState({
+ card: _card,
})
- this.setState({card})
-
- this.props.updateConfig(card)
- }
-
- /**
- * @description 鍗曚釜鍗＄墖淇℃伅鏇存柊
- */
- deleteCard = (cell) => {
- let card = fromJS(this.state.card).toJS()
- let _this = this
-
- confirm({
- content: '纭畾鍒犻櫎鍗＄墖鍚楋紵',
- onOk() {
- card.subcards = card.subcards.filter(item => item.uuid !== cell.uuid)
-
- let uuids = []
- cell.elements && cell.elements.forEach(c => {
- if (c.eleType === 'button') {
- uuids.push(c.uuid)
- }
- })
- cell.backElements && cell.backElements.forEach(c => {
- if (c.eleType === 'button') {
- uuids.push(c.uuid)
- }
- })
- MKEmitter.emit('delButtons', uuids)
-
- _this.setState({card})
- _this.props.updateConfig(card)
- },
- onCancel() {}
- })
+ this.props.updateConfig(_card)
}
changeStyle = () => {
@@ -204,66 +145,63 @@
this.props.updateConfig(_card)
}
- addCard = () => {
- let card = fromJS(this.state.card).toJS()
+ addElement = () => {
+ const { card } = this.state
- let newcard = {
- uuid: Utils.getuuid(),
- setting: { width: 6, type: 'simple'},
- style: {
- borderWidth: '1px', borderColor: '#e8e8e8',
- paddingTop: '15px', paddingBottom: '15px', paddingLeft: '15px', paddingRight: '15px',
- marginLeft: '8px', marginRight: '8px', marginTop: '8px', marginBottom: '8px'
- },
- backStyle: {},
- elements: [],
- backElements: []
- }
-
- if (card.subcards.length > 0) {
- newcard = fromJS(card.subcards.slice(-1)[0]).toJS()
- newcard.uuid = Utils.getuuid()
- newcard.elements = newcard.elements.map(elem => {
- elem.uuid = Utils.getuuid()
- return elem
- })
- newcard.backElements = newcard.backElements.map(elem => {
- elem.uuid = Utils.getuuid()
- return elem
- })
- }
-
- card.subcards.push(newcard)
+ let newcard = {}
+ newcard.uuid = Utils.getuuid()
+ newcard.focus = true
- this.setState({card})
- this.props.updateConfig(card)
+ newcard.eleType = 'text'
+ newcard.datatype = 'dynamic'
+ newcard.height = 1
+
+ // 娉ㄥ唽浜嬩欢-娣诲姞鍏冪礌
+ MKEmitter.emit('cardAddElement', [card.uuid, card.uuid], newcard)
}
- move = (item, direction) => {
- let card = fromJS(this.state.card).toJS()
+ addButton = () => {
+ const { card } = this.state
- let dragIndex = card.subcards.findIndex(c => c.uuid === item.uuid)
- let hoverIndex = null
+ let newcard = {}
+ newcard.uuid = Utils.getuuid()
+ newcard.focus = true
+
+ newcard.eleType = 'button'
+ newcard.label = 'button'
+ newcard.sqlType = ''
+ newcard.Ot = 'requiredSgl'
+ newcard.OpenType = 'prompt'
+ newcard.icon = ''
+ newcard.class = 'primary'
+ newcard.intertype = 'system'
+ newcard.execSuccess = 'grid'
+ newcard.execError = 'never'
+ newcard.popClose = 'never'
+ newcard.errorTime = 10
+ newcard.verify = null
+ newcard.show = 'link'
- if (direction === 'left') {
- hoverIndex = dragIndex - 1
+ // 娉ㄥ唽浜嬩欢-娣诲姞鍏冪礌
+ MKEmitter.emit('cardAddElement', [card.uuid, card.uuid], newcard)
+ }
+
+ pasteComponent = (res, resolve) => {
+ const { card } = this.state
+
+ let type = res.copyType
+ delete res.copyType
+
+ res.uuid = Utils.getuuid()
+ res.focus = true
+
+ if (type === 'customCardElement') {
+ MKEmitter.emit('cardAddElement', [card.uuid, card.uuid], res)
} else {
- hoverIndex = dragIndex + 1
+ res.eleType = 'button'
+ MKEmitter.emit('cardAddElement', [card.uuid, card.uuid], res)
}
-
- if (hoverIndex === -1 || hoverIndex === card.subcards.length) return
-
- card.subcards.splice(hoverIndex, 0, ...card.subcards.splice(dragIndex, 1))
-
- this.setState({card})
- this.props.updateConfig(card)
- }
-
- clickComponent = (e) => {
- if (sessionStorage.getItem('style-control') === 'true' || sessionStorage.getItem('style-control') === 'component') {
- e.stopPropagation()
- MKEmitter.emit('clickComponent', this.state.card)
- }
+ resolve({status: true})
}
render() {
@@ -272,15 +210,14 @@
let _style = resetStyle(card.style)
return (
- <div className="menu-balcony-edit-box" style={_style} onClick={this.clickComponent} id={card.uuid}>
- <NormalHeader defaultshow="hidden" config={card} updateComponent={this.updateComponent}/>
+ <div className="menu-balcony-edit-box" style={_style} id={card.uuid}>
<Popover overlayClassName="mk-popover-control-wrap" mouseLeaveDelay={0.2} mouseEnterDelay={0.2} content={
<div className="mk-popover-control">
<Icon className="plus" title="娣诲姞鍏冪礌" onClick={this.addElement} type="plus" />
<Icon className="plus" title="娣诲姞鎸夐挳" onClick={this.addButton} type="plus-square" />
<WrapComponent config={card} updateConfig={this.updateComponent} />
<CopyComponent type="balcony" card={card}/>
- <PasteComponent config={card} options={['cardcell']} updateConfig={this.updateComponent} />
+ <PasteComponent options={['action', 'customCardElement']} updateConfig={this.pasteComponent} />
<Icon className="style" title="璋冩暣鏍峰紡" onClick={this.changeStyle} type="font-colors" />
<ClockComponent config={card} updateConfig={this.updateComponent}/>
<UserComponent config={card}/>
--
Gitblit v1.8.0