Files
Aruba-PoE/srv/poe_manager/templates/index.html

91 lines
3.2 KiB
HTML

{% extends "base.html" %}
{% block content %}
<h2 class="d-flex justify-content-between align-items-center">
Dashboard
<span id="dashboard-timer" class="badge bg-success">
Nächste Prüfung in -- Sekunden
</span>
</h2>
<div class="row row-cols-1 row-cols-md-6 g-3">
{% for d in devices %}
<div class="col">
<div class="card text-center p-2">
<div class="card-header">{{ d[1] }}</div> <!-- Name -->
<div class="card-body">
<span class="fw-bold" style="color:
{% if d[2] == 0 %}gray
{% elif status[d[0]] == 'online' %}green
{% elif status[d[0]] == 'offline' %}red
{% else %}black
{% endif %};">
{% if d[2] == 0 %}
Deaktiviert
{% else %}
{% if status[d[0]] %}{{ status[d[0]]|capitalize }}{% else %}Unbekannt{% endif %}
{% endif %}
</span>
</div>
</div>
</div>
{% endfor %}
</div>
<script>
document.addEventListener("DOMContentLoaded", () => {
const intervalMinutes = {{ interval | int }}; // aus DB
const intervalMilliseconds = intervalMinutes * 60 * 1000;
let lastUpdateTime = Date.now();
function parseLogTimestamp(ts) {
const parts = ts.match(/^(\d{4})-(\d{2})-(\d{2}) (\d{2}):(\d{2}):(\d{2})$/);
if (!parts) return Date.now();
const [, year, month, day, hour, minute, second] = parts.map(Number);
return new Date(year, month - 1, day, hour, minute, second).getTime();
}
function updateTimer() {
const now = Date.now();
const elapsed = now - lastUpdateTime;
const remainingMs = intervalMilliseconds - (elapsed % intervalMilliseconds);
const remainingSec = Math.ceil(remainingMs / 1000);
document.getElementById("dashboard-timer").innerText =
`Nächste Prüfung in ${remainingSec} Sekunden`;
if (remainingSec <= 1) {
// Timer abgelaufen → Reload starten
window.location.reload();
}
}
function fetchLastLog() {
fetch("{{ url_for('get_log') }}")
.then(response => response.text())
.then(data => {
const lines = data.split("\n");
let lastSepIndex = -1;
for (let i = lines.length - 1; i >= 0; i--) {
if (lines[i].startsWith("--------------------------------------------------------------------")) {
lastSepIndex = i;
break;
}
}
if (lastSepIndex >= 0 && lastSepIndex + 1 < lines.length) {
const firstLine = lines[lastSepIndex + 1];
const match = firstLine.match(/^(\d{4}-\d{2}-\d{2} \d{2}:\d{2}:\d{2})/);
if (match) lastUpdateTime = parseLogTimestamp(match[1]);
}
})
.catch(err => console.error("Fehler beim Laden der Logs:", err));
}
// Timer alle 1 Sekunde aktualisieren
setInterval(updateTimer, 1000);
// einmal beim Laden die letzte Log-Zeit setzen
fetchLastLog();
});
</script>
{% endblock %}