From c45a375e5b4ce0e33c7fc8a1aecdad67d60acc9e Mon Sep 17 00:00:00 2001 From: king <18310653075@163.com> Date: 星期一, 01 三月 2021 15:09:06 +0800 Subject: [PATCH] 2021-03-01 --- src/menu/components/card/data-card/index.jsx | 212 ++++++++++++++++++++++++++++++++++++++-------------- 1 files changed, 155 insertions(+), 57 deletions(-) diff --git a/src/menu/components/card/data-card/index.jsx b/src/menu/components/card/data-card/index.jsx index 57b3102..1ce4fff 100644 --- a/src/menu/components/card/data-card/index.jsx +++ b/src/menu/components/card/data-card/index.jsx @@ -1,8 +1,8 @@ import React, {Component} from 'react' import PropTypes from 'prop-types' -import {connect} from 'react-redux' +import { connect } from 'react-redux' import { is, fromJS } from 'immutable' -import { Icon, Popover, Modal, Pagination } from 'antd' +import { Icon, Popover, Modal, Pagination, notification } from 'antd' import asyncComponent from '@/utils/asyncComponent' import asyncIconComponent from '@/utils/asyncIconComponent' @@ -16,6 +16,10 @@ const SettingComponent = asyncIconComponent(() => import('@/menu/datasource')) const WrapComponent = asyncIconComponent(() => import('./wrapsetting')) const CardComponent = asyncComponent(() => import('../cardcomponent')) +const LogComponent = asyncIconComponent(() => import('@/menu/components/share/logcomponent')) +const CopyComponent = asyncIconComponent(() => import('@/menu/components/share/copycomponent')) +const UserComponent = asyncIconComponent(() => import('@/menu/components/share/usercomponent')) +const PasteComponent = asyncIconComponent(() => import('@/menu/components/share/pastecomponent')) const NormalHeader = asyncComponent(() => import('@/menu/components/share/normalheader')) const ActionComponent = asyncComponent(() => import('@/menu/components/share/actioncomponent')) @@ -29,7 +33,7 @@ } state = { - dict: localStorage.getItem('lang') !== 'en-US' ? zhCN : enUS, + dict: sessionStorage.getItem('lang') !== 'en-US' ? zhCN : enUS, card: null, back: false } @@ -38,24 +42,29 @@ const { card } = this.props if (card.isNew) { - let subcards = null - - if (card.config) { - subcards = JSON.parse(card.config) - subcards = subcards.map(scard => { - scard.uuid = Utils.getuuid() - scard.elements = scard.elements.map(elem => { - elem.uuid = Utils.getuuid() - return elem - }) - scard.backElements = scard.backElements.map(elem => { - elem.uuid = Utils.getuuid() - return elem - }) - return scard - }) - } else { - subcards = [{ + let _card = { + uuid: card.uuid, + type: card.type, + floor: card.floor, + tabId: card.tabId || '', + parentId: card.parentId || '', + format: 'array', // 缁勪欢灞炴�� - 鏁版嵁鏍煎紡 + pageable: true, // 缁勪欢灞炴�� - 鏄惁鍙垎椤� + switchable: true, // 缁勪欢灞炴�� - 鏁版嵁鏄惁鍙垏鎹� + dataName: card.dataName || '', + width: card.width || 24, + name: card.name, + subtype: card.subtype, + setting: { interType: 'system' }, + wrap: { name: card.name, width: card.width || 24, title: '', pagestyle: 'page', switch: 'false' }, + style: { marginLeft: '0px', marginRight: '0px', marginTop: '8px', marginBottom: '8px' }, + headerStyle: { fontSize: '16px', borderBottomWidth: '1px', borderBottomColor: '#e8e8e8' }, + columns: [], + scripts: [], + action: [], + search: [], + btnlog: [], + subcards: [{ uuid: Utils.getuuid(), setting: { width: 6, type: 'simple'}, style: { @@ -69,29 +78,36 @@ }] } - let _card = { - uuid: card.uuid, - type: card.type, - floor: card.floor, - tabId: card.tabId || '', - parentId: card.parentId || '', - format: 'array', // 缁勪欢灞炴�� - 鏁版嵁鏍煎紡 - pageable: true, // 缁勪欢灞炴�� - 鏄惁鍙垎椤� - switchable: true, // 缁勪欢灞炴�� - 鏁版嵁鏄惁鍙垏鎹� - dataName: card.dataName || '', - width: 24, - name: card.name, - subtype: card.subtype, - setting: { interType: 'system' }, - wrap: { name: card.name, width: 24, title: '', pagestyle: 'page', switch: 'false' }, - style: { marginLeft: '0px', marginRight: '0px', marginTop: '8px', marginBottom: '8px' }, - headerStyle: { fontSize: '16px', borderBottomWidth: '1px', borderBottomColor: '#e8e8e8' }, - columns: [], - scripts: [], - action: [], - btnlog: [], - subcards: subcards + if (card.config) { + let config = fromJS(card.config).toJS() + + _card.wrap = config.wrap + _card.wrap.name = card.name + _card.style = config.style + _card.headerStyle = config.headerStyle + + _card.subcards = config.subcards.map(scard => { + scard.uuid = Utils.getuuid() + scard.elements = scard.elements.map(elem => { + elem.uuid = Utils.getuuid() + return elem + }) + scard.backElements = scard.backElements.map(elem => { + elem.uuid = Utils.getuuid() + return elem + }) + return scard + }) + _card.action = config.action.map(col => { + col.uuid = Utils.getuuid() + return col + }) + _card.search = config.search.map(col => { + col.uuid = Utils.getuuid() + return col + }) } + this.setState({ card: _card }) @@ -99,6 +115,7 @@ } else { card.action = card.action || [] // 鍏煎 card.search = card.search || [] // 鍏煎 + this.setState({ card: fromJS(card).toJS() }) @@ -108,6 +125,7 @@ componentDidMount () { MKEmitter.addListener('submitStyle', this.getStyle) MKEmitter.addListener('submitModal', this.handleSave) + MKEmitter.addListener('logButton', this.logButton) } shouldComponentUpdate (nextProps, nextState) { @@ -123,8 +141,23 @@ } MKEmitter.removeListener('submitStyle', this.getStyle) MKEmitter.removeListener('submitModal', this.handleSave) + MKEmitter.removeListener('logButton', this.logButton) } + logButton = (id, item) => { + const { card } = this.state + + if (id !== card.uuid) return + + let btnlog = card.btnlog || [] + btnlog.push(item) + + this.setState({ + card: {...card, btnlog} + }) + this.props.updateConfig({...card, btnlog}) + } + /** * @description 鍗$墖琛屽灞備俊鎭洿鏂帮紙鏁版嵁婧愶紝鏍峰紡绛夛級 */ @@ -166,7 +199,24 @@ 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) + + if (card.btnlog) { + card.btnlog = card.btnlog.filter(c => c.$parentId !== cell.uuid) + } + _this.setState({card}) _this.props.updateConfig(card) }, @@ -241,28 +291,22 @@ MKEmitter.emit('addButton', card.uuid, newcard) } - setSubConfig = (btn) => { + setSubConfig = (item) => { const { card } = this.state + let btn = fromJS(item).toJS() - if (btn.OpenType === 'pop') { + if (btn.OpenType === 'pop' || btn.execMode === 'pop') { if (!btn.modal) { btn.modal = { - setting: { - title: btn.label, - width: 60, - cols: '2', - container: 'tab', - focus: '', - finish: 'close', - clickouter: 'unclose', - display: 'modal' - }, + setting: { title: btn.label, width: 60, cols: '2', container: 'view', focus: '', finish: 'close', clickouter: 'unclose', display: 'modal' }, tables: [], groups: [], fields: [] } } MKEmitter.emit('changeModal', card, btn) + } else if (btn.OpenType === 'popview') { + MKEmitter.emit('changePopview', card, btn) } } @@ -287,6 +331,56 @@ this.props.updateConfig(card) } + handleLog = (type, logs, item) => { + let card = fromJS(this.state.card).toJS() + + if (type === 'revert') { + let done = false + if (item.$parentId) { + card.subcards.forEach(col => { + if (item.$parentId === col.uuid) { + if (item.$side !== 'back') { + col.elements = col.elements ? [...col.elements, item] : [item] + } else { + col.backElements = col.backElements ? [...col.backElements, item] : [item] + } + done = true + } + }) + } + + if (!done) { + card.action = card.action ? [...card.action, item] : [item] + } + + card.btnlog = logs + + this.setState({ card }) + this.props.updateConfig(card) + notification.success({ + top: 92, + message: '鎭㈠鎴愬姛锛�', + duration: 2 + }) + } else { + card.btnlog = logs + this.setState({ card }) + this.props.updateConfig(card) + notification.success({ + top: 92, + message: '娓呴櫎鎴愬姛锛�', + duration: 2 + }) + } + } + + clickComponent = (e) => { + if (sessionStorage.getItem('style-control') === 'true' || sessionStorage.getItem('style-control') === 'component') { + e.stopPropagation() + MKEmitter.emit('clickComponent', this.state.card) + } + } + render() { const { card } = this.state @@ -303,14 +397,18 @@ } return ( - <div className="menu-data-card-edit-box" style={{...card.style, minHeight: card.wrap.minHeight}}> + <div className="menu-data-card-edit-box" style={{...card.style}} onClick={this.clickComponent} id={card.uuid}> <NormalHeader defaultshow="hidden" config={card} updateComponent={this.updateComponent}/> <Popover overlayClassName="mk-popover-control-wrap" mouseLeaveDelay={0.2} mouseEnterDelay={0.2} content={ <div className="mk-popover-control"> <Icon className="plus" title="娣诲姞鎼滅储" onClick={this.addSearch} type="plus-circle" /> <Icon className="plus" title="娣诲姞鎸夐挳" onClick={this.addButton} type="plus-square" /> <WrapComponent config={card} updateConfig={this.updateComponent} /> + <CopyComponent type="datacard" card={card}/> + <PasteComponent config={card} options={['action', 'search', 'form']} updateConfig={this.updateComponent} /> <Icon className="style" title="璋冩暣鏍峰紡" onClick={this.changeStyle} type="font-colors" /> + <LogComponent btnlog={card.btnlog || []} handlelog={this.handleLog} /> + <UserComponent config={card}/> <Icon className="close" title="鍒犻櫎缁勪欢" type="delete" onClick={() => this.props.deletecomponent(card.uuid)} /> <SettingComponent config={card} updateConfig={this.updateComponent} /> </div> -- Gitblit v1.8.0