feat(platform): add dedicated time monitor workspace

vehicle-data-platform/apps/web/src/pages/Dashboard.tsx

@@ -287,7 +287,9 @@ export function Dashboard({
   onOpenVehicles,
   onOpenHistory,
   onOpenMileage,
-  customerTimeWindow
+  customerTimeWindow,
+  focusMode = 'overview',
+  initialTimeMonitorFilters
 }: {
   onOpenVehicle: (vin: string, protocol?: string) => void;
   onOpenQuality: (filters?: Record<string, string>) => void;
@@ -297,6 +299,8 @@ export function Dashboard({
   onOpenHistory: (filters?: Record<string, string>) => void;
   onOpenMileage: (filters?: Record<string, string>) => void;
   customerTimeWindow?: Record<string, string>;
+  focusMode?: 'overview' | 'time-window';
+  initialTimeMonitorFilters?: Record<string, string>;
 }) {
   const [summary, setSummary] = useState<DashboardSummary | null>(null);
   const [serviceSummary, setServiceSummary] = useState<VehicleServiceSummary | null>(null);
@@ -304,7 +308,10 @@ export function Dashboard({
   const [locations, setLocations] = useState<VehicleRealtimeRow[]>([]);
   const [qualityIssues, setQualityIssues] = useState<QualityIssueRow[]>([]);
   const [opsHealth, setOpsHealth] = useState<OpsHealth | null>(null);
-  const [timeMonitorFilters, setTimeMonitorFilters] = useState<Record<string, string>>(defaultTimeMonitorFilters);
+  const [timeMonitorFilters, setTimeMonitorFilters] = useState<Record<string, string>>({
+    ...defaultTimeMonitorFilters(),
+    ...(initialTimeMonitorFilters ?? {})
+  });
   const [loading, setLoading] = useState(true);
   const [coverageLoading, setCoverageLoading] = useState(false);
   const [coverageServiceStatusTitle, setCoverageServiceStatusTitle] = useState('');
@@ -1174,6 +1181,36 @@ export function Dashboard({
       onClick: () => copyTimeMonitorReviewPackage()
     }
   ];
+  const dedicatedTimeMonitorActions = [
+    {
+      label: '轨迹回放',
+      value: timeMonitorWindowLabel,
+      detail: '按同一辆车和时间窗回放位置、速度、停留和里程断点。',
+      color: timeMonitorHasTrajectory ? 'blue' as const : 'orange' as const,
+      onClick: openTimeMonitorHistory
+    },
+    {
+      label: '统计查询',
+      value: timeMonitorWindowLabel,
+      detail: '用同一时间窗核对区间里程、日报闭合和异常点。',
+      color: 'green' as const,
+      onClick: openTimeMonitorMileage
+    },
+    {
+      label: '历史导出',
+      value: `${formatCount(summary?.frameToday)} 帧`,
+      detail: '导出历史位置、原始记录和字段证据，形成客户可复核数据包。',
+      color: timeMonitorHasHistory ? 'blue' as const : 'orange' as const,
+      onClick: openTimeMonitorRaw
+    },
+    {
+      label: '告警复盘',
+      value: `${formatCount(summary?.issueVehicles)} 告警`,
+      detail: '用同一时间窗解释异常车辆、通知策略和恢复验收。',
+      color: timeMonitorHasAlerts ? 'orange' as const : 'green' as const,
+      onClick: openTimeMonitorAlerts
+    }
+  ];
   const dataFlowStages = [
     {
       stage: '01',
@@ -2600,8 +2637,45 @@ export function Dashboard({
 
   return (
     <div className="vp-page">
-      <PageHeader title="车辆服务工作台" description="面向客户的车辆地图、实时监控、轨迹回放、统计查询、自定义时间窗复盘、历史查询、告警通知和数据导出" />
+      <PageHeader
+        title={focusMode === 'time-window' ? '自定义时间监控' : '车辆服务工作台'}
+        description={focusMode === 'time-window'
+          ? '把客户选择的一辆车和一个时间窗固定下来，同时进入实时地图、轨迹回放、里程统计、历史导出和告警复盘。'
+          : '面向客户的车辆地图、实时监控、轨迹回放、统计查询、自定义时间窗复盘、历史查询、告警通知和数据导出'}
+      />
       <Spin spinning={loading}>
+        {focusMode === 'time-window' ? (
+          <section className="vp-time-monitor-dedicated" aria-label="时间窗监控">
+            <div className="vp-time-monitor-dedicated-copy">
+              <Space wrap>
+                <Tag color="blue">时间窗监控</Tag>
+                <Tag color={timeMonitorHasRange ? 'green' : 'orange'}>{timeMonitorWindowLabel}</Tag>
+                <Tag color={timeMonitorDeliveryStatus.color}>{timeMonitorDeliveryStatus.label}</Tag>
+              </Space>
+              <Typography.Title heading={4} style={{ margin: 0 }}>
+                当前监控范围：{timeMonitorScopeValue.keyword || '全部车辆'} / {timeMonitorScopeValue.protocol || '全部数据通道'} / {timeMonitorScopeValue.dateFrom || '-'} 至 {timeMonitorScopeValue.dateTo || '-'}
+              </Typography.Title>
+              <Typography.Text type="secondary">
+                用同一组筛选条件贯穿地图定位、轨迹复盘、里程对账、历史证据导出和告警说明，避免客户跨页面重复输入。
+              </Typography.Text>
+            </div>
+            <div className="vp-time-monitor-dedicated-grid">
+              {dedicatedTimeMonitorActions.map((item) => (
+                <button
+                  key={item.label}
+                  type="button"
+                  className="vp-time-monitor-dedicated-item"
+                  onClick={item.onClick}
+                  aria-label={`时间窗监控入口 ${item.label} ${item.value}`}
+                >
+                  <Tag color={item.color}>{item.label}</Tag>
+                  <strong>{item.value}</strong>
+                  <span>{item.detail}</span>
+                </button>
+              ))}
+            </div>
+          </section>
+        ) : null}
         <section className="vp-vehicle-command-center" aria-label="车辆服务指挥台">
           <div className="vp-vehicle-command-map">
             <VehicleMap