dashboard: Group messages by service

This commit is contained in:
2024-11-03 11:53:45 +01:00
parent af604426c8
commit eeb70d9fcf
3 changed files with 95 additions and 24 deletions

View File

@ -26,26 +26,66 @@
padding: 0.5em;
font-family: 'Ubuntu Mono', mono;
}
.service-error-list {
max-height: 20em;
font-size: small;
overflow: scroll;
transition: max-height ease-in-out 0.4s;
}
.collapsed {
max-height: 0;
}
</style>
<script>
function collapse(id) {
document.getElementById(id).classList.toggle("collapsed")
}
</script>
</head>
<body>
{{#if records}}
<table>
<tr>
<th>Service</th>
<th>Severity</th>
<th>Time</th>
<th>Message</th>
<th>Location</th>
</tr>
{{#each messages}}
<tr>
<td>{{this.service}}</td>
<td>{{this.severity}}</td>
<td>{{this.time}}</td>
<td>{{this.message}}</td>
<td>{{this.location}}</td>
</tr>
{{/each}}
<tr>
<th>Severity</th>
<th>Service</th>
<th>Count</th>
<th>Last message at</th>
</tr>
{{#each records_by_service}}
<tr onclick="collapse('{{@key}}-error-list')">
<td>{{this.severity}}</td>
<td>{{@key}}</td>
<td>{{len this.all_records}}</td>
<td>{{this.last_record.time}}</td>
</tr>
<tr><td colspan="4">
<div
id="{{@key}}-error-list"
class="service-error-list collapsed"
>
<table>
<tr>
<th>Severity</th>
<th>Message</th>
<th>Time</th>
</tr>
{{#each this.all_records}}
<tr>
<td>{{this.severity}}</td>
<td>{{this.message}}</td>
<td>{{this.time}}</td>
</tr>
{{/each}}
</table>
</div></td></tr>
{{/each}}
</table>
{{else}}
<p>
No entries! All is well.
</p>
{{/if}}
</body>
</html>