diff --git a/vehicle-data-platform/apps/web/src/pages/Realtime.tsx b/vehicle-data-platform/apps/web/src/pages/Realtime.tsx
index 03300f6f..dbe0026f 100644
--- a/vehicle-data-platform/apps/web/src/pages/Realtime.tsx
+++ b/vehicle-data-platform/apps/web/src/pages/Realtime.tsx
@@ -730,6 +730,69 @@ export function Realtime({
{ label: '有效定位', value: locatedCount.toLocaleString(), color: locatedCount > 0 ? 'green' as const : 'orange' as const, helper: `定位率 ${formatPercent(locatedRate)}` },
{ label: '需关注', value: mapAttentionRows.length.toLocaleString(), color: mapAttentionRows.length > 0 ? 'orange' as const : 'green' as const, helper: `${staleCount.toLocaleString()} 辆更新超时` }
];
+ const selectedVehicleProtocol = selectedMapRow ? filters.protocol || selectedMapRow.primaryProtocol || '' : '';
+ const openSelectedVehicleRaw = () => {
+ if (!selectedMapRow || !canOpenVehicle(selectedMapRow.vin)) {
+ Toast.warning('请先选择可查询的车辆');
+ return;
+ }
+ window.location.hash = buildAppHash({
+ page: 'history-query',
+ keyword: selectedMapRow.vin,
+ protocol: selectedVehicleProtocol,
+ filters: { tab: 'raw', includeFields: 'true' }
+ });
+ };
+ const mapCustomerTasks = [
+ {
+ title: '实时盯车',
+ value: `${onlineCount.toLocaleString()} 在线`,
+ detail: '先看在线车辆和有效定位,确认客户当前能看到车在哪里。',
+ color: 'green' as const,
+ primaryAction: '只看在线',
+ secondaryAction: '刷新地图',
+ onPrimary: () => applyFilters({ ...filters, online: 'online' }),
+ onSecondary: () => load(filters, pagination.currentPage, pagination.pageSize),
+ disabled: false,
+ secondaryDisabled: false
+ },
+ {
+ title: '异常优先',
+ value: `${mapAttentionRows.length.toLocaleString()} 辆关注`,
+ detail: mapAttentionRows[0] ? `${mapAttentionRows[0].plate || mapAttentionRows[0].vin}:${realtimeIssueLabels(mapAttentionRows[0]).join(';')}` : '当前筛选下暂无需要关注的车辆。',
+ color: mapAttentionRows.length > 0 ? 'orange' as const : 'green' as const,
+ primaryAction: '关注车辆',
+ secondaryAction: '告警事件',
+ onPrimary: () => applyFilters({ ...filters, serviceStatus: 'degraded' }),
+ onSecondary: () => onOpenQuality?.({ serviceStatus: 'degraded' }),
+ disabled: !onOpenQuality && mapAttentionRows.length === 0,
+ secondaryDisabled: !onOpenQuality
+ },
+ {
+ title: '轨迹复盘',
+ value: selectedMapRow?.plate || selectedMapRow?.vin || '未选车辆',
+ detail: selectedMapRow ? `围绕 ${selectedMapRow.plate || selectedMapRow.vin} 回放位置、速度和里程变化。` : '从地图或车辆队列选择一辆车后回放轨迹。',
+ color: selectedMapRow ? 'blue' as const : 'grey' as const,
+ primaryAction: '轨迹回放',
+ secondaryAction: '车辆档案',
+ disabled: !selectedMapRow || !canOpenVehicle(selectedMapRow.vin),
+ onPrimary: () => selectedMapRow && onOpenHistory?.(selectedMapRow.vin, selectedVehicleProtocol),
+ onSecondary: () => selectedMapRow && onOpenVehicle(selectedMapRow.vin, selectedVehicleProtocol),
+ secondaryDisabled: !selectedMapRow || !canOpenVehicle(selectedMapRow.vin)
+ },
+ {
+ title: '数据交付',
+ value: `${rows.length.toLocaleString()} 辆当前页`,
+ detail: '导出当前车辆清单,或进入选中车辆的原始记录证据。',
+ color: 'blue' as const,
+ primaryAction: '导出当前页',
+ secondaryAction: '原始记录',
+ onPrimary: exportRealtime,
+ onSecondary: openSelectedVehicleRaw,
+ disabled: false,
+ secondaryDisabled: !selectedMapRow || !canOpenVehicle(selectedMapRow.vin)
+ }
+ ];
if (mode === 'map') {
return (
@@ -780,6 +843,40 @@ export function Realtime({
))}
+
+ {mapCustomerTasks.map((item) => (
+
+
+ {item.title}
+ {item.value}
+
+
{item.detail}
+
+
+
+
+
+ ))}
+
+
diff --git a/vehicle-data-platform/apps/web/src/styles/global.css b/vehicle-data-platform/apps/web/src/styles/global.css
index 1181c4fd..3a8e06a2 100644
--- a/vehicle-data-platform/apps/web/src/styles/global.css
+++ b/vehicle-data-platform/apps/web/src/styles/global.css
@@ -985,6 +985,41 @@ button.vp-realtime-command-item:focus-visible {
line-height: 18px;
}
+.vp-map-task-strip {
+ display: grid;
+ grid-template-columns: repeat(4, minmax(0, 1fr));
+ gap: 12px;
+}
+
+.vp-map-task-item {
+ min-height: 158px;
+ padding: 14px;
+ border: 1px solid var(--vp-border);
+ border-radius: var(--vp-radius);
+ background: var(--vp-surface);
+ display: grid;
+ align-content: space-between;
+ gap: 12px;
+}
+
+.vp-map-task-head {
+ min-width: 0;
+ display: grid;
+ gap: 8px;
+}
+
+.vp-map-task-head strong {
+ color: var(--vp-text);
+ font-size: 18px;
+ line-height: 24px;
+ word-break: break-word;
+}
+
+.vp-map-task-item .semi-typography {
+ font-size: 13px;
+ line-height: 20px;
+}
+
.vp-map-workspace {
min-height: 680px;
display: grid;
@@ -3223,6 +3258,7 @@ button.vp-realtime-command-item:focus-visible {
.vp-realtime-impact-grid,
.vp-source-coverage-grid,
.vp-map-kpi-strip,
+ .vp-map-task-strip,
.vp-map-workspace,
.vp-runbook-grid,
.vp-workbench-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 b730f0c6..f9a4a7ab 100644
--- a/vehicle-data-platform/apps/web/src/test/App.test.tsx
+++ b/vehicle-data-platform/apps/web/src/test/App.test.tsx
@@ -192,7 +192,7 @@ test('exposes AMap operations shortcuts when map key is configured', async () =>
fireEvent.click(screen.getByRole('button', { name: '顶部地图态势' }));
expect(window.location.hash).toBe('#/map');
expect(await screen.findByRole('heading', { name: '车辆实时地图' })).toBeInTheDocument();
- expect(screen.getByText('关注车辆')).toBeInTheDocument();
+ expect(screen.getAllByText('关注车辆').length).toBeGreaterThanOrEqual(1);
expect(screen.getByText('车辆列表')).toBeInTheDocument();
fireEvent.click(screen.getByRole('button', { name: '顶部实时监控' }));
expect(window.location.hash).toBe('#/realtime');
@@ -9016,7 +9016,15 @@ test('shows realtime freshness status for recently updated and stale vehicles',
expect(await screen.findByRole('heading', { name: '车辆实时地图' })).toBeInTheDocument();
expect(screen.getAllByText('数据新鲜').length).toBeGreaterThan(0);
expect(screen.getAllByText('更新超时').length).toBeGreaterThan(0);
- expect(screen.getByText('关注车辆')).toBeInTheDocument();
+ expect(screen.getByText('实时盯车')).toBeInTheDocument();
+ expect(screen.getByText('异常优先')).toBeInTheDocument();
+ expect(screen.getByText('轨迹复盘')).toBeInTheDocument();
+ expect(screen.getByText('数据交付')).toBeInTheDocument();
+ expect(screen.getByRole('button', { name: '地图监控任务 实时盯车 只看在线' })).toBeInTheDocument();
+ expect(screen.getByRole('button', { name: '地图监控任务 异常优先 关注车辆' })).toBeInTheDocument();
+ expect(screen.getByRole('button', { name: '地图监控任务 轨迹复盘 轨迹回放' })).toBeInTheDocument();
+ expect(screen.getByRole('button', { name: '地图监控任务 数据交付 导出当前页' })).toBeInTheDocument();
+ expect(screen.getAllByText('关注车辆').length).toBeGreaterThanOrEqual(1);
expect(screen.getByText('选中车辆')).toBeInTheDocument();
expect(screen.getByText('车辆列表')).toBeInTheDocument();
expect(screen.getByText('1 辆更新超时')).toBeInTheDocument();