From cbb5bb7c9eecc76bbebea81875ab6813372a78a6 Mon Sep 17 00:00:00 2001
From: king <18310653075@163.com>
Date: 星期一, 19 五月 2025 17:53:53 +0800
Subject: [PATCH] 2025-05-19
---
src/menu/components/card/prop-card/index.jsx | 283 +++++++++++++-------------------------------------------
1 files changed, 66 insertions(+), 217 deletions(-)
diff --git a/src/menu/components/card/prop-card/index.jsx b/src/menu/components/card/prop-card/index.jsx
index e79cbe6..3fd1c5c 100644
--- a/src/menu/components/card/prop-card/index.jsx
+++ b/src/menu/components/card/prop-card/index.jsx
@@ -1,12 +1,12 @@
import React, {Component} from 'react'
import PropTypes from 'prop-types'
import { is, fromJS } from 'immutable'
-import { Popover, Modal } from 'antd'
-import { PlusOutlined, SettingOutlined, EditOutlined, ToolOutlined, DeleteOutlined, FontColorsOutlined, ClockCircleOutlined } from '@ant-design/icons'
+import { Popover, Modal, message } from 'antd'
+import { PlusOutlined, SettingOutlined, EditOutlined, ToolOutlined, DeleteOutlined, FontColorsOutlined, ClockCircleOutlined, HeatMapOutlined } from '@ant-design/icons'
import asyncComponent from '@/utils/asyncComponent'
import asyncIconComponent from '@/utils/asyncIconComponent'
-import { resetStyle, getTables } from '@/utils/utils-custom.js'
+import { resetStyle, getTables, checkComponent, getInterfaces } from '@/utils/utils-custom.js'
import MKEmitter from '@/utils/events.js'
import Utils from '@/utils/utils.js'
import getWrapForm from '../data-card/options'
@@ -17,7 +17,6 @@
const CardComponent = asyncComponent(() => import('../cardcomponent'))
const CopyComponent = asyncIconComponent(() => import('@/menu/components/share/copycomponent'))
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'))
@@ -44,17 +43,14 @@
let _card = {
uuid: card.uuid,
type: card.type,
- tabId: card.tabId || '',
- parentId: card.parentId || '',
format: 'object', // 缁勪欢灞炴�� - 鏁版嵁鏍煎紡
pageable: false, // 缁勪欢灞炴�� - 鏄惁鍙垎椤�
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: '', datatype: 'static' },
+ wrap: { name: card.name, width: card.width || 24, title: '', datatype: 'static', cardType: 'radio' },
style: { marginLeft: '0px', marginRight: '0px', marginTop: '8px', marginBottom: '8px' },
headerStyle: { fontSize: '16px', borderBottomWidth: '1px', borderBottomColor: '#e8e8e8' },
columns: [],
@@ -73,31 +69,6 @@
}],
}
- 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.setting = config.setting
- _card.columns = config.columns
- _card.scripts = config.scripts
-
- _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
- })
- }
this.updateComponent(_card)
} else {
this.setState({
@@ -108,7 +79,6 @@
componentDidMount () {
MKEmitter.addListener('mkUpdateInter', this.mkUpdateInter)
- MKEmitter.addListener('submitComponentStyle', this.updateComponentStyle)
}
shouldComponentUpdate (nextProps, nextState) {
@@ -123,29 +93,11 @@
return
}
MKEmitter.removeListener('mkUpdateInter', this.mkUpdateInter)
- 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})
- })
}
mkUpdateInter = (inter, split) => {
const { card } = this.state
-
+
if (card.wrap.datatype === 'public' && card.wrap.publicId === inter.uuid) {
let _card = {...card, columns: fromJS(inter.columns).toJS()}
@@ -161,8 +113,6 @@
* @description 鍗＄墖琛屽灞備俊鎭洿鏂帮紙鏁版嵁婧愶紝鏍峰紡绛夛級
*/
updateComponent = (card) => {
- const { appType } = this.state
-
card.width = card.wrap.width
card.name = card.wrap.name
@@ -175,114 +125,19 @@
return
}
- card.errors = []
+ card.$c_ds = card.wrap.datatype === 'dynamic'
+ card.$c_ac = false
+ card.$c_sc = true
+
+ card.errors = checkComponent(card)
- if (card.subcards.length === 0) {
- card.errors.push({ level: 0, detail: '鍗＄墖涓嶅彲涓虹┖锛�'})
- }
-
- if (card.wrap.datatype === 'static') {
+ if (card.errors.length === 0) {
card.$tables = getTables(card)
-
- card.subcards.forEach((item, i) => {
- let linkbtn = item.setting.linkbtn || ''
-
- item.elements.forEach(cell => {
- if (cell.eleType === 'button') {
- if (cell.OpenType === 'pop' || (cell.OpenType === 'funcbutton' && cell.execMode === 'pop')) {
- if (!cell.modal || cell.modal.fields.length === 0) {
- card.errors.push({ level: 1, detail: `鎸夐挳鈥�${cell.label}鈥濅腑琛ㄥ崟灏氭湭娣诲姞`})
- }
- }
- if (linkbtn && linkbtn === cell.uuid) {
- linkbtn = ''
- }
- } else if (cell.datatype === 'dynamic' && cell.field) {
- card.errors.push({ level: 1, detail: `鍗＄墖涓姩鎬佸瓧娈碘��${cell.field}鈥濇棤鏁坄})
- }
- })
-
- if (item.setting.type === 'multi' && appType !== 'mob') {
- item.backElements.forEach(cell => {
- if (cell.eleType === 'button') {
- if (cell.OpenType === 'pop' || (cell.OpenType === 'funcbutton' && cell.execMode === 'pop')) {
- if (!cell.modal || cell.modal.fields.length === 0) {
- card.errors.push({ level: 1, detail: `鎸夐挳鈥�${cell.label}鈥濅腑琛ㄥ崟灏氭湭娣诲姞`})
- }
- }
- if (linkbtn && linkbtn === cell.uuid) {
- linkbtn = ''
- }
- } else if (cell.datatype === 'dynamic' && cell.field) {
- card.errors.push({ level: 1, detail: `鍗＄墖涓姩鎬佸瓧娈碘��${cell.field}鈥濇棤鏁坄})
- }
- })
- }
-
- if (linkbtn) {
- card.errors.push({ level: 1, detail: `绗�${i + 1}寮犲崱鐗囦腑缁戝畾鎸夐挳宸插垹闄})
- }
- })
- } else {
- let columns = card.columns.map(c => c.field)
-
- if (card.wrap.datatype === 'dynamic') {
- if (card.setting.interType === 'system' && card.setting.execute !== 'false' && !card.setting.dataresource) {
- card.errors.push({ level: 0, detail: '鏈缃暟鎹簮锛�'})
- } else if (card.setting.interType === 'system' && card.setting.execute === 'false' && card.scripts.filter(script => script.status !== 'false').length === 0) {
- card.errors.push({ level: 0, detail: '鏁版嵁婧愪腑鏃犲彲鐢ㄨ剼鏈紒'})
- } else if (!card.setting.primaryKey) {
- card.errors.push({ level: 0, detail: '鏈缃富閿紒'})
- } else if (!columns.includes(card.setting.primaryKey)) {
- card.errors.push({ level: 0, detail: '涓婚敭宸插け鏁堬紒'})
- } else if (!card.setting.supModule) {
- card.errors.push({ level: 0, detail: '鏈缃笂绾х粍浠讹紒'})
- }
- }
-
- if (card.errors.length === 0) {
- card.$tables = getTables(card)
- }
-
- card.subcards.forEach((item, i) => {
- let linkbtn = item.setting.linkbtn || ''
- item.elements.forEach(cell => {
- if (cell.eleType === 'button') {
- if (cell.OpenType === 'pop' || (cell.OpenType === 'funcbutton' && cell.execMode === 'pop')) {
- if (!cell.modal || cell.modal.fields.length === 0) {
- card.errors.push({ level: 1, detail: `鎸夐挳鈥�${cell.label}鈥濅腑琛ㄥ崟灏氭湭娣诲姞`})
- }
- }
- if (linkbtn && linkbtn === cell.uuid) {
- linkbtn = ''
- }
- } else if (cell.datatype === 'dynamic' && cell.field && !columns.includes(cell.field)) {
- card.errors.push({ level: 1, detail: `鍗＄墖涓姩鎬佸瓧娈碘��${cell.field}鈥濇棤鏁坄})
- }
- })
-
- if (item.setting.type === 'multi' && appType !== 'mob') {
- item.backElements.forEach(cell => {
- if (cell.eleType === 'button') {
- if (cell.OpenType === 'pop' || (cell.OpenType === 'funcbutton' && cell.execMode === 'pop')) {
- if (!cell.modal || cell.modal.fields.length === 0) {
- card.errors.push({ level: 1, detail: `鎸夐挳鈥�${cell.label}鈥濅腑琛ㄥ崟灏氭湭娣诲姞`})
- }
- }
- if (linkbtn && linkbtn === cell.uuid) {
- linkbtn = ''
- }
- } else if (cell.datatype === 'dynamic' && cell.field && !columns.includes(cell.field)) {
- card.errors.push({ level: 1, detail: `鍗＄墖涓姩鎬佸瓧娈碘��${cell.field}鈥濇棤鏁坄})
- }
- })
- }
-
- if (linkbtn) {
- card.errors.push({ level: 1, detail: `绗�${i + 1}寮犲崱鐗囦腑缁戝畾鎸夐挳宸插垹闄})
- }
- })
}
+
+ delete card.$c_ds
+ delete card.$c_ac
+ delete card.$c_sc
this.setState({
card: card
@@ -309,35 +164,15 @@
* @description 鍗曚釜鍗＄墖淇℃伅鏇存柊
*/
deleteCard = (cell) => {
- const { appType } = this.state
let card = fromJS(this.state.card).toJS()
- let _this = this
+ let that = this
confirm({
content: '纭畾鍒犻櫎鍗＄墖鍚楋紵',
onOk() {
card.subcards = card.subcards.filter(item => item.uuid !== cell.uuid)
- _this.updateComponent(card)
-
- if (appType === 'mob') return
-
- let uuids = []
-
- cell.elements && cell.elements.forEach(c => {
- if (c.eleType !== 'button' || (appType === 'pc' && c.OpenType !== 'popview')) return
-
- uuids.push(c.uuid)
- })
- cell.backElements && cell.backElements.forEach(c => {
- if (c.eleType !== 'button' || (appType === 'pc' && c.OpenType !== 'popview')) return
-
- uuids.push(c.uuid)
- })
-
- if (uuids.length === 0) return
-
- MKEmitter.emit('delButtons', uuids)
+ that.updateComponent(card)
},
onCancel() {}
})
@@ -346,7 +181,7 @@
changeStyle = () => {
const { card } = this.state
- MKEmitter.emit('changeStyle', ['background', 'border', 'padding', 'margin', 'shadow'], card.style, this.getStyle)
+ MKEmitter.emit('changeStyle', ['background', 'border', 'padding', 'margin', 'shadow', 'clear', 'minHeight'], card.style, this.getStyle)
}
getStyle = (style) => {
@@ -423,8 +258,7 @@
res.setting = res.setting || {}
res.setting.width = res.setting.width || 6
- let copyBtns = []
- let mobtypes = ['pop', 'prompt', 'exec', 'innerpage', 'funcbutton']
+ let mobtypes = ['pop', 'prompt', 'exec', 'innerpage', 'funcbutton', 'form']
let elements = []
res.elements && res.elements.forEach(cell => {
@@ -434,16 +268,7 @@
} else if (appType === 'mob' && !mobtypes.includes(cell.OpenType)) {
return
} else {
- let _uuid = Utils.getuuid()
-
- if (cell.OpenType === 'popview') {
- let _cell = fromJS(cell).toJS()
- _cell.$originUuid = _cell.uuid
- _cell.uuid = _uuid
- copyBtns.push(_cell)
- }
-
- cell.uuid = _uuid
+ cell.uuid = Utils.getuuid()
elements.push(cell)
}
})
@@ -460,26 +285,13 @@
} else if (appType === 'mob' && !mobtypes.includes(cell.OpenType)) {
return
} else {
- let _uuid = Utils.getuuid()
-
- if (cell.OpenType === 'popview') {
- let _cell = fromJS(cell).toJS()
- _cell.$originUuid = _cell.uuid
- _cell.uuid = _uuid
- copyBtns.push(_cell)
- }
-
- cell.uuid = _uuid
+ cell.uuid = Utils.getuuid()
backElements.push(cell)
}
})
}
res.backElements = backElements
-
- if (copyBtns.length > 0) {
- MKEmitter.emit('copyButtons', copyBtns)
- }
resolve({status: true})
@@ -488,11 +300,31 @@
getWrapForms = () => {
const { card } = this.state
- return getWrapForm(card.wrap, card.subtype, card.columns, card.uuid)
+ let buttons = []
+
+ card.subcards.forEach(m => {
+ m.elements.forEach(n => {
+ if (n.eleType === 'button') {
+ buttons.push({
+ value: n.uuid,
+ label: n.label
+ })
+ }
+ })
+ })
+
+ return getWrapForm(card.wrap, card.subtype, card.columns, card.uuid, null, null, buttons)
}
updateWrap = (res) => {
const { card } = this.state
+
+ if (res.interaction) {
+ if (res.interaction.includes('scale')) {
+ res.scale = 'true'
+ }
+ delete res.interaction
+ }
let _card = {...card, wrap: res}
@@ -503,12 +335,15 @@
_card.setting.supModule = ''
}
} else if (res.datatype === 'public') {
- let interfaces = window.GLOB.customMenu.interfaces || []
+ let interfaces = getInterfaces()
- let d = interfaces.filter(m => m.uuid === res.publicId && m.status === 'true')[0]
+ let d = interfaces.filter(m => m.value === res.publicId)[0]
if (d) {
_card.columns = fromJS(d.columns).toJS()
+
+ _card.setting = { interType: 'system' }
+ _card.scripts = []
}
}
@@ -541,7 +376,13 @@
clickComponent = (e) => {
if (sessionStorage.getItem('style-control') === 'true' || sessionStorage.getItem('style-control') === 'component') {
e.stopPropagation()
- MKEmitter.emit('clickComponent', this.state.card)
+ MKEmitter.emit('clickComponent', this.state.card.uuid, null, (style) => {
+ let _card = {...this.state.card}
+ _card.style = {..._card.style, ...style}
+
+ this.setState({ card: _card })
+ this.props.updateConfig(_card)
+ })
}
}
@@ -562,20 +403,28 @@
<CopyComponent type="propcard" card={card}/>
<PasteComponent options={['cardcell']} updateConfig={this.pasteComponent} />
<FontColorsOutlined className="style" title="璋冩暣鏍峰紡" onClick={this.changeStyle}/>
- {card.wrap.datatype === 'dynamic' ? <ClockComponent config={card} updateConfig={this.updateComponent}/> : <ClockCircleOutlined style={{color: '#eeeeee', cursor: 'not-allowed'}}/>}
- <UserComponent config={card}/>
+ {card.wrap.datatype !== 'public' ? <ClockComponent config={card} updateConfig={this.updateComponent}/> : <ClockCircleOutlined style={{color: '#eeeeee', cursor: 'not-allowed'}}/>}
<DeleteOutlined className="close" title="鍒犻櫎缁勪欢" onClick={() => this.props.deletecomponent(card.uuid)} />
{card.wrap.datatype === 'dynamic' ? <SettingComponent config={card} updateConfig={this.updateComponent} /> : <SettingOutlined style={{color: '#eeeeee', cursor: 'not-allowed'}}/>}
</div>
} trigger="hover">
<ToolOutlined />
</Popover>
- <div className={(card.wrap.layout || 'grid') + '-layout float-' + (card.wrap.cardFloat || 'left') + ' select-' + card.wrap.selStyle}>
+ <div className={`${card.wrap.layout || 'grid'}-layout float-${card.wrap.cardFloat || 'left'} select-${card.wrap.selStyle || ''}`}>
{card.subcards.map(subcard => (<CardComponent key={subcard.uuid} cards={card} card={subcard} move={this.move} updateElement={this.updateCard} deleteElement={this.deleteCard}/>))}
</div>
+ {card.wrap.display === 'hidden' ? <HeatMapOutlined title="缁勪欢闅愯棌" className="prop-hidden"/> : null}
<div className="component-name">
<div className="center">
- <div className="title">{card.name}</div>
+ <div className="title" onDoubleClick={() => {
+ let oInput = document.createElement('input')
+ oInput.value = 'anchor' + card.uuid
+ document.body.appendChild(oInput)
+ oInput.select()
+ document.execCommand('Copy')
+ document.body.removeChild(oInput)
+ message.success('澶嶅埗鎴愬姛銆�')
+ }}>{card.name}</div>
<div className="content">
{card.errors && card.errors.map((err, index) => {
if (err.level === 0) {
--
Gitblit v1.8.0