feat(platform): filter vehicle coverage

This commit is contained in:
lingniu
2026-07-03 21:59:03 +08:00
parent 110041a9db
commit 2d064e3c53
5 changed files with 101 additions and 7 deletions

View File

@@ -1,4 +1,4 @@
import { Button, Card, Col, Row, Space, Spin, Table, Tag, Toast, Typography } from '@douyinfe/semi-ui';
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, RealtimeLocationRow, VehicleCoverageRow, VehicleRow } from '../api/types';
@@ -17,6 +17,20 @@ export function Dashboard({ onOpenVehicle }: { onOpenVehicle: (vin: string) => v
const [coverage, setCoverage] = useState<VehicleCoverageRow[]>([]);
const [locations, setLocations] = useState<RealtimeLocationRow[]>([]);
const [loading, setLoading] = useState(true);
const [coverageLoading, setCoverageLoading] = useState(false);
const loadCoverage = (values?: Record<string, string>) => {
setCoverageLoading(true);
const params = new URLSearchParams({ limit: '8' });
if (values?.keyword) params.set('keyword', values.keyword);
if (values?.coverage) params.set('coverage', values.coverage);
if (values?.online) params.set('online', values.online);
if (values?.bindingStatus) params.set('bindingStatus', values.bindingStatus);
api.vehicleCoverage(params)
.then((page) => setCoverage(page.items))
.catch((error: Error) => Toast.error(error.message))
.finally(() => setCoverageLoading(false));
};
useEffect(() => {
Promise.all([
@@ -93,7 +107,27 @@ export function Dashboard({ onOpenVehicle }: { onOpenVehicle: (vin: string) => v
<Typography.Text>Kafka {summary?.kafkaLag ?? 0}</Typography.Text>
</Card>
<Card title="车辆服务覆盖" bordered style={{ marginTop: 16 }}>
<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 }}>
<Select.Option value="single"></Select.Option>
<Select.Option value="multi"></Select.Option>
</Form.Select>
<Form.Select field="online" label="在线" placeholder="全部" style={{ width: 130 }}>
<Select.Option value="online">线</Select.Option>
<Select.Option value="offline">线</Select.Option>
</Form.Select>
<Form.Select field="bindingStatus" label="绑定" placeholder="全部" style={{ width: 130 }}>
<Select.Option value="bound"></Select.Option>
<Select.Option value="unbound"></Select.Option>
</Form.Select>
<Space>
<Button htmlType="submit" theme="solid" type="primary"></Button>
<Button onClick={() => loadCoverage()}></Button>
</Space>
</Form>
<Table
loading={coverageLoading}
pagination={false}
rowKey="vin"
dataSource={coverage}