feat(platform): reorganize customer navigation
This commit is contained in:
@@ -20,17 +20,19 @@ export type PageKey = 'dashboard' | 'vehicles' | 'map' | 'realtime' | 'detail' |
|
|||||||
|
|
||||||
const navGroups = [
|
const navGroups = [
|
||||||
{
|
{
|
||||||
title: '车辆运营',
|
title: '车辆服务',
|
||||||
|
description: '以车辆为对象监控在线、位置和服务状态',
|
||||||
items: [
|
items: [
|
||||||
{ itemKey: 'dashboard', text: '运营驾驶舱', icon: <IconHome /> },
|
{ itemKey: 'dashboard', text: '运营驾驶舱', icon: <IconHome /> },
|
||||||
|
{ itemKey: 'vehicles', text: '车辆中心', icon: <IconServer /> },
|
||||||
{ itemKey: 'map', text: '实时地图', icon: <IconMapPin /> },
|
{ itemKey: 'map', text: '实时地图', icon: <IconMapPin /> },
|
||||||
{ itemKey: 'realtime', text: '实时监控', icon: <IconActivity /> },
|
{ itemKey: 'realtime', text: '实时监控', icon: <IconActivity /> },
|
||||||
{ itemKey: 'vehicles', text: '车辆中心', icon: <IconServer /> },
|
|
||||||
{ itemKey: 'detail', text: '车辆档案', icon: <IconSetting /> }
|
{ itemKey: 'detail', text: '车辆档案', icon: <IconSetting /> }
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '轨迹报表',
|
title: '数据交付',
|
||||||
|
description: '轨迹、里程、历史数据和客户导出',
|
||||||
items: [
|
items: [
|
||||||
{ itemKey: 'history', text: '轨迹回放', icon: <IconMapPin /> },
|
{ itemKey: 'history', text: '轨迹回放', icon: <IconMapPin /> },
|
||||||
{ itemKey: 'mileage', text: '里程统计', icon: <IconBarChartHStroked /> },
|
{ itemKey: 'mileage', text: '里程统计', icon: <IconBarChartHStroked /> },
|
||||||
@@ -38,14 +40,16 @@ const navGroups = [
|
|||||||
]
|
]
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '告警通知',
|
title: '告警闭环',
|
||||||
|
description: '断链、离线、定位异常和通知升级',
|
||||||
items: [
|
items: [
|
||||||
{ itemKey: 'alert-events', text: '告警事件', icon: <IconHistogram /> },
|
{ itemKey: 'alert-events', text: '告警事件', icon: <IconHistogram /> },
|
||||||
{ itemKey: 'notification-rules', text: '通知规则', icon: <IconBell /> }
|
{ itemKey: 'notification-rules', text: '通知规则', icon: <IconBell /> }
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '平台运维',
|
title: '运维后台',
|
||||||
|
description: '接入链路和平台运行质量单独查看',
|
||||||
items: [
|
items: [
|
||||||
{ itemKey: 'ops-quality', text: '运维质量', icon: <IconPulse /> }
|
{ itemKey: 'ops-quality', text: '运维质量', icon: <IconPulse /> }
|
||||||
]
|
]
|
||||||
@@ -141,13 +145,16 @@ export function AppShell({
|
|||||||
<span className="vp-brand-mark" />
|
<span className="vp-brand-mark" />
|
||||||
<span className="vp-brand-copy">
|
<span className="vp-brand-copy">
|
||||||
<span>车辆服务中台</span>
|
<span>车辆服务中台</span>
|
||||||
<span>地图监控 / 轨迹回放 / 里程统计</span>
|
<span>车辆地图 / 里程统计 / 数据交付</span>
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
<div className="vp-nav-groups">
|
<div className="vp-nav-groups">
|
||||||
{navGroups.map((group) => (
|
{navGroups.map((group) => (
|
||||||
<div key={group.title} className="vp-nav-group">
|
<div key={group.title} className="vp-nav-group">
|
||||||
<div className="vp-nav-section-title">{group.title}</div>
|
<div className="vp-nav-section-title">
|
||||||
|
<span>{group.title}</span>
|
||||||
|
<small>{group.description}</small>
|
||||||
|
</div>
|
||||||
<Nav
|
<Nav
|
||||||
selectedKeys={[selectedPage]}
|
selectedKeys={[selectedPage]}
|
||||||
items={group.items}
|
items={group.items}
|
||||||
|
|||||||
@@ -84,6 +84,15 @@ body {
|
|||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
line-height: 18px;
|
line-height: 18px;
|
||||||
|
display: grid;
|
||||||
|
gap: 2px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.vp-nav-section-title small {
|
||||||
|
color: var(--vp-text-muted);
|
||||||
|
font-size: 10px;
|
||||||
|
font-weight: 500;
|
||||||
|
line-height: 14px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.vp-main {
|
.vp-main {
|
||||||
|
|||||||
@@ -21,11 +21,13 @@ test('renders vehicle platform shell', () => {
|
|||||||
|
|
||||||
render(<App />);
|
render(<App />);
|
||||||
expect(screen.getByText('车辆服务中台')).toBeInTheDocument();
|
expect(screen.getByText('车辆服务中台')).toBeInTheDocument();
|
||||||
expect(screen.getByText('地图监控 / 轨迹回放 / 里程统计')).toBeInTheDocument();
|
expect(screen.getByText('车辆地图 / 里程统计 / 数据交付')).toBeInTheDocument();
|
||||||
expect(screen.getByText('车辆运营')).toBeInTheDocument();
|
expect(screen.getAllByText('车辆服务').length).toBeGreaterThanOrEqual(1);
|
||||||
expect(screen.getByText('轨迹报表')).toBeInTheDocument();
|
expect(screen.getByText('以车辆为对象监控在线、位置和服务状态')).toBeInTheDocument();
|
||||||
expect(screen.getAllByText('告警通知').length).toBeGreaterThanOrEqual(1);
|
expect(screen.getAllByText('数据交付').length).toBeGreaterThanOrEqual(1);
|
||||||
expect(screen.getByText('平台运维')).toBeInTheDocument();
|
expect(screen.getByText('轨迹、里程、历史数据和客户导出')).toBeInTheDocument();
|
||||||
|
expect(screen.getByText('告警闭环')).toBeInTheDocument();
|
||||||
|
expect(screen.getByText('运维后台')).toBeInTheDocument();
|
||||||
expect(screen.getAllByText('运营驾驶舱').length).toBeGreaterThanOrEqual(1);
|
expect(screen.getAllByText('运营驾驶舱').length).toBeGreaterThanOrEqual(1);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user