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

99 lines
3.7 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>
<div class="card-body">
<span class="fw-bold" style="color:
{% if d[2] == 0 %}gray
{% elif status[d[0]]=='online' %}green
{% else %}red
{% 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 }};
const intervalMilliseconds = intervalMinutes * 60 * 1000;
let lastUpdateTime = Date.now(); // Startpunkt beim Laden der Seite
let reloadCountdown = null;
let reloadTriggered = false;
function updateTimer() {
const now = Date.now();
const elapsed = now - lastUpdateTime;
const timerElem = document.getElementById("dashboard-timer");
if (elapsed < intervalMilliseconds) {
// Haupt-Timer läuft
const remainingSec = Math.ceil((intervalMilliseconds - elapsed) / 1000);
timerElem.innerText = `Nächste Prüfung in ${remainingSec} Sekunden`;
} else {
// Haupt-Timer abgelaufen → Reload-Timer starten
if (reloadCountdown === null) reloadCountdown = 10; // 10 Sekunden Countdown
if (!reloadTriggered) {
timerElem.innerText = `Aktualisieren der Seite in ${reloadCountdown} Sekunden`;
reloadCountdown--;
if (reloadCountdown < 0) {
reloadTriggered = true;
window.location.reload();
}
}
}
}
// Initiale Synchronisierung mit letzter Log-Zeit optional
function fetchLastLog() {
fetch("{{ url_for('get_log') }}")
.then(response => response.text())
.then(data => {
const lines = data.split("\n").filter(line => !line.includes("ist erreichbar!"));
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) {
const logTime = new Date(match[1]).getTime();
// Nur Offset setzen, damit Haupt-Timer beim Laden nicht sofort abläuft
const offset = Math.min(Date.now() - logTime, intervalMilliseconds);
lastUpdateTime = Date.now() - offset;
}
}
})
.catch(err => console.error("Fehler beim Laden der Logs:", err));
}
setInterval(updateTimer, 1000);
fetchLastLog();
});
</script>
{% endblock %}