找不到区域拖拽状态

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

@@ -102,55 +102,6 @@ const mainAreaResizeBars = ref([])
 // 检查主区域内是否有其他Area（简化版）
 const hasAreasInMainContent = ref(false)
 
-// 代理到事件处理器的方法
-const onPanelDragStart = (areaId, event) => {
-  dragStateActions.onPanelDragStart(areaId, event);
-};
-
-const onPanelDragMove = (areaId, event) => {
-  dragStateActions.onPanelDragMove(areaId, event);
-};
-
-const onPanelDragEnd = () => {
-  dragStateActions.onPanelDragEnd();
-};
-
-const onPanelDragStartFromTabPage = (event) => {
-  dragStateActions.onPanelDragStartFromTabPage(event);
-};
-
-const onPanelDragMoveFromTabPage = (event) => {
-  dragStateActions.onPanelDragMoveFromTabPage(event);
-};
-
-const onPanelDragEndFromTabPage = () => {
-  dragStateActions.onPanelDragEndFromTabPage();
-};
-
-const onAreaDragStart = (event) => {
-  dragStateActions.onAreaDragStart(event);
-};
-
-const onAreaDragMove = (event) => {
-  dragStateActions.onAreaDragMove(event);
-};
-
-const onAreaDragEnd = (event) => {
-  dragStateActions.onAreaDragEnd(event);
-};
-
-const onTabDragStart = (event) => {
-  dragStateActions.onTabDragStart(event);
-};
-
-const onTabDragMove = (event) => {
-  dragStateActions.onTabDragMove(event);
-};
-
-const onTabDragEnd = () => {
-  dragStateActions.onTabDragEnd();
-};
-
 // Area相关事件处理
 const onCloseFloatingArea = (event) => {
   const id = event.areaId;
@@ -289,9 +240,6 @@ const setupEventListeners = () => {
   const unsubscribeFunctions = [];
   
   // Area相关事件
-  unsubscribeFunctions.push(eventBus.on(EVENT_TYPES.AREA_DRAG_START, onAreaDragStart, { componentId: 'dock-layout' }));
-  unsubscribeFunctions.push(eventBus.on(EVENT_TYPES.AREA_DRAG_MOVE, onAreaDragMove, { componentId: 'dock-layout' }));
-  unsubscribeFunctions.push(eventBus.on(EVENT_TYPES.AREA_DRAG_END, onAreaDragEnd, { componentId: 'dock-layout' }));
   unsubscribeFunctions.push(eventBus.on(EVENT_TYPES.AREA_POSITION_UPDATE, onUpdatePosition, { componentId: 'dock-layout' }));
   unsubscribeFunctions.push(eventBus.on(EVENT_TYPES.AREA_DRAG_OVER, handleAreaDragOver, { componentId: 'dock-layout' }));
   unsubscribeFunctions.push(eventBus.on(EVENT_TYPES.AREA_DRAG_LEAVE, handleAreaDragLeave, { componentId: 'dock-layout' }));
@@ -300,9 +248,6 @@ const setupEventListeners = () => {
   unsubscribeFunctions.push(eventBus.on(EVENT_TYPES.TAB_CHANGE, onTabChange, { componentId: 'dock-layout' }));
   unsubscribeFunctions.push(eventBus.on(EVENT_TYPES.TAB_CLOSE, onTabClose, { componentId: 'dock-layout' }));
   unsubscribeFunctions.push(eventBus.on(EVENT_TYPES.TAB_ADD, onTabAdd, { componentId: 'dock-layout' }));
-  unsubscribeFunctions.push(eventBus.on(EVENT_TYPES.TAB_DRAG_START, onTabDragStart, { componentId: 'dock-layout' }));
-  unsubscribeFunctions.push(eventBus.on(EVENT_TYPES.TAB_DRAG_MOVE, onTabDragMove, { componentId: 'dock-layout' }));
-  unsubscribeFunctions.push(eventBus.on(EVENT_TYPES.TAB_DRAG_END, onTabDragEnd, { componentId: 'dock-layout' }));
   
   // Panel相关事件
   unsubscribeFunctions.push(eventBus.on(EVENT_TYPES.PANEL_TOGGLE_COLLAPSE, () => emit('toggleCollapse'), { componentId: 'dock-layout' }));
@@ -310,12 +255,6 @@ const setupEventListeners = () => {
   unsubscribeFunctions.push(eventBus.on(EVENT_TYPES.PANEL_CLOSE_REQUEST, onCloseFloatingArea, { componentId: 'dock-layout' }));
   unsubscribeFunctions.push(eventBus.on(EVENT_TYPES.PANEL_CLOSE, onClosePanel, { componentId: 'dock-layout' }));
   unsubscribeFunctions.push(eventBus.on(EVENT_TYPES.PANEL_TOGGLE_TOOLBAR, () => emit('toggleToolbar'), { componentId: 'dock-layout' }));
-  unsubscribeFunctions.push(eventBus.on(EVENT_TYPES.PANEL_DRAG_START, onPanelDragStart, { componentId: 'dock-layout' }));
-  unsubscribeFunctions.push(eventBus.on(EVENT_TYPES.PANEL_DRAG_MOVE, onPanelDragMove, { componentId: 'dock-layout' }));
-  unsubscribeFunctions.push(eventBus.on(EVENT_TYPES.PANEL_DRAG_END, onPanelDragEnd, { componentId: 'dock-layout' }));
-  unsubscribeFunctions.push(eventBus.on(EVENT_TYPES.PANEL_DRAG_START_FROM_TABPAGE, onPanelDragStartFromTabPage, { componentId: 'dock-layout' }));
-  unsubscribeFunctions.push(eventBus.on(EVENT_TYPES.PANEL_DRAG_MOVE_FROM_TABPAGE, onPanelDragMoveFromTabPage, { componentId: 'dock-layout' }));
-  unsubscribeFunctions.push(eventBus.on(EVENT_TYPES.PANEL_DRAG_END_FROM_TABPAGE, onPanelDragEndFromTabPage, { componentId: 'dock-layout' }));
   unsubscribeFunctions.push(eventBus.on(EVENT_TYPES.PANEL_MAXIMIZE_SYNC, onPanelMaximizeSync, { componentId: 'dock-layout' }));
   
   // Resize相关事件

AutoRobot/Windows/Robot/Web/src/DockLayout/handlers/DragStateManager.js

@@ -610,18 +610,22 @@ class DragStateManager {
     try {
       const { eventType = data.type, dragId, componentType, sourceElement } = data;
       
+      console.log('🔍 _onDragEvent 接收到的数据:', { eventType, dragId, componentType, data });
+      
       // 从事件数据中提取 dragId，如果没有则根据组件类型推断
       let actualDragId = dragId;
       if (!actualDragId) {
         if (data.panelId) {
-          actualDragId = `panel_${data.panelId}_${data.timestamp || Date.now()}`;
+          actualDragId = `panel_${data.panelId}_${data.timestamp || Date.now()}_${Math.random().toString(36).substring(2, 9)}`;
         } else if (data.tabIndex !== undefined) {
-          actualDragId = `tabpage_${data.tabId}_${data.tabIndex}_${data.timestamp || Date.now()}`;
+          actualDragId = `tabpage_${data.tabId}_${data.tabIndex}_${data.timestamp || Date.now()}_${Math.random().toString(36).substring(2, 9)}`;
         } else if (data.areaId) {
-          actualDragId = `area_${data.areaId}_${data.timestamp || Date.now()}`;
+          actualDragId = `area_${data.areaId}_${data.timestamp || Date.now()}_${Math.random().toString(36).substring(2, 9)}`;
         }
       }
       
+      console.log('🔍 _onDragEvent 处理后的 dragId:', { originalDragId: dragId, actualDragId });
+      
       // 推断组件类型
       let actualComponentType = componentType;
       if (!actualComponentType) {
@@ -686,9 +690,19 @@ class DragStateManager {
   async _handleDragStart(data) {
     const { dragId, componentType, sourceElement, position, options = {} } = data;
     
-    // 如果没有提供 dragId，生成一个唯一的 dragId
+    console.log('🔍 _handleDragStart 接收到的数据:', { dragId, componentType, position, data });
+    
+    // 使用传入的 dragId，如果没有则生成一个唯一的 dragId
     const actualDragId = dragId || this._generateDragId(componentType);
     
+    console.log('🔍 _handleDragStart 处理后的 dragId:', { originalDragId: dragId, actualDragId });
+    
+    // 检查是否已存在相同 dragId 的拖拽状态
+    if (this.activeDrags.has(actualDragId)) {
+      console.log(`⚠️ 拖拽状态已存在: ${actualDragId}，跳过创建`);
+      return actualDragId;
+    }
+    
     // 创建拖拽状态
     const dragState = new DragState(actualDragId, componentType, sourceElement, options);
     dragState.startPosition = { ...position };
@@ -1277,6 +1291,18 @@ class DragStateManager {
           dragId,
           reason: 'manager_cancelled'
         });
+        
+        // 立即从活跃拖拽中移除，不依赖异步事件处理
+        this.activeDrags.delete(dragId);
+        
+        // 清除反馈
+        this._hideDragFeedback(dragId);
+        
+        // 从冲突检测器注销
+        this.conflictDetector.unregisterDrag(dragId);
+        
+        // 清理拖拽目标
+        this.dragTargets.delete(dragId);
       }
     });
     
@@ -1295,6 +1321,7 @@ class DragStateManager {
         element,
         type = 'panel',
         position = { x: 0, y: 0 },
+        dragId: incomingDragId,
         ...options 
       } = eventData;
 
@@ -1304,8 +1331,8 @@ class DragStateManager {
         this.cancelAllDrags();
       }
 
-      // 创建拖拽ID
+      // 使用传入的 dragId，如果没有则生成新的
-      const dragId = `panel-${panelId}-${Date.now()}`;
+      const dragId = incomingDragId || `panel-${panelId}-${Date.now()}`;
       
       // 创建拖拽状态
       const dragState = new DragState(dragId, DRAG_AREA_TYPES.PANEL, element, {
@@ -1487,11 +1514,12 @@ class DragStateManager {
         tabPageId,
         element,
         tabIndex,
+        dragId: incomingDragId,
         ...options 
       } = eventData;
 
-      // 创建拖拽ID
+      // 使用传入的 dragId，如果没有则生成新的
-      const dragId = `tabpage-${tabPageId}-${Date.now()}`;
+      const dragId = incomingDragId || `tabpage-${tabPageId}-${Date.now()}`;
       
       // 创建拖拽状态
       const dragState = new DragState(dragId, DRAG_AREA_TYPES.TABPAGE, element, {
@@ -1767,17 +1795,19 @@ class DragStateManager {
         element,
         type = 'area',
         position = { x: 0, y: 0 },
+        dragId: incomingDragId,
         ...options 
       } = eventData;
 
       // 检查是否有其他活跃拖拽
       if (this.activeDrags.size > 0) {
-        console.warn('检测到其他活跃拖拽，暂停之前的拖拽');
+        console.warn('检测到其他活跃拖拽，跳过创建新拖拽状态');
-        this.cancelAllDrags();
+        // 如果已经有活跃拖拽，直接返回现有拖拽的dragId
+        return Array.from(this.activeDrags.keys())[0];
       }
 
-      // 创建拖拽ID
+      // 使用传入的 dragId，如果没有则生成新的
-      const dragId = `area-${areaId}-${Date.now()}`;
+      const dragId = incomingDragId || `area-${areaId}-${Date.now()}`;
       
       // 创建拖拽状态
       const dragState = new DragState(dragId, DRAG_AREA_TYPES.AREA, element, {
@@ -1900,10 +1930,12 @@ class DragStateManager {
         ...options 
       } = eventData;
 
+      console.log('🔍 onAreaDragEnd 接收到的数据:', { dragId, areaId, eventData });
+
       // 查找拖拽状态
       const activeDrag = this._findDragByIdOrAreaId(dragId, areaId);
       if (!activeDrag) {
-        console.warn('找不到区域拖拽状态:', areaId);
+        console.warn('找不到区域拖拽状态:', { dragId, areaId, activeDrags: Array.from(this.activeDrags.keys()) });
         return false;
       }
 
@@ -1950,7 +1982,7 @@ class DragStateManager {
 }
 
 // 立即创建单例实例，避免并发初始化问题
-const dragStateManager = new DragStateManager();
+let dragStateManager = new DragStateManager();
 
 // 便捷操作函数
 export const dragStateActions = {
@@ -2097,7 +2129,6 @@ export const dragStateActions = {
       } catch (e) {
         console.warn('销毁拖拽状态管理器时出错:', e);
       }
-      dragStateManager = null;
       console.log('🗑️ 拖拽状态管理器已销毁');
     }
   }