diff --git a/vehicle-data-platform/apps/web/src/pages/VehicleDetail.tsx b/vehicle-data-platform/apps/web/src/pages/VehicleDetail.tsx index 7402aa0b..37520a67 100644 --- a/vehicle-data-platform/apps/web/src/pages/VehicleDetail.tsx +++ b/vehicle-data-platform/apps/web/src/pages/VehicleDetail.tsx @@ -26,6 +26,26 @@ const coverageStatusText: Record = { no_data: '暂无来源' }; +function isFiniteNumber(value: unknown): value is number { + return typeof value === 'number' && Number.isFinite(value); +} + +function formatCompactNumber(value?: number, suffix = '') { + if (!isFiniteNumber(value)) return '-'; + return `${value.toLocaleString(undefined, { maximumFractionDigits: 1 })}${suffix}`; +} + +function parseTimeMs(value?: string) { + if (!value) return undefined; + const ms = Date.parse(value); + return Number.isFinite(ms) ? ms : undefined; +} + +function formatSeconds(value?: number) { + if (!isFiniteNumber(value)) return '-'; + return `${Math.round(value)} 秒`; +} + export function VehicleDetail({ vin, protocol, @@ -96,6 +116,20 @@ export function VehicleDetail({ const online = resolution?.online || summary?.online || identity?.online || false; const lastSeen = resolution?.lastSeen || summary?.lastSeen || latest?.lastSeen || '-'; const serviceStatus = detail?.serviceStatus; + const realtimeRows = detail?.realtime ?? []; + const realtimeSources = new Set(realtimeRows.map((row) => row.protocol).filter(Boolean)); + const sourceCount = Math.max(detail?.sourceStatus?.length ?? 0, realtimeSources.size, summary?.sourceCount ?? 0, protocols.length); + const onlineSourceCount = detail?.sourceStatus?.length + ? detail.sourceStatus.filter((source) => source.online).length + : summary?.onlineSourceCount ?? 0; + const locatedSourceCount = realtimeRows.filter((row) => isFiniteNumber(row.longitude) && isFiniteNumber(row.latitude)).length; + const mileageValues = realtimeRows.map((row) => row.totalMileageKm).filter(isFiniteNumber); + const mileageDelta = mileageValues.length > 1 ? Math.max(...mileageValues) - Math.min(...mileageValues) : undefined; + const timeValues = [ + ...realtimeRows.map((row) => parseTimeMs(row.lastSeen)), + ...(detail?.sourceStatus ?? []).map((source) => parseTimeMs(source.lastSeen)) + ].filter(isFiniteNumber); + const sourceTimeDeltaSeconds = timeValues.length > 1 ? (Math.max(...timeValues) - Math.min(...timeValues)) / 1000 : undefined; const activeProtocol = query.protocol?.trim() ?? ''; const scopeText = activeProtocol ? `单一来源：${activeProtocol}` : '全部来源聚合'; const formKey = `${query.keyword}-${query.protocol ?? ''}`; @@ -284,6 +318,20 @@ export function VehicleDetail({ )} + + 0 ? `${sourceCount} 个来源` : '-' }, + { key: '在线来源', value: sourceCount > 0 ? `${onlineSourceCount}/${sourceCount} 在线` : '-' }, + { key: '位置覆盖', value: locatedSourceCount > 0 ? `${locatedSourceCount} 个来源有位置` : '暂无位置' }, + { key: '里程差异', value: formatCompactNumber(mileageDelta, ' km') }, + { key: '来源时间差', value: formatSeconds(sourceTimeDeltaSeconds) }, + { key: '车辆服务视角', value: activeProtocol ? `当前只看 ${activeProtocol}` : '三类来源合并为同一车辆服务' } + ]} + /> + + { expect(screen.getByText('部分来源离线')).toBeInTheDocument(); expect(fetchMock).toHaveBeenCalledWith(expect.stringContaining('/api/vehicle-service?keyword=VIN001&protocol=JT808'), undefined); }); + +test('shows cross-source consistency for one vehicle service', async () => { + window.history.replaceState(null, '', '/#/detail?keyword=VIN-CONSISTENCY-001'); + vi.spyOn(globalThis, 'fetch').mockImplementation(async (input) => { + const path = String(input); + if (path.includes('/api/vehicle-service')) { + return { + ok: true, + json: async () => ({ + data: { + vin: 'VIN-CONSISTENCY-001', + lookupKey: 'VIN-CONSISTENCY-001', + lookupResolved: true, + resolution: { + lookupKey: 'VIN-CONSISTENCY-001', + resolved: true, + vin: 'VIN-CONSISTENCY-001', + plate: '粤A一致1', + phone: '13307795425', + oem: 'G7s', + protocols: ['GB32960', 'JT808', 'YUTONG_MQTT'], + online: true, + lastSeen: '2026-07-03 20:12:10' + }, + realtimeSummary: { + vin: 'VIN-CONSISTENCY-001', + plate: '粤A一致1', + phone: '13307795425', + oem: 'G7s', + protocols: ['GB32960', 'JT808', 'YUTONG_MQTT'], + sourceCount: 3, + onlineSourceCount: 2, + online: true, + bindingStatus: 'bound', + primaryProtocol: 'GB32960', + longitude: 113.2, + latitude: 23.1, + speedKmh: 32, + socPercent: 78, + totalMileageKm: 1000.5, + lastSeen: '2026-07-03T20:12:10+08:00' + }, + sources: ['GB32960', 'JT808', 'YUTONG_MQTT'], + sourceStatus: [ + { protocol: 'GB32960', online: true, lastSeen: '2026-07-03T20:12:10+08:00', hasRealtime: true, hasHistory: true, hasRaw: true, hasMileage: true }, + { protocol: 'JT808', online: true, lastSeen: '2026-07-03T20:12:05+08:00', hasRealtime: true, hasHistory: true, hasRaw: true, hasMileage: true }, + { protocol: 'YUTONG_MQTT', online: false, lastSeen: '2026-07-03T20:11:40+08:00', hasRealtime: true, hasHistory: true, hasRaw: true, hasMileage: true } + ], + realtime: [ + { vin: 'VIN-CONSISTENCY-001', plate: '粤A一致1', protocol: 'GB32960', longitude: 113.2, latitude: 23.1, speedKmh: 32, socPercent: 78, totalMileageKm: 1000.5, lastSeen: '2026-07-03T20:12:10+08:00' }, + { vin: 'VIN-CONSISTENCY-001', plate: '粤A一致1', protocol: 'JT808', longitude: 113.201, latitude: 23.101, speedKmh: 30, socPercent: 0, totalMileageKm: 1000.8, lastSeen: '2026-07-03T20:12:05+08:00' }, + { vin: 'VIN-CONSISTENCY-001', plate: '粤A一致1', protocol: 'YUTONG_MQTT', longitude: 113.2, latitude: 23.1, speedKmh: 31, socPercent: 77, totalMileageKm: 1000.7, lastSeen: '2026-07-03T20:11:40+08:00' } + ], + history: { items: [], total: 0, limit: 20, offset: 0 }, + raw: { items: [], total: 0, limit: 10, offset: 0 }, + mileage: { items: [], total: 0, limit: 20, offset: 0 }, + quality: { items: [], total: 0, limit: 20, offset: 0 } + }, + traceId: 'trace-test', + timestamp: 1783094400000 + }) + } as Response; + } + return { + ok: true, + json: async () => ({ + data: path.includes('/api/ops/health') + ? { linkHealth: [], kafkaLag: 0, redisOnlineKeys: 0, tdengineWritable: true, mysqlWritable: true, runtime: { requestTimeoutMs: 5000 } } + : { items: [], total: 0, limit: 10, offset: 0 }, + traceId: 'trace-test', + timestamp: 1783094400000 + }) + } as Response; + }); + + render(); + + expect(await screen.findByText('跨来源一致性')).toBeInTheDocument(); + expect(screen.getByText('3 个来源')).toBeInTheDocument(); + expect(screen.getByText('2/3 在线')).toBeInTheDocument(); + expect(screen.getByText('3 个来源有位置')).toBeInTheDocument(); + expect(screen.getByText('0.3 km')).toBeInTheDocument(); + expect(screen.getByText('30 秒')).toBeInTheDocument(); +});