feat(platform): make vehicle action recommendations filterable

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

@@ -69,20 +69,26 @@ function sourceDiagnosisText(row: VehicleCoverageRow) {
   return parts.join('，');
 }
 
-function vehicleActionRecommendation(row: VehicleCoverageRow) {
+type VehicleActionRecommendation = {
+  label: string;
+  color: 'green' | 'orange' | 'red';
+  filters: Record<string, string> | null;
+};
+
+function vehicleActionRecommendation(row: VehicleCoverageRow): VehicleActionRecommendation {
   if (row.bindingStatus !== 'bound') {
-    return { label: '维护身份绑定', color: 'orange' as const };
+    return { label: '维护身份绑定', color: 'orange' as const, filters: { bindingStatus: 'unbound' } };
   }
   if ((row.missingProtocols ?? []).length > 0) {
-    return { label: `补齐 ${row.missingProtocols.join('、')} 来源`, color: 'orange' as const };
+    return { label: `补齐 ${row.missingProtocols.join('、')} 来源`, color: 'orange' as const, filters: { missingProtocol: row.missingProtocols[0] } };
   }
   if (row.sourceCount <= 0) {
-    return { label: '确认平台转发配置', color: 'orange' as const };
+    return { label: '确认平台转发配置', color: 'orange' as const, filters: { serviceStatus: 'no_data' } };
   }
   if (row.onlineSourceCount <= 0) {
-    return { label: '排查离线链路', color: 'red' as const };
+    return { label: '排查离线链路', color: 'red' as const, filters: { online: 'offline' } };
   }
-  return { label: '持续观察', color: 'green' as const };
+  return { label: '持续观察', color: 'green' as const, filters: null };
 }
 
 function sourceConsistencyAction(row: VehicleCoverageRow, onFilter: (filters: Record<string, string>) => void) {
@@ -246,6 +252,13 @@ export function Vehicles({
         width: 180,
         render: (_: unknown, row: VehicleCoverageRow) => {
           const action = vehicleActionRecommendation(row);
+          if (action.filters) {
+            return (
+              <Button size="small" theme="light" type={action.color === 'red' ? 'danger' : 'warning'} onClick={() => applyFilters({ ...filters, ...action.filters })}>
+                {action.label}
+              </Button>
+            );
+          }
           return <Tag color={action.color}>{action.label}</Tag>;
         }
       },