fix: 修复TAB组件中的组合取消并修改内容后,显示异常问题 #15532

This commit is contained in:
wangjiahao
2025-04-14 15:04:04 +08:00
committed by fit2cloud-chenyw
parent 56143ab902
commit 2a0b162d6d
2 changed files with 14 additions and 3 deletions

View File

@@ -230,6 +230,7 @@ export const composeStore = defineStore('compose', {
const editorRect = editor.getBoundingClientRect()
const isInTab = isTabCanvas(canvasId)
let decomposeComponentData = componentData.value
let parentGroupStyle = null
if (isInTab) {
const pathMap = {}
componentData.value.forEach(componentItem => {
@@ -242,10 +243,11 @@ export const composeStore = defineStore('compose', {
if (pComponentTarget && pComponentTarget.length > 0) {
decomposeComponentData = pComponentTarget[0].componentData
}
parentGroupStyle = curComponent.value.groupStyle
}
dvMainStore.deleteComponentById(curComponent.value.id, decomposeComponentData)
components.forEach(component => {
decomposeComponent(component, editorRect, parentStyle, canvasId)
decomposeComponent(component, editorRect, parentStyle, canvasId, parentGroupStyle)
dvMainStore.addComponent({
component: component,
index: undefined,

View File

@@ -3,11 +3,20 @@ export default function decomposeComponent(
component,
editorRect,
parentStyle,
canvasId = 'canvas-main'
canvasId = 'canvas-main',
parentGroupStyle?
) {
// 计算出元素新的 top left 坐标
component.style.left = component.style.left + parentStyle.left
component.style.top = component.style.top + parentStyle.top
component.groupStyle = {}
if (parentGroupStyle && component.groupStyle) {
const originLeftScale = component.groupStyle['left'] / component.groupStyle['width']
const originTopScale = component.groupStyle['top'] / component.groupStyle['height']
component.groupStyle['width'] = component.groupStyle['width'] * parentGroupStyle['width']
component.groupStyle['height'] = component.groupStyle['height'] * parentGroupStyle['height']
component.groupStyle['left'] =
parentStyle.left + component.groupStyle['width'] * originLeftScale
component.groupStyle['top'] = parentStyle.top + component.groupStyle['height'] * originTopScale
}
component.canvasId = canvasId
}