mirror of
https://github.com/Rain-kl/OpenFlare.git
synced 2026-10-11 01:36:37 +08:00
修复仪表盘与节点详情「24 小时网络趋势」误按速率展示:改为 OpenResty 入/出站小时流量与近 24 小时总量摘要,Y 轴与 tooltip 自动换算 B/KB/MB/GB。
This commit is contained in:
@@ -22,6 +22,8 @@ sidebar: false
|
|||||||
|
|
||||||
### 修复
|
### 修复
|
||||||
|
|
||||||
|
- 修复仪表盘与节点详情「24 小时网络趋势」误按速率展示:改为 OpenResty 入/出站小时流量与近 24 小时总量摘要,Y 轴与 tooltip 自动换算 B/KB/MB/GB。
|
||||||
|
|
||||||
- 修复 Pages 上传或节点同步时报 `pages file size out of bounds`:允许 ZIP 包内的 0 字节文件,并兼容未声明解压大小的 ZIP 条目。
|
- 修复 Pages 上传或节点同步时报 `pages file size out of bounds`:允许 ZIP 包内的 0 字节文件,并兼容未声明解压大小的 ZIP 条目。
|
||||||
|
|
||||||
- 修复节点详情 OpenResty 连接数与吞吐显示为「—」:节点可观测 API 将 OpenResty 观测数据合并进 `metric_snapshots`;指标文案改为「请求/分钟」(近 60 秒窗口),连接数为 0 时正常显示 0。
|
- 修复节点详情 OpenResty 连接数与吞吐显示为「—」:节点可观测 API 将 OpenResty 观测数据合并进 `metric_snapshots`;指标文案改为「请求/分钟」(近 60 秒窗口),连接数为 0 时正常显示 0。
|
||||||
|
|||||||
@@ -1,15 +1,10 @@
|
|||||||
'use client';
|
'use client';
|
||||||
|
|
||||||
import {TrendChart} from '@/components/data/trend-chart';
|
import {TrendChart} from '@/components/data/trend-chart';
|
||||||
import {
|
import {Card, CardContent, CardHeader, CardTitle,} from '@/components/ui/card';
|
||||||
Card,
|
|
||||||
CardContent,
|
|
||||||
CardHeader,
|
|
||||||
CardTitle,
|
|
||||||
} from '@/components/ui/card';
|
|
||||||
import type {DiskIOTrendPoint, NetworkTrendPoint} from '@/lib/services/openflare';
|
import type {DiskIOTrendPoint, NetworkTrendPoint} from '@/lib/services/openflare';
|
||||||
|
|
||||||
import {formatBytes, formatBytesPerSecond, formatTrendHour} from './dashboard-utils';
|
import {formatBytes, formatTrendHour} from './dashboard-utils';
|
||||||
|
|
||||||
export function NetworkDiskTrendChart({
|
export function NetworkDiskTrendChart({
|
||||||
networkPoints,
|
networkPoints,
|
||||||
@@ -27,7 +22,9 @@ export function NetworkDiskTrendChart({
|
|||||||
<TrendChart
|
<TrendChart
|
||||||
labels={networkPoints.map((point) => formatTrendHour(point.bucket_started_at))}
|
labels={networkPoints.map((point) => formatTrendHour(point.bucket_started_at))}
|
||||||
height={180}
|
height={180}
|
||||||
yAxisValueFormatter={(value) => formatBytesPerSecond(value, 3600)}
|
summaryScope="total"
|
||||||
|
summaryHint="近 24 小时"
|
||||||
|
yAxisValueFormatter={formatBytes}
|
||||||
series={[
|
series={[
|
||||||
{
|
{
|
||||||
label: 'OpenResty 入站',
|
label: 'OpenResty 入站',
|
||||||
@@ -35,13 +32,13 @@ export function NetworkDiskTrendChart({
|
|||||||
fillColor: 'rgba(34, 197, 94, 0.14)',
|
fillColor: 'rgba(34, 197, 94, 0.14)',
|
||||||
variant: 'area',
|
variant: 'area',
|
||||||
values: networkPoints.map((point) => point.openresty_rx_bytes),
|
values: networkPoints.map((point) => point.openresty_rx_bytes),
|
||||||
valueFormatter: (value) => formatBytesPerSecond(value, 3600),
|
valueFormatter: formatBytes,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: 'OpenResty 出站',
|
label: 'OpenResty 出站',
|
||||||
color: '#38bdf8',
|
color: '#38bdf8',
|
||||||
values: networkPoints.map((point) => point.openresty_tx_bytes),
|
values: networkPoints.map((point) => point.openresty_tx_bytes),
|
||||||
valueFormatter: (value) => formatBytesPerSecond(value, 3600),
|
valueFormatter: formatBytes,
|
||||||
},
|
},
|
||||||
]}
|
]}
|
||||||
/>
|
/>
|
||||||
@@ -49,6 +46,8 @@ export function NetworkDiskTrendChart({
|
|||||||
<TrendChart
|
<TrendChart
|
||||||
labels={diskPoints.map((point) => formatTrendHour(point.bucket_started_at))}
|
labels={diskPoints.map((point) => formatTrendHour(point.bucket_started_at))}
|
||||||
height={180}
|
height={180}
|
||||||
|
summaryScope="total"
|
||||||
|
summaryHint="近 24 小时"
|
||||||
yAxisValueFormatter={formatBytes}
|
yAxisValueFormatter={formatBytes}
|
||||||
series={[
|
series={[
|
||||||
{
|
{
|
||||||
|
|||||||
@@ -183,7 +183,7 @@ export function WorldStage({
|
|||||||
progress: healthyRate,
|
progress: healthyRate,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: '最近窗口请求',
|
label: '24小时请求',
|
||||||
value: formatCompactNumber(traffic.request_count),
|
value: formatCompactNumber(traffic.request_count),
|
||||||
hint: `QPS ${traffic.estimated_qps.toFixed(1)} · ${traffic.reported_nodes} 个节点上报`,
|
hint: `QPS ${traffic.estimated_qps.toFixed(1)} · ${traffic.reported_nodes} 个节点上报`,
|
||||||
icon: Activity,
|
icon: Activity,
|
||||||
|
|||||||
@@ -1,13 +1,7 @@
|
|||||||
'use client';
|
'use client';
|
||||||
|
|
||||||
import {TrendChart} from '@/components/data/trend-chart';
|
import {TrendChart} from '@/components/data/trend-chart';
|
||||||
import {
|
import {Card, CardContent, CardDescription, CardHeader, CardTitle,} from '@/components/ui/card';
|
||||||
Card,
|
|
||||||
CardContent,
|
|
||||||
CardDescription,
|
|
||||||
CardHeader,
|
|
||||||
CardTitle,
|
|
||||||
} from '@/components/ui/card';
|
|
||||||
import type {DiskIOTrendPoint} from '@/lib/services/openflare';
|
import type {DiskIOTrendPoint} from '@/lib/services/openflare';
|
||||||
|
|
||||||
import {formatBytes, formatTrendHour} from '../../components/dashboard/dashboard-utils';
|
import {formatBytes, formatTrendHour} from '../../components/dashboard/dashboard-utils';
|
||||||
@@ -30,6 +24,8 @@ export function DiskIOTrendChart({
|
|||||||
<CardContent>
|
<CardContent>
|
||||||
<TrendChart
|
<TrendChart
|
||||||
labels={points.map((point) => formatTrendHour(point.bucket_started_at))}
|
labels={points.map((point) => formatTrendHour(point.bucket_started_at))}
|
||||||
|
summaryScope="total"
|
||||||
|
summaryHint="近 24 小时"
|
||||||
yAxisValueFormatter={formatBytes}
|
yAxisValueFormatter={formatBytes}
|
||||||
series={[
|
series={[
|
||||||
{
|
{
|
||||||
|
|||||||
@@ -1,24 +1,15 @@
|
|||||||
'use client';
|
'use client';
|
||||||
|
|
||||||
import {TrendChart} from '@/components/data/trend-chart';
|
import {TrendChart} from '@/components/data/trend-chart';
|
||||||
import {
|
import {Card, CardContent, CardDescription, CardHeader, CardTitle,} from '@/components/ui/card';
|
||||||
Card,
|
|
||||||
CardContent,
|
|
||||||
CardDescription,
|
|
||||||
CardHeader,
|
|
||||||
CardTitle,
|
|
||||||
} from '@/components/ui/card';
|
|
||||||
import type {NetworkTrendPoint} from '@/lib/services/openflare';
|
import type {NetworkTrendPoint} from '@/lib/services/openflare';
|
||||||
|
|
||||||
import {
|
import {formatBytes, formatTrendHour} from '../../components/dashboard/dashboard-utils';
|
||||||
formatBytesPerSecond,
|
|
||||||
formatTrendHour,
|
|
||||||
} from '../../components/dashboard/dashboard-utils';
|
|
||||||
|
|
||||||
export function NetworkTrendChart({
|
export function NetworkTrendChart({
|
||||||
points,
|
points,
|
||||||
title = '24 小时网络趋势',
|
title = '24 小时网络趋势',
|
||||||
description = '观察 OpenResty 入站/出站吞吐的变化,辅助识别回源压力、突发流量或出口异常。',
|
description = '按小时展示 OpenResty 入站/出站流量累计,摘要为近 24 小时总量。',
|
||||||
}: {
|
}: {
|
||||||
points: NetworkTrendPoint[];
|
points: NetworkTrendPoint[];
|
||||||
title?: string;
|
title?: string;
|
||||||
@@ -33,7 +24,9 @@ export function NetworkTrendChart({
|
|||||||
<CardContent>
|
<CardContent>
|
||||||
<TrendChart
|
<TrendChart
|
||||||
labels={points.map((point) => formatTrendHour(point.bucket_started_at))}
|
labels={points.map((point) => formatTrendHour(point.bucket_started_at))}
|
||||||
yAxisValueFormatter={(value) => formatBytesPerSecond(value, 3600)}
|
summaryScope="total"
|
||||||
|
summaryHint="近 24 小时"
|
||||||
|
yAxisValueFormatter={formatBytes}
|
||||||
series={[
|
series={[
|
||||||
{
|
{
|
||||||
label: 'OpenResty 入站',
|
label: 'OpenResty 入站',
|
||||||
@@ -41,13 +34,13 @@ export function NetworkTrendChart({
|
|||||||
fillColor: 'rgba(34, 197, 94, 0.14)',
|
fillColor: 'rgba(34, 197, 94, 0.14)',
|
||||||
variant: 'area',
|
variant: 'area',
|
||||||
values: points.map((point) => point.openresty_rx_bytes),
|
values: points.map((point) => point.openresty_rx_bytes),
|
||||||
valueFormatter: (value) => formatBytesPerSecond(value, 3600),
|
valueFormatter: formatBytes,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: 'OpenResty 出站',
|
label: 'OpenResty 出站',
|
||||||
color: '#38bdf8',
|
color: '#38bdf8',
|
||||||
values: points.map((point) => point.openresty_tx_bytes),
|
values: points.map((point) => point.openresty_tx_bytes),
|
||||||
valueFormatter: (value) => formatBytesPerSecond(value, 3600),
|
valueFormatter: formatBytes,
|
||||||
},
|
},
|
||||||
]}
|
]}
|
||||||
/>
|
/>
|
||||||
|
|||||||
Reference in New Issue
Block a user