From 4e504e9003e157e0173d5c21a3c0ee77c01a04b5 Mon Sep 17 00:00:00 2001
From: Jz0ojiang <hi@im0o.top>
Date: Tue, 11 Aug 2026 17:08:33 +0800
Subject: [PATCH] =?UTF-8?q?=E5=88=87=20tab=20=E6=97=B6=E5=AE=B9=E5=99=A8?=
 =?UTF-8?q?=E9=AB=98=E5=BA=A6=E4=B9=9F=E5=81=9A=E8=BF=87=E6=B8=A1?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

三个 tab 的成员数不同，内容淡切时高度直接跳。复用换入站那套锁高度、
量目标、过渡、交还的钩子，挂到 tab 的 Transition 上；tab 切换仍然不触发
自动滚动。
---
 web/views/InboundDetail.vue | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/web/views/InboundDetail.vue b/web/views/InboundDetail.vue
index 6d92ef5..538422a 100644
--- a/web/views/InboundDetail.vue
+++ b/web/views/InboundDetail.vue
@@ -146,7 +146,7 @@ function revealBottom() {
 }
 
 /**
- * 切换选中的入站时，内容淡出淡入，容器高度从旧值滑到新值。
+ * 内容 out-in 切换（换入站、切 tab 共用）时，容器高度从旧值滑到新值。
  * 高度过渡没法纯 CSS 做：auto 不可插值。所以离开前把当前高度钉住，
  * 新内容进场时量出目标高度、过渡过去，结束后清掉内联样式让内容重新做主。
  */
@@ -492,7 +492,8 @@ const complete = computed(
           </button>
           <span class="ink" :style="ink"></span>
         </div>
-        <Transition name="pane" mode="out-in">
+        <!-- 复用入站切换的高度钩子：三个 tab 的成员数不同，高度直接跳很突兀 -->
+        <Transition name="pane" mode="out-in" @before-leave="lockHeight" @enter="settleHeight">
           <div :key="activeTab">
             <p v-if="!kernel.online" class="hint"><IconOffline /> 内核未连接</p>
             <p v-else-if="!proxyDraft && proxyLines.length === 0" class="hint">