Преглед изворни кода

fix: 添加家具编辑时的拖拽范围限制;

liujia пре 1 дан
родитељ
комит
e76518d1d3
1 измењених фајлова са 13 додато и 2 уклоњено
  1. 13 2
      src/components/EditableFurniture/index.vue

+ 13 - 2
src/components/EditableFurniture/index.vue

@@ -286,10 +286,21 @@ const startDrag = (e: MouseEvent) => {
   const startY = e.clientY
   const initLeft = pixelPosition.left
   const initTop = pixelPosition.top
+  const canvasSize = props.canvasSize
 
   const onMove = (ev: MouseEvent) => {
-    pixelPosition.left = initLeft + (ev.clientX - startX)
-    pixelPosition.top = initTop + (ev.clientY - startY)
+    // 计算新的位置
+    let newLeft = initLeft + (ev.clientX - startX)
+    let newTop = initTop + (ev.clientY - startY)
+
+    // 边界检查 - 确保家具不会超出画布
+    newLeft = Math.max(0, Math.min(newLeft, canvasSize - boundingBox.value.width))
+    newTop = Math.max(0, Math.min(newTop, canvasSize - boundingBox.value.height))
+
+    // 更新位置
+    pixelPosition.left = newLeft
+    pixelPosition.top = newTop
+
     updateGeoPosition()
     emit('update', { ...localItem })
   }