feat(ui): Add status emojis to vhost and NAC pages

- vhost: /⏸️ emojis for Enabled/Disabled status
- nac: 🟢/🔴/🟠 emojis for Online/Offline/Quarantine clients
- nac: Dynamic action button (Quarantine/Release)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
CyberMind-FR 2026-05-09 07:04:51 +02:00
parent 750c059ce8
commit 5a507d04df
2 changed files with 13 additions and 7 deletions

View File

@ -325,15 +325,21 @@
const clients = await api('/clients');
const tbody = document.getElementById('clientsTable');
if (clients.clients && clients.clients.length > 0) {
tbody.innerHTML = clients.clients.map(c => `
<tr>
tbody.innerHTML = clients.clients.map(c => {
const statusEmoji = c.status === 'online' ? '🟢' : c.status === 'offline' ? '🔴' : c.status === 'quarantine' ? '🟠' : '⚪';
const statusLabel = c.status === 'online' ? 'Online' : c.status === 'offline' ? 'Offline' : c.status === 'quarantine' ? 'Quarantine' : c.status;
return `<tr>
<td style="font-family:monospace">${c.mac}</td>
<td style="font-family:monospace">${c.ip}</td>
<td>${c.hostname || '-'}</td>
<td><span class="badge ${c.status}">${c.status}</span></td>
<td><button class="btn danger" onclick="quarantine('${c.mac}')">Quarantine</button></td>
</tr>
`).join('');
<td><span class="badge ${c.status}">${statusEmoji} ${statusLabel}</span></td>
<td>
${c.status === 'quarantine'
? '<button class="btn" onclick="unquarantine(\'' + c.mac + '\')">🔓 Release</button>'
: '<button class="btn danger" onclick="quarantine(\'' + c.mac + '\')">🔒 Quarantine</button>'}
</td>
</tr>`;
}).join('');
} else {
tbody.innerHTML = '<tr><td colspan="5" style="color:var(--text-dim)">No clients connected</td></tr>';
}

View File

@ -567,7 +567,7 @@
<td><a href="${v.ssl ? 'https' : 'http'}://${v.domain}" target="_blank" style="color:var(--primary)">${v.domain}</a></td>
<td style="color:var(--text-dim);font-family:monospace;font-size:0.8rem">${v.backend || '-'}</td>
<td>${v.ssl ? '<span class="badge ssl">' + (v.tls_mode || 'SSL') + '</span>' : '-'}</td>
<td><span class="badge ${v.enabled ? 'enabled' : 'disabled'}">${v.enabled ? 'Enabled' : 'Disabled'}</span></td>
<td><span class="badge ${v.enabled ? 'enabled' : 'disabled'}">${v.enabled ? 'Enabled' : '⏸️ Disabled'}</span></td>
<td>
<button class="btn" onclick="toggleVhost('${v.domain}', ${!v.enabled})" style="padding:2px 8px;font-size:0.7rem">${v.enabled ? 'Disable' : 'Enable'}</button>
<button class="btn danger" onclick="deleteVhost('${v.domain}')" style="padding:2px 8px;font-size:0.7rem">Delete</button>