From c00cb0218ab93565e88cda11f6d0feb003223fa1 Mon Sep 17 00:00:00 2001 From: lingniu Date: Mon, 6 Jul 2026 00:34:07 +0800 Subject: [PATCH] feat(platform): add ten second vehicle triage --- .../apps/web/src/pages/Dashboard.tsx | 56 +++++++++++++ .../apps/web/src/styles/global.css | 84 +++++++++++++++++++ .../apps/web/src/test/App.test.tsx | 5 ++ 3 files changed, 145 insertions(+) diff --git a/vehicle-data-platform/apps/web/src/pages/Dashboard.tsx b/vehicle-data-platform/apps/web/src/pages/Dashboard.tsx index ed3386f8..e1315d30 100644 --- a/vehicle-data-platform/apps/web/src/pages/Dashboard.tsx +++ b/vehicle-data-platform/apps/web/src/pages/Dashboard.tsx @@ -1707,6 +1707,32 @@ export function Dashboard({ onClick: () => onOpenQuality(highPriorityIssue?.issueType ? { issueType: highPriorityIssue.issueType } : {}) } ]; + const tenSecondTriageItems = [ + { + label: '告警车辆', + value: `${formatCount(summary?.issueVehicles)} 辆`, + detail: highPriorityIssue ? `${qualityIssueLabel(highPriorityIssue.issueType)} / ${priorityIssueVehicleLabel(highPriorityIssue)}` : '暂无高优先级告警，保持日常巡检。', + action: '处理告警', + color: (summary?.issueVehicles ?? 0) > 0 ? 'orange' as const : 'green' as const, + onClick: () => onOpenQuality(highPriorityIssue?.issueType ? { issueType: highPriorityIssue.issueType } : {}) + }, + { + label: '无数据车辆', + value: `${formatCount(serviceSummary?.noDataVehicles)} 辆`, + detail: '优先确认平台转发、车辆是否在线以及是否有任何来源证据。', + action: '查车辆', + color: (serviceSummary?.noDataVehicles ?? 0) > 0 ? 'orange' as const : 'green' as const, + onClick: () => onOpenVehicles({ serviceStatus: 'no_data' }) + }, + { + label: '身份未绑定', + value: `${formatCount(serviceSummary?.identityRequiredVehicles)} 辆`, + detail: '已有上报但无法稳定归并到 VIN，会影响地图、轨迹和统计聚合。', + action: '维护绑定', + color: (serviceSummary?.identityRequiredVehicles ?? 0) > 0 ? 'orange' as const : 'green' as const, + onClick: () => onOpenVehicles({ serviceStatus: 'identity_required' }) + } + ]; const amapVehicleServiceItems = [ { label: '实时看车', @@ -2456,6 +2482,36 @@ export function Dashboard({ ))} +
+
+ + 十秒车辆处置台 + 0 || (serviceSummary?.noDataVehicles ?? 0) > 0 ? 'orange' : 'green'}>先处理异常车辆 + + + 登录后先知道哪三类车辆最需要处理，再进入地图、车辆中心或告警通知。 + + + 首页只保留能直接行动的优先级：告警车辆、无数据车辆、身份未绑定车辆；协议来源留在证据层解释原因。 + +
+
+ {tenSecondTriageItems.map((item) => ( + + ))} +
+
车辆服务闭环 diff --git a/vehicle-data-platform/apps/web/src/styles/global.css b/vehicle-data-platform/apps/web/src/styles/global.css index 92888f0a..a0df9714 100644 --- a/vehicle-data-platform/apps/web/src/styles/global.css +++ b/vehicle-data-platform/apps/web/src/styles/global.css @@ -2081,6 +2081,88 @@ body { line-height: 18px; } +.vp-ten-second-triage { + margin-bottom: 16px; + padding: 14px; + border: 1px solid rgba(245, 135, 0, 0.18); + border-radius: 8px; + background: #ffffff; + display: grid; + grid-template-columns: minmax(300px, 0.5fr) minmax(0, 1.5fr); + gap: 14px; + align-items: stretch; +} + +.vp-ten-second-triage-copy { + padding: 16px; + border: 1px solid rgba(245, 135, 0, 0.14); + border-radius: 8px; + background: #fffaf2; + display: grid; + gap: 10px; + align-content: center; +} + +.vp-ten-second-triage-copy .semi-typography { + line-height: 25px; +} + +.vp-ten-second-triage-grid { + min-width: 0; + display: grid; + grid-template-columns: repeat(3, minmax(0, 1fr)); + gap: 10px; +} + +.vp-ten-second-triage-item { + min-width: 0; + min-height: 128px; + padding: 12px; + border: 1px solid rgba(245, 135, 0, 0.16); + border-radius: 8px; + background: #fffdfa; + color: inherit; + cursor: pointer; + font: inherit; + text-align: left; + display: grid; + gap: 8px; + align-content: start; + transition: border-color 0.16s ease, box-shadow 0.16s ease, background 0.16s ease; +} + +.vp-ten-second-triage-item:hover, +.vp-ten-second-triage-item:focus-visible { + border-color: rgba(245, 135, 0, 0.42); + background: #fff8ec; + box-shadow: 0 0 0 3px rgba(245, 135, 0, 0.08); + outline: none; +} + +.vp-ten-second-triage-item strong { + color: var(--vp-text); + font-size: 18px; + line-height: 24px; + font-weight: 800; + word-break: break-word; +} + +.vp-ten-second-triage-item span { + color: var(--vp-text-muted); + font-size: 12px; + line-height: 18px; + word-break: break-word; +} + +.vp-ten-second-triage-item em { + align-self: end; + color: #d25f00; + font-size: 12px; + font-style: normal; + font-weight: 800; + line-height: 18px; +} + .vp-customer-service-journey { margin-bottom: 16px; padding: 14px; @@ -12363,6 +12445,8 @@ button.vp-realtime-command-item:focus-visible { .vp-customer-platform-blueprint-grid, .vp-customer-saved-view-library, .vp-customer-saved-view-library-grid, + .vp-ten-second-triage, + .vp-ten-second-triage-grid, .vp-customer-service-separation, .vp-customer-primary-flow-grid, .vp-source-readiness-grid, diff --git a/vehicle-data-platform/apps/web/src/test/App.test.tsx b/vehicle-data-platform/apps/web/src/test/App.test.tsx index f5452729..58d9385f 100644 --- a/vehicle-data-platform/apps/web/src/test/App.test.tsx +++ b/vehicle-data-platform/apps/web/src/test/App.test.tsx @@ -1369,6 +1369,11 @@ test('dashboard exposes vehicle data center capability matrix', async () => { expect(screen.getByRole('button', { name: '客户常用视图库 轨迹日报模板 4 活跃 历史导出' })).toBeInTheDocument(); expect(screen.getByRole('button', { name: '客户常用视图库 里程周报模板 1,033 车辆 统计查询' })).toBeInTheDocument(); expect(screen.getByRole('button', { name: '客户常用视图库 告警订阅视图 7 告警 通知闭环' })).toBeInTheDocument(); + expect(screen.getByRole('region', { name: '十秒车辆处置台' })).toBeInTheDocument(); + expect(screen.getByText('登录后先知道哪三类车辆最需要处理，再进入地图、车辆中心或告警通知。')).toBeInTheDocument(); + expect(screen.getByRole('button', { name: '十秒车辆处置台 告警车辆 7 辆 处理告警' })).toBeInTheDocument(); + expect(screen.getByRole('button', { name: '十秒车辆处置台 无数据车辆 461 辆 查车辆' })).toBeInTheDocument(); + expect(screen.getByRole('button', { name: '十秒车辆处置台 身份未绑定 9 辆 维护绑定' })).toBeInTheDocument(); expect(screen.getByText('现代车队运营台')).toBeInTheDocument(); expect(screen.getByText('一屏完成车辆地图、轨迹回放、里程统计、数据导出和告警闭环。')).toBeInTheDocument(); expect(screen.getByRole('button', { name: '现代车队运营台 Live Map 208 在线 打开地图' })).toBeInTheDocument();