为DockLayout.vue添加事件总线支持，让它能够响应面板关闭事件

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

@@ -76,7 +76,7 @@
 </template>
 
 <script setup>
-import { ref, defineExpose, defineEmits, nextTick, watch, computed, onMounted } from 'vue'
+import { ref, defineExpose, defineEmits, nextTick, watch, computed, onMounted, onUnmounted } from 'vue'
 import Area from './Area.vue';
 import Panel from './Panel.vue';
 import TabPage from './TabPage.vue';
@@ -84,6 +84,12 @@ import DockIndicator from './DockIndicator.vue';
 import ResizeBar from './ResizeBar.vue';
 import Render from './Render.vue';
 import { Z_INDEX_LAYERS, zIndexManager } from './dockLayers.js';
+import {
+  eventBus,
+  EVENT_TYPES,
+  emitEvent,
+  onEvent
+} from './eventBus.js';
 
 // 定义组件可以发出的事件
 const emit = defineEmits([
@@ -410,6 +416,22 @@ const onClosePanel = (areaId, panelId) => {
   }
 }
 
+// 处理通过事件总线接收到的面板关闭请求
+const handlePanelCloseRequest = (eventData) => {
+  // console.log('收到面板关闭请求:', eventData)
+  const { areaId, panelId } = eventData
+  
+  if (areaId && panelId) {
+    // 直接调用现有的onClosePanel方法
+    onClosePanel(areaId, panelId)
+  } else if (areaId && !panelId) {
+    // 如果只提供了areaId，关闭整个浮动区域
+    onCloseFloatingArea(areaId)
+  } else {
+    console.warn('收到无效的面板关闭请求:', eventData)
+  }
+}
+
 // 切换工具栏
 const onToggleToolbar = (id) => {
   const area = floatingAreas.value.find(a => a.id === id)
@@ -863,12 +885,21 @@ watch(floatingAreas, (newAreas) => {
   });
 }, { deep: true });
 
-// 组件挂载后检查主区域内容
+// 组件挂载后检查主区域内容并设置事件监听
 onMounted(() => {
   // 延迟执行，确保DOM完全渲染
   setTimeout(() => {
     checkMainContentForAreas()
   }, 100)
+  
+  // 监听面板关闭事件
+  onEvent(EVENT_TYPES.PANEL_CLOSE_REQUEST, handlePanelCloseRequest)
+})
+
+// 组件卸载后清理事件监听
+onUnmounted(() => {
+  // 清理面板关闭事件监听
+  eventBus.off(EVENT_TYPES.PANEL_CLOSE_REQUEST, handlePanelCloseRequest)
 })
 
 // 监听主区域内容变化