diff --git a/vehicle-data-platform/apps/web/src/pages/Mileage.tsx b/vehicle-data-platform/apps/web/src/pages/Mileage.tsx index c49e4200..c9d50cc2 100644 --- a/vehicle-data-platform/apps/web/src/pages/Mileage.tsx +++ b/vehicle-data-platform/apps/web/src/pages/Mileage.tsx @@ -231,6 +231,13 @@ export function Mileage({ const hasFullMileagePage = summary.recordCount > 0 && rows.length === summary.recordCount; const closureDeltaKm = hasFullMileagePage ? summary.totalMileageKm - pageMileageTotal : undefined; const closurePassed = closureDeltaKm != null && Math.abs(closureDeltaKm) < 0.01; + const closureStatus = closureDeltaKm == null ? '分页抽样' : closurePassed ? '闭合通过' : '闭合异常'; + const closureStatusColor = closurePassed ? 'green' as const : closureDeltaKm == null ? 'grey' as const : 'orange' as const; + const closureActionText = closureDeltaKm == null + ? '当前页未覆盖全量记录，请翻页、导出或缩小筛选范围后核验。' + : closurePassed + ? '当前筛选范围汇总总里程与明细合计一致，可作为统计证据。' + : '汇总总里程与明细合计不一致，请核对分页、来源和异常记录。'; const confidenceStatus = anomalyRows.length > 0 || pageCoverageRate < 100 ? '需复核' : '可用于 BI'; const confidenceColor = confidenceStatus === '可用于 BI' ? 'green' as const : 'orange' as const; const currentEvidenceText = `${summary.vehicleCount.toLocaleString()} 车 / ${summary.sourceCount.toLocaleString()} 来源 / ${rows.length.toLocaleString()} 条明细`; @@ -457,6 +464,45 @@ export function Mileage({ ))} + +
+ {[ + { label: '汇总总里程', value: `${formatKm(summary.totalMileageKm)} km`, color: 'blue' as const, detail: '后端按当前筛选范围返回的区间里程总值。' }, + { label: '明细合计', value: `${formatKm(pageMileageTotal)} km`, color: 'green' as const, detail: '当前页日里程明细求和，用于快速复核。' }, + { label: '闭合差值', value: closureDeltaKm == null ? '需全量' : `${formatKm(Math.abs(closureDeltaKm))} km`, color: closureStatusColor, detail: closureActionText }, + { label: '记录覆盖率', value: formatPercent(pageCoverageRate), color: pageCoverageRate >= 100 ? 'green' as const : 'grey' as const, detail: `${rows.length.toLocaleString()} / ${summary.recordCount.toLocaleString()} 条明细在当前页。` } + ].map((item) => ( +
+ {item.label} +
{item.value}
+ {item.detail} +
+ ))} +
+
+ {closureStatus} + + {closurePassed && anomalyRows.length === 0 ? '当前统计口径可直接用于 BI 里程口径；若存在跨来源差异，再进入车辆服务查看来源证据。' : '统计进入 BI 前需要结合异常记录、轨迹回放和 RAW 解析字段完成复核。'} + + + + + + +
+
diff --git a/vehicle-data-platform/apps/web/src/styles/global.css b/vehicle-data-platform/apps/web/src/styles/global.css index 7317d6e8..feefcf9d 100644 --- a/vehicle-data-platform/apps/web/src/styles/global.css +++ b/vehicle-data-platform/apps/web/src/styles/global.css @@ -866,6 +866,36 @@ button.vp-realtime-command-item:focus-visible { line-height: 20px; } +.vp-stat-closure-board { + display: grid; + grid-template-columns: repeat(4, minmax(0, 1fr)); + gap: 12px; +} + +.vp-stat-closure-item { + min-height: 112px; + padding: 12px; + border: 1px solid var(--vp-border); + border-radius: var(--vp-radius); + background: #fbfcff; + display: grid; + gap: 8px; + align-content: start; +} + +.vp-stat-closure-action { + margin-top: 12px; + min-height: 48px; + padding: 10px 12px; + border: 1px solid var(--vp-border); + border-radius: var(--vp-radius); + background: #f5f9ff; + display: flex; + align-items: center; + justify-content: space-between; + gap: 12px; +} + .vp-trajectory-anomaly-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); @@ -1262,10 +1292,16 @@ button.vp-realtime-command-item:focus-visible { .vp-stat-workspace, .vp-stat-insight-grid, .vp-stat-definition-grid, + .vp-stat-closure-board, .vp-trajectory-anomaly-grid, .vp-vehicle-map-layout, .vp-playback-layout, .vp-playback-timeline { grid-template-columns: 1fr; } + + .vp-stat-closure-action { + align-items: flex-start; + flex-direction: column; + } } diff --git a/vehicle-data-platform/apps/web/src/test/App.test.tsx b/vehicle-data-platform/apps/web/src/test/App.test.tsx index 76e27150..eebe72d9 100644 --- a/vehicle-data-platform/apps/web/src/test/App.test.tsx +++ b/vehicle-data-platform/apps/web/src/test/App.test.tsx @@ -6787,6 +6787,16 @@ test('shows mileage statistics workspace with trend source and definition', asyn expect(screen.getAllByText('GB32960').length).toBeGreaterThanOrEqual(1); expect(screen.getByText('当前页里程')).toBeInTheDocument(); expect(screen.getAllByText('140 km').length).toBeGreaterThanOrEqual(1); + expect(screen.getByText('统计闭合工作台')).toBeInTheDocument(); + expect(screen.getByText('汇总总里程')).toBeInTheDocument(); + expect(screen.getByText('明细合计')).toBeInTheDocument(); + expect(screen.getByText('闭合差值')).toBeInTheDocument(); + expect(screen.getByText('记录覆盖率')).toBeInTheDocument(); + expect(screen.getByText('闭合通过')).toBeInTheDocument(); + expect(screen.getByText('当前筛选范围汇总总里程与明细合计一致，可作为统计证据。')).toBeInTheDocument(); + expect(screen.getByRole('button', { name: '复制闭合摘要' })).toBeInTheDocument(); + expect(screen.getByRole('button', { name: '闭合复核轨迹' })).toBeInTheDocument(); + expect(screen.getByRole('button', { name: '闭合复核 RAW' })).toBeInTheDocument(); expect(screen.getByText('异常记录')).toBeInTheDocument(); expect(screen.getAllByText('1').length).toBeGreaterThanOrEqual(1); expect(screen.getByText('最大单日')).toBeInTheDocument(); @@ -6797,7 +6807,7 @@ test('shows mileage statistics workspace with trend source and definition', asyn expect(screen.getByText('最大单日占比')).toBeInTheDocument(); expect(screen.getByText('42.9%')).toBeInTheDocument(); expect(screen.getByText('分页覆盖率')).toBeInTheDocument(); - expect(screen.getByText('100%')).toBeInTheDocument(); + expect(screen.getAllByText('100%').length).toBeGreaterThanOrEqual(1); expect(screen.getByText('闭合校验')).toBeInTheDocument(); expect(screen.getAllByText('0 km').length).toBeGreaterThanOrEqual(1); expect(screen.getByText('统计口径')).toBeInTheDocument();