shishengliang/lingniu-vehicle-ingest
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(platform-web): switch vehicle detail sources

Browse Source
This commit is contained in:
lingniu
2026-07-04 01:28:08 +08:00
parent edca567d52
commit a12d86e6f4
3 changed files with 135 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

62
vehicle-data-platform/apps/web/src/pages/VehicleDetail.tsx
View File

@@ -87,7 +87,14 @@ export function VehicleDetail({
const qualityCount = detail?.quality?.total ?? 0;
const online = resolution?.online || summary?.online || identity?.online || false;
const lastSeen = resolution?.lastSeen || summary?.lastSeen || latest?.lastSeen || '-';
const activeProtocol = query.protocol?.trim() ?? '';
const formKey = `${query.keyword}-${query.protocol ?? ''}`;
const switchSource = (nextProtocol = '') => {
const nextQuery = { keyword: resolvedVIN || query.keyword, protocol: nextProtocol };
setQuery(nextQuery);
onQueryChange?.(nextQuery.keyword, nextQuery.protocol);
load(nextQuery);
};
const qualityTable = (
<Table
loading={loading}
@@ -167,26 +174,45 @@ export function VehicleDetail({
<>
<Card bordered title="数据来源覆盖" style={{ marginTop: 16 }}>
{detail?.sourceStatus?.length ? (
<div className="vp-source-grid">
{detail.sourceStatus.map((source) => (
<div key={source.protocol} className="vp-source-card">
<div className="vp-source-card-head">
<Space>
<Tag color={source.protocol === summary?.primaryProtocol ? 'blue' : 'grey'}>{source.protocol}</Tag>
<StatusTag status={source.online ? 'ok' : 'offline'} />
<>
<div className="vp-source-toolbar">
<Space>
<Tag color={activeProtocol ? 'grey' : 'blue'}>{activeProtocol ? `当前 ${activeProtocol}` : '当前 全部来源'}</Tag>
<Button size="small" disabled={!activeProtocol} onClick={() => switchSource('')}>全部来源</Button>
</Space>
</div>
<div className="vp-source-grid">
{detail.sourceStatus.map((source) => (
<div key={source.protocol} className={`vp-source-card${activeProtocol === source.protocol ? ' vp-source-card-active' : ''}`}>
<div className="vp-source-card-head">
<Space>
<Tag color={source.protocol === summary?.primaryProtocol ? 'blue' : 'grey'}>{source.protocol}</Tag>
<StatusTag status={source.online ? 'ok' : 'offline'} />
</Space>
<Typography.Text type="tertiary">{source.lastSeen || '无上报'}</Typography.Text>
</div>
<Space spacing={4} wrap>
{sourceCapabilities.map((item) => (
<Tag key={item.key} color={source[item.key] ? 'green' : 'grey'}>
{item.label}{source[item.key] ? '有' : '无'}
</Tag>
))}
</Space>
<Typography.Text type="tertiary">{source.lastSeen || '无上报'}</Typography.Text>
<div className="vp-source-card-actions">
<Button
size="small"
theme={activeProtocol === source.protocol ? 'solid' : 'light'}
type={activeProtocol === source.protocol ? 'primary' : 'tertiary'}
disabled={activeProtocol === source.protocol}
onClick={() => switchSource(source.protocol)}
>
仅看 {source.protocol}
</Button>
</div>
</div>
<Space spacing={4} wrap>
{sourceCapabilities.map((item) => (
<Tag key={item.key} color={source[item.key] ? 'green' : 'grey'}>
{item.label}{source[item.key] ? '有' : '无'}
</Tag>
))}
</Space>
</div>
))}
</div>
))}
</div>
</>
) : (
<Typography.Text type="secondary">暂未查询到该车辆的数据来源覆盖。</Typography.Text>
)}