src/frontend/src/components/NavBar.vue

@@ -14,7 +14,7 @@ const emit = defineEmits(['navigate', 'logout', 'toggle'])
 
 const isDarkMode = ref(true)
 const savedState = localStorage.getItem('kt_nav_expanded')
-const isExpanded = ref(savedState === 'true' && savedState !== null ? true : false)
+const isExpanded = ref(savedState === 'true' && typeof window !== 'undefined' && window.innerWidth > 900)
 
 // DOM Refs
 const navButtonRefs = ref([]) // 存储所有导航按钮的 DOM 元素
@@ -83,6 +83,19 @@ watch(() => props.currentSection, () => {
 // ResizeObserver: 监听容器尺寸变化（比 window.resize 更灵敏，能捕捉缩放）
 let resizeObserver = null
 
+
+// === 统一的窗口缩放处理函数 ===
+const handleWindowResize = () => {
+  // 1. 更新高亮条位置 (原有逻辑)
+  updateHighlightPosition()
+  
+  // 2. 响应式检查：如果屏幕变窄(<=900px)且当前是展开状态，强制收起
+  if (window.innerWidth <= 900 && isExpanded.value) {
+    isExpanded.value = false
+  }
+}
+
+
 onMounted(() => {
   const savedTheme = localStorage.getItem('theme')
   if (savedTheme === 'light') {
@@ -105,13 +118,13 @@ onMounted(() => {
       resizeObserver.observe(navContainerRef.value)
     }
     // 同时监听 window resize 作为双重保障
-    window.addEventListener('resize', updateHighlightPosition)
+    window.addEventListener('resize', handleWindowResize)
   })
 })
 
 onUnmounted(() => {
   if (resizeObserver) resizeObserver.disconnect()
-  window.removeEventListener('resize', updateHighlightPosition)
+  window.removeEventListener('resize', handleWindowResize)
 })
 
 const handleNavClick = (id) => { emit('navigate', id) }

src/frontend/src/views/MainFlow.vue

@@ -309,8 +309,9 @@ onMounted(() => {
   // 添加可见性监听
   document.addEventListener('visibilitychange', handleVisibilityChange)
 
+  
   const savedNavState = localStorage.getItem('kt_nav_expanded')
-  if (savedNavState === 'true') {
+  if (savedNavState === 'true' && window.innerWidth > 900) {
      setTimeout(() => {
         handleNavToggle(true) 
      }, 200) 

src/frontend/src/views/Page4/Page4.vue

@@ -135,7 +135,7 @@
                 </button>
 
                 <button 
-                  v-if="['pending','waiting','processing','running'].includes(task.status)" 
+                  v-if="['pending','waiting'].includes(task.status)" 
                   class="kt-action-btn kt-action-btn--danger" 
                   title="取消任务"
                   @click="handleCancel(task)"