feat: 新增解除组件还原位置

src/store/modules/chartEditStore/chartEditStore.ts

@@ -650,7 +650,11 @@ export const useChartEditStore = defineStore({
         // 解组
         const unGroup = (targetIndex: number) => {
           const targetGroup = this.getComponentList[targetIndex] as CreateComponentGroupType
+
+          // 分离组件并还原位置属性
           targetGroup.groupList.forEach(item => {
+            item.attr.x = item.attr.x + targetGroup.attr.x
+            item.attr.y = item.attr.y + targetGroup.attr.y
             this.addComponentList(item)
           })
           this.setTargetSelectChart(targetGroup.id)

src/views/chart/ContentEdit/components/EditGroup/index.vue

@@ -5,6 +5,7 @@
       :data-id="groupData.id"
       :index="groupIndex"
       :item="groupData"
+      :hiddenPoint="true"
       :style="{
         ...useComponentStyle(groupData.attr, groupIndex),
         ...useSizeStyle(groupData.attr),
@@ -24,6 +25,7 @@
         :data-id="item.id"
         :index="groupIndex"
         :item="item"
+        :hiddenPoint="true"
         :style="{
           ...useComponentStyle(item.attr, groupIndex)
         }"

src/views/chart/ContentEdit/components/EditShapeBox/index.vue

@@ -2,6 +2,7 @@
   <div class="go-shape-box">
     <slot></slot>
     <!-- 锚点 -->
+    <template v-if="!hiddenPoint">
       <div
         :class="`shape-point ${point}`"
         v-for="(point, index) in select ? pointList : []"
@@ -9,6 +10,7 @@
         :style="usePointStyle(point, index, item.attr, cursorResize)"
         @mousedown="useMousePointHandle($event, point, item.attr)"
       ></div>
+    </template>
 
     <!-- 选中 -->
     <div class="shape-modal" :style="useSizeStyle(item.attr)">
@@ -30,6 +32,10 @@ const props = defineProps({
   item: {
     type: Object as PropType<CreateComponentType | CreateComponentGroupType>,
     required: true
+  },
+  hiddenPoint: {
+    type: Boolean,
+    required: false
   }
 })