拖拽点完成

src/core/base/BaseInteraction.ts

@@ -55,6 +55,63 @@ export default abstract class BaseInteraction {
     this.itemTypeName = itemTypeName
   }
 
+
+  dragOption: DragOption | undefined
+  dragOriginPosition: THREE.Vector3 | undefined
+  dragItem: ItemJson | undefined
+
+  /**
+   * 拖拽点开始
+   */
+  dragPointStart(viewport: Viewport, dragOption: DragOption) {
+    this.viewport = viewport
+    this.dragOption = dragOption
+    this.dragOriginPosition = dragOption.object.position.clone()
+
+    // 找到 itemJson
+    const itemJson = _.find(this.viewport.stateManager.vdata.items, (item) => item.id === dragOption.entityId)
+    if (!itemJson) {
+      system.showErrorDialog('Not found for entityId:' + dragOption.entityId)
+      return false
+    }
+
+    this.dragItem = itemJson
+    return true
+  }
+
+  /**
+   * 拖拽点移动
+   */
+  dragPointMove(viewport: Viewport, e: MouseEvent) {
+    if (this.viewport !== viewport) return
+  }
+
+  /**
+   * 拖拽点完成
+   */
+  dragPointComplete(viewport: Viewport, e: MouseEvent) {
+    if (this.viewport !== viewport) return
+
+    // 获取当前鼠标所在位置
+    if (!CurrentMouseInfo || !CurrentMouseInfo.x || !this.dragItem?.tf?.[0]) {
+      return
+    }
+
+    // 提交状态管理器
+    console.log('drag from ', [this.dragItem.tf[0][0], this.dragItem.tf[0][2]], 'to', [CurrentMouseInfo.x, CurrentMouseInfo.z])
+
+    const stateManager = this.viewport.stateManager
+    stateManager.beginStateUpdate({ createFromInteraction: true })
+    this.dragItem.tf[0][0] = CurrentMouseInfo.x
+    this.dragItem.tf[0][2] = CurrentMouseInfo.z
+    stateManager.endStateUpdate()
+
+    this.viewport = undefined
+    this.dragOption = undefined
+    this.dragItem = undefined
+    return true
+  }
+
   /**
    * 开始交互
    */
@@ -108,21 +165,6 @@ export default abstract class BaseInteraction {
     this.canvas = undefined
   }
 
-  /**
-   * 拖拽点开始
-   * @param viewport 当前视口
-   * @param point 拖拽的点
-   */
-  dragPointStart(viewport: Viewport, point: THREE.Object3D) {
-  }
-
-  /**
-   * 拖拽点完成
-   * @param viewport 当前视口
-   */
-  dragPointComplete(viewport: Viewport) {
-  }
-
   mousedown() {
     this.mouseOnlyClick = true
   }
@@ -318,4 +360,9 @@ export default abstract class BaseInteraction {
     const obj = new CSS2DObject(div)
     return obj
   }
+}
+
+export interface DragOption {
+  object: THREE.Object3D
+  entityId: string
 }

src/core/base/BaseRenderer.ts

@@ -75,6 +75,7 @@ export default abstract class BaseRenderer {
         ...object.userData,
         createType: 'point',
         entityId: item.id,
+        draggable: item.dt.protected !== true,
         t: item.t
       }
     })
@@ -103,9 +104,21 @@ export default abstract class BaseRenderer {
       console.warn('No active viewport to append objects to.')
       return
     }
+
+    const dragObjects = objects.filter(obj => !!obj.userData.draggable)
+    this.tempViewport.dragControl.setDragObjects(dragObjects, 'push')
     this.tempViewport.scene.add(...objects)
   }
 
+  removeFromScene(...objects: THREE.Object3D[]) {
+    if (!this.tempViewport || !this.tempViewport.scene) {
+      console.warn('No active viewport to remove objects from.')
+      return
+    }
+    this.tempViewport.scene.remove(...objects)
+    this.tempViewport.dragControl.setDragObjects(objects, 'remove')
+  }
+
   /**
    * 创建一个点
    * @param item 点的定义
@@ -145,7 +158,7 @@ export default abstract class BaseRenderer {
   deletePoint(id: string, option?: RendererCudOption) {
     const objects = this.tempViewport.entityManager.findObjectsById(id)
     if (objects) {
-      this.tempViewport.scene.remove(...objects)
+      this.removeFromScene(...objects)
     }
 
     this.tempViewport.entityManager.deleteEntityOnly(id)
@@ -241,7 +254,7 @@ export default abstract class BaseRenderer {
     const id = getLineId(start.id, end.id, type)
     const lines = this.tempViewport.entityManager.findLineObjectsById(id)
     if (lines) {
-      this.tempViewport.scene.remove(...lines)
+      this.removeFromScene(...lines)
     }
 
     this.tempViewport.entityManager.deleteLineObjectOnly(id)

src/core/controls/EsDragControls.ts

@@ -5,6 +5,8 @@ import { getItemTypeByName } from '@/model/itemType/ItemTypeDefine'
 import type { ItemTypeDefineOption } from '@/model/itemType/ItemTypeDefine'
 import { markRaw } from 'vue'
 import EventBus from '@/runtime/EventBus'
+import { getInteraction } from '@/core/manager/ModuleManager.ts'
+import type BaseInteraction from '@/core/base/BaseInteraction.ts'
 
 // dragControls 绑定函数
 let dragStartFn, dragFn, dragEndFn, clickblankFn
@@ -15,6 +17,7 @@ export default class EsDragControls {
   private onDownPosition: { x: number; y: number } = { x: -1, y: -1 }
 
   viewport: Viewport
+  currentInteraction: BaseInteraction
   isDragging = false
 
   constructor(viewport) {
@@ -68,7 +71,24 @@ export default class EsDragControls {
   // 拖拽开始
   dragControlsStart(e) {
     // 右键拖拽不响应
-    if (e.e.button === 2 || !e.object.userData.type || !e.object.visible) return
+    if (e.e.button === 2 || !e.object.visible) return
+
+    const type = e.object.userData?.t
+    const entityId = e.object.userData?.entityId
+
+    if (!type || !entityId) return
+
+    this.currentInteraction = getInteraction(e.object.userData?.t)
+    if (!this.currentInteraction) {
+      return
+    }
+
+    // 有效拖拽对象
+    const enable = this.currentInteraction.dragPointStart(this.viewport, {
+      object: e.object,
+      entityId: entityId
+    })
+    if (!enable) return
 
     e.e.preventDefault()
 
@@ -80,12 +100,10 @@ export default class EsDragControls {
     // 记录拖拽按下的位置和对象
     this.onDownPosition = { x: e.e.clientX, y: e.e.clientY }
 
-    if (e.object.userData?.type) {
-      const itemType: ItemTypeDefineOption = getItemTypeByName(e.object.userData.type)
-      if (itemType?.clazz) {
-        itemType.clazz.dragPointStart(this.viewport, e.object)
-      }
-    }
+    // const itemType: ItemTypeDefineOption = getItemTypeByName(e.object.userData.type)
+    // if (itemType?.clazz) {
+    //   itemType.clazz.dragPointStart(this.viewport, e.object)
+    // }
     // switch (e.object.userData.type) {
     //   case Constract.MeasureMarker:
     //     this.viewport.measure.dragPointStart(e.object)
@@ -95,6 +113,7 @@ export default class EsDragControls {
 
   // 拖拽中
   drag(e) {
+    this.currentInteraction?.dragPointMove(this.viewport, e)
     EventBus.dispatch('objectChanged', {
       viewport: this,
       object: e.object
@@ -105,15 +124,9 @@ export default class EsDragControls {
   dragControlsEnd(e) {
     // 右键拖拽不响应
     if (e.e.button === 2 || !e.object.visible) return
+    if (!e.object.userData?.t) return
 
-    // 拖拽结束启用其他控制器
-    this.viewport.controls.enabled = true
-
-    this.isDragging = false
-
-    if (!e.object.userData.type) return
-
-    // 判断位置是否有变化,没有变化则为点击
+    // 单选点击
     if (this.onDownPosition.x === e.e.clientX && this.onDownPosition.y === e.e.clientY) {
       if (e.object.userData.onClick) {
         e.object.userData.onClick(e)
@@ -127,12 +140,19 @@ export default class EsDragControls {
       }
     }
 
-    if (e.object.userData?.type) {
-      const itemType: ItemTypeDefineOption = getItemTypeByName(e.object.userData.type)
-      if (itemType?.clazz) {
-        itemType.clazz.dragPointComplete(this.viewport)
-      }
-    }
+    const ret = this.currentInteraction?.dragPointComplete(this.viewport, e)
+    if (!ret) return
+
+    // 拖拽结束启用其他控制器
+    this.viewport.controls.enabled = true
+    this.isDragging = false
+
+    // if (e.object.userData?.type) {
+    //   const itemType: ItemTypeDefineOption = getItemTypeByName(e.object.userData.type)
+    //   if (itemType?.clazz) {
+    //     itemType.clazz.dragPointComplete(this.viewport)
+    //   }
+    // }
     // switch (e.object.userData.type) {
     //   case Constract.MeasureMarker:
     //     this.viewport.measure.dragPointComplete()

src/core/manager/InteractionManager.ts

@@ -54,6 +54,7 @@ export default class InteractionManager implements IControls {
 
     this.viewport.state.cursorMode = 'normal'
     this.viewport.dragControl.dragControls.enabled = true
+    debugger
     this.viewport.viewerDom.style.cursor = ''
     system.msg('退出新建模式')
   }
@@ -91,6 +92,7 @@ export default class InteractionManager implements IControls {
     // 初始化交互
     this.currentTool = interaction
     this.viewport.dragControl.dragControls.enabled = false
+    debugger
     this.currentTool.start(this.viewport, { startPoint: this.toolStartObject })
 
     // 更新 UI 状态

src/modules/measure/MeasureRenderer.ts

@@ -37,7 +37,7 @@ export default class MeasureRenderer extends BaseRenderer {
   readonly defaultScale: THREE.Vector3 = new THREE.Vector3(0.25, 0.1, 0.25)
   readonly defaultRotation: THREE.Vector3 = new THREE.Vector3(0, 0, 0)
 
-  constructor(itemTypeName:string) {
+  constructor(itemTypeName: string) {
     super(itemTypeName)
   }
 
@@ -72,6 +72,10 @@ export default class MeasureRenderer extends BaseRenderer {
       this.tempViewport?.scene.add(this.group)
     }
 
+    const dragObjects = objects.filter(obj => !!obj.userData.draggable)
+    this.tempViewport.dragControl.setDragObjects(dragObjects, 'push')
+    // this.tempViewport.dragControl.setDragObjects(objects, 'remove')
+
     this.group.add(...objects)
   }
 

src/types/global.d.ts

@@ -2,6 +2,7 @@ import _ from 'lodash'
 import $ from 'jquery'
 import type System from '@/runtime/System'
 import type WorldModel from '@/core/manager/WorldModel'
+import type { CurrentMouseInfo } from '@/types/model'
 
 declare global {
   const $: $
@@ -9,4 +10,5 @@ declare global {
   const system: System
 
   const worldModel: WorldModel
+  const CurrentMouseInfo: CurrentMouseInfo
 }

src/types/model.d.ts

@@ -1,5 +1,27 @@
 type LinkType = 'in' | 'out' | 'center'
 
+interface CurrentMouseInfo {
+  /**
+   * 当前鼠标所在的设计图
+   */
+  viewport: any
+
+  /**
+   * 鼠标在设计图上的 X 坐标
+   */
+  x: number
+
+  /**
+   * 鼠标在设计图上的 Y 坐标
+   */
+  z: number
+
+  /**
+   * 鼠标在设计图上的坐标, 归一化到 [0, 1] 范围
+   */
+  mouse: any
+}
+
 interface InitThreeOption {
   stateManagerId: string
 }