gru/haproxy-dashboard
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fixes

Browse Source
This commit is contained in:
Mateusz Gruszczyński
2025-11-04 08:54:29 +01:00
parent 0a027bbebd
commit 9949e34d68
2 changed files with 99 additions and 35 deletions
Download Patch File Download Diff File Expand all files Collapse all files

87
static/js/logs.js
View File

@@ -27,7 +27,7 @@ document.addEventListener('DOMContentLoaded', function() {
// Event Listeners
searchFilter.addEventListener('keyup', debounce(function() {
currentPage = 1;
applyFilters();
loadLogsWithPage();
}, 300));
excludeBtn.addEventListener('click', function() {
@@ -36,7 +36,8 @@ document.addEventListener('DOMContentLoaded', function() {
if (!excludePhrases.includes(phrase)) {
excludePhrases.push(phrase);
updateExcludeUI();
applyFilters();
currentPage = 1;
loadLogsWithPage();
}
excludeFilter.value = '';
}
@@ -52,7 +53,7 @@ document.addEventListener('DOMContentLoaded', function() {
excludeFilter.value = '';
updateExcludeUI();
currentPage = 1;
applyFilters();
loadLogsWithPage();
});
perPageSelect.addEventListener('change', function() {
@@ -105,28 +106,48 @@ document.addEventListener('DOMContentLoaded', function() {
}
/**
* Load logs from API
* Load initial logs from API
*/
function loadLogs() {
logsContainer.innerHTML = '<tr><td class="text-center text-muted py-4">Loading logs...</td></tr>';
loadLogsWithPage();
}
/**
* Load logs with pagination from API
*/
function loadLogsWithPage() {
console.log(`[Logs] Loading page ${currentPage}, per_page ${perPage}`);
fetch('/api/logs', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({
page: 1,
per_page: 200 // Load initial 200
page: currentPage,
per_page: perPage,
search: searchFilter.value.trim(),
exclude: excludePhrases
})
})
.then(r => r.json())
.then(data => {
if (data.success) {
allLoadedLogs = data.logs;
loadedSpan.textContent = data.logs.length;
loadedSpan.textContent = data.loaded_count;
totalLogs = data.total;
document.getElementById('total_count').textContent = data.total;
console.log(`[Logs] Loaded ${data.logs.length}/${data.total}`, flush=true);
applyFilters();
const totalPages = Math.ceil(data.total_filtered / perPage) || 1;
totalPagesSpan.textContent = totalPages;
matchSpan.textContent = data.total_filtered;
currentPageSpan.textContent = data.page;
renderLogs(data.logs);
prevBtn.disabled = currentPage === 1;
nextBtn.disabled = !data.has_more;
console.log(`[Logs] Page ${data.page}/${totalPages}, ${data.logs.length} logs`, flush=true);
} else {
showError(data.error);
}
@@ -138,7 +159,7 @@ document.addEventListener('DOMContentLoaded', function() {
}
/**
* Get filtered logs
* Get filtered logs (for local filtering)
*/
function getFilteredLogs() {
let filtered = allLoadedLogs;
@@ -164,23 +185,19 @@ document.addEventListener('DOMContentLoaded', function() {
}
/**
* Apply all filters and render
* Apply local filters only
*/
function applyFilters() {
const filtered = getFilteredLogs();
matchSpan.textContent = filtered.length;
renderLogs(filtered);
const totalPages = Math.ceil(filtered.length / perPage) || 1;
totalPagesSpan.textContent = totalPages;
currentPageSpan.textContent = currentPage;
const offset = (currentPage - 1) * perPage;
const paginated = filtered.slice(offset, offset + perPage);
renderLogs(paginated);
matchSpan.textContent = filtered.length;
prevBtn.disabled = currentPage === 1;
nextBtn.disabled = offset + perPage >= filtered.length;
nextBtn.disabled = (currentPage * perPage) >= filtered.length;
}
/**
@@ -188,7 +205,7 @@ document.addEventListener('DOMContentLoaded', function() {
*/
function renderLogs(logs) {
if (!logs || logs.length === 0) {
logsContainer.innerHTML = '<tr><td class="text-center text-muted py-4">No logs matching criteria</td></tr>';
logsContainer.innerHTML = '<tr><td class="text-center text-muted py-4">No logs found</td></tr>';
return;
}
@@ -197,22 +214,35 @@ document.addEventListener('DOMContentLoaded', function() {
if (entry.xss_alert) threat_badges.push('<span class="badge bg-danger me-1">XSS</span>');
if (entry.sql_alert) threat_badges.push('<span class="badge bg-danger me-1">SQL</span>');
if (entry.webshell_alert) threat_badges.push('<span class="badge bg-danger me-1">SHELL</span>');
if (entry.put_method) threat_badges.push('<span class="badge bg-warning me-1">PUT</span>');
if (entry.put_method) threat_badges.push('<span class="badge bg-danger me-1">PUT</span>');
if (entry.illegal_resource) threat_badges.push('<span class="badge bg-warning me-1">403</span>');
const threat_html = threat_badges.length > 0 ? `<div class="mb-2">${threat_badges.join('')}</div>` : '';
let row_class = '';
if (entry.has_threat) {
row_class = 'table-danger';
} else if (entry.status_code.startsWith('5')) {
row_class = 'table-danger';
} else if (entry.status_code.startsWith('4')) {
row_class = 'table-warning';
} else if (entry.status_code.startsWith('2')) {
row_class = 'table-light';
} else {
row_class = 'table-light';
}
return `
<tr class="table-${entry.status_class}" style="font-family: monospace; font-size: 11px;">
<tr class="${row_class}" style="font-family: monospace; font-size: 11px;">
<td>
${threat_html}
<small class="text-info">${escapeHtml(entry.timestamp)}</small><br>
<small class="text-warning">${escapeHtml(entry.ip_address)}</small><br>
<strong>${escapeHtml(entry.http_method)}</strong>
<code>${escapeHtml(entry.requested_url)}</code>
<span class="badge bg-secondary ms-2">${escapeHtml(entry.status_code)}</span>
<small style="color: #0066cc;">${escapeHtml(entry.timestamp)}</small><br>
<small style="color: #666;">${escapeHtml(entry.ip_address)}</small>
<strong style="color: #333;">${escapeHtml(entry.http_method)}</strong>
<code style="color: #333;">${escapeHtml(entry.requested_url)}</code>
<span class="badge bg-dark" style="color: white; margin-left: 5px;">${escapeHtml(entry.status_code)}</span>
<br>
<small style="color: #aaa;">${escapeHtml(entry.frontend)}~ ${escapeHtml(entry.backend)}</small>
<small style="color: #666;">${escapeHtml(entry.frontend)}~ ${escapeHtml(entry.backend)}</small>
</td>
</tr>
`;
@@ -251,7 +281,8 @@ document.addEventListener('DOMContentLoaded', function() {
window.removeExcludePhrase = function(idx) {
excludePhrases.splice(idx, 1);
updateExcludeUI();
applyFilters();
currentPage = 1;
loadLogsWithPage();
};
/**