diff --git a/vehicle-data-platform/apps/web/src/App.tsx b/vehicle-data-platform/apps/web/src/App.tsx index 6d62f295..4f2a2ce1 100644 --- a/vehicle-data-platform/apps/web/src/App.tsx +++ b/vehicle-data-platform/apps/web/src/App.tsx @@ -1,6 +1,7 @@ import { useCallback, useEffect, useState } from 'react'; import { Toast } from '@douyinfe/semi-ui'; import { api } from './api/client'; +import type { VehicleServiceStatus } from './api/types'; import { buildAppHash, parseAppHash } from './domain/appRoute'; import { AppShell, type PageKey } from './layout/AppShell'; import { Dashboard } from './pages/Dashboard'; @@ -19,6 +20,7 @@ export default function App() { const [analysisVin, setAnalysisVin] = useState(initialVehicleKey); const [activeProtocol, setActiveProtocol] = useState(initialRoute.protocol ?? ''); const [linkIssueCount, setLinkIssueCount] = useState(null); + const [currentVehicleStatus, setCurrentVehicleStatus] = useState(); const refreshOpsHealth = useCallback((showError = true) => { return api.opsHealth() @@ -91,6 +93,7 @@ export default function App() { try { const resolved = await api.vehicleResolve(new URLSearchParams({ keyword: lookupKey })); const nextKey = resolved.resolved && resolved.vin ? resolved.vin : lookupKey; + setCurrentVehicleStatus(resolved.serviceStatus); setActiveVin(nextKey); setActiveProtocol(nextProtocol); setActivePage('detail'); @@ -149,7 +152,7 @@ export default function App() { }; return ( - + {pages[activePage]} ); diff --git a/vehicle-data-platform/apps/web/src/layout/AppShell.tsx b/vehicle-data-platform/apps/web/src/layout/AppShell.tsx index 9519f6c8..7b6c6b73 100644 --- a/vehicle-data-platform/apps/web/src/layout/AppShell.tsx +++ b/vehicle-data-platform/apps/web/src/layout/AppShell.tsx @@ -11,6 +11,7 @@ import { } from '@douyinfe/semi-icons'; import type { ReactNode } from 'react'; import { useState } from 'react'; +import type { VehicleServiceStatus } from '../api/types'; export type PageKey = 'dashboard' | 'vehicles' | 'realtime' | 'detail' | 'history' | 'mileage' | 'quality'; @@ -34,12 +35,14 @@ function linkHealthClassName(count: number | null) { export function AppShell({ activePage, linkIssueCount, + currentVehicleStatus, onChange, onVehicleSearch, children }: { activePage: PageKey; linkIssueCount: number | null; + currentVehicleStatus?: VehicleServiceStatus; onChange: (page: PageKey) => void; onVehicleSearch: (keyword: string) => void | Promise; children: ReactNode; @@ -86,6 +89,11 @@ export function AppShell({ + {currentVehicleStatus ? ( + + 当前车辆:{currentVehicleStatus.title} + + ) : null} 生产环境 多源接入 / 一个车辆服务