feat(frontend): 观测网络字节字段与 UV 文案对齐

网络图仅使用 bytes_provided/received;看板与节点 UV 改为 24h/查询窗口
独立访客;清理 traffic_reports 与 openresty 吞吐兼容字段;运维清理目标
改为 node_edge_health。
This commit is contained in:
ryan
2026-07-18 11:53:11 +08:00
parent f0e234df1f
commit 71ce028f91
10 changed files with 108 additions and 120 deletions
@@ -20,7 +20,7 @@ export function NetworkDiskTrendChart({
<Card className='border-dashed shadow-none'>
<CardHeader>
<CardTitle className='text-sm font-semibold'>
24 小时网络与磁盘趋势
24 小时业务流量与宿主机磁盘
</CardTitle>
</CardHeader>
<CardContent className='space-y-6'>
@@ -30,21 +30,47 @@ export function NetworkDiskTrendChart({
)}
height={180}
summaryScope='total'
summaryHint='近 24 小时'
summaryHint='近 24 小时 · 来自访问日志'
yAxisValueFormatter={formatBytes}
series={[
{
label: 'OpenResty 入站',
label: '接收数据',
color: '#22c55e',
fillColor: 'rgba(34, 197, 94, 0.14)',
variant: 'area',
values: networkPoints.map((point) => point.openresty_rx_bytes),
values: networkPoints.map((point) => point.bytes_received),
valueFormatter: formatBytes,
},
{
label: 'OpenResty 出站',
label: '已提供数据',
color: '#38bdf8',
values: networkPoints.map((point) => point.openresty_tx_bytes),
values: networkPoints.map((point) => point.bytes_provided),
valueFormatter: formatBytes,
},
]}
/>
<TrendChart
labels={networkPoints.map((point) =>
formatTrendHour(point.bucket_started_at),
)}
height={180}
summaryScope='total'
summaryHint='近 24 小时 · 宿主机网卡'
yAxisValueFormatter={formatBytes}
series={[
{
label: '宿主机网卡入站',
color: '#a3e635',
fillColor: 'rgba(163, 230, 53, 0.12)',
variant: 'area',
values: networkPoints.map((point) => point.network_rx_bytes),
valueFormatter: formatBytes,
},
{
label: '宿主机网卡出站',
color: '#f97316',
values: networkPoints.map((point) => point.network_tx_bytes),
valueFormatter: formatBytes,
},
]}
@@ -56,7 +82,7 @@ export function NetworkDiskTrendChart({
)}
height={180}
summaryScope='total'
summaryHint='近 24 小时'
summaryHint='近 24 小时 · 宿主机磁盘'
yAxisValueFormatter={formatBytes}
series={[
{
@@ -40,7 +40,7 @@ export function DashboardStatCards({
{formatCompactNumber(traffic.request_count)}
</div>
<p className='text-[10px] text-muted-foreground'>
窗口UV(估) {formatCompactNumber(traffic.unique_visitors)} · 错误{' '}
24h 独立访客 {formatCompactNumber(traffic.unique_visitors)} · 错误{' '}
{formatCompactNumber(traffic.error_count)} · 估算 QPS{' '}
{traffic.estimated_qps.toFixed(2)}
</p>