diff --git a/packages/shell/src/drag-object.ts b/packages/shell/src/drag-object.ts new file mode 100644 index 000000000..1261b4d26 --- /dev/null +++ b/packages/shell/src/drag-object.ts @@ -0,0 +1,30 @@ +import { DragObject as InnerDragObject, DragNodeDataObject } from '@alilc/lowcode-designer'; +import { dragObjectSymbol } from './symbols'; +import Node from './node'; + +export default class DragObject { + private readonly [dragObjectSymbol]: InnerDragObject; + + constructor(dragObject: InnerDragObject) { + this[dragObjectSymbol] = dragObject; + } + + static create(dragObject: InnerDragObject) { + if (!dragObject) return null; + return new DragObject(dragObject); + } + + get type() { + return this[dragObjectSymbol].type; + } + + get nodes() { + const { nodes } = this[dragObjectSymbol]; + if (!nodes) return null; + return nodes.map(Node.create); + } + + get data() { + return (this[dragObjectSymbol] as DragNodeDataObject).data; + } +} \ No newline at end of file diff --git a/packages/shell/src/dragon.ts b/packages/shell/src/dragon.ts index 85f4b84d3..a1e4a4dab 100644 --- a/packages/shell/src/dragon.ts +++ b/packages/shell/src/dragon.ts @@ -1,8 +1,12 @@ import { Dragon as InnerDragon, + DragObject as InnerDragObject, DragNodeDataObject, + LocateEvent as InnerLocateEvent, } from '@alilc/lowcode-designer'; import { dragonSymbol } from './symbols'; +import LocateEvent from './locate-event'; +import DragObject from './drag-object'; export default class Dragon { private readonly [dragonSymbol]: InnerDragon; @@ -28,9 +32,8 @@ export default class Dragon { * @param func * @returns */ - onDragstart(func: (/* e: LocateEvent */) => any) { - // TODO: 补充必要参数 - return this[dragonSymbol].onDragstart(() => func()); + onDragstart(func: (e: LocateEvent) => any) { + return this[dragonSymbol].onDragstart((e: InnerLocateEvent) => func(LocateEvent.create(e)!)); } /** @@ -38,9 +41,8 @@ export default class Dragon { * @param func * @returns */ - onDrag(func: (/* e: LocateEvent */) => any) { - // TODO: 补充必要参数 - return this[dragonSymbol].onDrag(() => func()); + onDrag(func: (e: LocateEvent) => any) { + return this[dragonSymbol].onDrag((e: InnerLocateEvent) => func(LocateEvent.create(e)!)); } /** @@ -48,9 +50,13 @@ export default class Dragon { * @param func * @returns */ - onDragend(func: (/* e: LocateEvent */) => any) { - // TODO: 补充必要参数 - return this[dragonSymbol].onDragend(() => func()); + onDragend(func: (o: { dragObject: DragObject; copy?: boolean }) => any) { + return this[dragonSymbol].onDragend( + (o: { dragObject: InnerDragObject; copy?: boolean }) => func({ + dragObject: DragObject.create(o.dragObject)!, + copy: o.copy, + }), + ); } /** @@ -61,4 +67,4 @@ export default class Dragon { from(shell: Element, boost: (e: MouseEvent) => DragNodeDataObject | null) { return this[dragonSymbol].from(shell, boost); } -} \ No newline at end of file +} diff --git a/packages/shell/src/locate-event.ts b/packages/shell/src/locate-event.ts new file mode 100644 index 000000000..01c97edae --- /dev/null +++ b/packages/shell/src/locate-event.ts @@ -0,0 +1,48 @@ +import { LocateEvent as InnerLocateEvent } from '@alilc/lowcode-designer'; +import { locateEventSymbol } from './symbols'; +import DragObject from './drag-object'; + +export default class LocateEvent { + private readonly [locateEventSymbol]: InnerLocateEvent; + + constructor(locateEvent: InnerLocateEvent) { + this[locateEventSymbol] = locateEvent; + } + + static create(locateEvent: InnerLocateEvent) { + if (!locateEvent) return null; + return new LocateEvent(locateEvent); + } + + get type() { + return this[locateEventSymbol].type; + } + + get globalX() { + return this[locateEventSymbol].globalX; + } + + get globalY() { + return this[locateEventSymbol].globalY; + } + + get originalEvent() { + return this[locateEventSymbol].originalEvent; + } + + get target() { + return this[locateEventSymbol].target; + } + + get canvasX() { + return this[locateEventSymbol].canvasX; + } + + get canvasY() { + return this[locateEventSymbol].canvasY; + } + + get dragObject() { + return DragObject.create(this[locateEventSymbol].dragObject); + } +} \ No newline at end of file diff --git a/packages/shell/src/symbols.ts b/packages/shell/src/symbols.ts index 27bc59f33..baeb4452a 100644 --- a/packages/shell/src/symbols.ts +++ b/packages/shell/src/symbols.ts @@ -21,4 +21,6 @@ export const dragonSymbol = Symbol('dragon'); export const componentMetaSymbol = Symbol('componentMeta'); export const dropLocationSymbol = Symbol('dropLocation'); export const simulatorHostSymbol = Symbol('simulatorHost'); -export const simulatorRendererSymbol = Symbol('simulatorRenderer'); \ No newline at end of file +export const simulatorRendererSymbol = Symbol('simulatorRenderer'); +export const dragObjectSymbol = Symbol('dragObject'); +export const locateEventSymbol = Symbol('locateEvent'); \ No newline at end of file