refactor: 将纵向/横向布局按钮从Toolbar移至EPLAN导入面板

- 从Toolbar移除布局切换按钮, 简化顶部UI
- 在EPLAN导入面板中新增自动布局区域(纵向/横向)
- 清理Toolbar中不再使用的autoLayout/layoutDirection引用

src/components/Sidebar/Sidebar.jsx

@@ -8,7 +8,7 @@
 import { useState, useCallback, useRef } from 'react';
 import useFlowStore from '../../hooks/useFlowStore';
 import useComponentLibrary from '../../hooks/useComponentLibrary';
-import { FUNCTION_CODE_MAP, DEVICE_CATEGORIES } from '../../utils/constants';
+import { FUNCTION_CODE_MAP, DEVICE_CATEGORIES, LAYOUT_DIRECTION } from '../../utils/constants';
 import MODEL_MAP_DEFAULT, { getAllMappings } from '../../utils/modelMapping';
 import styles from './Sidebar.module.css';
 
@@ -37,6 +37,8 @@ export default function Sidebar() {
     isLoading,
     error,
     nodes,
+    autoLayout,
+    layoutDirection,
     edges,
   } = useFlowStore();
 
@@ -173,6 +175,33 @@ export default function Sidebar() {
 
             {error && <div className={styles.error}>{error}</div>}
 
+            {/* 布局方向 */}
+            <div className={styles.sectionTitle} style={{ marginTop: 16 }}>自动布局</div>
+            <div style={{ display: 'flex', gap: 8 }}>
+              <button
+                className={`${styles.importBtn} ${layoutDirection === LAYOUT_DIRECTION.TB ? '' : ''}`}
+                style={{
+                  flex: 1,
+                  background: layoutDirection === LAYOUT_DIRECTION.TB ? '#6366f1' : '#1a1a2e',
+                  border: '1px solid #2a2a3a',
+                }}
+                onClick={() => autoLayout(LAYOUT_DIRECTION.TB)}
+              >
+                &#8597; 纵向
+              </button>
+              <button
+                className={`${styles.importBtn}`}
+                style={{
+                  flex: 1,
+                  background: layoutDirection === LAYOUT_DIRECTION.LR ? '#6366f1' : '#1a1a2e',
+                  border: '1px solid #2a2a3a',
+                }}
+                onClick={() => autoLayout(LAYOUT_DIRECTION.LR)}
+              >
+                &#8596; 横向
+              </button>
+            </div>
+
             <div className={styles.stats}>
               <span>节点: {nodes.length}</span>
               <span>连接: {edges.length}</span>

src/components/Toolbar/Toolbar.jsx

@@ -4,7 +4,6 @@
  */
 import { useCallback, useRef } from 'react';
 import useFlowStore from '../../hooks/useFlowStore';
-import { LAYOUT_DIRECTION } from '../../utils/constants';
 import { downloadModelicaFile } from '../../utils/modelicaExporter';
 import styles from './Toolbar.module.css';
 import useComponentLibrary from '../../hooks/useComponentLibrary';
@@ -12,8 +11,6 @@ import useComponentLibrary from '../../hooks/useComponentLibrary';
 export default function Toolbar() {
   const jsonInputRef = useRef(null);
   const {
-    autoLayout,
-    layoutDirection,
     clearAll,
     exportToJSON,
     importFromJSON,
@@ -24,13 +21,6 @@ export default function Toolbar() {
     nodes,
   } = useFlowStore();
 
-  const handleLayoutTB = useCallback(() => {
-    autoLayout(LAYOUT_DIRECTION.TB);
-  }, [autoLayout]);
-
-  const handleLayoutLR = useCallback(() => {
-    autoLayout(LAYOUT_DIRECTION.LR);
-  }, [autoLayout]);
 
   const handleExportJSON = useCallback(() => {
     const json = exportToJSON();
@@ -96,26 +86,6 @@ export default function Toolbar() {
 
       <div className={styles.divider} />
 
-      <div className={styles.group}>
-        <span className={styles.groupLabel}>布局</span>
-        <button
-          className={`${styles.btn} ${layoutDirection === LAYOUT_DIRECTION.TB ? styles.active : ''}`}
-          onClick={handleLayoutTB}
-          title="纵向布局（拓扑图）"
-        >
-          &#8597; 纵向
-        </button>
-        <button
-          className={`${styles.btn} ${layoutDirection === LAYOUT_DIRECTION.LR ? styles.active : ''}`}
-          onClick={handleLayoutLR}
-          title="横向布局（连接图）"
-        >
-          &#8596; 横向
-        </button>
-      </div>
-
-      <div className={styles.divider} />
-
       <div className={styles.group}>
         <button
           className={`${styles.btn} ${useComponentLibrary.getState().currentView === 'editor' ? styles.active : ''}`}