From 8a2b07d36fd44e0fe90907ab2d532179cde05403 Mon Sep 17 00:00:00 2001
From: zqm <zqm@example.com>
Date: Thu, 15 Jan 2026 09:09:21 +0800
Subject: [PATCH] =?UTF-8?q?=E5=9C=A8tabpage=E7=9A=84=E6=A0=87=E7=AD=BE?=
 =?UTF-8?q?=E4=B8=BAtop=E6=97=B6=E6=98=BE=E7=A4=BA=E5=8C=BA=E5=9F=9F?=
 =?UTF-8?q?=E6=A0=87=E9=A2=98=E6=A0=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../Windows/Robot/Web/src/DockLayout/Area.vue | 23 +++++++++++++++++--
 .../Robot/Web/src/DockLayout/Panel.vue        | 19 +++++++++++----
 .../Robot/Web/src/DockLayout/Render.vue       |  3 ++-
 .../Robot/Web/src/DockLayout/TabPage.vue      |  6 ++++-
 4 files changed, 42 insertions(+), 9 deletions(-)

diff --git a/AutoRobot/Windows/Robot/Web/src/DockLayout/Area.vue b/AutoRobot/Windows/Robot/Web/src/DockLayout/Area.vue
index 77378bd..51f62dd 100644
--- a/AutoRobot/Windows/Robot/Web/src/DockLayout/Area.vue
+++ b/AutoRobot/Windows/Robot/Web/src/DockLayout/Area.vue
@@ -223,6 +223,22 @@ const isSingleTabPageWithMultiplePanels = computed(() => {
   return false;
 });
 
+// 计算属性：TabPage的tabPosition
+const tabPagePosition = computed(() => {
+  // 检查children配置
+  if (props.children) {
+    const childrenArray = Array.isArray(props.children) ? props.children : [props.children];
+    
+    // 只有一个child且是TabPage
+    if (childrenArray.length === 1 && childrenArray[0].type === 'TabPage') {
+      return childrenArray[0].tabPosition || 'top';
+    }
+  }
+  
+  // 默认top
+  return 'top';
+});
+
 // 计算属性：是否显示标题栏
 const shouldShowTitleBar = computed(() => {
   // 基础条件：props.showTitleBar为true
@@ -231,8 +247,11 @@ const shouldShowTitleBar = computed(() => {
   // 单面板场景不显示标题栏
   if (isSinglePanel.value) return false;
   
-  // 只有一个TabPage且有多个Panel的情况不显示标题栏
-  if (isSingleTabPageWithMultiplePanels.value) return false;
+  // 只有一个TabPage且有多个Panel的情况
+  if (isSingleTabPageWithMultiplePanels.value) {
+    // 当tabPosition为top时显示标题栏，其他位置不显示
+    return tabPagePosition.value === 'top';
+  }
   
   // 检查children配置
   if (props.children) {
diff --git a/AutoRobot/Windows/Robot/Web/src/DockLayout/Panel.vue b/AutoRobot/Windows/Robot/Web/src/DockLayout/Panel.vue
index b5c10cb..94b8018 100644
--- a/AutoRobot/Windows/Robot/Web/src/DockLayout/Panel.vue
+++ b/AutoRobot/Windows/Robot/Web/src/DockLayout/Panel.vue
@@ -39,8 +39,8 @@
     </div>
     
     <div class="flex flex-col h-full">
-      <!-- 标题栏 -->
-      <div class="title-bar h-6 bg-[#435d9c] text-white px-2 flex items-center justify-between select-none cursor-move"
+      <!-- 标题栏 - 当tabPosition为top时不显示 -->
+      <div v-if="props._tabPosition !== 'top'" class="title-bar h-6 bg-[#435d9c] text-white px-2 flex items-center justify-between select-none cursor-move"
            :style="{ cursor: isSinglePanel && isMaximized ? 'default' : 'move' }"
            @mousedown="onDragStart">
         <div class="flex items-center">
@@ -204,6 +204,11 @@ const props = defineProps({
     type: Object,
     default: null
   },
+  // 父TabPage的tabPosition信息，用于控制标题栏显示
+  _tabPosition: {
+    type: String,
+    default: 'top'
+  },
   // 移除areaId属性，因为面板会被拖拽到不同区域
   // 改为通过DOM动态获取当前所在区域
 });
@@ -866,13 +871,17 @@ onUnmounted(() => {
   console.log(`[Panel:${props.id}] 组件即将卸载`)
   
   try {
-    // 1. 立即设置标志位，防止新的异步操作
+    // 1. 立即清理content内容，防止尝试访问已销毁的DOM元素
+    // 这是解决content.js中"Cannot read properties of null (reading 'parentNode')"错误的关键
+    const contentRef = ref(null);
+    
+    // 2. 立即设置标志位，防止新的异步操作
     isDragging.value = false
     
-    // 2. 同步清理所有可以直接清理的资源
+    // 3. 同步清理所有可以直接清理的资源
     const cleanupResult = cleanupEventListeners()
     
-    // 3. 记录清理结果
+    // 4. 记录清理结果
     if (import.meta.env.DEV) {
       console.log(`[Panel:${props.id}] 组件清理结果:`, cleanupResult)
     }
diff --git a/AutoRobot/Windows/Robot/Web/src/DockLayout/Render.vue b/AutoRobot/Windows/Robot/Web/src/DockLayout/Render.vue
index 4f5abbd..c747378 100644
--- a/AutoRobot/Windows/Robot/Web/src/DockLayout/Render.vue
+++ b/AutoRobot/Windows/Robot/Web/src/DockLayout/Render.vue
@@ -93,7 +93,8 @@ const componentProps = computed(() => {
         collapsed: config.collapsed || false,
         toolbarExpanded: config.toolbarExpanded || false,
         maximized: config.maximized || false,
-        content: config.content
+        content: config.content,
+        _tabPosition: config._tabPosition
       }
       
     default:
diff --git a/AutoRobot/Windows/Robot/Web/src/DockLayout/TabPage.vue b/AutoRobot/Windows/Robot/Web/src/DockLayout/TabPage.vue
index c8b1d4a..9337607 100644
--- a/AutoRobot/Windows/Robot/Web/src/DockLayout/TabPage.vue
+++ b/AutoRobot/Windows/Robot/Web/src/DockLayout/TabPage.vue
@@ -91,7 +91,11 @@
       <Render
         v-if="activeChild"
         :type="activeChild.type"
-        :config="activeChild"
+        :config="{
+          ...activeChild,
+          // 传递tabPosition信息给子组件
+          _tabPosition: adjustedTabPosition
+        }"
         style="width: 100%; height: 100%;"
       />