Browse Source

拖拽点完成

master
修宁 7 months ago
parent
commit
4d1c3ab376
  1. 77
      src/core/base/BaseInteraction.ts
  2. 17
      src/core/base/BaseRenderer.ts
  3. 62
      src/core/controls/EsDragControls.ts
  4. 2
      src/core/manager/InteractionManager.ts
  5. 4
      src/modules/measure/MeasureRenderer.ts
  6. 2
      src/types/global.d.ts
  7. 22
      src/types/model.d.ts

77
src/core/base/BaseInteraction.ts

@ -55,6 +55,63 @@ export default abstract class BaseInteraction {
this.itemTypeName = itemTypeName 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 this.canvas = undefined
} }
/**
*
* @param viewport
* @param point
*/
dragPointStart(viewport: Viewport, point: THREE.Object3D) {
}
/**
*
* @param viewport
*/
dragPointComplete(viewport: Viewport) {
}
mousedown() { mousedown() {
this.mouseOnlyClick = true this.mouseOnlyClick = true
} }
@ -319,3 +361,8 @@ export default abstract class BaseInteraction {
return obj return obj
} }
} }
export interface DragOption {
object: THREE.Object3D
entityId: string
}

17
src/core/base/BaseRenderer.ts

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

62
src/core/controls/EsDragControls.ts

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

2
src/core/manager/InteractionManager.ts

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

4
src/modules/measure/MeasureRenderer.ts

@ -72,6 +72,10 @@ export default class MeasureRenderer extends BaseRenderer {
this.tempViewport?.scene.add(this.group) 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) this.group.add(...objects)
} }

2
src/types/global.d.ts

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

22
src/types/model.d.ts

@ -1,5 +1,27 @@
type LinkType = 'in' | 'out' | 'center' type LinkType = 'in' | 'out' | 'center'
interface CurrentMouseInfo {
/**
*
*/
viewport: any
/**
* X
*/
x: number
/**
* Y
*/
z: number
/**
* , [0, 1]
*/
mouse: any
}
interface InitThreeOption { interface InitThreeOption {
stateManagerId: string stateManagerId: string
} }

Loading…
Cancel
Save