{% extends "base.html" %} {% block title %}Reports — Intrusion Detection{%
endblock %} {% block content %}
<h1>Reports</h1>
<p class="muted">Browse the timestamped reports written by each scanner.</p>

<div class="panel">
  <div class="panel-actions" style="margin-top: 0">
    <label style="flex-direction: row; align-items: center; gap: 0.5rem"
      >Source
      <select id="source">
        <option value="copyparty">copyparty</option>
        <option value="npm">npm</option>
        <option value="app">app</option>
        <option value="mikrotik">mikrotik</option>
      </select>
    </label>
    <button class="btn" id="refresh-btn">Refresh</button>
  </div>
  <div class="list" id="files"></div>
</div>

<div class="panel">
  <div class="panel-head"><h2 id="content-title">Report content</h2></div>
  <pre class="content" id="content">
Select a report on the left to view it.</pre
  >
</div>
{% endblock %} {% block scripts %}
<script>
  async function loadFiles() {
    const source = document.getElementById("source").value;
    const list = document.getElementById("files");
    list.innerHTML = '<div class="muted">Loading…</div>';
    try {
      const data = await api(`/api/reports/${source}`);
      list.innerHTML = "";
      const files = data.files || [];
      if (!files.length) {
        list.innerHTML = '<div class="muted">No reports in this source.</div>';
        return;
      }
      for (const name of files) {
        list.append(
          el("a", {
            href: "#",
            text: name,
            onclick: (ev) => {
              ev.preventDefault();
              openReport(name);
            },
          }),
        );
      }
    } catch (e) {
      list.innerHTML = `<div class="muted">${escapeHtml(e.message)}</div>`;
    }
  }

  async function openReport(name) {
    const source = document.getElementById("source").value;
    document.getElementById("content-title").textContent = name;
    const pre = document.getElementById("content");
    pre.textContent = "Loading…";
    try {
      const data = await api(`/api/reports/${source}/${name}`);
      pre.textContent = data.content;
    } catch (e) {
      pre.textContent = `Error: ${e.message}`;
    }
  }

  document.getElementById("refresh-btn").addEventListener("click", loadFiles);
  document.getElementById("source").addEventListener("change", loadFiles);
  loadFiles();
</script>
{% endblock %}