updated api

2026-05-22 13:26:29 +02:00
parent c86372af2e
commit 52d4ef42dc
17 changed files with 867 additions and 41 deletions
--- a/website/js/pages/activity.js
+++ b/website/js/pages/activity.js
@ -0,0 +1,104 @@
+import { apiGet } from '../api.js';
+import { showToast } from '../app.js';
+
+export async function activityPage() {
+    const app = document.getElementById('app');
+    app.innerHTML = `
+        <div class="page-header">
+            <h1>Activity</h1>
+        </div>
+        <div class="card" style="margin-bottom:16px">
+            <div class="form-row" style="align-items:flex-end">
+                <div class="form-group">
+                    <label>Action</label>
+                    <select id="act_filter">
+                        <option value="">All actions</option>
+                        <option value="login">login</option>
+                        <option value="questionnaire_submitted">questionnaire_submitted</option>
+                        <option value="client_created">client_created</option>
+                        <option value="client_deleted">client_deleted</option>
+                        <option value="clients_assigned">clients_assigned</option>
+                        <option value="client_data_exported">client_data_exported</option>
+                        <option value="user_created">user_created</option>
+                        <option value="user_deleted">user_deleted</option>
+                        <option value="password_changed">password_changed</option>
+                    </select>
+                </div>
+                <button class="btn btn-primary btn-sm" id="act_refresh">Refresh</button>
+            </div>
+        </div>
+        <div id="activityContent"><div class="spinner"></div></div>
+    `;
+
+    document.getElementById('act_refresh').addEventListener('click', loadActivity);
+    document.getElementById('act_filter').addEventListener('change', loadActivity);
+    await loadActivity();
+}
+
+async function loadActivity() {
+    const container = document.getElementById('activityContent');
+    container.innerHTML = '<div class="spinner"></div>';
+    const action = document.getElementById('act_filter')?.value || '';
+    const qs = action ? `?limit=200&action=${encodeURIComponent(action)}` : '?limit=200';
+
+    try {
+        const data = await apiGet(`activity${qs}`);
+        renderActivity(data.events || [], data.total ?? 0);
+    } catch (e) {
+        showToast(e.message, 'error');
+        container.innerHTML = `<p class="error-text" style="padding:16px">${esc(e.message)}</p>`;
+    }
+}
+
+function renderActivity(events, total) {
+    const container = document.getElementById('activityContent');
+
+    if (!events.length) {
+        container.innerHTML = `
+            <div class="card"><div class="empty-state"><h3>No activity</h3></div></div>`;
+        return;
+    }
+
+    container.innerHTML = `
+        <div class="card">
+            <p style="margin-bottom:12px;color:var(--text-secondary)">Showing ${events.length} of ${total} events (newest first)</p>
+            <div class="table-wrapper">
+                <table class="data-table">
+                    <thead>
+                        <tr>
+                            <th>Time</th>
+                            <th>Actor</th>
+                            <th>Role</th>
+                            <th>Action</th>
+                            <th>Target</th>
+                            <th>Summary</th>
+                        </tr>
+                    </thead>
+                    <tbody>
+                        ${events.map(e => `
+                            <tr>
+                                <td>${esc(formatTime(e.createdAt))}</td>
+                                <td>${esc(e.actorUsername || e.actorUserID || '—')}</td>
+                                <td>${esc(e.actorRole || '')}</td>
+                                <td><span class="badge">${esc(e.action)}</span></td>
+                                <td>${esc(e.targetType || '')}${e.targetID ? ': ' + esc(e.targetID) : ''}</td>
+                                <td>${esc(e.summary)}</td>
+                            </tr>
+                        `).join('')}
+                    </tbody>
+                </table>
+            </div>
+        </div>`;
+}
+
+function formatTime(ms) {
+    if (!ms) return '';
+    const d = new Date(Number(ms));
+    return d.toLocaleString();
+}
+
+function esc(s) {
+    const d = document.createElement('div');
+    d.textContent = s ?? '';
+    return d.innerHTML;
+}