feat(阶段1): 搬入 ojnext 为 apps/web，未改业务代码

apps/web/src/shared/components/FlowchartEditor/useDnD.ts

@@ -0,0 +1,84 @@
+import { ref } from "vue"
+import { useVueFlow } from "@vue-flow/core"
+import {
+  getNodeTypeConfig,
+  createNodeStyle,
+  getNodeDimensions,
+} from "./useNodeStyles"
+import { getRandomId } from "utils/functions"
+
+// 模块级共享：当前拖拽的节点类型（Toolbar 写入，canvas 读取）
+export const currentDragNodeType = ref<string | null>(null)
+
+/**
+ * 简化的拖拽处理
+ */
+export function useDnD() {
+  const { addNodes, screenToFlowCoordinate } = useVueFlow()
+  const isDragOver = ref(false)
+  const screenDragPos = ref<{ x: number; y: number } | null>(null)
+
+  // 拖拽悬停处理
+  const onDragOver = (event: DragEvent) => {
+    event.preventDefault()
+    isDragOver.value = true
+    screenDragPos.value = { x: event.clientX, y: event.clientY }
+  }
+
+  // 拖拽离开处理
+  const onDragLeave = () => {
+    isDragOver.value = false
+    screenDragPos.value = null
+  }
+
+  // 拖拽放置处理
+  const onDrop = (event: DragEvent) => {
+    event.preventDefault()
+    isDragOver.value = false
+    screenDragPos.value = null
+    currentDragNodeType.value = null
+
+    const type = event.dataTransfer?.getData("application/vueflow")
+    if (!type) return
+
+    // 获取鼠标在画布中的坐标
+    const position = screenToFlowCoordinate({
+      x: event.clientX,
+      y: event.clientY,
+    })
+
+    // 根据节点类型获取实际尺寸
+    const dimensions = getNodeDimensions(type)
+
+    // 调整位置，使节点中心点对齐到鼠标位置
+    const adjustedPosition = {
+      x: position.x - dimensions.width / 2,
+      y: position.y - dimensions.height / 2,
+    }
+
+    const nodeId = `node-${getRandomId()}`
+    const config = getNodeTypeConfig(type)
+    const newNode = {
+      id: nodeId,
+      type: "custom",
+      position: adjustedPosition,
+      data: {
+        label: config.label,
+        color: config.color,
+        originalType: type,
+      },
+      style: createNodeStyle(type),
+    }
+
+    addNodes([newNode])
+    return newNode
+  }
+
+  return {
+    isDragOver,
+    screenDragPos,
+    onDragOver,
+    onDragLeave,
+    onDrop,
+  }
+}