diff --git a/core/core-frontend/src/components/data-visualization/canvas/Shape.vue b/core/core-frontend/src/components/data-visualization/canvas/Shape.vue
index d35f8a7278..bde1ea4b4c 100644
--- a/core/core-frontend/src/components/data-visualization/canvas/Shape.vue
+++ b/core/core-frontend/src/components/data-visualization/canvas/Shape.vue
@@ -55,7 +55,6 @@
{
isFirst = false
}
// 修改当前组件样式
- dvMainStore.setShapeStyle(pos, areaData.value.components)
+ dvMainStore.setShapeStyle(pos, areaData.value.components, 'move')
// 等更新完当前组件的样式并绘制到屏幕后再判断是否需要吸附
- // GroupArea是分组视括租金 不需要进行吸附
+ // GroupArea是分组视括组件 不需要进行吸附
// 如果不使用 nextTick,吸附后将无法移动
if (!isGroupArea.value) {
nextTick(() => {
@@ -685,7 +684,7 @@ const handleMouseDownOnPoint = (point, e) => {
}
calculateRadioComponentPositionAndSize(point, style, symmetricPoint)
- dvMainStore.setShapeStyle(style)
+ dvMainStore.setShapeStyle(style, areaData.value.components, 'resize')
// 矩阵逻辑 如果当前是仪表板(矩阵模式)则要进行矩阵重排
dashboardActive.value && emit('onResizing', moveEvent)
//如果当前组件是Group分组 则要进行内部组件深度计算
diff --git a/core/core-frontend/src/store/modules/data-visualization/dvMain.ts b/core/core-frontend/src/store/modules/data-visualization/dvMain.ts
index 490bcd851e..d3e44a30d1 100644
--- a/core/core-frontend/src/store/modules/data-visualization/dvMain.ts
+++ b/core/core-frontend/src/store/modules/data-visualization/dvMain.ts
@@ -255,18 +255,31 @@ export const dvMainStore = defineStore('dataVisualization', {
this.bashMatrixInfo = bashMatrixInfo
},
- setShapeStyle({ top, left, width, height, rotate }, areaDataComponents = []) {
+ setShapeStyle(
+ { top, left, width, height, rotate },
+ areaDataComponents = [],
+ moveType = 'move'
+ ) {
if (this.curComponent.component === 'GroupArea' && areaDataComponents.length > 0) {
const topOffset = top - this.curComponent.style.top
const leftOffset = left - this.curComponent.style.left
const widthOffset = width - this.curComponent.style.width
const heightOffset = height - this.curComponent.style.height
- areaDataComponents.forEach(component => {
- component.style.top = component.style.top + topOffset
- component.style.left = component.style.left + leftOffset
- component.style.width = component.style.width + widthOffset
- component.style.height = component.style.height + heightOffset
- })
+ if (moveType === 'move') {
+ areaDataComponents.forEach(component => {
+ component.style.top = component.style.top + topOffset
+ component.style.left = component.style.left + leftOffset
+ component.style.width = component.style.width + widthOffset
+ component.style.height = component.style.height + heightOffset
+ })
+ } else {
+ areaDataComponents.forEach(component => {
+ component.style.top = component.style.top + topOffset
+ component.style.left = component.style.left + leftOffset
+ component.style.width = component.style.width + widthOffset
+ component.style.height = component.style.height + heightOffset
+ })
+ }
}
if (this.dvInfo.type === 'dashboard') {
if (top) this.curComponent.style.top = top < 0 ? 0 : Math.round(top)