ux(quellen-health): Run-Verlauf-Tabelle kompakter

- Total-Spalte raus (= errors+warnings+ok, redundant).
- Spalten-Widths explizit per colgroup gesetzt: 200/160/110/130/110px,
  damit die Werte nicht in einer leeren Flaeche rechts kleben.
- Header-Bezeichnungen + Werte fuer Counter-Spalten zentriert
  (statt rechtsbuendig auf gleichmaessig verteilten Spalten).
- Run-ID gekuerzt auf 12 Zeichen, kleinerer font-size, voller
  Wert im title-Tooltip.
- Spaltenbeschriftung von "Zeitpunkt (Run-Ende)" -> "Zeitpunkt"
  (Klammer-Erklaerung war Footnote-Material).

Cache-Buster source-health.js auf 20260509k gebumpt.
Dieser Commit ist enthalten in:
Claude (cleanup)
2026-05-09 14:44:20 +00:00
Ursprung 3a838809c6
Commit 38a13c0b64
2 geänderte Dateien mit 24 neuen und 9 gelöschten Zeilen

Datei anzeigen

@@ -723,7 +723,7 @@
<script src="/static/js/app.js?v=20260509j"></script> <script src="/static/js/app.js?v=20260509j"></script>
<script src="/static/js/sources.js?v=20260509d"></script> <script src="/static/js/sources.js?v=20260509d"></script>
<script src="/static/js/source-health.js?v=20260509i"></script> <script src="/static/js/source-health.js?v=20260509k"></script>
<script src="/static/js/audit.js?v=20260509d"></script> <script src="/static/js/audit.js?v=20260509d"></script>
<div id="toastContainer" class="toast-container" aria-live="polite" aria-atomic="true"></div> <div id="toastContainer" class="toast-container" aria-live="polite" aria-atomic="true"></div>
</body> </body>

Datei anzeigen

@@ -361,24 +361,39 @@ function renderHealthDashboard() {
</div>`; </div>`;
} }
// History-View: letzte Runs // History-View: letzte Runs. Kompakt: Total raus (= errors+warnings+ok),
// Spalten-Widths explizit, Zahlen zentriert, Run-ID gekürzt + leiser.
let runsHtml = ""; let runsHtml = "";
if (healthHistoryCache.length > 0) { if (healthHistoryCache.length > 0) {
runsHtml = ` runsHtml = `
<div class="card" style="margin-bottom:16px;"> <div class="card" style="margin-bottom:16px;">
<div class="card-header"><h2>Verlauf der Health-Check-Runs</h2></div> <div class="card-header"><h2>Verlauf der Health-Check-Runs</h2></div>
<div class="table-wrap"> <div class="table-wrap">
<table> <table style="table-layout:fixed; width:100%;">
<thead><tr><th>Zeitpunkt (Run-Ende)</th><th>Run-ID</th><th>Total</th><th>Fehler</th><th>Warnungen</th><th>OK</th></tr></thead> <colgroup>
<col style="width:200px;">
<col style="width:160px;">
<col style="width:110px;">
<col style="width:130px;">
<col style="width:110px;">
</colgroup>
<thead>
<tr>
<th>Zeitpunkt</th>
<th>Run-ID</th>
<th style="text-align:center;">Fehler</th>
<th style="text-align:center;">Warnungen</th>
<th style="text-align:center;">OK</th>
</tr>
</thead>
<tbody> <tbody>
${healthHistoryCache.map(r => ` ${healthHistoryCache.map(r => `
<tr> <tr>
<td>${formatDateTime(r.archived_at)}</td> <td>${formatDateTime(r.archived_at)}</td>
<td class="text-secondary"><code>${esc(r.run_id)}</code></td> <td class="text-secondary" style="font-size:12px;" title="${esc(r.run_id)}"><code>${esc(String(r.run_id || "").slice(0, 12))}</code></td>
<td class="text-right">${r.total}</td> <td class="text-danger" style="text-align:center;">${r.errors || 0}</td>
<td class="text-right text-danger">${r.errors || 0}</td> <td class="text-warning" style="text-align:center;">${r.warnings || 0}</td>
<td class="text-right text-warning">${r.warnings || 0}</td> <td class="text-success" style="text-align:center;">${r.ok || 0}</td>
<td class="text-right text-success">${r.ok || 0}</td>
</tr>`).join("")} </tr>`).join("")}
</tbody> </tbody>
</table> </table>