feat(frontend): restructure admin menu into two-level groups and add intelligent-eval entry
Some checks failed
CI / test (push) Failing after 50s
Some checks failed
CI / test (push) Failing after 50s
Reorganize the sidebar into top-level items plus four groups (静态评估 / 智能评估 / 配置中心 / 系统), add the /intelligent-evals route with a placeholder page, and tune the expanded-submenu background so nested groups sit harmoniously on the dark sider.
This commit is contained in:
parent
1317552701
commit
da6ccc265d
@ -13,6 +13,10 @@ import {
|
||||
CloudServerOutlined,
|
||||
ScheduleOutlined,
|
||||
LogoutOutlined,
|
||||
BulbOutlined,
|
||||
ExperimentOutlined,
|
||||
SettingOutlined,
|
||||
ToolOutlined,
|
||||
} from '@ant-design/icons'
|
||||
import TabBar from './components/TabBar'
|
||||
import LoginPage from './pages/Login'
|
||||
@ -33,6 +37,7 @@ const CampaignsPage = lazy(() => import('./pages/Campaigns'))
|
||||
const OpenClawPage = lazy(() => import('./pages/OpenClaw'))
|
||||
const FilesPage = lazy(() => import('./pages/Files'))
|
||||
const ModelConfigsPage = lazy(() => import('./pages/ModelConfigs'))
|
||||
const IntelligentEvalsPage = lazy(() => import('./pages/IntelligentEvals'))
|
||||
|
||||
function PageLoader({ children }: { children: ReactNode }) {
|
||||
return (
|
||||
@ -55,24 +60,60 @@ interface RouteConfig {
|
||||
|
||||
const routeConfigs: RouteConfig[] = [
|
||||
{ path: '/', name: '仪表盘', icon: <DashboardOutlined />, component: () => <PageLoader><HomePage /></PageLoader> },
|
||||
{ path: '/openclaw', name: 'AI 助手', icon: <RobotOutlined />, component: () => <PageLoader><OpenClawPage /></PageLoader> },
|
||||
{ path: '/targets', name: '评测对象', icon: <AimOutlined />, component: () => <PageLoader><TargetsPage /></PageLoader> },
|
||||
{ path: '/models', name: '模型配置', icon: <CloudServerOutlined />, component: () => <PageLoader><ModelConfigsPage /></PageLoader> },
|
||||
{ path: '/scenarios', name: '评测场景', icon: <FileTextOutlined />, component: () => <PageLoader><ScenariosPage /></PageLoader> },
|
||||
{ path: '/runs', name: '评测执行', icon: <PlayCircleOutlined />, component: () => <PageLoader><RunsPage /></PageLoader> },
|
||||
{ path: '/campaigns', name: '评估活动', icon: <ScheduleOutlined />, component: () => <PageLoader><CampaignsPage /></PageLoader> },
|
||||
{ path: '/reports', name: '评测报告', icon: <BarChartOutlined />, component: () => <PageLoader><ReportsPage /></PageLoader> },
|
||||
{ path: '/openclaw', name: 'AI 助手', icon: <RobotOutlined />, component: () => <PageLoader><OpenClawPage /></PageLoader> },
|
||||
{ path: '/intelligent-evals', name: '智能评估', icon: <BulbOutlined />, component: () => <PageLoader><IntelligentEvalsPage /></PageLoader> },
|
||||
{ path: '/models', name: '模型配置', icon: <CloudServerOutlined />, component: () => <PageLoader><ModelConfigsPage /></PageLoader> },
|
||||
{ path: '/files', name: '原始文件', icon: <FolderOpenOutlined />, component: () => <PageLoader><FilesPage /></PageLoader> },
|
||||
]
|
||||
|
||||
const componentMap: Record<string, () => ReactNode> = {}
|
||||
routeConfigs.forEach((r) => { componentMap[r.path] = r.component })
|
||||
|
||||
const menuItems: MenuProps['items'] = routeConfigs.map((r) => ({
|
||||
key: r.path,
|
||||
icon: r.icon,
|
||||
label: r.name,
|
||||
}))
|
||||
const menuItems: MenuProps['items'] = [
|
||||
{ key: '/', icon: <DashboardOutlined />, label: '仪表盘' },
|
||||
{ key: '/openclaw', icon: <RobotOutlined />, label: 'AI 助手' },
|
||||
{ key: '/targets', icon: <AimOutlined />, label: '评测对象' },
|
||||
{
|
||||
key: 'group-static',
|
||||
icon: <ExperimentOutlined />,
|
||||
label: '静态评估',
|
||||
children: [
|
||||
{ key: '/scenarios', icon: <FileTextOutlined />, label: '评测场景' },
|
||||
{ key: '/runs', icon: <PlayCircleOutlined />, label: '评测执行' },
|
||||
{ key: '/campaigns', icon: <ScheduleOutlined />, label: '评估活动' },
|
||||
{ key: '/reports', icon: <BarChartOutlined />, label: '评测报告' },
|
||||
],
|
||||
},
|
||||
{
|
||||
key: 'group-intelligent',
|
||||
icon: <BulbOutlined />,
|
||||
label: '智能评估',
|
||||
children: [
|
||||
{ key: '/intelligent-evals', icon: <BulbOutlined />, label: '评估列表' },
|
||||
],
|
||||
},
|
||||
{
|
||||
key: 'group-config',
|
||||
icon: <SettingOutlined />,
|
||||
label: '配置中心',
|
||||
children: [
|
||||
{ key: '/models', icon: <CloudServerOutlined />, label: '模型配置' },
|
||||
],
|
||||
},
|
||||
{
|
||||
key: 'group-system',
|
||||
icon: <ToolOutlined />,
|
||||
label: '系统',
|
||||
children: [
|
||||
{ key: '/files', icon: <FolderOpenOutlined />, label: '原始文件' },
|
||||
],
|
||||
},
|
||||
]
|
||||
|
||||
type AuthState = 'checking' | 'login' | 'ready'
|
||||
|
||||
@ -182,6 +223,7 @@ function App() {
|
||||
theme="dark"
|
||||
mode="inline"
|
||||
selectedKeys={[activeKey]}
|
||||
defaultOpenKeys={['group-static', 'group-intelligent', 'group-config', 'group-system']}
|
||||
items={menuItems}
|
||||
onClick={handleMenuClick}
|
||||
style={{
|
||||
|
||||
@ -39,6 +39,16 @@ body {
|
||||
.ant-menu-dark .ant-menu-item:hover {
|
||||
background-color: rgba(255, 255, 255, 0.08) !important;
|
||||
}
|
||||
/* 二级菜单展开背景:与侧边栏 #1e2030 协调,用微暗叠加制造层次而非跳色 */
|
||||
.ant-menu-dark .ant-menu-sub {
|
||||
background: rgba(0, 0, 0, 0.15) !important;
|
||||
}
|
||||
.ant-menu-dark .ant-menu-submenu-title:hover {
|
||||
background-color: rgba(255, 255, 255, 0.08) !important;
|
||||
}
|
||||
.ant-menu-dark .ant-menu-submenu-selected > .ant-menu-submenu-title {
|
||||
color: rgba(255, 255, 255, 0.9) !important;
|
||||
}
|
||||
|
||||
/* editable-card Tabs 默认有 4px paddingTop,导致 TabBar 顶部出现空隙 */
|
||||
.ant-tabs-editable-card > .ant-tabs-nav {
|
||||
|
||||
14
frontend/web/src/pages/IntelligentEvals.tsx
Normal file
14
frontend/web/src/pages/IntelligentEvals.tsx
Normal file
@ -0,0 +1,14 @@
|
||||
import { Result } from 'antd'
|
||||
import { BulbOutlined } from '@ant-design/icons'
|
||||
|
||||
export default function IntelligentEvalsPage() {
|
||||
return (
|
||||
<div style={{ height: '100%', display: 'flex', alignItems: 'center', justifyContent: 'center' }}>
|
||||
<Result
|
||||
icon={<BulbOutlined style={{ color: '#8c8c8c' }} />}
|
||||
title="智能评估"
|
||||
subTitle="OpenClaw 驱动的独立评测体系(开发中)"
|
||||
/>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
Loading…
Reference in New Issue
Block a user