Auditlog: Statistik-Kacheln zeigen geladen/gesamt (weiterhin v1.1.9)

Alle vier Kacheln (Alle, Hinzufuegen, Aenderungen, Loeschungen) zeigen
jetzt "geladen / gesamt" (z.B. "300 / 466"), solange noch nicht alles
geladen ist -- Gesamtzahlen je Kategorie kommen aus einer einzigen
aggregierten SQL-Abfrage (SUM/CASE ueber die bestehenden LIKE-Muster von
category_of), nicht aus einem vollstaendigen Tabellen-Scan. Sobald alles
geladen ist, wird wieder nur die reine Zahl angezeigt (client- wie
serverseitig identische Formatierungslogik).

Dieser Fix wird per Nutzervorgabe unter der GLEICHEN Releasnummer v1.1.9
ausgeliefert (Tag wird bewusst weitergezogen statt neu vergeben, da
v1.1.9 zum Zeitpunkt dieses Commits zwar schon getaggt, aber die
Kachel-Anzeige noch nicht ausgereift war).

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>

srv/tesm/VERSION

@@ -1 +1 @@
-1.1.8
+1.1.9

srv/tesm/app.py

@@ -7706,21 +7706,84 @@ def kea_log():
     return render_template("logs_kea.html", log_content=log_content)
 
 
+AUDIT_LOG_PAGE_SIZE = 300
+
+
 @app.route("/logs/aenderungen")
 @login_required
 def activity_log():
     """Auditlog: wer hat was geändert (Aktivieren/Deaktivieren, Anlegen,
-    Bearbeiten, Löschen). Bewusst OHNE PoE-Neustarts — die stehen im Live-Log."""
+    Bearbeiten, Löschen). Bewusst OHNE PoE-Neustarts — die stehen im Live-Log.
+    Lädt anfangs nur die neuesten AUDIT_LOG_PAGE_SIZE Zeilen (Performance bei
+    einer ggf. noch nicht archivierten, großen Tabelle) -- ältere Zeilen
+    werden bei Bedarf über "Weitere 300 laden" bzw. "Alle laden" (siehe
+    activity_log_more()) nachgeladen, ohne die Seite neu zu laden."""
     if not current_user.can_view_activity_log:
         flash("Keine Berechtigung, das Auditlog einzusehen.", "danger")
         return redirect(url_for("index"))
 
     conn = get_db_connection()
     entries = conn.execute(
-        "SELECT id, ts, username, action, target, details FROM audit_log ORDER BY id DESC LIMIT 500"
+        "SELECT id, ts, username, action, target, details FROM audit_log ORDER BY id DESC LIMIT ?",
+        (AUDIT_LOG_PAGE_SIZE,),
+    ).fetchall()
+    # Gesamtzahlen je Kategorie (nicht nur der geladenen Zeilen) für die
+    # "X / Y geladen"-Anzeige in den Statistik-Kacheln -- eine einzige
+    # aggregierte Abfrage statt die komplette Tabelle einzulesen. Die
+    # LIKE-Muster bilden exakt dieselbe Kategorisierung wie category_of()
+    # in _audit_log_macros.html ab (kind = action.split(".")[-1]).
+    totals_row = conn.execute(
+        "SELECT COUNT(*) AS total, "
+        "SUM(CASE WHEN action LIKE '%.create' OR action LIKE '%.upload' OR action LIKE '%.mkdir' THEN 1 ELSE 0 END) AS create_n, "
+        "SUM(CASE WHEN action LIKE '%.delete' THEN 1 ELSE 0 END) AS delete_n "
+        "FROM audit_log"
+    ).fetchone()
+    conn.close()
+
+    total_count = totals_row["total"] or 0
+    total_create = totals_row["create_n"] or 0
+    total_delete = totals_row["delete_n"] or 0
+    total_edit = total_count - total_create - total_delete
+
+    oldest_loaded_id = entries[-1]["id"] if entries else None
+    has_more = len(entries) >= AUDIT_LOG_PAGE_SIZE and total_count > len(entries)
+    return render_template(
+        "activity_log.html", entries=entries, total_count=total_count,
+        total_create=total_create, total_edit=total_edit, total_delete=total_delete,
+        oldest_loaded_id=oldest_loaded_id, has_more=has_more,
+    )
+
+
+@app.route("/logs/aenderungen/more")
+@login_required
+def activity_log_more():
+    """AJAX-Nachladen älterer Auditlog-Zeilen in AUDIT_LOG_PAGE_SIZE-Schritten
+    (Cursor-Pagination über die id-Spalte, absteigend) -- liefert reines
+    HTML-Zeilenfragment (dieselbe Zeilen-Darstellung wie die Erstladung, über
+    das gemeinsame Makro in _audit_log_macros.html) statt JSON, damit das
+    Anhängen im Frontend ein einfaches insertAdjacentHTML bleibt."""
+    if not current_user.can_view_activity_log:
+        return "Keine Berechtigung.", 403
+    try:
+        before_id = int(request.args.get("before_id", ""))
+    except (TypeError, ValueError):
+        return "Ungültiger Parameter.", 400
+
+    conn = get_db_connection()
+    entries = conn.execute(
+        "SELECT id, ts, username, action, target, details FROM audit_log WHERE id < ? ORDER BY id DESC LIMIT ?",
+        (before_id, AUDIT_LOG_PAGE_SIZE),
     ).fetchall()
     conn.close()
-    return render_template("activity_log.html", entries=entries)
+
+    oldest_loaded_id = entries[-1]["id"] if entries else before_id
+    has_more = len(entries) >= AUDIT_LOG_PAGE_SIZE
+    html = render_template("_audit_log_rows.html", entries=entries)
+    resp = app.response_class(html, mimetype="text/html")
+    resp.headers["X-Row-Count"] = str(len(entries))
+    resp.headers["X-Has-More"] = "1" if has_more else "0"
+    resp.headers["X-Oldest-Id"] = str(oldest_loaded_id)
+    return resp
 
 
 

srv/tesm/templates/_audit_log_macros.html

@@ -0,0 +1,67 @@
+{#
+  Gemeinsame Auditlog-Zeilendarstellung -- von activity_log.html (Erstladung)
+  UND _audit_log_rows.html (AJAX-Nachladen über "Weitere 500 laden")
+  importiert, damit beide garantiert dieselbe Darstellung erzeugen und
+  action_labels/action_icons/category_of nicht an zwei Stellen gepflegt
+  werden müssen.
+#}
+{% set action_labels = {
+  "settings.update": "Einstellung geändert",
+  "device.create": "Gerät angelegt",
+  "device.edit": "Gerät bearbeitet",
+  "device.delete": "Gerät gelöscht",
+  "device.activate": "Gerät aktiviert",
+  "device.deactivate": "Gerät deaktiviert",
+  "switch.create": "Switch angelegt",
+  "switch.edit": "Switch bearbeitet",
+  "switch.delete": "Switch gelöscht",
+  "credential.create": "Zugangsdaten angelegt",
+  "credential.edit": "Zugangsdaten bearbeitet",
+  "credential.delete": "Zugangsdaten gelöscht",
+  "user.create": "Benutzer angelegt",
+  "user.edit": "Benutzer bearbeitet",
+  "user.delete": "Benutzer gelöscht",
+  "user.assign_group": "Gruppe zugewiesen",
+  "group.create": "Gruppe angelegt",
+  "group.edit": "Gruppe bearbeitet",
+  "group.delete": "Gruppe gelöscht",
+  "group.assign_admins": "Admin-Zuweisung geändert",
+  "profile.update": "Profil aktualisiert",
+  "profile.password": "Passwort geändert",
+  "check.run_now": "Prüfung manuell gestartet",
+  "fileshare.upload": "Datei(en) hochgeladen",
+  "fileshare.mkdir": "Ordner angelegt",
+  "fileshare.delete": "Datei/Ordner gelöscht",
+  "fileshare.rename": "Datei/Ordner umbenannt",
+  "fileshare.download": "Als ZIP heruntergeladen",
+  "auditlog.archive": "Auditlog archiviert",
+  "auditlog.export_delete": "Auditlog-Archiv exportiert",
+} %}
+{% set action_icons = {
+  "delete": '<path d="M3 6h18M8 6V4a2 2 0 012-2h4a2 2 0 012 2v2m3 0l-1 14a2 2 0 01-2 2H7a2 2 0 01-2-2L4 6"/>',
+  "create": '<path d="M12 5v14M5 12h14"/>',
+  "edit": '<path d="M12 20h9"/><path d="M16.5 3.5a2.1 2.1 0 013 3L7 19l-4 1 1-4z"/>',
+  "activate": '<path d="M20 6L9 17l-5-5"/>',
+  "deactivate": '<circle cx="12" cy="12" r="9"/><path d="M15 9l-6 6M9 9l6 6"/>',
+} %}
+{% set create_kinds = ("create", "upload", "mkdir") %}
+
+{% macro category_of(kind) %}{% if kind in create_kinds %}create{% elif kind == "delete" %}delete{% else %}edit{% endif %}{% endmacro %}
+
+{% macro audit_row(e) %}
+{% set kind = e['action'].split('.')[-1] %}
+{% set cat = category_of(kind)|trim %}
+<tr data-category="{{ cat }}" data-sort-ts="{{ e['ts'] }}" data-sort-user="{{ e['username']|lower }}"
+    data-sort-action="{{ action_labels.get(e['action'], e['action'])|lower }}" data-sort-target="{{ (e['target'] or '')|lower }}">
+  <td class="text-dim mono" style="font-size:12.5px;">{{ e['ts'] }}</td>
+  <td class="cell-name">{{ e['username'] }}</td>
+  <td>
+    <span class="pill action-pill action-pill--{{ cat }}">
+      <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">{{ (action_icons.get(kind) or action_icons['edit'])|safe }}</svg>
+      {{ action_labels.get(e['action'], e['action']) }}
+    </span>
+  </td>
+  <td>{{ e['target'] or '—' }}</td>
+  <td class="text-dim">{{ e['details'] or '—' }}</td>
+</tr>
+{% endmacro %}

srv/tesm/templates/_audit_log_rows.html

@@ -0,0 +1,5 @@
+{# Reines Zeilenfragment fürs AJAX-Nachladen (activity_log_more()) -- kein
+   umschließendes <table>/<tbody>, wird per insertAdjacentHTML direkt an das
+   bestehende tbody von #auditTable angehängt. #}
+{% import "_audit_log_macros.html" as m %}
+{% for e in entries %}{{ m.audit_row(e) }}{% endfor %}

srv/tesm/templates/activity_log.html

@@ -1,77 +1,41 @@
 {% extends "base.html" %}
 {% set active_page = "logs" %}
 {% block page_title %}Auditlog{% endblock %}
-{% block page_sub %}<div class="topbar-sub">{{ entries|length }} Einträge (letzte 500)</div>{% endblock %}
+{% block page_sub %}
+<div class="topbar-sub" id="auditEntryCount">
+  {% if has_more %}{{ entries|length }} von {{ total_count }} Einträgen geladen{% else %}{{ entries|length }} Eintrag{{ 'e' if entries|length != 1 else '' }}{% endif %}
+</div>
+{% endblock %}
 
 {% block content %}
-
-{% set action_labels = {
-  "settings.update": "Einstellung geändert",
-  "device.create": "Gerät angelegt",
-  "device.edit": "Gerät bearbeitet",
-  "device.delete": "Gerät gelöscht",
-  "device.activate": "Gerät aktiviert",
-  "device.deactivate": "Gerät deaktiviert",
-  "switch.create": "Switch angelegt",
-  "switch.edit": "Switch bearbeitet",
-  "switch.delete": "Switch gelöscht",
-  "credential.create": "Zugangsdaten angelegt",
-  "credential.edit": "Zugangsdaten bearbeitet",
-  "credential.delete": "Zugangsdaten gelöscht",
-  "user.create": "Benutzer angelegt",
-  "user.edit": "Benutzer bearbeitet",
-  "user.delete": "Benutzer gelöscht",
-  "user.assign_group": "Gruppe zugewiesen",
-  "group.create": "Gruppe angelegt",
-  "group.edit": "Gruppe bearbeitet",
-  "group.delete": "Gruppe gelöscht",
-  "group.assign_admins": "Admin-Zuweisung geändert",
-  "profile.update": "Profil aktualisiert",
-  "profile.password": "Passwort geändert",
-  "check.run_now": "Prüfung manuell gestartet",
-  "fileshare.upload": "Datei(en) hochgeladen",
-  "fileshare.mkdir": "Ordner angelegt",
-  "fileshare.delete": "Datei/Ordner gelöscht",
-  "fileshare.rename": "Datei/Ordner umbenannt",
-  "fileshare.download": "Als ZIP heruntergeladen",
-  "auditlog.archive": "Auditlog archiviert",
-  "auditlog.export_delete": "Auditlog-Archiv exportiert",
-} %}
-{% set action_icons = {
-  "delete": '<path d="M3 6h18M8 6V4a2 2 0 012-2h4a2 2 0 012 2v2m3 0l-1 14a2 2 0 01-2 2H7a2 2 0 01-2-2L4 6"/>',
-  "create": '<path d="M12 5v14M5 12h14"/>',
-  "edit": '<path d="M12 20h9"/><path d="M16.5 3.5a2.1 2.1 0 013 3L7 19l-4 1 1-4z"/>',
-  "activate": '<path d="M20 6L9 17l-5-5"/>',
-  "deactivate": '<circle cx="12" cy="12" r="9"/><path d="M15 9l-6 6M9 9l6 6"/>',
-} %}
-{% set create_kinds = ("create", "upload", "mkdir") %}
-
-{% macro category_of(kind) %}{% if kind in create_kinds %}create{% elif kind == "delete" %}delete{% else %}edit{% endif %}{% endmacro %}
+{% import "_audit_log_macros.html" as m %}
 
 {% set ns = namespace(create=0, delete=0, edit=0) %}
 {% for e in entries %}
-  {% set cat = category_of(e['action'].split('.')[-1])|trim %}
+  {% set cat = m.category_of(e['action'].split('.')[-1])|trim %}
   {% if cat == "create" %}{% set ns.create = ns.create + 1 %}
   {% elif cat == "delete" %}{% set ns.delete = ns.delete + 1 %}
   {% else %}{% set ns.edit = ns.edit + 1 %}{% endif %}
 {% endfor %}
 
+{% macro fmt_count(loaded, total) %}{% if loaded < total %}{{ loaded }} / {{ total }}{% else %}{{ loaded }}{% endif %}{% endmacro %}
+
 <div class="stat-row" style="margin-bottom:18px;">
   <div class="stat-card" data-category-filter="">
     <div class="stat-label">Alle</div>
-    <div class="stat-value">{{ entries|length }}</div>
+    <div class="stat-value" id="statAll">{{ fmt_count(entries|length, total_count) }}</div>
   </div>
   <div class="stat-card" data-category-filter="create">
     <div class="stat-label">Hinzufügen</div>
-    <div class="stat-value" style="color:var(--success);">{{ ns.create }}</div>
+    <div class="stat-value" id="statCreate" style="color:var(--success);">{{ fmt_count(ns.create, total_create) }}</div>
   </div>
   <div class="stat-card" data-category-filter="edit">
     <div class="stat-label">Änderungen</div>
-    <div class="stat-value" style="color:var(--accent-strong);">{{ ns.edit }}</div>
+    <div class="stat-value" id="statEdit" style="color:var(--accent-strong);">{{ fmt_count(ns.edit, total_edit) }}</div>
   </div>
   <div class="stat-card" data-category-filter="delete">
     <div class="stat-label">Löschungen</div>
-    <div class="stat-value" style="color:var(--danger);">{{ ns.delete }}</div>
+    <div class="stat-value" id="statDelete" style="color:var(--danger);">{{ fmt_count(ns.delete, total_delete) }}</div>
   </div>
 </div>
 
@@ -92,29 +56,21 @@
       <th>Details</th>
     </tr></thead>
     <tbody>
-      {% for e in entries %}
-      {% set kind = e['action'].split('.')[-1] %}
-      {% set cat = category_of(kind)|trim %}
-      <tr data-category="{{ cat }}" data-sort-ts="{{ e['ts'] }}" data-sort-user="{{ e['username']|lower }}"
-          data-sort-action="{{ action_labels.get(e['action'], e['action'])|lower }}" data-sort-target="{{ (e['target'] or '')|lower }}">
-        <td class="text-dim mono" style="font-size:12.5px;">{{ e['ts'] }}</td>
-        <td class="cell-name">{{ e['username'] }}</td>
-        <td>
-          <span class="pill action-pill action-pill--{{ cat }}">
-            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">{{ (action_icons.get(kind) or action_icons['edit'])|safe }}</svg>
-            {{ action_labels.get(e['action'], e['action']) }}
-          </span>
-        </td>
-        <td>{{ e['target'] or '—' }}</td>
-        <td class="text-dim">{{ e['details'] or '—' }}</td>
-      </tr>
-      {% else %}
+      {% for e in entries %}{{ m.audit_row(e) }}{% else %}
       <tr class="empty-row"><td colspan="5">Noch keine Änderungen protokolliert.</td></tr>
       {% endfor %}
     </tbody>
   </table>
   </div>
   <p id="auditNoResults" class="text-faint hidden" style="padding:16px; text-align:center; font-size:12.5px;">Keine Einträge für diese Auswahl.</p>
+  <div id="auditLoadMoreWrap" class="{{ 'hidden' if not has_more }}" style="padding:16px; text-align:center; display:flex; gap:8px; justify-content:center;">
+    <button type="button" id="auditLoadMoreBtn" class="btn btn-primary" data-oldest-id="{{ oldest_loaded_id or '' }}">
+      Mehr laden (300)
+    </button>
+    <button type="button" id="auditLoadAllBtn" class="btn btn-secondary">
+      Alle laden
+    </button>
+  </div>
   </div>
 
 {% endblock %}
@@ -124,11 +80,11 @@
 document.addEventListener("DOMContentLoaded", function () {
     const searchInput = document.getElementById("auditSearch");
     const noResults = document.getElementById("auditNoResults");
-    const rows = Array.from(document.querySelectorAll("#auditTable tbody tr"));
     let activeCategory = null;
 
     function applyFilters() {
         const q = (searchInput ? searchInput.value : "").trim().toLowerCase();
+        const rows = Array.from(document.querySelectorAll("#auditTable tbody tr"));
         let anyVisible = false;
         rows.forEach(function (row) {
             if (row.classList.contains("empty-row")) return;
@@ -156,7 +112,113 @@ document.addEventListener("DOMContentLoaded", function () {
         });
     });
 
+    /* ---- Nachladen älterer Einträge (Mehr laden / Alle laden) ---- */
+    const totalCount = {{ total_count }};
+    const totalCreate = {{ total_create }};
+    const totalEdit = {{ total_edit }};
+    const totalDelete = {{ total_delete }};
+    const entryCountLabel = document.getElementById("auditEntryCount");
+
+    function fmtCount(loaded, total) {
+        return loaded < total ? loaded + " / " + total : String(loaded);
+    }
+
+    function recomputeStats() {
+        const rows = Array.from(document.querySelectorAll("#auditTable tbody tr[data-category]"));
+        const counts = { create: 0, edit: 0, delete: 0 };
+        rows.forEach(function (r) { counts[r.dataset.category] = (counts[r.dataset.category] || 0) + 1; });
+        document.getElementById("statAll").textContent = fmtCount(rows.length, totalCount);
+        document.getElementById("statCreate").textContent = fmtCount(counts.create, totalCreate);
+        document.getElementById("statEdit").textContent = fmtCount(counts.edit, totalEdit);
+        document.getElementById("statDelete").textContent = fmtCount(counts.delete, totalDelete);
+        if (entryCountLabel) {
+            entryCountLabel.textContent = rows.length < totalCount
+                ? rows.length + " von " + totalCount + " Einträgen geladen"
+                : rows.length + " Eintrag" + (rows.length === 1 ? "" : "e");
+        }
+        return rows.length;
+    }
+
+    const loadMoreBtn = document.getElementById("auditLoadMoreBtn");
+    const loadAllBtn = document.getElementById("auditLoadAllBtn");
+    const loadMoreWrap = document.getElementById("auditLoadMoreWrap");
+    const tbody = document.querySelector("#auditTable tbody");
+    const MORE_URL = "{{ url_for('activity_log_more') }}";
+
+    // Laedt genau einen weiteren 300er-Block nach und haengt ihn an -- von
+    // beiden Buttons genutzt: "Mehr laden" ruft das einmal auf, "Alle laden"
+    // ruft es wiederholt auf, bis der Server "keine weiteren mehr" meldet.
+    function loadMoreOnce() {
+        const oldestId = loadMoreBtn.dataset.oldestId;
+        if (!oldestId) return Promise.resolve({ hasMore: false });
+        return fetch(MORE_URL + "?before_id=" + encodeURIComponent(oldestId))
+            .then(function (r) {
+                const hasMore = r.headers.get("X-Has-More") === "1";
+                const newOldestId = r.headers.get("X-Oldest-Id");
+                return r.text().then(function (html) {
+                    return { html: html, hasMore: hasMore, newOldestId: newOldestId };
+                });
+            })
+            .then(function (result) {
+                const emptyRow = tbody.querySelector(".empty-row");
+                if (emptyRow) emptyRow.remove();
+                tbody.insertAdjacentHTML("beforeend", result.html);
+                if (result.newOldestId) loadMoreBtn.dataset.oldestId = result.newOldestId;
+                return result;
+            });
+    }
+
+    if (loadMoreBtn) {
+        loadMoreBtn.addEventListener("click", function () {
+            loadMoreBtn.disabled = true;
+            if (loadAllBtn) loadAllBtn.disabled = true;
+            const originalText = loadMoreBtn.textContent;
+            loadMoreBtn.textContent = "Lädt …";
+            loadMoreOnce()
+                .then(function (result) {
+                    if (!result.hasMore) loadMoreWrap.classList.add("hidden");
+                    recomputeStats();
                     applyFilters();
+                })
+                .catch(function () { /* Button unten wird trotzdem wieder aktiviert */ })
+                .then(function () {
+                    loadMoreBtn.disabled = false;
+                    if (loadAllBtn) loadAllBtn.disabled = false;
+                    loadMoreBtn.textContent = originalText;
+                });
+        });
+    }
+
+    if (loadAllBtn) {
+        loadAllBtn.addEventListener("click", function () {
+            loadMoreBtn.disabled = true;
+            loadAllBtn.disabled = true;
+            const originalText = loadAllBtn.textContent;
+
+            function step() {
+                loadAllBtn.textContent = "Lädt … (" + recomputeStats() + " von " + totalCount + ")";
+                return loadMoreOnce().then(function (result) {
+                    return result.hasMore ? step() : null;
+                });
+            }
+
+            step()
+                .then(function () {
+                    loadMoreWrap.classList.add("hidden");
+                })
+                .catch(function () { /* teilweise geladene Eintraege bleiben stehen */ })
+                .then(function () {
+                    recomputeStats();
+                    applyFilters();
+                    loadMoreBtn.disabled = false;
+                    loadAllBtn.disabled = false;
+                    loadAllBtn.textContent = originalText;
+                });
+        });
+    }
+
+    applyFilters();
+    recomputeStats();
 });
 </script>
 {% endblock %}