You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
139 lines
4.1 KiB
139 lines
4.1 KiB
<!DOCTYPE html> |
|
<html lang="en"> |
|
<head> |
|
<meta charset="UTF-8"> |
|
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
|
<title>System Health - OTB Billing</title> |
|
<link rel="stylesheet" href="/static/style.css"> |
|
<style> |
|
.page-wrap { |
|
padding: 1.5rem; |
|
} |
|
|
|
.page-header h1 { |
|
margin-bottom: 0.35rem; |
|
} |
|
|
|
.page-header p { |
|
margin-top: 0; |
|
opacity: 0.9; |
|
} |
|
|
|
.health-links { |
|
margin: 1rem 0 1.25rem 0; |
|
} |
|
|
|
.health-links a { |
|
margin-right: 1rem; |
|
text-decoration: underline; |
|
} |
|
|
|
.health-grid { |
|
display: grid; |
|
grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); |
|
gap: 1rem; |
|
margin-top: 1rem; |
|
} |
|
|
|
.health-card { |
|
border: 1px solid rgba(255,255,255,0.16); |
|
border-radius: 14px; |
|
padding: 1rem 1.1rem; |
|
background: rgba(255,255,255,0.03); |
|
box-shadow: 0 6px 18px rgba(0,0,0,0.16); |
|
} |
|
|
|
.health-card h3 { |
|
margin-top: 0; |
|
margin-bottom: 0.85rem; |
|
} |
|
|
|
.health-card p { |
|
margin: 0.45rem 0; |
|
} |
|
|
|
.status-good { |
|
color: #63d471; |
|
font-weight: 700; |
|
} |
|
|
|
.status-bad { |
|
color: #ff7b7b; |
|
font-weight: 700; |
|
} |
|
|
|
.monoish { |
|
word-break: break-word; |
|
} |
|
</style> |
|
</head> |
|
<body> |
|
<div class="page-wrap"> |
|
<div class="page-header"> |
|
<h1>System Health</h1> |
|
<p>Application and server status for OTB Billing.</p> |
|
</div> |
|
|
|
<div class="health-links"> |
|
<a href="/">Home</a> |
|
<a href="/health.json">Raw JSON</a> |
|
</div> |
|
|
|
<div class="health-grid"> |
|
<div class="health-card"> |
|
<h3>Status</h3> |
|
{% if health.status == "ok" %} |
|
<p class="status-good">Healthy</p> |
|
{% else %} |
|
<p class="status-bad">Degraded</p> |
|
{% endif %} |
|
<p><strong>App:</strong> {{ health.app_name }}</p> |
|
<p><strong>Host:</strong> {{ health.hostname }}</p> |
|
<p class="monoish"><strong>Toronto Time:</strong> {{ health.server_time_toronto }}</p> |
|
<p class="monoish"><strong>UTC Time:</strong> {{ health.server_time_utc }}</p> |
|
</div> |
|
|
|
<div class="health-card"> |
|
<h3>Database</h3> |
|
{% if health.database.ok %} |
|
<p class="status-good">Connected</p> |
|
{% else %} |
|
<p class="status-bad">Connection Error</p> |
|
{% endif %} |
|
<p class="monoish"><strong>Error:</strong> {{ health.database.error or "None" }}</p> |
|
</div> |
|
|
|
<div class="health-card"> |
|
<h3>Uptime</h3> |
|
<p><strong>Application:</strong> {{ health.app_uptime_human }}</p> |
|
<p><strong>Server:</strong> {{ health.server_uptime_human }}</p> |
|
</div> |
|
|
|
<div class="health-card"> |
|
<h3>Load Average</h3> |
|
<p><strong>1 min:</strong> {{ health.load_average["1m"] }}</p> |
|
<p><strong>5 min:</strong> {{ health.load_average["5m"] }}</p> |
|
<p><strong>15 min:</strong> {{ health.load_average["15m"] }}</p> |
|
</div> |
|
|
|
<div class="health-card"> |
|
<h3>Memory</h3> |
|
<p><strong>Total:</strong> {{ health.memory.total_mb }} MB</p> |
|
<p><strong>Available:</strong> {{ health.memory.available_mb }} MB</p> |
|
<p><strong>Used:</strong> {{ health.memory.used_mb }} MB</p> |
|
<p><strong>Used %:</strong> {{ health.memory.used_percent }}%</p> |
|
</div> |
|
|
|
<div class="health-card"> |
|
<h3>Disk /</h3> |
|
<p><strong>Total:</strong> {{ health.disk_root.total_gb }} GB</p> |
|
<p><strong>Used:</strong> {{ health.disk_root.used_gb }} GB</p> |
|
<p><strong>Free:</strong> {{ health.disk_root.free_gb }} GB</p> |
|
<p><strong>Used %:</strong> {{ health.disk_root.used_percent }}%</p> |
|
</div> |
|
</div> |
|
</div> |
|
|
|
{% include "footer.html" %} |
|
</body> |
|
</html>
|
|
|