feat(platform): summarize service status on dashboard

This commit is contained in:
lingniu
2026-07-04 01:59:05 +08:00
parent 14408d135d
commit 5d401a8f0b
8 changed files with 132 additions and 10 deletions

View File

@@ -1,7 +1,7 @@
import { Button, Card, Col, Form, Row, Select, Space, Spin, Table, Tag, Toast, Typography } from '@douyinfe/semi-ui';
import { useEffect, useState } from 'react';
import { api } from '../api/client';
import type { DashboardSummary, LinkHealth, ProtocolStat, QualityIssueRow, VehicleCoverageRow, VehicleRealtimeRow } from '../api/types';
import type { DashboardSummary, LinkHealth, ProtocolStat, QualityIssueRow, ServiceStatusStat, VehicleCoverageRow, VehicleRealtimeRow } from '../api/types';
import { PageHeader } from '../components/PageHeader';
import { StatusTag } from '../components/StatusTag';
import { qualityIssueVehicleLookup } from '../domain/vehicleLookup';
@@ -12,6 +12,13 @@ const statusColor: Record<string, 'green' | 'orange' | 'red' | 'grey'> = {
error: 'red'
};
const serviceStatusColor: Record<string, 'green' | 'orange' | 'red' | 'grey'> = {
healthy: 'green',
degraded: 'orange',
offline: 'red',
identity_required: 'orange'
};
function formatLag(value?: number | null) {
return value == null ? '未接入' : value.toLocaleString();
}
@@ -74,7 +81,22 @@ export function Dashboard({ onOpenVehicle, onOpenQuality }: { onOpenVehicle: (vi
))}
</div>
<Row gutter={16}>
<Col span={14}>
<Col span={8}>
<Card title="车辆服务状态" bordered>
<Table
pagination={false}
dataSource={summary?.serviceStatuses ?? []}
columns={[
{
title: '状态',
render: (_: unknown, row: ServiceStatusStat) => <Tag color={serviceStatusColor[row.status] ?? 'grey'}>{row.title}</Tag>
},
{ title: '车辆数', dataIndex: 'count' }
]}
/>
</Card>
</Col>
<Col span={8}>
<Card title="数据来源在线分布" bordered>
<Table
pagination={false}
@@ -91,7 +113,7 @@ export function Dashboard({ onOpenVehicle, onOpenQuality }: { onOpenVehicle: (vi
/>
</Card>
</Col>
<Col span={10}>
<Col span={8}>
<Card title="链路健康" bordered>
<Table
pagination={false}