servidor funcionando dashboard 80%

node-api/public/index.html

@@ -33,6 +33,11 @@
     <div class="toolbar">
       <button id="refresh">Recargar historial</button>
       <label><input type="checkbox" id="autoScroll" checked /> Autoscroll</label>
+      <button id="selfTest">Self‑Test RADIUS</button>
+      <span class="chip" id="selfTestStatus">Idle</span>
+      <button id="clear">Limpiar</button>
+      <button id="copy">Copiar</button>
+      <button id="exportCsv">Exportar CSV</button>
     </div>
     <div id="list" class="list"></div>
   </main>
@@ -42,8 +47,14 @@ const list = document.getElementById('list');
 const statusEl = document.getElementById('status');
 const countEl = document.getElementById('count');
 const btnRefresh = document.getElementById('refresh');
+const btnSelfTest = document.getElementById('selfTest');
+const selfTestStatus = document.getElementById('selfTestStatus');
 const autoScroll = document.getElementById('autoScroll');
 let total = 0;
+const btnClear = document.getElementById('clear');
+const btnCopy = document.getElementById('copy');
+const btnExportCsv = document.getElementById('exportCsv');
+let history = [];
 
 function renderItem(ev) {
   const div = document.createElement('div');
@@ -69,12 +80,49 @@ async function loadHistory() {
   const r = await fetch('/api/requests');
   const data = await r.json();
   list.innerHTML = '';
+  history = data.items || [];
   total = 0;
-  data.items.forEach(renderItem);
+  history.forEach(renderItem);
 }
 
 btnRefresh.addEventListener('click', loadHistory);
 
+btnSelfTest.addEventListener('click', async () => {
+  selfTestStatus.textContent = 'Running…';
+  try {
+    const r = await fetch('/test/radius', { method: 'POST' });
+    const data = await r.json();
+    if (data.ok) selfTestStatus.textContent = `OK (${data.result.code}, ${data.result.rtt_ms}ms)`;
+    else selfTestStatus.textContent = `Error (${data.error||r.status})`;
+  } catch (e) {
+    selfTestStatus.textContent = `Error (${e.message})`;
+  }
+});
+
+btnClear.addEventListener('click', async () => {
+  if (!confirm('¿Limpiar historial de eventos?')) return;
+  await fetch('/api/requests', { method: 'DELETE' });
+  await loadHistory();
+});
+
+btnCopy.addEventListener('click', async () => {
+  try {
+    await navigator.clipboard.writeText(JSON.stringify(history, null, 2));
+    alert('Copiado al portapapeles');
+  } catch (e) {
+    alert('No se pudo copiar: ' + e.message);
+  }
+});
+
+btnExportCsv.addEventListener('click', () => {
+  const a = document.createElement('a');
+  a.href = '/api/requests.csv';
+  a.download = '';
+  document.body.appendChild(a);
+  a.click();
+  a.remove();
+});
+
 // SSE live events
 function connectSSE() {
   const es = new EventSource('/events');
@@ -83,10 +131,10 @@ function connectSSE() {
   es.addEventListener('message', (e) => {
     try { const ev = JSON.parse(e.data); renderItem(ev); } catch {}
   });
+  es.addEventListener('clear', () => { loadHistory(); });
 }
 
 loadHistory().then(connectSSE);
 </script>
 </body>
 </html>
-