check page, fix ui

src/App.vue

@@ -229,17 +229,28 @@ const appendLog = (msg: string) => {
     });
 }
 
+const appendLogs = (msgs: string[]) => {
+    checkLogs.value.push(...msgs);
+     nextTick(() => {
+        if (logContainerRef.value) {
+            logContainerRef.value.scrollTop = logContainerRef.value.scrollHeight;
+        }
+    });
+}
+
 const handleDeleteEmptyDirs = async () => {
-    appendLog("---" + " 删除空目录操作 @ " + new Date().toLocaleString() + " ---");
+    appendLog("\n" + "=".repeat(20));
     appendLog("正在扫描并删除空目录...");
     try {
         const deleted = await invoke<string[]>('delete_empty_dirs', { path: currentDir.value });
         if (deleted.length === 0) {
             appendLog("未发现空目录。");
         } else {
-            for (const path of deleted) {
+            const batchSize = 100;
-                appendLog(`已删除: ${path}`);
+            for (let i = 0; i < deleted.length; i += batchSize) {
-                await new Promise(resolve => setTimeout(resolve, 50)); // Small delay for buffering effect
+                const batch = deleted.slice(i, i + batchSize).map(p => `已删除: ${p}`);
+                appendLogs(batch);
+                await new Promise(resolve => setTimeout(resolve, 50)); // Small delay for rendering
             }
             appendLog(`删除完毕，共删除 ${deleted.length} 个空目录。`);
         }
@@ -249,7 +260,7 @@ const handleDeleteEmptyDirs = async () => {
 }
 
 const handleCheckNaming = async () => {
-    appendLog("---" + " 检查命名操作 @ " + new Date().toLocaleString() + " ---");
+    appendLog("\n" + "=".repeat(20));
     appendLog(`正在检查文件命名，前缀要求: ${videoNamePrefix.value} ...`);
     try {
         const mismatches = await invoke<string[]>('check_file_naming', { 
@@ -261,17 +272,23 @@ const handleCheckNaming = async () => {
             appendLog("检查完毕，所有文件均符合命名规范。");
         } else {
             appendLog(`发现 ${mismatches.length} 个文件不符合规范:`);
-            // Simple tree view simulation
-            // Sort to group by dir
             mismatches.sort();
-            mismatches.forEach(path => {
+            
-                // Determine relative path to show cleaner tree-like structure
+            // Format logs first
+            const formattedLogs = mismatches.map(path => {
                 let displayPath = path;
                 if (path.startsWith(currentDir.value)) {
                     displayPath = "." + path.substring(currentDir.value.length);
                 }
-                appendLog(displayPath);
+                return displayPath;
             });
+
+             const batchSize = 100;
+             for (let i = 0; i < formattedLogs.length; i += batchSize) {
+                 const batch = formattedLogs.slice(i, i + batchSize);
+                 appendLogs(batch);
+                 await new Promise(resolve => setTimeout(resolve, 50)); 
+             }
         }
     } catch (e) {
         appendLog(`错误: ${e}`);
@@ -526,7 +543,7 @@ watch(currentDir, (newPath) => {
       </div>
 
       <!-- Check Page -->
-      <div v-else-if="activeMenu === 'check'" style="display: flex; flex-direction: column; height: 100%;">
+      <div v-else-if="activeMenu === 'check'" style="display: flex; flex-direction: column; height: 100%; overflow: hidden;">
         <h2>检查</h2>
 
         <el-alert
@@ -538,7 +555,7 @@ watch(currentDir, (newPath) => {
             style="margin-bottom: 20px"
         />
 
-        <div :class="{ 'disabled-area': isReviewDisabled }" style="display: flex; flex-direction: column; flex-grow: 1;">
+        <div :class="{ 'disabled-area': isReviewDisabled }" style="display: flex; flex-direction: column; flex-grow: 1; overflow: hidden;">
             <div class="check-actions">
                 <el-button type="danger" :icon="Delete" @click="handleDeleteEmptyDirs">删除空目录</el-button>
                 <el-button type="primary" :icon="Refresh" @click="handleCheckNaming">检查命名</el-button>
@@ -691,6 +708,7 @@ body {
     display: flex;
     flex-direction: column;
     flex-grow: 1; /* Make it fill available height */
+    overflow: hidden; /* Prevent container from expanding beyond parent */
 }
 .log-header {
     padding: 10px 15px;