update: monitor display
This commit is contained in:
parent
496ba0f9fb
commit
43c3443e3f
|
|
@ -635,10 +635,10 @@ function redactGroupsAndMonitors(
|
|||
name: g.name,
|
||||
position: g.position,
|
||||
}));
|
||||
const publicMonitors = monitors.map((m) => ({
|
||||
...m,
|
||||
group_id: m.group_id ? (idMap.get(m.group_id) ?? null) : null,
|
||||
}));
|
||||
const publicMonitors = monitors.map((m) => {
|
||||
const { uptime, ...rest } = m;
|
||||
return { ...rest, group_id: m.group_id ? (idMap.get(m.group_id) ?? null) : null };
|
||||
});
|
||||
return { groups: publicGroups, monitors: publicMonitors };
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -165,6 +165,7 @@ h1 { font-size: 1.75rem; font-weight: 700; margin: 0 0 0.5rem; }
|
|||
.past-update-body p { display: inline; margin: 0; }
|
||||
.past-update-body code { background: var(--bg); padding: 0.05em 0.3em; border-radius: 3px; font-size: 0.85em; }
|
||||
.past-update-time { color: var(--muted); font-size: 0.7rem; margin-top: 0.15rem; }
|
||||
.page-uptime { margin-top: 2rem; }
|
||||
footer { padding-top: 2rem; border-top: 1px solid var(--border); color: var(--muted); font-size: 0.8rem; text-align: center; }
|
||||
a { color: var(--accent); text-decoration: none; }
|
||||
a:hover { text-decoration: underline; }
|
||||
|
|
|
|||
|
|
@ -94,6 +94,20 @@
|
|||
const dotGlow = overall === 'up' ? 'rgba(16,185,129,0.4)'
|
||||
: overall === 'degraded' ? 'rgba(245,158,11,0.4)'
|
||||
: 'rgba(239,68,68,0.4)';
|
||||
|
||||
// Page-wide aggregate uptime - average across active monitors
|
||||
const pageUptimeAcc = { d24: { sum: 0, n: 0 }, d7: { sum: 0, n: 0 }, d30: { sum: 0, n: 0 }, d90: { sum: 0, n: 0 } };
|
||||
for (const m of monitors) {
|
||||
if (m.current_state === 'paused') continue;
|
||||
const u = m.uptime || {};
|
||||
for (const key of ['d24', 'd7', 'd30', 'd90']) {
|
||||
if (u[key] != null) { pageUptimeAcc[key].sum += u[key]; pageUptimeAcc[key].n++; }
|
||||
}
|
||||
}
|
||||
function pageUptimePct(key) {
|
||||
const a = pageUptimeAcc[key];
|
||||
return a.n > 0 ? (a.sum / a.n) : null;
|
||||
}
|
||||
%><!DOCTYPE html>
|
||||
<html lang="en" class="<%= themeClass %>">
|
||||
<head>
|
||||
|
|
@ -239,7 +253,6 @@
|
|||
<% list.forEach(function(m) {
|
||||
const buckets = m.buckets || [];
|
||||
const hasData = buckets.some(b => b.total > 0);
|
||||
const u = m.uptime || { d24: null, d7: null, d30: null, d90: null };
|
||||
const startsOpen = m.display_mode !== 'compact';
|
||||
%>
|
||||
<% if (inGroup) { %>
|
||||
|
|
@ -292,12 +305,6 @@
|
|||
<span><%= windowLabel %></span>
|
||||
<span><%= hasData ? 'uptime over window' : 'awaiting data' %></span>
|
||||
</div>
|
||||
<div class="uptime-row">
|
||||
<div class="uptime-cell <%= uptimeBand(u.d24) %>"><div class="label">24h</div><div class="value"><%= fmtUptime(u.d24) %></div></div>
|
||||
<div class="uptime-cell <%= uptimeBand(u.d7) %>"><div class="label">7d</div><div class="value"><%= fmtUptime(u.d7) %></div></div>
|
||||
<div class="uptime-cell <%= uptimeBand(u.d30) %>"><div class="label">30d</div><div class="value"><%= fmtUptime(u.d30) %></div></div>
|
||||
<div class="uptime-cell <%= uptimeBand(u.d90) %>"><div class="label">90d</div><div class="value"><%= fmtUptime(u.d90) %></div></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<% } %>
|
||||
|
|
@ -354,6 +361,15 @@
|
|||
</div>
|
||||
<% } %>
|
||||
|
||||
<div class="page-uptime">
|
||||
<div class="uptime-row">
|
||||
<div class="uptime-cell <%= uptimeBand(pageUptimePct('d24')) %>"><div class="label">24h</div><div class="value"><%= fmtUptime(pageUptimePct('d24')) %></div></div>
|
||||
<div class="uptime-cell <%= uptimeBand(pageUptimePct('d7')) %>"><div class="label">7d</div><div class="value"><%= fmtUptime(pageUptimePct('d7')) %></div></div>
|
||||
<div class="uptime-cell <%= uptimeBand(pageUptimePct('d30')) %>"><div class="label">30d</div><div class="value"><%= fmtUptime(pageUptimePct('d30')) %></div></div>
|
||||
<div class="uptime-cell <%= uptimeBand(pageUptimePct('d90')) %>"><div class="label">90d</div><div class="value"><%= fmtUptime(pageUptimePct('d90')) %></div></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<footer>
|
||||
<% if (page.footer_text) { %><div><%= page.footer_text %></div><% } %>
|
||||
<% if (page.show_powered_by) { %><div>Status powered by <a href="https://pingql.com">PingQL</a></div><% } %>
|
||||
|
|
|
|||
Loading…
Reference in New Issue