fix: 解决重叠拖拽放置位置错误的bug

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

@@ -115,7 +115,7 @@ const selectHandle = (v: number) => {
 
 // 点击锁处理
 const lockHandle = () => {
-  chartEditStore.setEditCanvasItem(
+  chartEditStore.setEditCanvas(
     ChartEditStoreEnum.LOCK_SCALE,
     !lockScale.value
   )

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

@@ -1,22 +1,23 @@
 <template>
   <div
     class="go-edit-range"
-    :style="style"
+    :style="rangeStyle"
     @mousedown="mousedownHandleUnStop($event, undefined)"
   >
     <slot></slot>
   </div>
+  <div class="go-edit-range-model" :style="rangeModelStyle"></div>
 </template>
 
 <script setup lang="ts">
 import { toRefs, computed } from 'vue'
 import { useChartEditStoreStore } from '@/store/modules/chartEditStore/chartEditStore'
 import { useSizeStyle } from '../../hooks/useStyle.hook'
-import { mousedownHandleUnStop } from '../../hooks/useDrop.hook'
+import { mousedownHandleUnStop } from '../../hooks/useDrag.hook'
 
 const chartEditStoreStore = useChartEditStoreStore()
 
-const { getEditCanvasConfig } = toRefs(chartEditStoreStore)
+const { getEditCanvasConfig, getEditCanvas } = toRefs(chartEditStoreStore)
 
 const size = computed(() => {
   return {
@@ -25,16 +26,23 @@ const size = computed(() => {
   }
 })
 
-const style = computed(() => {
+const rangeStyle = computed(() => {
   const background = getEditCanvasConfig.value.background
   const backgroundImage = getEditCanvasConfig.value.backgroundImage
   const selectColor = getEditCanvasConfig.value.selectColor
   const backgroundColor = background ? background : null
-  const computed = selectColor
+  const computedBackground = selectColor
     ? { background: backgroundColor }
     : { background: `url(${backgroundImage}) no-repeat center/100% !important` }
   // @ts-ignore
-  return { ...useSizeStyle(size.value), ...computed }
+  return { ...useSizeStyle(size.value), ...computedBackground }
+})
+
+// 模态层
+const rangeModelStyle = computed(() => {
+  const dragStyle = getEditCanvas.value.isDrag && {'z-index': 99999 }
+  // @ts-ignore
+  return { ...useSizeStyle(size.value), ...dragStyle}
 })
 </script>
 
@@ -48,4 +56,12 @@ const style = computed(() => {
   @include filter-border-color('hover-border-color');
   @include fetch-theme-custom('border-color', 'background-color4');
 }
+@include go(edit-range-model) {
+  z-index: -1;
+  position: absolute;
+  left: 0;
+  top: 0;
+  border-radius: 15px;
+  border: 1px solid rgba(0, 0, 0, 0);
+}
 </style>