feat(platform-web): show dashboard coverage filter context
This commit is contained in:
@@ -20,6 +20,13 @@ const serviceStatusColor: Record<string, 'green' | 'orange' | 'red' | 'grey'> =
|
|||||||
identity_required: 'orange'
|
identity_required: 'orange'
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const serviceStatusTitle: Record<string, string> = {
|
||||||
|
healthy: '服务正常',
|
||||||
|
degraded: '部分来源离线',
|
||||||
|
offline: '车辆离线',
|
||||||
|
identity_required: '身份未绑定'
|
||||||
|
};
|
||||||
|
|
||||||
function formatLag(value?: number | null) {
|
function formatLag(value?: number | null) {
|
||||||
return value == null ? '未接入' : value.toLocaleString();
|
return value == null ? '未接入' : value.toLocaleString();
|
||||||
}
|
}
|
||||||
@@ -47,9 +54,11 @@ export function Dashboard({ onOpenVehicle, onOpenQuality }: { onOpenVehicle: (vi
|
|||||||
const [qualityIssues, setQualityIssues] = useState<QualityIssueRow[]>([]);
|
const [qualityIssues, setQualityIssues] = useState<QualityIssueRow[]>([]);
|
||||||
const [loading, setLoading] = useState(true);
|
const [loading, setLoading] = useState(true);
|
||||||
const [coverageLoading, setCoverageLoading] = useState(false);
|
const [coverageLoading, setCoverageLoading] = useState(false);
|
||||||
|
const [coverageServiceStatusTitle, setCoverageServiceStatusTitle] = useState('');
|
||||||
|
|
||||||
const loadCoverage = (values?: Record<string, string>) => {
|
const loadCoverage = (values?: Record<string, string>) => {
|
||||||
setCoverageLoading(true);
|
setCoverageLoading(true);
|
||||||
|
setCoverageServiceStatusTitle(values?.serviceStatus ? serviceStatusTitle[values.serviceStatus] ?? values.serviceStatus : '');
|
||||||
const params = new URLSearchParams({ limit: '8' });
|
const params = new URLSearchParams({ limit: '8' });
|
||||||
if (values?.keyword) params.set('keyword', values.keyword);
|
if (values?.keyword) params.set('keyword', values.keyword);
|
||||||
if (values?.coverage) params.set('coverage', values.coverage);
|
if (values?.coverage) params.set('coverage', values.coverage);
|
||||||
@@ -193,6 +202,11 @@ export function Dashboard({ onOpenVehicle, onOpenQuality }: { onOpenVehicle: (vi
|
|||||||
/>
|
/>
|
||||||
</Card>
|
</Card>
|
||||||
<Card title="车辆服务覆盖" bordered style={{ marginTop: 16 }}>
|
<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 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.Input field="keyword" label="关键词" placeholder="VIN / 车牌 / 手机号 / OEM" style={{ width: 240 }} />
|
||||||
<Form.Select field="coverage" label="来源覆盖" placeholder="全部" style={{ width: 130 }}>
|
<Form.Select field="coverage" label="来源覆盖" placeholder="全部" style={{ width: 130 }}>
|
||||||
|
|||||||
@@ -215,6 +215,7 @@ test('filters dashboard coverage by service status', async () => {
|
|||||||
await waitFor(() => {
|
await waitFor(() => {
|
||||||
expect(fetchMock).toHaveBeenCalledWith(expect.stringContaining('serviceStatus=degraded'), undefined);
|
expect(fetchMock).toHaveBeenCalledWith(expect.stringContaining('serviceStatus=degraded'), undefined);
|
||||||
});
|
});
|
||||||
|
expect(screen.getByText('当前筛选:部分来源离线')).toBeInTheDocument();
|
||||||
});
|
});
|
||||||
|
|
||||||
test('opens dashboard coverage from service status distribution', async () => {
|
test('opens dashboard coverage from service status distribution', async () => {
|
||||||
|
|||||||
Reference in New Issue
Block a user