diff --git a/packages/backend/src/settings/settings.controller.ts b/packages/backend/src/settings/settings.controller.ts
index 103c941..b47fb4c 100644
--- a/packages/backend/src/settings/settings.controller.ts
+++ b/packages/backend/src/settings/settings.controller.ts
@@ -37,8 +37,8 @@ export const settingsController = {
           'autoCopyOnSelect', 'dockerStatusIntervalSeconds', 'dockerDefaultExpand',
           'statusMonitorIntervalSeconds', // +++ 添加状态监控间隔键 +++
           'workspaceSidebarPersistent', // +++ 添加侧边栏固定键 +++
-          'leftSidebarWidth', // +++ 添加左侧栏宽度键 +++
-          'rightSidebarWidth' // +++ 添加右侧栏宽度键 +++
+          'sidebarPaneWidths' // +++ 添加侧边栏宽度对象键 +++
+          // --- REMOVED old width keys ---
       ];
       const filteredSettings: Record<string, string> = {};
       for (const key in settingsToUpdate) {
diff --git a/packages/frontend/src/components/LayoutRenderer.vue b/packages/frontend/src/components/LayoutRenderer.vue
index d916468..bdecc7d 100644
--- a/packages/frontend/src/components/LayoutRenderer.vue
+++ b/packages/frontend/src/components/LayoutRenderer.vue
@@ -72,7 +72,7 @@ const fileEditorStore = useFileEditorStore(); // <-- Initialize FileEditorStore
 const settingsStore = useSettingsStore(); // +++ Initialize SettingsStore +++
 const { t } = useI18n(); // <-- Get translation function
 const { activeSession } = storeToRefs(sessionStore);
-const { workspaceSidebarPersistentBoolean, leftSidebarWidthPx, rightSidebarWidthPx } = storeToRefs(settingsStore); // +++ Get sidebar setting and width getters +++
+const { workspaceSidebarPersistentBoolean, getSidebarPaneWidth } = storeToRefs(settingsStore); // +++ Get sidebar setting and width getter +++
 const { sidebarPanes } = storeToRefs(layoutStore);
 const { orderedTabs: editorTabsFromStore, activeTabId: activeEditorTabIdFromStore } = storeToRefs(fileEditorStore); // <-- Get editor state
 
@@ -400,7 +400,10 @@ onMounted(() => {
     side: 'left',
     onResizeEnd: (newWidth) => {
       console.log(`Left sidebar resize ended. New width: ${newWidth}px`);
-      settingsStore.updateSetting('leftSidebarWidth', `${newWidth}px`);
+      // +++ Update specific pane width +++
+      if (activeLeftSidebarPane.value) {
+        settingsStore.updateSidebarPaneWidth(activeLeftSidebarPane.value, `${newWidth}px`);
+      }
     },
   });
 
@@ -411,7 +414,10 @@ onMounted(() => {
     side: 'right',
     onResizeEnd: (newWidth) => {
       console.log(`Right sidebar resize ended. New width: ${newWidth}px`);
-      settingsStore.updateSetting('rightSidebarWidth', `${newWidth}px`);
+      // +++ Update specific pane width +++
+      if (activeRightSidebarPane.value) {
+        settingsStore.updateSidebarPaneWidth(activeRightSidebarPane.value, `${newWidth}px`);
+      }
     },
   });
 });
@@ -584,7 +590,7 @@ onMounted(() => {
     ></div>
 
     <!-- Left Sidebar Panel -->
-    <div ref="leftSidebarPanelRef" :class="['sidebar-panel', 'left-sidebar-panel', { active: !!activeLeftSidebarPane }]" :style="{ width: leftSidebarWidthPx }"> <!-- +++ Add ref and bind width +++ -->
+    <div ref="leftSidebarPanelRef" :class="['sidebar-panel', 'left-sidebar-panel', { active: !!activeLeftSidebarPane }]" :style="{ width: getSidebarPaneWidth(activeLeftSidebarPane) }"> <!-- +++ Use getter for width +++ -->
         <div ref="leftResizeHandleRef" class="resize-handle left-handle"></div> <!-- +++ Left Handle +++ -->
         <button class="close-sidebar-btn" @click="closeSidebars" title="Close Sidebar">&times;</button>
         <component
@@ -612,7 +618,7 @@ onMounted(() => {
     </div>
 
     <!-- Right Sidebar Panel -->
-     <div ref="rightSidebarPanelRef" :class="['sidebar-panel', 'right-sidebar-panel', { active: !!activeRightSidebarPane }]" :style="{ width: rightSidebarWidthPx }"> <!-- +++ Add ref and bind width +++ -->
+     <div ref="rightSidebarPanelRef" :class="['sidebar-panel', 'right-sidebar-panel', { active: !!activeRightSidebarPane }]" :style="{ width: getSidebarPaneWidth(activeRightSidebarPane) }"> <!-- +++ Use getter for width +++ -->
         <div ref="rightResizeHandleRef" class="resize-handle right-handle"></div> <!-- +++ Right Handle +++ -->
         <button class="close-sidebar-btn" @click="closeSidebars" title="Close Sidebar">&times;</button>
         <component
diff --git a/packages/frontend/src/stores/settings.store.ts b/packages/frontend/src/stores/settings.store.ts
index 2d4a7ca..2b8df11 100644
--- a/packages/frontend/src/stores/settings.store.ts
+++ b/packages/frontend/src/stores/settings.store.ts
@@ -2,6 +2,7 @@ import { defineStore } from 'pinia';
 import apiClient from '../utils/apiClient'; // 使用统一的 apiClient
 import { ref, computed } from 'vue'; // 移除 watch
 import i18n, { setLocale, defaultLng } from '../i18n'; // Import i18n instance and setLocale
+import type { PaneName } from './layout.store'; // +++ Import PaneName type +++
 // 移除 ITheme 和默认主题定义，这些移到 appearance.store.ts
 
 // 定义通用设置状态类型
@@ -18,8 +19,7 @@ interface SettingsState {
   dockerDefaultExpand?: string; // NEW: Docker 默认展开详情 'true' or 'false'
   statusMonitorIntervalSeconds?: string; // NEW: 状态监控轮询间隔 (秒)
   workspaceSidebarPersistent?: string; // NEW: 工作区侧边栏是否固定 'true' or 'false'
-  leftSidebarWidth?: string; // NEW: 左侧边栏宽度 (e.g., '350px')
-  rightSidebarWidth?: string; // NEW: 右侧边栏宽度 (e.g., '350px')
+  sidebarPaneWidths?: string; // NEW: 存储各侧边栏组件宽度的 JSON 字符串
  // Add other general settings keys here as needed
  [key: string]: string | undefined; // Allow other string settings
 }
@@ -28,6 +28,7 @@ interface SettingsState {
 export const useSettingsStore = defineStore('settings', () => {
   // --- State ---
   const settings = ref<Partial<SettingsState>>({}); // 通用设置状态
+  const parsedSidebarPaneWidths = ref<Record<string, string>>({}); // NEW: 解析后的侧边栏宽度对象
   const isLoading = ref(false);
   const error = ref<string | null>(null);
   // 移除外观相关状态: isStyleCustomizerVisible, currentUiTheme, currentXtermTheme
@@ -86,13 +87,33 @@ export const useSettingsStore = defineStore('settings', () => {
       if (settings.value.workspaceSidebarPersistent === undefined) {
           settings.value.workspaceSidebarPersistent = 'false'; // 默认不固定
       }
-      // NEW: Sidebar width defaults
-      if (settings.value.leftSidebarWidth === undefined) {
-          settings.value.leftSidebarWidth = '350px'; // 默认宽度
-      }
-      if (settings.value.rightSidebarWidth === undefined) {
-          settings.value.rightSidebarWidth = '350px'; // 默认宽度
+      // NEW: Load and parse sidebar pane widths
+      const defaultPaneWidth = '350px';
+      // +++ Ensure PaneName type is available or define it here +++
+      const knownPanes: PaneName[] = ['connections', 'fileManager', 'editor', 'statusMonitor', 'commandHistory', 'quickCommands', 'dockerManager']; // Add all possible sidebar panes
+      let loadedWidths: Record<string, string> = {};
+      try {
+          if (settings.value.sidebarPaneWidths) {
+              loadedWidths = JSON.parse(settings.value.sidebarPaneWidths);
+              if (typeof loadedWidths !== 'object' || loadedWidths === null) {
+                  console.warn('[SettingsStore] Invalid sidebarPaneWidths format loaded, resetting.');
+                  loadedWidths = {};
+              }
+          }
+      } catch (e) {
+          console.error('[SettingsStore] Failed to parse sidebarPaneWidths, resetting.', e);
+          loadedWidths = {};
       }
+      // Ensure defaults for all known panes
+      const finalWidths: Record<string, string> = {};
+      knownPanes.forEach(pane => {
+          finalWidths[pane] = loadedWidths[pane] || defaultPaneWidth;
+      });
+      parsedSidebarPaneWidths.value = finalWidths;
+      // Optionally save back if defaults were added (might cause extra write on first load)
+      // if (Object.keys(loadedWidths).length !== Object.keys(finalWidths).length) {
+      //     await updateSetting('sidebarPaneWidths', JSON.stringify(finalWidths));
+      // }
 
       // --- 语言设置 ---
       const langFromSettings = settings.value.language;
@@ -145,8 +166,7 @@ export const useSettingsStore = defineStore('settings', () => {
         'autoCopyOnSelect', 'dockerStatusIntervalSeconds', 'dockerDefaultExpand',
         'statusMonitorIntervalSeconds', // +++ 添加状态监控间隔键 +++
         'workspaceSidebarPersistent', // +++ 添加侧边栏固定键 +++
-        'leftSidebarWidth', // +++ 添加左侧栏宽度键 +++
-        'rightSidebarWidth' // +++ 添加右侧栏宽度键 +++
+        'sidebarPaneWidths' // +++ 添加侧边栏宽度对象键 +++
     ];
     if (!allowedKeys.includes(key)) {
         console.error(`[SettingsStore] 尝试更新不允许的设置键: ${key}`);
@@ -182,8 +202,7 @@ export const useSettingsStore = defineStore('settings', () => {
         'autoCopyOnSelect', 'dockerStatusIntervalSeconds', 'dockerDefaultExpand',
         'statusMonitorIntervalSeconds', // +++ 添加状态监控间隔键 +++
         'workspaceSidebarPersistent', // +++ 添加侧边栏固定键 +++
-        'leftSidebarWidth', // +++ 添加左侧栏宽度键 +++
-        'rightSidebarWidth' // +++ 添加右侧栏宽度键 +++
+        'sidebarPaneWidths' // +++ 添加侧边栏宽度对象键 +++
     ];
     const filteredUpdates: Partial<SettingsState> = {};
     let languageUpdate: 'en' | 'zh' | undefined = undefined;
@@ -197,7 +216,7 @@ export const useSettingsStore = defineStore('settings', () => {
         } else {
              console.warn(`[SettingsStore] 尝试批量更新不允许的设置键: ${key}`);
         }
-    }
+      }
 
     if (Object.keys(filteredUpdates).length === 0) {
         console.log('[SettingsStore] 没有有效的通用设置需要更新。');
@@ -221,6 +240,23 @@ export const useSettingsStore = defineStore('settings', () => {
     }
   }
 
+  /**
+   * Updates the width for a specific sidebar pane.
+   * @param paneName The name of the pane (component).
+   * @param width The new width string (e.g., '400px').
+   */
+  async function updateSidebarPaneWidth(paneName: PaneName, width: string) {
+    if (!paneName) return;
+    const newWidths = { ...parsedSidebarPaneWidths.value, [paneName]: width };
+    parsedSidebarPaneWidths.value = newWidths; // Update local reactive state first
+    try {
+      await updateSetting('sidebarPaneWidths', JSON.stringify(newWidths));
+    } catch (error) {
+      console.error(`[SettingsStore] Failed to save sidebarPaneWidths after updating ${paneName}:`, error);
+      // Optionally revert local state or show error to user
+    }
+  }
+
   // 移除外观相关 actions: saveCustomThemes, resetCustomThemes, toggleStyleCustomizer
 
   // --- Getters ---
@@ -250,11 +286,14 @@ export const useSettingsStore = defineStore('settings', () => {
       return settings.value.workspaceSidebarPersistent === 'true';
   });
 
-  // NEW: Getter for left sidebar width
-  const leftSidebarWidthPx = computed(() => settings.value.leftSidebarWidth || '350px');
-
-  // NEW: Getter for right sidebar width
-  const rightSidebarWidthPx = computed(() => settings.value.rightSidebarWidth || '350px');
+  // NEW: Getter to get width for a specific sidebar pane
+  const getSidebarPaneWidth = computed(() => (paneName: PaneName | null): string => {
+    const defaultWidth = '350px';
+    if (!paneName) return defaultWidth;
+    // Ensure parsedSidebarPaneWidths.value is accessed correctly
+    const widths = parsedSidebarPaneWidths.value || {};
+    return widths[paneName] || defaultWidth;
+  });
 
   // NEW: Getter for Docker default expand setting, returning boolean
   const dockerDefaultExpandBoolean = computed(() => {
@@ -279,11 +318,11 @@ export const useSettingsStore = defineStore('settings', () => {
     dockerDefaultExpandBoolean, // +++ 暴露 Docker 默认展开 getter +++
     statusMonitorIntervalSecondsNumber, // +++ 暴露状态监控间隔 getter +++
     workspaceSidebarPersistentBoolean, // +++ 暴露侧边栏固定 getter +++
-    leftSidebarWidthPx, // +++ 暴露左侧栏宽度 getter +++
-    rightSidebarWidthPx, // +++ 暴露右侧栏宽度 getter +++
+    getSidebarPaneWidth, // +++ 暴露获取特定面板宽度的 getter +++
     // 移除外观相关的 getters 和 actions
     loadInitialSettings,
     updateSetting,
     updateMultipleSettings,
+    updateSidebarPaneWidth, // +++ 暴露更新特定面板宽度的 action +++
   };
 });