feat(platform): unify source status tags

vehicle-data-platform/apps/web/src/components/SourceStatusTags.tsx

@@ -0,0 +1,35 @@
+import { Space, Tag } from '@douyinfe/semi-ui';
+import type { VehicleSourceStatus } from '../api/types';
+
+function sourceStatusLabel(source: Pick<VehicleSourceStatus, 'online' | 'hasRealtime' | 'lastSeen'>) {
+  if (source.online) {
+    return { text: '在线', color: 'green' as const };
+  }
+  if (source.hasRealtime || source.lastSeen) {
+    return { text: '离线', color: 'orange' as const };
+  }
+  return { text: '未接入', color: 'grey' as const };
+}
+
+export function SourceStatusTags({
+  sourceStatus,
+  protocols,
+  lastSeen
+}: {
+  sourceStatus?: VehicleSourceStatus[];
+  protocols: string[];
+  lastSeen: string;
+}) {
+  const sources = sourceStatus?.length
+    ? sourceStatus
+    : protocols.map((protocol) => ({ protocol, online: false, hasRealtime: true, lastSeen }));
+
+  return (
+    <Space spacing={4} wrap>
+      {sources.map((source) => {
+        const status = sourceStatusLabel(source);
+        return <Tag key={source.protocol} color={status.color}>{source.protocol} {status.text}</Tag>;
+      })}
+    </Space>
+  );
+}