feat(platform): add custom time window monitor

This commit is contained in:
lingniu
2026-07-05 17:23:12 +08:00
parent afbe29b8de
commit 2e20ec5c81
3 changed files with 168 additions and 0 deletions

View File

@@ -1006,6 +1006,54 @@ export function History({
onClick: () => copyDeliveryPackage()
}
];
const timeWindowMonitorItems = [
{
title: '轨迹复盘',
value: validLocations.length > 0 ? `${validLocations.length.toLocaleString()}` : '待查询',
detail: `${filters.dateFrom || '-'}${filters.dateTo || '-'},先确认位置覆盖和断点。`,
action: '位置历史',
color: validLocations.length > 0 ? 'green' as const : 'orange' as const,
disabled: false,
onClick: () => openQueryTab('location')
},
{
title: '统计核对',
value: formatNumber(mileageDelta, ' km'),
detail: '把同一时间窗带到统计查询,核对区间里程和日报闭合。',
action: '统计查询',
color: isFiniteNumber(mileageDelta) ? 'green' as const : 'grey' as const,
disabled: !onOpenMileage,
onClick: () => onOpenMileage?.({ keyword: currentVehicleKeyword, protocol: currentProtocol, ...(filters.dateFrom ? { dateFrom: filters.dateFrom } : {}), ...(filters.dateTo ? { dateTo: filters.dateTo } : {}) })
},
{
title: '历史证据',
value: `${(rawFrames.total ?? 0).toLocaleString()}`,
detail: selectedFieldCount > 0 ? `包含 ${selectedFieldCount.toLocaleString()} 个字段裁剪。` : '保留原始明细和解析字段,解释位置、里程和字段来源。',
action: '明细证据',
color: (rawFrames.total ?? 0) > 0 ? 'blue' as const : 'grey' as const,
disabled: false,
onClick: () => openQueryTab('raw')
},
{
title: '告警复盘',
value: anomalyTotal > 0 ? `${anomalyTotal.toLocaleString()} 项提示` : '同步说明',
detail: '用同一车辆和时间窗打开告警事件,解释断链、字段缺失和质量影响。',
action: '告警说明',
color: anomalyTotal > 0 ? 'orange' as const : 'blue' as const,
disabled: false,
onClick: () => {
window.location.hash = buildAppHash({
page: 'alert-events',
keyword: currentVehicleKeyword,
protocol: currentProtocol,
filters: {
...(filters.dateFrom ? { dateFrom: filters.dateFrom } : {}),
...(filters.dateTo ? { dateTo: filters.dateTo } : {})
}
});
}
}
];
const historyReportTemplates = [
{
title: '轨迹报告',
@@ -1442,6 +1490,40 @@ export function History({
<Tag color={currentProtocol ? 'blue' : 'green'}>{currentProtocol || '全部数据通道'}</Tag>
<Typography.Text type="tertiary">{scopeDescription}</Typography.Text>
</div>
{mode === 'query' ? (
<Card bordered title="自定义时间窗监控台" style={{ marginTop: 16 }}>
<div className="vp-history-time-window-board">
<div className="vp-history-time-window-summary">
<Space wrap>
<Tag color="blue"></Tag>
<Tag color={deliveryStateColor}>{deliveryState}</Tag>
<Tag color={currentVehicleKeyword ? 'green' : 'orange'}>{currentVehicleKeyword || '全部车辆'}</Tag>
</Space>
<Typography.Title heading={5} style={{ margin: 0 }}></Typography.Title>
<Typography.Text type="secondary">
线穿
</Typography.Text>
</div>
<div className="vp-history-time-window-grid">
{timeWindowMonitorItems.map((item) => (
<button
key={item.title}
type="button"
className="vp-history-time-window-item"
disabled={item.disabled}
onClick={item.onClick}
aria-label={`自定义时间窗监控 ${item.title} ${item.action}`}
>
<Tag color={item.color}>{item.title}</Tag>
<strong>{item.value}</strong>
<span>{item.detail}</span>
<em>{item.action}</em>
</button>
))}
</div>
</div>
</Card>
) : null}
{mode === 'query' ? (
<Card bordered className="vp-history-customer-export-board" bodyStyle={{ padding: 0 }}>
<div className="vp-history-customer-export-summary">