{{define "audit"}}{{template "base" .}}{{end}}
{{define "title"}}Audit Log — MCIAS{{end}}
{{define "content"}}
<div class="page-header d-flex align-center justify-between">
  <div>
    <h1>Audit Log</h1>
    <p class="text-muted text-small">{{.Total}} total events</p>
  </div>
  <form class="d-flex gap-1 align-center" style="font-size:.9rem">
    <select class="form-control" name="event_type" style="width:auto"
            hx-get="/audit/rows" hx-target="#audit-tbody" hx-swap="innerHTML"
            hx-trigger="change">
      <option value="">All events</option>
      {{range .EventTypes}}<option value="{{.}}"{{if eq $.FilterType .}} selected{{end}}>{{.}}</option>{{end}}
    </select>
  </form>
</div>
<div class="table-wrapper">
  <table>
    <thead>
      <tr><th>Time</th><th>Event</th><th>Actor</th><th>Target</th><th>IP</th><th>Details</th></tr>
    </thead>
    <tbody id="audit-tbody">
      {{template "audit_rows" .}}
    </tbody>
  </table>
</div>
{{if gt .TotalPages 1}}
<div class="d-flex gap-1 align-center mt-2" style="font-size:.9rem;color:#64748b">
  <span>Page {{.Page}} of {{.TotalPages}}</span>
  {{if gt .Page 1}}
  <button class="btn btn-sm btn-secondary"
          hx-get="/audit/rows?page={{sub .Page 1}}&event_type={{.FilterType}}"
          hx-target="#audit-tbody" hx-swap="innerHTML">← Prev</button>
  {{end}}
  {{if lt .Page .TotalPages}}
  <button class="btn btn-sm btn-secondary"
          hx-get="/audit/rows?page={{add .Page 1}}&event_type={{.FilterType}}"
          hx-target="#audit-tbody" hx-swap="innerHTML">Next →</button>
  {{end}}
</div>
{{end}}
{{end}}