From 9dd2d4a1fc8ec31f402d249396426ba9ec6a41bd Mon Sep 17 00:00:00 2001
From: lanyuanxiaoyao <lanyuanxiaoyao@gmail.com>
Date: Sun, 19 Apr 2026 15:19:26 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E6=89=A9=E5=B1=95=E5=B7=A5=E4=BD=9C?=
 =?UTF-8?q?=E7=A9=BA=E9=97=B4=E4=BE=A7=E8=BE=B9=E6=A0=8F=E5=AE=BD=E5=BA=A6?=
 =?UTF-8?q?=E7=BA=A6=E6=9D=9F=E5=B9=B6=E7=BB=9F=E4=B8=80=E6=8B=96=E5=8A=A8?=
 =?UTF-8?q?=E6=89=8B=E6=9F=84=E6=A0=B7=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 侧边栏最大宽度从 800px 扩展至 1200px（含动态计算）
- 文件树最小宽度从 180px 提升至 300px
- 文件树最大宽度扩展为侧边栏宽度
- 预览关闭时文件树自动占满侧边栏，分隔线隐藏
- 外部拖动手柄改为与内部分隔线一致的样式（1px、hover 变色）
---
 src/components/workspace/WorkspaceSidebar.jsx | 30 ++++++------
 src/styles/components/workspace/_index.scss   | 49 +++++++------------
 2 files changed, 35 insertions(+), 44 deletions(-)

diff --git a/src/components/workspace/WorkspaceSidebar.jsx b/src/components/workspace/WorkspaceSidebar.jsx
index 9b28638..6abd949 100644
--- a/src/components/workspace/WorkspaceSidebar.jsx
+++ b/src/components/workspace/WorkspaceSidebar.jsx
@@ -82,7 +82,8 @@ function WorkspaceSidebar({ isOpen, onClose }) {
                 if (isResizingSidebarRef.current) {
                     setSidebarWidth(prev => {
                         const newWidth = prev - deltaX;  // 注意：向左拖动是负数
-                        return Math.max(400, Math.min(800, newWidth));
+                        const maxWidth = Math.min(1200, window.innerWidth - 480);
+                        return Math.max(400, Math.min(maxWidth, newWidth));
                     });
                 }
 
@@ -90,7 +91,9 @@ function WorkspaceSidebar({ isOpen, onClose }) {
                 if (isResizingTreeRef.current) {
                     setFileTreeWidth(prev => {
                         const newWidth = prev + deltaX;
-                        return Math.max(180, Math.min(300, newWidth));
+                        const minWidth = 300;
+                        const maxWidth = previewFile ? sidebarWidth - 32 : sidebarWidth;
+                        return Math.max(minWidth, Math.min(maxWidth, newWidth));
                     });
                 }
             });
@@ -368,7 +371,10 @@ function WorkspaceSidebar({ isOpen, onClose }) {
                     {/* FileTree */}
                     <div
                         className="workspace-sidebar__file-tree"
-                        style={{ width: `${fileTreeWidth}px` }}
+                        style={{
+                            width: previewFile ? `${fileTreeWidth}px` : 'auto',
+                            flex: previewFile ? 'none' : '1'
+                        }}
                     >
                         <FileTree
                             onFileClick={handleFileClick}
@@ -377,10 +383,12 @@ function WorkspaceSidebar({ isOpen, onClose }) {
                     </div>
 
                     {/* 分隔线（可拖动调整） */}
-                    <div
-                        className="workspace-sidebar__divider"
-                        onMouseDown={handleDividerMouseDown}
-                    />
+                    {previewFile && (
+                        <div
+                            className="workspace-sidebar__divider"
+                            onMouseDown={handleDividerMouseDown}
+                        />
+                    )}
 
                     {/* Preview Panel */}
                     {previewFile && (
@@ -397,13 +405,7 @@ function WorkspaceSidebar({ isOpen, onClose }) {
                 <div
                     className="workspace-sidebar__resize-handle"
                     onMouseDown={handleSidebarMouseDown}
-                >
-                    <div className="workspace-sidebar__resize-lines">
-                        <div></div>
-                        <div></div>
-                        <div></div>
-                    </div>
-                </div>
+                />
             </div>
 
             {/* 右键菜单 */}
diff --git a/src/styles/components/workspace/_index.scss b/src/styles/components/workspace/_index.scss
index d68d135..c4a3874 100644
--- a/src/styles/components/workspace/_index.scss
+++ b/src/styles/components/workspace/_index.scss
@@ -6,7 +6,7 @@
 .workspace-sidebar {
     width: 500px;
     min-width: 400px;
-    max-width: 800px;
+    max-width: 1200px;
     background: var(--color-bg-2);
     border-left: 1px solid var(--color-border-2);
     display: flex;
@@ -131,8 +131,8 @@
 
     // ========== FileTree ==========
     &__file-tree {
-        min-width: 180px;
-        max-width: 300px;
+        min-width: 300px;
+        max-width: 100%;
         flex-shrink: 0;
         overflow-y: auto;
         padding: 8px;
@@ -177,39 +177,28 @@
     &__resize-handle {
         position: absolute;
         left: 0;
-        top: 50%;
-        transform: translateY(-50%);
-        width: 12px;
-        height: 48px;
-        display: flex;
-        align-items: center;
-        justify-content: center;
+        top: 0;
+        bottom: 0;
+        width: 1px;
+        background: var(--color-border-2);
         cursor: ew-resize;
-        opacity: 0.5;
-        transition: opacity 0.2s;
+        transition: background 0.2s;
         z-index: 10;
 
+        &::before {
+            content: '';
+            position: absolute;
+            top: 0;
+            left: -4px;
+            right: -4px;
+            bottom: 0;
+            cursor: ew-resize;
+        }
+
         &:hover {
-            opacity: 1;
+            background: var(--color-primary);
         }
     }
-
-    &__resize-lines {
-        display: flex;
-        flex-direction: column;
-        gap: 2px;
-
-        div {
-            width: 4px;
-            height: 2px;
-            background: var(--color-text-3);
-            border-radius: 1px;
-        }
-    }
-
-    &__resize-handle:hover &__resize-lines div {
-        background: var(--color-text-1);
-    }
 }
 
 // 工作空间展开按钮