From add9227fa1fe670c79dee30b34fbfb08ad3337e5 Mon Sep 17 00:00:00 2001
From: Julian Freeman <freemanjulian372@gmail.com>
Date: Tue, 3 Mar 2026 11:36:15 -0400
Subject: [PATCH] fix ui

---
 src/App.vue | 35 +++++++++++++++++++++++++++++------
 1 file changed, 29 insertions(+), 6 deletions(-)

diff --git a/src/App.vue b/src/App.vue
index a3d345b..ee19bcb 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -418,7 +418,7 @@ function splitSize(sizeStr: string | number) {
             <p>正在分析数百万个文件，请稍候...</p>
           </div>
 
-          <div v-else>
+          <div v-else class="tree-content-wrapper">
             <div class="tree-header">
               <span class="col-name">文件/文件夹名称</span>
               <span class="col-size">大小</span>
@@ -606,10 +606,19 @@ body {
   overflow-y: auto; 
   height: 100%;
 }
+/* 当处于全屏模式（深度分析）时，内容区本身不滚动，让内部树形滚动 */
+.content:has(.page-container.full-width) {
+  overflow-y: hidden;
+}
 
 .page-container { max-width: 800px; margin: 0 auto; padding-bottom: 10px; transition: max-width 0.4s ease; }
-.page-container.full-width { max-width: 1400px; }
-.page-header { margin-bottom: 40px; text-align: center; }
+.page-container.full-width { 
+  max-width: 1400px; 
+  height: calc(100vh - 96px); 
+  display: flex; 
+  flex-direction: column; 
+}
+.page-header { margin-bottom: 40px; text-align: center; flex-shrink: 0; }
 .page-header h1 { font-size: 28px; font-weight: 700; margin-bottom: 8px; color: var(--text-main); }
 .page-header p { color: var(--text-sec); font-size: 15px; }
 
@@ -625,6 +634,7 @@ body {
   cursor: pointer; 
   transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1); 
   box-shadow: var(--btn-shadow);
+  flex-shrink: 0;
 }
 .btn-primary:hover { background-color: var(--primary-hover); transform: translateY(-1.5px); box-shadow: 0 6px 16px rgba(0, 122, 255, 0.35); }
 .btn-primary:active { transform: translateY(0); }
@@ -792,16 +802,25 @@ body {
 .detail-content li { margin-bottom: 8px; line-height: 1.4; }
 
 /* --- 磁盘树样式 --- */
-.advanced-actions { display: flex; justify-content: center; margin-bottom: 32px; }
+.advanced-actions { display: flex; justify-content: center; margin-bottom: 32px; flex-shrink: 0; }
 .tree-table-container { 
   background: #fff; 
   border-radius: 24px; 
   overflow: hidden; 
   margin-top: 32px; 
-  min-height: 400px; 
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  min-height: 0;
   box-shadow: var(--card-shadow); 
   border: 1px solid rgba(0,0,0,0.02); 
 }
+.tree-content-wrapper {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  min-height: 0;
+}
 .tree-header { 
   display: flex; 
   background: #F9FAFB; 
@@ -812,8 +831,12 @@ body {
   text-transform: uppercase;
   letter-spacing: 0.5px;
   border-bottom: 1px solid var(--border-color); 
+  flex-shrink: 0;
+}
+.tree-body { 
+  flex: 1;
+  overflow-y: auto; 
 }
-.tree-body { max-height: 550px; overflow-y: auto; }
 .tree-row { 
   display: flex; 
   align-items: center;