修复主区域边缘指示器显示逻辑

- 修改DockLayout.vue中的hideEdgeIndicators判断逻辑，从简单检查floatingAreas数组改为实际检测主区域内容区内是否包含其他Area
- 添加checkMainContentForAreas函数，通过DOM查询检测主区域内的.vs-area、.tab-page和.panel元素
- 添加onMounted钩子和floatingAreas监听器，确保在适当时机进行检测
- 保持DockIndicator.vue中v-if条件渲染边缘指示器的逻辑
- 修复第3条需求：当主区域内没有其他Area时正确隐藏外部边缘指示器

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

@@ -69,6 +69,7 @@
     
     <!-- 上指示：根据activeDockZone状态显示和高亮 -->
     <svg 
+      v-if="!props.hideEdgeIndicators"
       width="41" 
       height="41" 
       viewBox="0 0 40 40" 
@@ -93,6 +94,7 @@
 
     <!-- 右指示：根据activeDockZone状态显示和高亮 -->
     <svg 
+      v-if="!props.hideEdgeIndicators"
       width="41" 
       height="41" 
       viewBox="0 0 40 40" 
@@ -117,6 +119,7 @@
 
     <!-- 下指示：根据activeDockZone状态显示和高亮 -->
     <svg 
+      v-if="!props.hideEdgeIndicators"
       width="41" 
       height="41" 
       viewBox="0 0 40 40" 
@@ -141,6 +144,7 @@
 
     <!-- 左指示：根据activeDockZone状态显示和高亮 -->
     <svg 
+      v-if="!props.hideEdgeIndicators"
       width="41" 
       height="41" 
       viewBox="0 0 40 40" 
@@ -434,34 +438,14 @@
 <script setup>
 import { computed, watch, ref, onUnmounted } from 'vue'
 
-// Props定义
 const props = defineProps({
-  // 是否可见
+  visible: Boolean,
-  visible: {
+  targetRect: Object,
-    type: Boolean,
+  mousePosition: Object,
-    default: false
+  hideEdgeIndicators: Boolean
-  },
-  // 目标区域的位置和大小信息
-  targetRect: {
-    type: Object,
-    default: () => ({
-      left: 0,
-      top: 0,
-      width: 0,
-      height: 0
-    })
-  },
-  // 鼠标位置
-  mousePosition: {
-    type: Object,
-    default: () => ({
-      x: 0,
-      y: 0
-    })
-  }
 })
 
-// 鼠标悬停在哪个指示器上
+// 创建响应式的hoveredZone状态
 const hoveredZone = ref(null)
 // 鼠标是否悬停在中心指示器上（用于控制中心指示区的显示）
 const isCenterIndicatorHovered = ref(false)

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

@@ -6,12 +6,14 @@
       :visible="showDockIndicator"
       :target-rect="targetAreaRect"
       :mouse-position="currentMousePosition"
+      :hide-edge-indicators="hideEdgeIndicators"
       @zone-active="onDockZoneActive"
       style="z-index: 9999;"
     />
     
     <!-- 主区域 - 添加ref引用 -->
     <Area 
+      ref="mainAreaRef"
       :WindowState="windowState" 
       :showTitleBar="false" 
       title="主区域" 
@@ -19,6 +21,7 @@
       @dragover="handleMainAreaDragOver"
       @dragleave="handleMainAreaDragLeave"
     >
+      <!-- 这里可以放置主区域的内容 -->
     </Area>
     <!-- 浮动区域直接渲染，不使用额外的div包装 -->
     <Area
@@ -85,7 +88,7 @@
 </template>
 
 <script setup>
-import { ref, defineExpose, nextTick, watch } from 'vue'
+import { ref, defineExpose, nextTick, watch, computed, onMounted } from 'vue'
 import Area from './Area.vue';
 import Panel from './Panel.vue';
 import TabPage from './TabPage.vue';
@@ -99,6 +102,8 @@ const floatingAreas = ref([])
 
 // 容器引用
 const dockLayoutRef = ref(null)
+// 主区域引用
+const mainAreaRef = ref(null)
 // 区域ID计数器
 let areaIdCounter = 1
 
@@ -108,6 +113,15 @@ const currentMousePosition = ref({ x: 0, y: 0 })
 const targetAreaRect = ref({ left: 0, top: 0, width: 0, height: 0 })
 const activeDockZone = ref(null)
 
+// 检查主区域内是否有其他Area（TabPage和Panel等子组件）
+const hasAreasInMainContent = ref(false)
+
+// 计算是否隐藏外部边缘指示器
+const hideEdgeIndicators = computed(() => {
+  // 当主区域内没有其他Area时，隐藏外部边缘指示器
+  return !hasAreasInMainContent.value
+})
+
 // Panel拖拽相关状态
 const panelDragState = ref({
   isDragging: false,
@@ -124,6 +138,46 @@ const tabDragState = ref({
   startAreaPos: { x: 0, y: 0 }
 })
 
+// 检测主区域内是否有其他Area
+const checkMainContentForAreas = () => {
+  if (!mainAreaRef.value) {
+    hasAreasInMainContent.value = false
+    return
+  }
+  
+  try {
+    // 获取主区域的DOM元素
+    const mainAreaElement = mainAreaRef.value.$el
+    if (!mainAreaElement) {
+      hasAreasInMainContent.value = false
+      return
+    }
+    
+    // 检查主区域内容区内是否包含vs-area元素（子Area）
+    const childAreas = mainAreaElement.querySelectorAll('.vs-area')
+    const hasChildAreas = childAreas.length > 1 // 排除主区域本身
+    
+    // 检查主区域内容区内是否包含TabPage
+    const tabPages = mainAreaElement.querySelectorAll('.tab-page, [class*="tab"]')
+    
+    // 检查主区域内容区内是否包含Panel
+    const panels = mainAreaElement.querySelectorAll('.panel, [class*="panel"]')
+    
+    // 如果有任何子Area、TabPage或Panel，则认为主区域内有其他Area
+    hasAreasInMainContent.value = hasChildAreas || tabPages.length > 0 || panels.length > 0
+    
+    console.log('主区域内容检查结果:', {
+      childAreas: hasChildAreas,
+      tabPages: tabPages.length,
+      panels: panels.length,
+      hasAreasInMainContent: hasAreasInMainContent.value
+    })
+  } catch (error) {
+    console.error('检查主区域内容时出错:', error)
+    hasAreasInMainContent.value = false
+  }
+}
+
 // 添加新的浮动面板
 const addFloatingPanel = () => {
   // 获取父容器尺寸以计算居中位置
@@ -477,6 +531,24 @@ watch(floatingAreas, (newAreas) => {
   });
 }, { deep: true });
 
+// 组件挂载后检查主区域内容
+onMounted(() => {
+  // 延迟执行，确保DOM完全渲染
+  setTimeout(() => {
+    checkMainContentForAreas()
+  }, 100)
+})
+
+// 监听主区域内容变化
+watch(floatingAreas, () => {
+  // 当浮动区域变化时，重新检查主区域内容
+  setTimeout(() => {
+    checkMainContentForAreas()
+  }, 100)
+}, { deep: true })
+
+// 当主区域内没有其他Area时，隐藏外部边缘指示器，只显示中心指示器
+
 // 处理主区域的dragover事件
 const handleMainAreaDragOver = (event) => {
   event.preventDefault()

AutoRobot/Windows/Robot/Web/src/DockLayout/ToDoList.md

@@ -33,3 +33,4 @@
 ### 停靠规则
 1. 当一个Panel被拖动时，显示停靠指示器。
 2. 当拖动Panel到指示器时，显示停靠区。
+3. 当主区域内没有其他Area时，隐藏外部边缘指示器，只显示中心指示器。