From 78284ed816e0fced46223653cbefe2d8b55fcbd8 Mon Sep 17 00:00:00 2001
From: NanamiAdmin <yzt114@yeah.net>
Date: Thu, 10 Sep 2026 19:36:29 +0800
Subject: [PATCH] feat(frontend): add `debugMode` global variable to store
 debug mode state

---
 frontend/src/main.js          |  8 ++++++++
 frontend/src/utils/runtime.js | 22 ++++++++++++++++++++++
 frontend/src/views/Login.vue  |  3 +++
 3 files changed, 33 insertions(+)
 create mode 100644 frontend/src/utils/runtime.js

diff --git a/frontend/src/main.js b/frontend/src/main.js
index c34b4b8..71b815a 100644
--- a/frontend/src/main.js
+++ b/frontend/src/main.js
@@ -2,10 +2,18 @@ import { createApp } from 'vue';
 import App from './App.vue';
 import router from './router/index.js';
 import { initTheme } from './utils/theme.js';
+import { isLoggedIn } from './utils/auth.js';
+import { loadDebugMode } from './utils/runtime.js';
 import '@fortawesome/fontawesome-free/css/all.min.css';
 import './styles/theme.css';
 import './styles/ui.css';
 
 initTheme();
 
+// A persisted session can fetch the runtime flags right away; a fresh visitor
+// has no token yet and picks them up after signing in.
+if (isLoggedIn()) {
+    loadDebugMode();
+}
+
 createApp(App).use(router).mount('#app');
diff --git a/frontend/src/utils/runtime.js b/frontend/src/utils/runtime.js
new file mode 100644
index 0000000..4eafc7a
--- /dev/null
+++ b/frontend/src/utils/runtime.js
@@ -0,0 +1,22 @@
+import { ref } from 'vue';
+import { settingsApi } from '../api/index.js';
+
+// Runtime flags mirrored from the backend config so any view can read them
+// without refetching the whole config.
+
+// debugMode mirrors system.debugMode from the global config (config.json).
+export const debugMode = ref(false);
+
+// loadDebugMode reads the global config and mirrors system.debugMode into the
+// `debugMode` global. The endpoint needs an admin session, so callers only
+// invoke it once logged in; a failed request keeps the current value.
+export async function loadDebugMode() {
+    try {
+        const res = await settingsApi.get('global');
+        const config = (res && res.data && res.data.config) || {};
+        const system = config.system || {};
+        debugMode.value = !!system.debugMode;
+    } catch {
+        // Non-fatal: the flag simply keeps its current value.
+    }
+}
diff --git a/frontend/src/views/Login.vue b/frontend/src/views/Login.vue
index 947df88..88a5e3d 100644
--- a/frontend/src/views/Login.vue
+++ b/frontend/src/views/Login.vue
@@ -3,6 +3,7 @@ import { reactive, ref, computed } from 'vue';
 import { useRouter, useRoute } from 'vue-router';
 import { authApi } from '../api/index.js';
 import { setSession } from '../utils/auth.js';
+import { loadDebugMode } from '../utils/runtime.js';
 import { toast } from '../utils/toast.js';
 
 const router = useRouter();
@@ -23,6 +24,8 @@ function goTo(target) {
 
 function afterLogin(token, user) {
     setSession(token, user);
+    // The settings endpoint requires the token we just stored.
+    loadDebugMode();
     const redirect = typeof route.query.redirect === 'string' ? route.query.redirect : '/overview';
     router.push(redirect);
 }