fix: merge machines panel 4-col layout, fix vps-health ok field

This commit is contained in:
posimai 2026-04-02 20:33:21 +09:00
parent f5817eb156
commit 3d1d599fd6
2 changed files with 15 additions and 10 deletions

View File

@ -211,7 +211,7 @@ app.get('/api/vps-health', async (req, res) => {
signal: AbortSignal.timeout(6000), signal: AbortSignal.timeout(6000),
}); });
const data = await r.json(); const data = await r.json();
res.json(data); res.json({ ok: true, ...data });
} catch (e) { } catch (e) {
res.status(502).json({ error: e.message }); res.status(502).json({ error: e.message });
} }

View File

@ -71,7 +71,10 @@
#date { font-size:12px;color:var(--text3);margin-top:3px;letter-spacing:0.06em; } #date { font-size:12px;color:var(--text3);margin-top:3px;letter-spacing:0.06em; }
#last-checked { text-align:right;font-size:11px;color:var(--text3); } #last-checked { text-align:right;font-size:11px;color:var(--text3); }
#middle { display:grid;grid-template-columns:220px 200px 240px 1fr 180px;gap:10px;min-height:0; } #middle { display:grid;grid-template-columns:280px 240px 1fr 180px;gap:10px;min-height:0; }
.machines-panel { gap:10px; }
.machines-section { font-size:9px;font-weight:600;color:var(--text3);letter-spacing:0.14em;text-transform:uppercase;margin-bottom:-2px; }
.machines-divider { border-top:1px solid var(--border);margin:2px 0; }
.metric-item { display:flex;flex-direction:column;gap:5px;flex-shrink:0; } .metric-item { display:flex;flex-direction:column;gap:5px;flex-shrink:0; }
.metric-header-row { display:flex;justify-content:space-between;align-items:baseline; } .metric-header-row { display:flex;justify-content:space-between;align-items:baseline; }
@ -191,9 +194,11 @@
</div> </div>
<div id="alert-bar"><i data-lucide="alert-triangle"></i><span id="alert-messages"></span></div> <div id="alert-bar"><i data-lucide="alert-triangle"></i><span id="alert-messages"></span></div>
<div id="middle"> <div id="middle">
<!-- Col 1: text metrics --> <!-- Col 1: MACHINES (Ubuntu PC + VPS stacked) -->
<div class="panel"> <div class="panel machines-panel">
<div class="panel-title"><i data-lucide="cpu"></i>Ubuntu PC</div> <div class="panel-title"><i data-lucide="server"></i>Machines</div>
<!-- Ubuntu PC section -->
<div class="machines-section">Ubuntu PC</div>
<div class="metric-item"> <div class="metric-item">
<div class="metric-header-row"><span class="metric-label">CPU</span><span class="metric-val" id="cpu-val"></span></div> <div class="metric-header-row"><span class="metric-label">CPU</span><span class="metric-val" id="cpu-val"></span></div>
<div class="bin-bar" id="cpu-bar"></div> <div class="bin-bar" id="cpu-bar"></div>
@ -225,10 +230,10 @@
<div class="stat-card" id="temp-card" style="display:none"><div class="stat-label">CPU Temp</div><div class="stat-val" id="temp-val"></div></div> <div class="stat-card" id="temp-card" style="display:none"><div class="stat-label">CPU Temp</div><div class="stat-val" id="temp-val"></div></div>
</div> </div>
<a class="open-btn" href="/" target="_blank" rel="noopener"><i data-lucide="terminal"></i>posimai-dev を開く</a> <a class="open-btn" href="/" target="_blank" rel="noopener"><i data-lucide="terminal"></i>posimai-dev を開く</a>
</div> <!-- Divider -->
<!-- Col 2: VPS --> <div class="machines-divider"></div>
<div class="panel"> <!-- VPS section -->
<div class="panel-title"><i data-lucide="server"></i>VPS</div> <div class="machines-section">VPS</div>
<div class="metric-item"> <div class="metric-item">
<div class="metric-header-row"><span class="metric-label">CPU Load</span><span class="metric-val" id="vps-load"></span></div> <div class="metric-header-row"><span class="metric-label">CPU Load</span><span class="metric-val" id="vps-load"></span></div>
</div> </div>
@ -240,7 +245,7 @@
<div class="metric-header-row"><span class="metric-label">Disk (/)</span><span class="metric-val" id="vps-disk"></span></div> <div class="metric-header-row"><span class="metric-label">Disk (/)</span><span class="metric-val" id="vps-disk"></span></div>
<div class="bin-bar" id="vps-disk-bar"></div> <div class="bin-bar" id="vps-disk-bar"></div>
</div> </div>
<div class="stat-grid" style="grid-template-columns:1fr 1fr;gap:6px;margin-top:4px"> <div class="stat-grid" style="grid-template-columns:1fr 1fr;gap:6px">
<div class="stat-card"><div class="stat-label">Uptime</div><div class="stat-val" id="vps-uptime"></div></div> <div class="stat-card"><div class="stat-label">Uptime</div><div class="stat-val" id="vps-uptime"></div></div>
<div class="stat-card"><div class="stat-label">Users</div><div class="stat-val" id="vps-users"></div></div> <div class="stat-card"><div class="stat-label">Users</div><div class="stat-val" id="vps-users"></div></div>
<div class="stat-card"><div class="stat-label">Gemini</div><div class="stat-val" id="vps-gemini"></div></div> <div class="stat-card"><div class="stat-label">Gemini</div><div class="stat-val" id="vps-gemini"></div></div>