feat(platform): separate customer and ops navigation

vehicle-data-platform/apps/web/src/layout/AppShell.tsx

@@ -21,6 +21,7 @@ export type PageKey = 'dashboard' | 'vehicles' | 'map' | 'realtime' | 'detail' |
 const navGroups = [
   {
     title: '车辆服务',
+    audience: '客户',
     description: '以车辆为对象监控在线、位置和服务状态',
     items: [
       { itemKey: 'dashboard', text: '运营驾驶舱', icon: <IconHome /> },
@@ -32,6 +33,7 @@ const navGroups = [
   },
   {
     title: '数据交付',
+    audience: '客户',
     description: '轨迹、里程、历史数据和客户导出',
     items: [
       { itemKey: 'history', text: '轨迹回放', icon: <IconMapPin /> },
@@ -41,6 +43,7 @@ const navGroups = [
   },
   {
     title: '告警闭环',
+    audience: '客户',
     description: '断链、离线、定位异常和通知升级',
     items: [
       { itemKey: 'alert-events', text: '告警事件', icon: <IconHistogram /> },
@@ -48,8 +51,9 @@ const navGroups = [
     ]
   },
   {
-    title: '运维后台',
+    title: '平台运维',
-    description: '接入链路和平台运行质量单独查看',
+    audience: '内部',
+    description: '客户主流程外查看接入链路和运行质量',
     items: [
       { itemKey: 'ops-quality', text: '运维质量', icon: <IconPulse /> }
     ]
@@ -152,7 +156,10 @@ export function AppShell({
             {navGroups.map((group) => (
               <div key={group.title} className="vp-nav-group">
                 <div className="vp-nav-section-title">
-                  <span>{group.title}</span>
+                  <span className="vp-nav-section-title-main">
+                    <span>{group.title}</span>
+                    <Tag size="small" color={group.audience === '内部' ? 'grey' : 'blue'}>{group.audience}</Tag>
+                  </span>
                   <small>{group.description}</small>
                 </div>
                 <Nav

vehicle-data-platform/apps/web/src/styles/global.css

@@ -88,6 +88,20 @@ body {
   gap: 2px;
 }
 
+.vp-nav-section-title-main {
+  min-width: 0;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 6px;
+}
+
+.vp-nav-section-title-main > span:first-child {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
 .vp-nav-section-title small {
   color: var(--vp-text-muted);
   font-size: 10px;

vehicle-data-platform/apps/web/src/test/App.test.tsx

@@ -27,7 +27,10 @@ test('renders vehicle platform shell', () => {
   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(3);
+  expect(screen.getByText('内部')).toBeInTheDocument();
+  expect(screen.getByText('客户主流程外查看接入链路和运行质量')).toBeInTheDocument();
   expect(screen.getAllByText('运营驾驶舱').length).toBeGreaterThanOrEqual(1);
 });