diff --git a/vehicle-data-platform/apps/web/src/pages/Realtime.tsx b/vehicle-data-platform/apps/web/src/pages/Realtime.tsx
index adb54e32..6370953a 100644
--- a/vehicle-data-platform/apps/web/src/pages/Realtime.tsx
+++ b/vehicle-data-platform/apps/web/src/pages/Realtime.tsx
@@ -353,6 +353,7 @@ export function Realtime({
.slice(0, 5);
const defaultMapRow = mapServiceRows[0] ?? rows.find((row) => isValidCoordinate(row) && canOpenVehicle(row.vin));
const selectedMapRow = rows.find((row, index) => realtimeMapPointId(row, index) === selectedMapPointId) ?? defaultMapRow;
+ const selectedMapPointKey = selectedMapRow ? realtimeMapPointId(selectedMapRow, rows.indexOf(selectedMapRow)) : selectedMapPointId;
const mapPoints: VehicleMapPoint[] = rows.map((row, index) => ({
id: realtimeMapPointId(row, index),
label: row.plate || row.vin || 'unknown',
@@ -416,6 +417,14 @@ export function Realtime({
amapConfigured,
sourceIssueRows
}), '实时摘要');
+ const selectRealtimeRow = (row: VehicleRealtimeRow) => {
+ const index = rows.indexOf(row);
+ if (index < 0) return;
+ setSelectedMapPointId(realtimeMapPointId(row, index));
+ };
+ const selectRealtimeMapPoint = (point: VehicleMapPoint) => {
+ setSelectedMapPointId(point.id);
+ };
return (
@@ -485,8 +494,8 @@ export function Realtime({
setSelectedMapPointId(point.id)}
+ selectedId={selectedMapPointKey}
+ onPointSelect={selectRealtimeMapPoint}
fallbackLabel="高德地图未配置,显示实时坐标预览"
/>
@@ -597,11 +606,11 @@ export function Realtime({
role="button"
tabIndex={0}
className={`vp-map-service-item vp-map-service-item-button ${selectedMapRow?.vin === row.vin ? 'vp-map-service-item-selected' : ''}`}
- onClick={() => setSelectedMapPointId(realtimeMapPointId(row, rows.indexOf(row)))}
+ onClick={() => selectRealtimeRow(row)}
onKeyDown={(event) => {
if (event.key === 'Enter' || event.key === ' ') {
event.preventDefault();
- setSelectedMapPointId(realtimeMapPointId(row, rows.indexOf(row)));
+ selectRealtimeRow(row);
}
}}
>
@@ -722,6 +731,7 @@ export function Realtime({
width: 190,
render: (_: unknown, row: VehicleRealtimeRow) => (
+
@@ -732,7 +742,13 @@ export function Realtime({
)}
-
+
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 3909e019..92deeb19 100644
--- a/vehicle-data-platform/apps/web/src/test/App.test.tsx
+++ b/vehicle-data-platform/apps/web/src/test/App.test.tsx
@@ -8329,6 +8329,12 @@ test('selects realtime map vehicle from fallback map point', async () => {
expect(within(selectedPanel as HTMLElement).getByText('粤A选中2')).toBeInTheDocument();
});
expect(within(selectedPanel as HTMLElement).getByText('42 km/h')).toBeInTheDocument();
+
+ const locateButtons = screen.getAllByRole('button', { name: '地图定位' });
+ fireEvent.click(locateButtons[0]);
+ expect(within(selectedPanel as HTMLElement).getByText('粤A选中1')).toBeInTheDocument();
+ fireEvent.click(locateButtons[1]);
+ expect(within(selectedPanel as HTMLElement).getByText('粤A选中2')).toBeInTheDocument();
});
test('opens vehicle service from realtime map service queue', async () => {