fix: 切换实例按钮无效 & 磁盘分区内容溢出

- Select 下拉切换主机时同步更新 latest/serverInfo(添加 selectedHost 依赖)
- 磁盘分区 used_gb/usage_percent 格式化 .toFixed(1),容器加宽 + whitespace-nowrap 防溢出
This commit is contained in:
attacker committed 2026-06-19 02:02:04 +00:00
1 parent 4dd3e3238d
commit 534fbdbfaf
1 file changed
+5 -4
+5 -4
View File
@@ -100,13 +100,14 @@ export function HostMonitor() {
const m = urlHost ? list.find((h: any) => h.hostname === urlHost) : null;
setSelectedHost(m?.hostname || list[0]?.hostname || '');
}
const cur = list.find((h: any) => h.hostname === (urlHost || selectedHost));
// 切换主机时同步更新 latest / serverInfo
const cur = list.find((h: any) => h.hostname === (selectedHost || urlHost));
if (cur) {
setLatest(cur);
setServerInfo(cur);
}
}).catch(() => {}).finally(() => setLoading(false));
}, []);
}, [selectedHost]);
// 加载历史数据
useEffect(() => {
@@ -392,8 +393,8 @@ export function HostMonitor() {
<div className="flex-1 h-1.5 bg-slate-700 rounded-full overflow-hidden">
<div className="h-full rounded-full bg-blue-500" style={{ width: `${Math.min(p.usage_percent || p.used_percent || 0, 100)}%` }} />
</div>
<span className="text-[var(--dg-text-primary)] w-20 text-right tabular-nums">{p.used_gb?.toFixed(1) || p.used || '?'}/{p.total_gb?.toFixed(0) || p.total || '?'}GB</span>
<span className="text-blue-400 w-12 text-right tabular-nums">{p.usage_percent || p.used_percent || 0}%</span>
<span className="text-[var(--dg-text-primary)] w-28 text-right tabular-nums whitespace-nowrap">{(p.used_gb ?? 0).toFixed(1)}/{(p.total_gb ?? 0).toFixed(0)}GB</span>
<span className="text-blue-400 w-14 text-right tabular-nums whitespace-nowrap">{(p.usage_percent ?? p.used_percent ?? 0).toFixed(1)}%</span>
</div>
))}
</div>