refactor(ideContainer): 优化日志栏收起逻辑

- 添加引用 ResizeBox 容器，用于手动调整大小
- 使用 useEffect 直接更新元素样式，当收起状态改变时
- 实现 handleResize 函数，同步更新收起状态
- 调整日志栏高度的字符串表示，提高代码可读性

src/pages/ideContainer/logBar.tsx

@@ -1,4 +1,4 @@
-import React, { useState } from 'react';
+import React, { useState, useRef, useEffect } from 'react';
 import { ResizeBox, Tabs } from '@arco-design/web-react';
 import styles from './style/logBar.module.less';
 
@@ -34,7 +34,8 @@ const data = [
 const LogBar: React.FC<LogBarProps> = () => {
   const [tabs] = useState(data);
   const [activeTab, setActiveTab] = useState('1');
-  const [collapsed, setCollapsed] = useState(true); // 添加收起状态，默认为收起
+  const [collapsed, setCollapsed] = useState(true);
+  const resizeBoxRef = useRef<HTMLDivElement>(null); // 引用 ResizeBox 容器
 
   // 处理 Tab 点击事件
   const handleTabClick = (key: string) => {
@@ -49,19 +50,39 @@ const LogBar: React.FC<LogBarProps> = () => {
     }
   };
 
+  // 当 collapsed 状态改变时，直接更新元素的样式
+  useEffect(() => {
+    if (resizeBoxRef.current) {
+      resizeBoxRef.current.style.height = collapsed ? '40px' : '250px';
+    }
+  }, [collapsed]);
+
+  // 处理 ResizeBox 手动调整大小事件
+  const handleResize = (e: number, size) => {
+    // 当高度接近收起状态的高度时，同步更新 collapsed 状态
+    if (size.height <= 40) {
+      setCollapsed(true);
+    }
+    else {
+      setCollapsed(false);
+    }
+  };
+
   return (
     <>
       <ResizeBox
+        ref={resizeBoxRef}
         className={styles.logBar}
         directions={['top']}
         style={{
-          height: collapsed ? 40 : 250 // 收起时只显示 tab 高度，展开时显示完整高度
+          height: collapsed ? '40px' : '250px'
         }}
+        onMoving={handleResize}
       >
         <Tabs
           type="card-gutter"
           activeTab={activeTab}
-          onClickTab={handleTabClick} // 使用自定义点击处理函数
+          onClickTab={handleTabClick}
         >
           {tabs.map((x) => (
             <TabPane destroyOnHide key={x.key} title={x.title}>