refactor: replace Jinja templates with static frontend pages

2026-06-16 03:35:41 +00:00
parent 2874680ffa
commit 593dece92b
39 changed files with 3532 additions and 2801 deletions
@@ -0,0 +1,79 @@
+import { h, PageHeader, Badge, StatusDot, Empty, Card, esc, enc, att_esc, $val, apiFetch, toast, dismissToast, openModal, closeModal, formModal, definePage, hComp, connect, reactive, requestUpdate, Link, createRouter, ToastContainer, render, parseZones } from '/static/hoover/index.js';
+
+const logTabs = [
+    { key: 'journal', label: 'Journal', url: '/api/logs/journal' },
+    { key: 'nginx-access', label: 'Nginx Access', url: '/api/logs/nginx/access' },
+    { key: 'nginx-error', label: 'Nginx Error', url: '/api/logs/nginx/error' },
+    { key: 'dnsmasq', label: 'Dnsmasq', url: '/api/logs/dnsmasq' },
+    { key: 'app', label: 'App', url: '/api/logs/app' },
+];
+
+
+async function fetchLog(state, url) {
+    state.loading = true;
+    state.error = null;
+    try {
+        const res = await fetch(url);
+        const text = await res.text();
+        state.lines = text.split('\n').filter(l => l.length > 0);
+    } catch (e) {
+        state.error = String(e);
+    }
+    state.loading = false;
+}
+
+export default definePage({
+    init() {
+        return { activeTab: 'journal', lines: [], loading: false, error: null };
+    },
+    subscribe: [],
+    async load(state) {
+        const tab = logTabs.find(t => t.key === state.activeTab) || logTabs[0];
+        await fetchLog(state, tab.url);
+    },
+    onUnmount(state) {
+        state.lines = [];
+    },
+    render(state) {
+        const tab = logTabs.find(t => t.key === state.activeTab) || logTabs[0];
+
+        const lineVnodes = state.lines.map((line, i) =>
+            h('div', { class: 'log-line', key: i }, esc(line))
+        );
+
+        return [
+            PageHeader({ title: 'Logs', subtitle: 'System & service logs' }),
+            h('div', { class: 'tabs', key: 'log-tabs' },
+                logTabs.map(t => h('span', {
+                    class: 'tab ' + (state.activeTab === t.key ? 'active' : ''),
+                    'on:click': async () => {
+                        state.activeTab = t.key;
+                        await fetchLog(state, t.url);
+                    },
+                    style: 'cursor:pointer;',
+                }, t.label))
+            ),
+            h('div', { class: 'card', key: 'log-card' },
+                h('div', { class: 'card-header' },
+                    h('span', null, tab.label),
+                    h('button', {
+                        class: 'btn btn-sm btn-outline',
+                        style: 'float:right;',
+                        'on:click': async () => {
+                            await fetchLog(state, tab.url);
+                        },
+                    }, '\u21BB')
+                ),
+                h('div', { class: 'card-body log-body' },
+                    state.loading
+                        ? h('div', { class: 'loading' }, 'Loading...')
+                        : state.error
+                            ? h('div', { class: 'error-msg' }, state.error)
+                            : lineVnodes.length > 0
+                                ? h('pre', null, lineVnodes)
+                                : h('div', { class: 'text-muted text-sm' }, 'No log lines available')
+                )
+            ),
+        ];
+    },
+});