ai-coding/deploy-ease-platform
0
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

1.45

Browse Source
This commit is contained in:
dengqichen 2025-12-30 17:13:31 +08:00
parent 70e6e0cac6
commit d9b8142028
1 changed files with 45 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

58
frontend/src/pages/System/Metrics/Dashboard/index.tsx
View File

@ -147,11 +147,27 @@ const MetricsDashboard: React.FC = () => {
}, [autoRefresh, loadMetrics]); }, [autoRefresh, loadMetrics]);
// 格式化字节为 GB（统一单位） // 格式化字节为 GB（统一单位）
const formatBytes = (bytes: number): string => { // 处理 JVM 返回 -1 表示"无限制"的情况
const formatBytes = (bytes: number, showUnlimited: boolean = false): string => {
if (bytes < 0) {
return showUnlimited ? '无限制' : '-';
}
const gb = bytes / 1024 / 1024 / 1024; const gb = bytes / 1024 / 1024 / 1024;
return `${gb.toFixed(2)} GB`; return `${gb.toFixed(2)} GB`;
}; };
// 计算内存使用百分比（处理 max 为 -1 或 0 的情况）
const calcMemoryPercent = (used: number, max: number, committed?: number): number => {
if (max > 0) {
return (used / max) * 100;
}
// 如果 max 无效，使用 committed 作为参考
if (committed && committed > 0) {
return (used / committed) * 100;
}
return 0;
};
// 格式化百分比 // 格式化百分比
const formatPercent = (value: number): string => { const formatPercent = (value: number): string => {
return value.toFixed(2); return value.toFixed(2);
@ -203,22 +219,22 @@ const MetricsDashboard: React.FC = () => {
regions: metrics.memory.regions ? { regions: metrics.memory.regions ? {
eden: metrics.memory.regions.eden ? { eden: metrics.memory.regions.eden ? {
used: formatBytes(metrics.memory.regions.eden.used), used: formatBytes(metrics.memory.regions.eden.used),
max: formatBytes(metrics.memory.regions.eden.max), max: formatBytes(metrics.memory.regions.eden.max, true),
committed: formatBytes(metrics.memory.regions.eden.committed), committed: formatBytes(metrics.memory.regions.eden.committed),
} : null, } : null,
oldGen: metrics.memory.regions.oldGen ? { oldGen: metrics.memory.regions.oldGen ? {
used: formatBytes(metrics.memory.regions.oldGen.used), used: formatBytes(metrics.memory.regions.oldGen.used),
max: formatBytes(metrics.memory.regions.oldGen.max), max: formatBytes(metrics.memory.regions.oldGen.max, true),
committed: formatBytes(metrics.memory.regions.oldGen.committed), committed: formatBytes(metrics.memory.regions.oldGen.committed),
} : null, } : null,
survivor: metrics.memory.regions.survivor ? { survivor: metrics.memory.regions.survivor ? {
used: formatBytes(metrics.memory.regions.survivor.used), used: formatBytes(metrics.memory.regions.survivor.used),
max: formatBytes(metrics.memory.regions.survivor.max), max: formatBytes(metrics.memory.regions.survivor.max, true),
committed: formatBytes(metrics.memory.regions.survivor.committed), committed: formatBytes(metrics.memory.regions.survivor.committed),
} : null, } : null,
metaspace: metrics.memory.regions.metaspace ? { metaspace: metrics.memory.regions.metaspace ? {
used: formatBytes(metrics.memory.regions.metaspace.used), used: formatBytes(metrics.memory.regions.metaspace.used),
max: formatBytes(metrics.memory.regions.metaspace.max), max: formatBytes(metrics.memory.regions.metaspace.max, true),
committed: formatBytes(metrics.memory.regions.metaspace.committed), committed: formatBytes(metrics.memory.regions.metaspace.committed),
} : null, } : null,
} : null, } : null,
@ -604,10 +620,14 @@ const MetricsDashboard: React.FC = () => {
</div> </div>
<div className="flex justify-between"> <div className="flex justify-between">
<span className="text-muted-foreground">最大:</span> <span className="text-muted-foreground">最大:</span>
<span className="font-medium">{formatBytes(metrics.memory.regions.eden.max)}</span> <span className="font-medium">{formatBytes(metrics.memory.regions.eden.max, true)}</span>
</div> </div>
<Progress <Progress
value={(metrics.memory.regions.eden.used / metrics.memory.regions.eden.max) * 100} value={calcMemoryPercent(
metrics.memory.regions.eden.used,
metrics.memory.regions.eden.max,
metrics.memory.regions.eden.committed
)}
className="h-1 mt-2" className="h-1 mt-2"
/> />
</div> </div>
@ -629,10 +649,14 @@ const MetricsDashboard: React.FC = () => {
</div> </div>
<div className="flex justify-between"> <div className="flex justify-between">
<span className="text-muted-foreground">最大:</span> <span className="text-muted-foreground">最大:</span>
<span className="font-medium">{formatBytes(metrics.memory.regions.oldGen.max)}</span> <span className="font-medium">{formatBytes(metrics.memory.regions.oldGen.max, true)}</span>
</div> </div>
<Progress <Progress
value={(metrics.memory.regions.oldGen.used / metrics.memory.regions.oldGen.max) * 100} value={calcMemoryPercent(
metrics.memory.regions.oldGen.used,
metrics.memory.regions.oldGen.max,
metrics.memory.regions.oldGen.committed
)}
className="h-1 mt-2" className="h-1 mt-2"
/> />
</div> </div>
@ -654,10 +678,14 @@ const MetricsDashboard: React.FC = () => {
</div> </div>
<div className="flex justify-between"> <div className="flex justify-between">
<span className="text-muted-foreground">最大:</span> <span className="text-muted-foreground">最大:</span>
<span className="font-medium">{formatBytes(metrics.memory.regions.survivor.max)}</span> <span className="font-medium">{formatBytes(metrics.memory.regions.survivor.max, true)}</span>
</div> </div>
<Progress <Progress
value={(metrics.memory.regions.survivor.used / metrics.memory.regions.survivor.max) * 100} value={calcMemoryPercent(
metrics.memory.regions.survivor.used,
metrics.memory.regions.survivor.max,
metrics.memory.regions.survivor.committed
)}
className="h-1 mt-2" className="h-1 mt-2"
/> />
</div> </div>
@ -679,10 +707,14 @@ const MetricsDashboard: React.FC = () => {
</div> </div>
<div className="flex justify-between"> <div className="flex justify-between">
<span className="text-muted-foreground">最大:</span> <span className="text-muted-foreground">最大:</span>
<span className="font-medium">{formatBytes(metrics.memory.regions.metaspace.max)}</span> <span className="font-medium">{formatBytes(metrics.memory.regions.metaspace.max, true)}</span>
</div> </div>
<Progress <Progress
value={(metrics.memory.regions.metaspace.used / metrics.memory.regions.metaspace.max) * 100} value={calcMemoryPercent(
metrics.memory.regions.metaspace.used,
metrics.memory.regions.metaspace.max,
metrics.memory.regions.metaspace.committed
)}
className="h-1 mt-2" className="h-1 mt-2"
/> />
</div> </div>