diff --git a/src/pages/ideContainer/logBar.tsx b/src/pages/ideContainer/logBar.tsx index c886421..24a05f5 100644 --- a/src/pages/ideContainer/logBar.tsx +++ b/src/pages/ideContainer/logBar.tsx @@ -1,11 +1,9 @@ import React, { useState } from 'react'; -import { ResizeBox } from '@arco-design/web-react'; +import { ResizeBox, Tabs } from '@arco-design/web-react'; import styles from './style/logBar.module.less'; -import { Tabs, Typography } from '@arco-design/web-react'; const TabPane = Tabs.TabPane; - interface LogBarProps { a?: string; } @@ -34,9 +32,22 @@ const data = [ ]; const LogBar: React.FC = () => { - const [tabs, setTabs] = useState(data); + const [tabs] = useState(data); const [activeTab, setActiveTab] = useState('1'); + const [collapsed, setCollapsed] = useState(true); // 添加收起状态,默认为收起 + // 处理 Tab 点击事件 + const handleTabClick = (key: string) => { + // 如果点击当前激活的 tab,则切换收起状态 + if (key === activeTab) { + setCollapsed(!collapsed); + } + else { + // 如果点击的是其他 tab,则切换到该 tab 并展开 + setActiveTab(key); + setCollapsed(false); + } + }; return ( <> @@ -44,15 +55,15 @@ const LogBar: React.FC = () => { className={styles.logBar} directions={['top']} style={{ - height: 250 + height: collapsed ? 40 : 250 // 收起时只显示 tab 高度,展开时显示完整高度 }} > - {tabs.map((x, i) => ( + {tabs.map((x) => ( {x.content}