35 lines
3 KiB
JavaScript
35 lines
3 KiB
JavaScript
(function () {
|
|
const esc = (s) => String(s ?? '').replace(/&/g,'&').replace(/</g,'<').replace(/>/g,'>');
|
|
async function api(path, opts = {}) {
|
|
const h = { ...(opts.headers || {}) };
|
|
const t = window.DeskAuth?.getToken?.();
|
|
if (t) h.Authorization = `Bearer ${t}`;
|
|
const r = await fetch(`/api/v1/agents${path}`, { ...opts, headers: h });
|
|
if (!r.ok) throw new Error(`${r.status}`);
|
|
return r.json();
|
|
}
|
|
async function renderAgenticOps() {
|
|
const el = document.getElementById('agentic-ops-content');
|
|
if (!el) return;
|
|
el.innerHTML = '<p class="loading">Carregando Agentic Ops…</p>';
|
|
try {
|
|
const [health, scenarios, findings, log] = await Promise.all([
|
|
api('/health'), api('/scenarios'), api('/findings?limit=30'), api('/action-log?limit=40'),
|
|
]);
|
|
const tier = health.tier === 't1' ? 'T1 LLM' : 'T0';
|
|
const ollama = health.ollama ? '<span class="pill pill-ok">Ollama OK</span>' : '<span class="pill pill-warn">Ollama offline</span>';
|
|
const sRows = (scenarios.scenarios || []).map(s => `<tr><td><code>${esc(s.id)}</code></td><td>${esc(s.title)}</td><td>${esc(s.last_run_status||'—')}</td><td class="ticket-meta">${esc(s.last_run_at||'—')}</td></tr>`).join('');
|
|
const fRows = (findings.findings || []).map(f => `<article class="card agentic-finding"><h3>${esc(f.title)} <span class="pill">${esc(f.severity)}</span></h3><p class="ticket-meta">${esc(f.created_at)}</p>${f.suggested_human_action?`<p><strong>Acção:</strong> ${esc(f.suggested_human_action)}</p>`:''}<button type="button" class="btn btn-ghost btn-sm" data-ack="${f.id}">Marcar visto</button></article>`).join('') || '<p class="empty">Sem findings abertos.</p>';
|
|
const lRows = (log.events || []).map(e => `<tr><td class="ticket-meta">${esc(e.ts)}</td><td><code>${esc(e.event_type)}</code></td><td>${esc(e.message)}</td></tr>`).join('');
|
|
el.innerHTML = `<div class="toolbar agentic-toolbar"><div><h2>Agentic Ops</h2><p class="ticket-meta">Spec 029 · ${tier} ${ollama}</p></div><button type="button" class="btn btn-primary btn-sm" id="btn-agentic-refresh">Actualizar</button></div><div class="agentic-grid"><div class="card"><h3>Cenários</h3><table class="data-table"><thead><tr><th>ID</th><th>Título</th><th>Último</th><th>Quando</th></tr></thead><tbody>${sRows}</tbody></table></div><div class="agentic-findings-col"><h3>Findings</h3>${fRows}</div></div><section class="card" style="margin-top:1rem"><h3>Audit log</h3><table class="data-table data-table-compact"><thead><tr><th>Quando</th><th>Evento</th><th>Mensagem</th></tr></thead><tbody>${lRows}</tbody></table></section>`;
|
|
el.querySelector('#btn-agentic-refresh')?.addEventListener('click', renderAgenticOps);
|
|
el.querySelectorAll('[data-ack]').forEach(btn => btn.addEventListener('click', async () => {
|
|
await api(`/findings/${btn.dataset.ack}/ack`, { method: 'POST' });
|
|
await renderAgenticOps();
|
|
}));
|
|
} catch (err) {
|
|
el.innerHTML = `<p class="error">Erro: ${esc(err.message)}</p>`;
|
|
}
|
|
}
|
|
window.renderAgenticOps = renderAgenticOps;
|
|
})();
|