feat(platform-web): show source consistency

2026-07-04 03:57:26 +08:00
parent 2e50f43ff4
commit 353b71ebbb
2 changed files with 132 additions and 0 deletions
--- 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<string, string> = {
  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({
            )}
          </Card>

+          <Card bordered title="跨来源一致性" style={{ marginTop: 16 }}>
+            <Descriptions
+              row
+              data={[
+                { key: '来源覆盖', value: sourceCount > 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}` : '三类来源合并为同一车辆服务' }
+              ]}
+            />
+          </Card>
+
          <Card bordered title="来源诊断明细" style={{ marginTop: 16 }}>
            <Table
              loading={loading}
--- a/vehicle-data-platform/apps/web/src/test/App.test.tsx
+++ b/vehicle-data-platform/apps/web/src/test/App.test.tsx
@@ -1720,3 +1720,87 @@ test('shows selected source scope on vehicle detail', async () => {
  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(<App />);
+
+  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();
+});