feat(platform-web): show dashboard coverage filter context

This commit is contained in:
lingniu
2026-07-04 02:19:59 +08:00
parent a6edc02be5
commit 826fa76008
2 changed files with 15 additions and 0 deletions

View File

@@ -20,6 +20,13 @@ const serviceStatusColor: Record<string, 'green' | 'orange' | 'red' | 'grey'> =
identity_required: 'orange'
};
const serviceStatusTitle: Record<string, string> = {
healthy: '服务正常',
degraded: '部分来源离线',
offline: '车辆离线',
identity_required: '身份未绑定'
};
function formatLag(value?: number | null) {
return value == null ? '未接入' : value.toLocaleString();
}
@@ -47,9 +54,11 @@ export function Dashboard({ onOpenVehicle, onOpenQuality }: { onOpenVehicle: (vi
const [qualityIssues, setQualityIssues] = useState<QualityIssueRow[]>([]);
const [loading, setLoading] = useState(true);
const [coverageLoading, setCoverageLoading] = useState(false);
const [coverageServiceStatusTitle, setCoverageServiceStatusTitle] = useState('');
const loadCoverage = (values?: Record<string, string>) => {
setCoverageLoading(true);
setCoverageServiceStatusTitle(values?.serviceStatus ? serviceStatusTitle[values.serviceStatus] ?? values.serviceStatus : '');
const params = new URLSearchParams({ limit: '8' });
if (values?.keyword) params.set('keyword', values.keyword);
if (values?.coverage) params.set('coverage', values.coverage);
@@ -193,6 +202,11 @@ export function Dashboard({ onOpenVehicle, onOpenQuality }: { onOpenVehicle: (vi
/>
</Card>
<Card title="车辆服务覆盖" bordered style={{ marginTop: 16 }}>
{coverageServiceStatusTitle ? (
<div className="vp-scope-bar" style={{ marginBottom: 12 }}>
<Tag color="blue">{coverageServiceStatusTitle}</Tag>
</div>
) : null}
<Form layout="horizontal" onSubmit={(values) => loadCoverage(values as Record<string, string>)} style={{ marginBottom: 12 }}>
<Form.Input field="keyword" label="关键词" placeholder="VIN / 车牌 / 手机号 / OEM" style={{ width: 240 }} />
<Form.Select field="coverage" label="来源覆盖" placeholder="全部" style={{ width: 130 }}>

View File

@@ -215,6 +215,7 @@ test('filters dashboard coverage by service status', async () => {
await waitFor(() => {
expect(fetchMock).toHaveBeenCalledWith(expect.stringContaining('serviceStatus=degraded'), undefined);
});
expect(screen.getByText('当前筛选:部分来源离线')).toBeInTheDocument();
});
test('opens dashboard coverage from service status distribution', async () => {