feat(platform): add single vehicle action desk

This commit is contained in:
lingniu
2026-07-05 18:13:57 +08:00
parent 098e927ada
commit 91b60ed63a
3 changed files with 169 additions and 0 deletions

View File

@@ -728,6 +728,53 @@ export function VehicleDetail({
]
}
];
const customerVehicleActionBar = [
{
title: '看当前位置',
value: formatLocation(latest),
detail: '确认车辆当前位置、在线状态、最后上报和地图可用性。',
action: '实时地图',
color: online ? 'green' as const : hasResolvedVIN ? 'orange' as const : 'grey' as const,
disabled: !hasResolvedVIN,
onClick: () => onOpenRealtime(resolvedVIN, activeProtocol)
},
{
title: '回放轨迹',
value: `${formatCompactNumber(overview?.historyCount ?? detail?.history?.total ?? 0)}`,
detail: '按同一车辆进入轨迹回放,复核位置、速度和里程断点。',
action: '轨迹回放',
color: (overview?.historyCount ?? detail?.history?.total ?? 0) > 0 ? 'blue' as const : 'grey' as const,
disabled: !hasResolvedVIN,
onClick: () => onOpenHistory(resolvedVIN, activeProtocol)
},
{
title: '核对里程',
value: `${formatCompactNumber(overview?.mileageCount ?? detail?.mileage?.total ?? 0)}`,
detail: '进入统计查询,核对区间里程、日里程和统计闭合。',
action: '统计查询',
color: (overview?.mileageCount ?? detail?.mileage?.total ?? 0) > 0 ? 'green' as const : 'grey' as const,
disabled: !hasResolvedVIN,
onClick: () => onOpenMileage(resolvedVIN, activeProtocol)
},
{
title: '导出证据',
value: `${formatCompactNumber(overview?.rawCount ?? detail?.raw?.total ?? 0)}`,
detail: '查询历史数据和字段证据,作为客户复盘与导出依据。',
action: '历史导出',
color: (overview?.rawCount ?? detail?.raw?.total ?? 0) > 0 ? 'blue' as const : 'grey' as const,
disabled: !hasResolvedVIN,
onClick: () => onOpenRaw(resolvedVIN, activeProtocol)
},
{
title: '告警通知',
value: `${qualityCount.toLocaleString()}`,
detail: priorityQualityIssue ? `${qualityIssueLabel(priorityQualityIssue.issueType)} / ${priorityQualityIssue.lastSeen || '-'}` : '暂无待通知告警。',
action: '告警闭环',
color: qualityCount > 0 ? 'orange' as const : 'green' as const,
disabled: !hasResolvedVIN && qualityCount <= 0,
onClick: () => onOpenQuality?.(qualityFiltersForCurrentVehicle())
}
];
const serviceRunbookSteps = [
{
title: '确认实时状态',
@@ -1188,6 +1235,32 @@ export function VehicleDetail({
<Typography.Text type="secondary">
SOC
</Typography.Text>
<div className="vp-single-vehicle-action-bar" aria-label="客户单车操作台">
<div className="vp-single-vehicle-action-head">
<div>
<strong></strong>
<span></span>
</div>
<Tag color="blue"></Tag>
</div>
<div className="vp-single-vehicle-action-grid">
{customerVehicleActionBar.map((item) => (
<button
key={item.title}
type="button"
className="vp-single-vehicle-action-item"
disabled={item.disabled}
onClick={item.onClick}
aria-label={`客户单车操作台 ${item.title} ${item.value} ${item.action}`}
>
<Tag color={item.color}>{item.title}</Tag>
<strong>{item.value}</strong>
<span>{item.detail}</span>
<em>{item.action}</em>
</button>
))}
</div>
</div>
<div className="vp-vehicle-live-facts">
{[
{ label: '当前位置', value: formatLocation(latest) },