Jakach/jakach-logging
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

adding search
Deploy / deploy (push) Successful in 9s
Details

Browse Source
This commit is contained in:
janis steiner
2026-05-06 12:30:13 +02:00
parent ddcd7b0a5e
commit 556ac06413
4 changed files with 106 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/index.html
+40 -6
View File
@@ -130,15 +130,37 @@ pre.raw-line { background: var(--bs-tertiary-bg); padding: .75rem; border-radius
<option value="warning">Warning</option>
<option value="info">Info</option>
</select>
<select class="form-select form-select-sm" id="filterStatus" style="width:auto">
<select class="form-select form-select-sm" id="filterStatus" style="width:auto">
<option value="">All Statuses</option>
<option value="open">Open</option>
<option value="acknowledged">Acknowledged</option>
<option value="resolved">Resolved</option>
</select>
<div class="input-group input-group-sm" style="width:220px">
<input type="text" class="form-control" id="searchInput" placeholder="Search logs..." maxlength="100">
<button class="btn btn-outline-secondary" id="searchBtn"><i class="bi bi-search"></i></button>
</div>
<button class="btn btn-outline-secondary btn-sm" id="refreshAlertsBtn"><i class="bi bi-arrow-clockwise"></i></button>
</div>
</div>
<div class="card">
<div class="card-body p-0">
<div class="table-responsive">
<table class="table table-hover table-sm mb-0">
<thead class="table-dark"><tr>
<th style="width:60px">ID</th>
<th style="width:90px">Severity</th>
<th style="width:100px">Status</th>
<th>Message / Raw Line</th>
<th>Source</th>
<th style="width:170px">Created</th>
<th style="width:60px"></th>
</tr></thead>
<tbody id="alertsBody"><tr><td colspan="7" class="empty-state"><i class="bi bi-inbox"></i><p class="mb-0">No alerts match those filters</p></td></tr></tbody>
</table>
</div>
</div>
</div>
<div class="card">
<div class="card-body p-0">
<div class="table-responsive">
@@ -545,12 +567,20 @@ async function loadDashboard() {
async function loadAlerts() {
const severity = document.getElementById('filterSeverity').value;
const status = document.getElementById('filterStatus').value;
const params = new URLSearchParams({ limit: 100, offset: 0 });
if (severity) params.set('severity', severity);
if (status) params.set('status', status);
const query = document.getElementById('searchInput').value.trim();
let url;
if (query) {
url = '/alerts/search?q=' + encodeURIComponent(query) + '&limit=100';
} else {
const params = new URLSearchParams({ limit: 100, offset: 0 });
if (severity) params.set('severity', severity);
if (status) params.set('status', status);
url = '/alerts?' + params.toString();
}
try {
const res = await api('/alerts?' + params.toString());
const res = await api(url);
const alerts = res.data || [];
state.alerts = alerts;
@@ -568,10 +598,14 @@ async function loadAlerts() {
<td>${a.status === 'open' ? `<button class="btn btn-outline-success btn-sm py-0" onclick="event.stopPropagation();ackAlert(${a.id})"><i class="bi bi-check"></i></button>` : ''}</td>
</tr>`).join('');
}
document.getElementById('alertsCount').textContent = alerts.length + ' alerts';
const label = query ? 'search results' : 'alerts';
document.getElementById('alertsCount').textContent = alerts.length + ' ' + label;
} catch (e) { console.error('alerts error', e); }
}
document.getElementById('searchBtn').addEventListener('click', loadAlerts);
document.getElementById('searchInput').addEventListener('keydown', e => { if (e.key === 'Enter') loadAlerts(); });
function showAlert(id) {
const a = state.alerts.find(x => x.id === id);
if (!a) return;