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

feat(platform): add ten second vehicle triage

Browse Source
This commit is contained in:
lingniu
2026-07-06 00:34:07 +08:00
parent 2299588df6
commit c00cb0218a
3 changed files with 145 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

56
vehicle-data-platform/apps/web/src/pages/Dashboard.tsx
View File

@@ -1707,6 +1707,32 @@ export function Dashboard({
onClick: () => onOpenQuality(highPriorityIssue?.issueType ? { issueType: highPriorityIssue.issueType } : {})
}
];
const tenSecondTriageItems = [
{
label: '告警车辆',
value: `${formatCount(summary?.issueVehicles)} 辆`,
detail: highPriorityIssue ? `${qualityIssueLabel(highPriorityIssue.issueType)} / ${priorityIssueVehicleLabel(highPriorityIssue)}` : '暂无高优先级告警，保持日常巡检。',
action: '处理告警',
color: (summary?.issueVehicles ?? 0) > 0 ? 'orange' as const : 'green' as const,
onClick: () => onOpenQuality(highPriorityIssue?.issueType ? { issueType: highPriorityIssue.issueType } : {})
},
{
label: '无数据车辆',
value: `${formatCount(serviceSummary?.noDataVehicles)} 辆`,
detail: '优先确认平台转发、车辆是否在线以及是否有任何来源证据。',
action: '查车辆',
color: (serviceSummary?.noDataVehicles ?? 0) > 0 ? 'orange' as const : 'green' as const,
onClick: () => onOpenVehicles({ serviceStatus: 'no_data' })
},
{
label: '身份未绑定',
value: `${formatCount(serviceSummary?.identityRequiredVehicles)} 辆`,
detail: '已有上报但无法稳定归并到 VIN，会影响地图、轨迹和统计聚合。',
action: '维护绑定',
color: (serviceSummary?.identityRequiredVehicles ?? 0) > 0 ? 'orange' as const : 'green' as const,
onClick: () => onOpenVehicles({ serviceStatus: 'identity_required' })
}
];
const amapVehicleServiceItems = [
{
label: '实时看车',
@@ -2456,6 +2482,36 @@ export function Dashboard({
))}
</div>
</section>
<section className="vp-ten-second-triage" aria-label="十秒车辆处置台">
<div className="vp-ten-second-triage-copy">
<Space wrap>
<Tag color="blue">十秒车辆处置台</Tag>
<Tag color={(summary?.issueVehicles ?? 0) > 0 || (serviceSummary?.noDataVehicles ?? 0) > 0 ? 'orange' : 'green'}>先处理异常车辆</Tag>
</Space>
<Typography.Title heading={5} style={{ margin: 0 }}>
登录后先知道哪三类车辆最需要处理，再进入地图、车辆中心或告警通知。
</Typography.Title>
<Typography.Text type="secondary">
首页只保留能直接行动的优先级：告警车辆、无数据车辆、身份未绑定车辆；协议来源留在证据层解释原因。
</Typography.Text>
</div>
<div className="vp-ten-second-triage-grid">
{tenSecondTriageItems.map((item) => (
<button
key={item.label}
type="button"
className="vp-ten-second-triage-item"
onClick={item.onClick}
aria-label={`十秒车辆处置台 ${item.label} ${item.value} ${item.action}`}
>
<Tag color={item.color}>{item.label}</Tag>
<strong>{item.value}</strong>
<span>{item.detail}</span>
<em>{item.action}</em>
</button>
))}
</div>
</section>
<section className="vp-customer-service-journey" aria-label="车辆服务闭环">
<div className="vp-customer-service-journey-copy">
<Tag color="blue">车辆服务闭环</Tag>

84
vehicle-data-platform/apps/web/src/styles/global.css
View File

@@ -2081,6 +2081,88 @@ body {
line-height: 18px;
}
.vp-ten-second-triage {
margin-bottom: 16px;
padding: 14px;
border: 1px solid rgba(245, 135, 0, 0.18);
border-radius: 8px;
background: #ffffff;
display: grid;
grid-template-columns: minmax(300px, 0.5fr) minmax(0, 1.5fr);
gap: 14px;
align-items: stretch;
}
.vp-ten-second-triage-copy {
padding: 16px;
border: 1px solid rgba(245, 135, 0, 0.14);
border-radius: 8px;
background: #fffaf2;
display: grid;
gap: 10px;
align-content: center;
}
.vp-ten-second-triage-copy .semi-typography {
line-height: 25px;
}
.vp-ten-second-triage-grid {
min-width: 0;
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 10px;
}
.vp-ten-second-triage-item {
min-width: 0;
min-height: 128px;
padding: 12px;
border: 1px solid rgba(245, 135, 0, 0.16);
border-radius: 8px;
background: #fffdfa;
color: inherit;
cursor: pointer;
font: inherit;
text-align: left;
display: grid;
gap: 8px;
align-content: start;
transition: border-color 0.16s ease, box-shadow 0.16s ease, background 0.16s ease;
}
.vp-ten-second-triage-item:hover,
.vp-ten-second-triage-item:focus-visible {
border-color: rgba(245, 135, 0, 0.42);
background: #fff8ec;
box-shadow: 0 0 0 3px rgba(245, 135, 0, 0.08);
outline: none;
}
.vp-ten-second-triage-item strong {
color: var(--vp-text);
font-size: 18px;
line-height: 24px;
font-weight: 800;
word-break: break-word;
}
.vp-ten-second-triage-item span {
color: var(--vp-text-muted);
font-size: 12px;
line-height: 18px;
word-break: break-word;
}
.vp-ten-second-triage-item em {
align-self: end;
color: #d25f00;
font-size: 12px;
font-style: normal;
font-weight: 800;
line-height: 18px;
}
.vp-customer-service-journey {
margin-bottom: 16px;
padding: 14px;
@@ -12363,6 +12445,8 @@ button.vp-realtime-command-item:focus-visible {
.vp-customer-platform-blueprint-grid,
.vp-customer-saved-view-library,
.vp-customer-saved-view-library-grid,
.vp-ten-second-triage,
.vp-ten-second-triage-grid,
.vp-customer-service-separation,
.vp-customer-primary-flow-grid,
.vp-source-readiness-grid,

5
vehicle-data-platform/apps/web/src/test/App.test.tsx
View File

@@ -1369,6 +1369,11 @@ test('dashboard exposes vehicle data center capability matrix', async () => {
expect(screen.getByRole('button', { name: '客户常用视图库 轨迹日报模板 4 活跃 历史导出' })).toBeInTheDocument();
expect(screen.getByRole('button', { name: '客户常用视图库 里程周报模板 1,033 车辆 统计查询' })).toBeInTheDocument();
expect(screen.getByRole('button', { name: '客户常用视图库 告警订阅视图 7 告警 通知闭环' })).toBeInTheDocument();
expect(screen.getByRole('region', { name: '十秒车辆处置台' })).toBeInTheDocument();
expect(screen.getByText('登录后先知道哪三类车辆最需要处理，再进入地图、车辆中心或告警通知。')).toBeInTheDocument();
expect(screen.getByRole('button', { name: '十秒车辆处置台 告警车辆 7 辆 处理告警' })).toBeInTheDocument();
expect(screen.getByRole('button', { name: '十秒车辆处置台 无数据车辆 461 辆 查车辆' })).toBeInTheDocument();
expect(screen.getByRole('button', { name: '十秒车辆处置台 身份未绑定 9 辆 维护绑定' })).toBeInTheDocument();
expect(screen.getByText('现代车队运营台')).toBeInTheDocument();
expect(screen.getByText('一屏完成车辆地图、轨迹回放、里程统计、数据导出和告警闭环。')).toBeInTheDocument();
expect(screen.getByRole('button', { name: '现代车队运营台 Live Map 208 在线 打开地图' })).toBeInTheDocument();