feat: logo click 5 time to admin page && fix: 401 cannot show auth modal (#335)

CHANGELOG.md

@@ -1,6 +1,11 @@
 <!-- markdownlint-disable-file MD004 MD024 MD034 MD036 -->
 # CHANGE LOG
 
+## main branch
+
+- 点击 logo 5 次进入 admin 页面
+- 修复 401 时无法跳转登录页面(admin 和 网站认证)
+
 ## v0.5.3
 
 - 修复 smtp imap proxy sever 的一些 bug

frontend/package.json

@@ -1,6 +1,6 @@
 {
   "name": "cloudflare_temp_email",
-  "version": "0.5.3",
+  "version": "0.5.4",
   "private": true,
   "type": "module",
   "scripts": {

frontend/src/api/index.js

@@ -10,7 +10,8 @@ const {
 
 const instance = axios.create({
     baseURL: API_BASE,
-    timeout: 30000
+    timeout: 30000,
+    validateStatus: (status) => status >= 200 && status <= 500
 });
 
 const apiFetch = async (path, options = {}) => {
@@ -27,14 +28,14 @@ const apiFetch = async (path, options = {}) => {
                 'Content-Type': 'application/json',
             },
         });
-        if (response.status === 401 && openSettings.value.auth) {
-            showAuth.value = true;
-            throw new Error("Unauthorized, you access password is wrong")
-        }
         if (response.status === 401 && path.startsWith("/admin")) {
             showAdminAuth.value = true;
             throw new Error("Unauthorized, your admin password is wrong")
         }
+        if (response.status === 401 && openSettings.value.auth) {
+            showAuth.value = true;
+            throw new Error("Unauthorized, you access password is wrong")
+        }
         if (response.status >= 300) {
             throw new Error(`${response.status} ${response.data}` || "error");
         }

frontend/src/views/Header.vue

@@ -203,6 +203,24 @@ useHead({
     ]
 });
 
+const logoClickCount = ref(0);
+const logoClick = async () => {
+    if (route.path.includes("admin")) {
+        logoClickCount.value = 0;
+        return;
+    }
+    if (logoClickCount.value >= 5) {
+        logoClickCount.value = 0;
+        message.info("Change to admin Page");
+        await router.push(getRouterPathWithLang('/admin', locale.value));
+    } else {
+        logoClickCount.value++;
+    }
+    if (logoClickCount.value > 0) {
+        message.info(`Click ${5 - logoClickCount.value + 1} times to enter the admin page`);
+    }
+}
+
 onMounted(async () => {
     await api.getOpenSettings(message);
 });
@@ -215,7 +233,9 @@ onMounted(async () => {
                 <h3>{{ openSettings.title || t('title') }}</h3>
             </template>
             <template #avatar>
-                <n-avatar style="margin-left: 10px;" src="/logo.png" />
+                <div @click="logoClick">
+                    <n-avatar style="margin-left: 10px;" src="/logo.png" />
+                </div>
             </template>
             <template #extra>
                 <n-space>

worker/src/constants.ts

@@ -1,5 +1,5 @@
 export const CONSTANTS = {
-    VERSION: 'v0.5.3',
+    VERSION: 'v0.5.4',
 
     // DB settings
     ADDRESS_BLOCK_LIST_KEY: 'address_block_list',