update
This commit is contained in:
47
frontend/src/components/layout/Tabs.tsx
Normal file
47
frontend/src/components/layout/Tabs.tsx
Normal file
@@ -0,0 +1,47 @@
|
||||
import React from 'react';
|
||||
import { useTheme, useApp } from '../../contexts';
|
||||
|
||||
const tabs = [
|
||||
{ id: 'docs', label: '文档管理' },
|
||||
{ id: 'compliance', label: '合规分析' },
|
||||
{ id: 'status', label: '系统状态' },
|
||||
{ id: 'rag', label: '法规对话' },
|
||||
];
|
||||
|
||||
export const Tabs: React.FC = () => {
|
||||
const { theme } = useTheme();
|
||||
const { activeTab, setActiveTab } = useApp();
|
||||
|
||||
return (
|
||||
<nav
|
||||
className="h-[56px] flex items-center"
|
||||
style={{
|
||||
padding: '0 48px',
|
||||
borderBottom: `1px solid ${theme.border}`,
|
||||
backgroundColor: theme.bg,
|
||||
}}
|
||||
>
|
||||
{tabs.map((tab) => (
|
||||
<button
|
||||
key={tab.id}
|
||||
onClick={() => setActiveTab(tab.id as any)}
|
||||
style={{
|
||||
height: 56,
|
||||
padding: '0 32px',
|
||||
fontSize: 15,
|
||||
fontWeight: activeTab === tab.id ? 600 : 400,
|
||||
color: activeTab === tab.id ? theme.accent : theme.text3,
|
||||
background: 'transparent',
|
||||
border: 'none',
|
||||
borderBottom: activeTab === tab.id ? `3px solid ${theme.accent}` : '3px solid transparent',
|
||||
marginBottom: -1,
|
||||
cursor: 'pointer',
|
||||
transition: 'all 0.2s ease',
|
||||
}}
|
||||
>
|
||||
{tab.label}
|
||||
</button>
|
||||
))}
|
||||
</nav>
|
||||
);
|
||||
};
|
||||
Reference in New Issue
Block a user