解决事件泄漏问题

AutoRobot/Windows/Robot/Web/src/DockLayout/Area.vue

@@ -180,6 +180,7 @@ const areaRef = ref(null)
 const isDragging = ref(false)
 const dragStartPos = ref({ x: 0, y: 0 })
 const areaStartPos = ref({ x: 0, y: 0 })
+const currentDragId = ref(null)
 
 // 调整大小相关状态
 const isResizing = ref(false)
@@ -278,18 +279,24 @@ const onPanelMaximize = (panelId) => {
   } else {
     // // console.log('🔸 非单Panel模式，转发到父组件')
     // 如果不是单Panel，转发给父组件处理
-    emitEvent(EVENT_TYPES.PANEL_MAXIMIZE, { panelId, areaId: props.id })
+    emitEvent(EVENT_TYPES.PANEL_MAXIMIZE, { panelId, areaId: props.id }, {
+      source: { component: 'Area', areaId: props.id }
+    })
   }
 }
 
 // 处理拖拽悬停事件
 const handleDragOver = (event) => {
-  emitEvent(EVENT_TYPES.AREA_DRAG_OVER, { event, areaId: props.id })
+  emitEvent(EVENT_TYPES.AREA_DRAG_OVER, { event, areaId: props.id }, {
+    source: { component: 'Area', areaId: props.id }
+  })
 }
 
 // 处理拖拽离开事件
 const handleDragLeave = (event) => {
-  emitEvent(EVENT_TYPES.AREA_DRAG_LEAVE, { event, areaId: props.id })
+  emitEvent(EVENT_TYPES.AREA_DRAG_LEAVE, { event, areaId: props.id }, {
+    source: { component: 'Area', areaId: props.id }
+  })
 }
 
 // 拖拽开始
@@ -307,8 +314,12 @@ const onDragStart = (e) => {
     y: originalPosition.value.top || 0
   }
   
-  // 使用事件总线通知拖拽开始
+  // 生成统一的 dragId
+  currentDragId.value = `area_${props.id}_${Date.now()}_${Math.random().toString(36).substring(2, 9)}`
+  
+  // 使用事件总线通知拖拽开始，包含 dragId 和标准化数据格式
   emitEvent(EVENT_TYPES.AREA_DRAG_START, {
+    dragId: currentDragId.value,
     areaId: props.id,
     event: e,
     element: areaRef.value,
@@ -316,7 +327,10 @@ const onDragStart = (e) => {
     clientX: e.clientX,
     clientY: e.clientY,
     startLeft: originalPosition.value.left || 0,
-    startTop: originalPosition.value.top || 0
+    startTop: originalPosition.value.top || 0,
+    timestamp: Date.now()
+  }, {
+    source: { component: 'Area', areaId: props.id, dragId: currentDragId.value }
   })
   
   // 使用全局事件管理器添加事件监听
@@ -329,7 +343,7 @@ const onDragStart = (e) => {
 
 // 拖拽移动
 const onDragMove = (e) => {
-  if (!isDragging.value) return
+  if (!isDragging.value || !currentDragId.value) return
   
   // 计算移动距离
   const deltaX = e.clientX - dragStartPos.value.x
@@ -354,8 +368,9 @@ const onDragMove = (e) => {
   originalPosition.value.left = newLeft
   originalPosition.value.top = newTop
   
-  // 使用事件总线通知拖拽移动
+  // 使用事件总线通知拖拽移动，包含 dragId
   emitEvent(EVENT_TYPES.AREA_DRAG_MOVE, {
+    dragId: currentDragId.value,
     areaId: props.id,
     event: e,
     element: areaRef.value,
@@ -363,27 +378,44 @@ const onDragMove = (e) => {
     clientX: e.clientX,
     clientY: e.clientY,
     left: newLeft,
-    top: newTop
+    top: newTop,
+    timestamp: Date.now()
+  }, {
+    source: { component: 'Area', areaId: props.id, dragId: currentDragId.value }
   })
   
-  // 使用事件总线通知位置变化
-  emitEvent(EVENT_TYPES.AREA_POSITION_UPDATE, { areaId: props.id, left: newLeft, top: newTop })
+  // 使用事件总线通知位置变化，包含 dragId
+  emitEvent(EVENT_TYPES.AREA_POSITION_UPDATE, { 
+    dragId: currentDragId.value,
+    areaId: props.id, 
+    left: newLeft, 
+    top: newTop 
+  }, {
+    source: { component: 'Area', areaId: props.id, dragId: currentDragId.value }
+  })
 }
 
 // 拖拽结束
 const onDragEnd = () => {
-  // 使用事件总线通知拖拽结束
+  if (!currentDragId.value) return
+  
+  // 使用事件总线通知拖拽结束，包含 dragId 和标准化数据格式
   emitEvent(EVENT_TYPES.AREA_DRAG_END, {
+    dragId: currentDragId.value,
     areaId: props.id,
     finalPosition: {
       x: originalPosition.value.left,
       y: originalPosition.value.top
     },
     left: originalPosition.value.left,
-    top: originalPosition.value.top
+    top: originalPosition.value.top,
+    timestamp: Date.now()
+  }, {
+    source: { component: 'Area', areaId: props.id, dragId: currentDragId.value }
   })
   
   isDragging.value = false
+  currentDragId.value = null
   // 使用全局事件管理器移除事件监听
   globalEventListenerManager.removeGlobalListener('mousemove', onDragMove)
   globalEventListenerManager.removeGlobalListener('mouseup', onDragEnd)
@@ -507,6 +539,8 @@ const onResizeStart = (direction, e) => {
     areaId: props.id,
     left: newLeft,
     top: newTop
+  }, {
+    source: { component: 'Area', areaId: props.id }
   })
   
   // 防止文本选择
@@ -542,6 +576,8 @@ const onToggleMaximize = () => {
       areaId: props.id,
       left: originalPosition.value.left,
       top: originalPosition.value.top
+    }, {
+      source: { component: 'Area', areaId: props.id }
     })
   }
   
@@ -549,11 +585,15 @@ const onToggleMaximize = () => {
   emitEvent(EVENT_TYPES.WINDOW_STATE_CHANGE, {
     areaId: props.id,
     state: next
+  }, {
+    source: { component: 'Area', areaId: props.id }
   })
 }
 
 const onClose = () => emitEvent(EVENT_TYPES.PANEL_CLOSE_REQUEST, {
   areaId: props.id
+}, {
+  source: { component: 'Area', areaId: props.id }
 })
 
 // 组件挂载后获取父容器引用并初始化位置
@@ -589,6 +629,8 @@ onMounted(() => {
       areaId: props.id,
       left: originalPosition.value.left,
       top: originalPosition.value.top
+    }, {
+      source: { component: 'Area', areaId: props.id }
     })
   }
 })
@@ -675,6 +717,8 @@ const mergeAreaContent = (sourceArea) => {
         targetAreaHasContent: false, // 目标Area为空
         operation: 'add-children',
         addedTabPages: receivedContent.value
+      }, {
+        source: { component: 'Area', areaId: props.id }
       })
       
       return true
@@ -734,6 +778,8 @@ const mergeAreaContent = (sourceArea) => {
         targetAreaHasContent: true, // 目标Area已有内容
         operation: 'merge-tabpages',
         sourceTabPages: tabPagesData
+      }, {
+        source: { component: 'Area', areaId: props.id }
       })
         // 更新完成
         // // console.log(`[Area] 合并完成，现有TabPage共有 ${existingTabPage.tabPage.panels.length} 个Panel`)