fix: 解决登录页跳转错误的问题 (#4470)

frontend/src/lang/modules/en.ts

@@ -1396,8 +1396,10 @@ const message = {
         sslDisableHelper:
             'If the https service is disabled, you need to restart the panel for it to take effect. Do you want to continue?',
         noAuthSetting: 'Unauthorized Setting',
+        noAuthSettingHelper:
+            'When the user is not logged in and has not correctly entered the security gateway, authorized IP, or bound domain, this response can hide panel features.',
         responseSetting: 'Response Setting',
-        help200: '200 - Help Page',
+        help200: 'Help Page',
         error400: 'Bad Request',
         error401: 'Unauthorized',
         error403: 'Forbidden',

frontend/src/lang/modules/tw.ts

@@ -1343,8 +1343,9 @@ const message = {
         sslDisable: '禁用',
         sslDisableHelper: '禁用 https 服務，需要重啟面板才能生效，是否繼續？',
         noAuthSetting: '未认证设置',
+        noAuthSettingHelper: '當用戶未登錄且未正確輸入安全入口、授權 IP 或綁定域名時，此回應可以隱藏面板特徵。',
         responseSetting: '响应设置',
-        help200: '200 - 幫助頁面',
+        help200: '幫助頁面',
         error400: '錯誤請求',
         error401: '未授權',
         error403: '禁止訪問',

frontend/src/lang/modules/zh.ts

@@ -1344,8 +1344,9 @@ const message = {
         sslDisable: '禁用',
         sslDisableHelper: '禁用 https 服务，需要重启面板才能生效，是否继续？',
         noAuthSetting: '未认证设置',
+        noAuthSettingHelper: '用户在未登录且未正确输入安全入口、授权 IP、或绑定域名时，该响应可隐藏面板特征。',
         responseSetting: '响应设置',
-        help200: '200 - 帮助页面',
+        help200: '帮助页面',
         error400: '错误请求',
         error401: '未授权',
         error403: '禁止访问',

frontend/src/views/home/status/index.vue

@@ -326,6 +326,7 @@ const acceptParams = (current: Dashboard.CurrentInfo, base: Dashboard.BaseInfo,
                 data: formatNumber(currentInfo.value.diskData[i].usedPercent),
             };
         }
+        currentInfo.value.gpuData = currentInfo.value.gpuData || [];
         for (let i = 0; i < currentInfo.value.gpuData.length; i++) {
             chartsOption.value['gpu' + i] = {
                 title: 'GPU-' + currentInfo.value.gpuData[i].index,

frontend/src/views/login/entrance/index.vue

@@ -1,33 +1,41 @@
 <template>
     <div>
-        <div class="login-background" v-if="isSafety && !isErr && !isNotFound">
-            <div class="login-wrapper">
-                <div :class="screenWidth > 1110 ? 'left inline-block' : ''">
-                    <div class="login-title">
-                        <span>{{ globalStore.themeConfig.title || $t('setting.description') }}</span>
+        <div v-if="!loading">
+            <div class="login-background" v-if="errStatus === ''">
+                <div class="login-wrapper">
+                    <div :class="screenWidth > 1110 ? 'left inline-block' : ''">
+                        <div class="login-title">
+                            <span>{{ globalStore.themeConfig.title || $t('setting.description') }}</span>
+                        </div>
+                        <img src="@/assets/images/1panel-login.png" alt="" v-if="screenWidth > 1110" />
                     </div>
-                    <img src="@/assets/images/1panel-login.png" alt="" v-if="screenWidth > 1110" />
-                </div>
-                <div :class="screenWidth > 1110 ? 'right inline-block' : ''">
-                    <div class="login-container">
-                        <LoginForm ref="loginRef"></LoginForm>
+                    <div :class="screenWidth > 1110 ? 'right inline-block' : ''">
+                        <div class="login-container">
+                            <LoginForm ref="loginRef"></LoginForm>
+                        </div>
                     </div>
                 </div>
             </div>
-        </div>
 
-        <div v-if="pageCode === '200' || !pageCode">
-            <UnSafe />
-        </div>
-
-        <div v-if="pageCode !== '200' && pageCode">
-            <ErrCode :code="pageCode" />
-        </div>
-        <div v-if="isErr && mySafetyCode.code === 'err-ip' && !isNotFound">
-            <ErrIP />
-        </div>
-        <div v-if="isErr && mySafetyCode.code === 'err-domain' && !isNotFound">
-            <ErrDomain />
+            <div v-else>
+                <div v-if="!pageCode || pageCode === '200'">
+                    <div v-if="errStatus === 'err-unsafe'">
+                        <UnSafe />
+                    </div>
+                    <div v-if="errStatus === 'err-ip'">
+                        <ErrIP />
+                    </div>
+                    <div v-if="errStatus === 'err-domain'">
+                        <ErrDomain />
+                    </div>
+                    <div v-if="errStatus === 'not-found'">
+                        <ErrFound />
+                    </div>
+                </div>
+                <div v-else>
+                    <ErrCode :code="pageCode" />
+                </div>
+            </div>
         </div>
     </div>
 </template>
@@ -39,16 +47,15 @@ import UnSafe from '@/components/error-message/unsafe.vue';
 import ErrIP from '@/components/error-message/err_ip.vue';
 import ErrCode from '@/components/error-message/error_code.vue';
 import ErrDomain from '@/components/error-message/err_domain.vue';
+import ErrFound from '@/components/error-message/404.vue';
 import { ref, onMounted } from 'vue';
 import { GlobalStore } from '@/store';
 const globalStore = GlobalStore();
 
-const isSafety = ref(true);
 const screenWidth = ref(null);
-const isErr = ref();
-const isNotFound = ref();
-
-const pageCode = ref();
+const errStatus = ref();
+const pageCode = ref('');
+const loading = ref();
 
 const mySafetyCode = defineProps({
     code: {
@@ -59,32 +66,45 @@ const mySafetyCode = defineProps({
 });
 
 const getStatus = async () => {
-    isErr.value = true;
     let code = mySafetyCode.code;
-    if (code === 'err-ip' || code === 'err-domain') {
-        code = globalStore.entrance;
-    }
-    const res = await checkIsSafety(code);
-    isErr.value = false;
-    globalStore.entrance = '';
-    if (res.data === 'disable') {
-        if (code === '') {
-            isNotFound.value = false;
-        } else {
-            isNotFound.value = true;
-        }
-        return;
-    }
-    isNotFound.value = false;
-    if (res.data !== 'pass') {
-        const resCode = await getResponsePage();
-        pageCode.value = resCode.data;
-        isSafety.value = false;
-        return;
-    }
-    if (res.data === 'pass') {
-        globalStore.entrance = code;
-    }
+    loading.value = true;
+    await getResponsePage()
+        .then(async (res) => {
+            pageCode.value = res.data;
+            if (code === 'err-ip' || code === 'err-domain') {
+                errStatus.value = code;
+                loading.value = false;
+                return;
+            }
+            await checkIsSafety(code)
+                .then((safeRes) => {
+                    if (safeRes.data === 'disable') {
+                        if (code !== '') {
+                            errStatus.value = 'not-found';
+                            loading.value = false;
+                            return;
+                        }
+                    }
+                    if (safeRes.data === 'pass') {
+                        globalStore.entrance = code;
+                        errStatus.value = '';
+                        loading.value = false;
+                        return;
+                    }
+                    loading.value = false;
+                    errStatus.value = 'err-unsafe';
+                })
+                .catch(() => {
+                    pageCode.value = '200';
+                    errStatus.value = 'err-unsafe';
+                    loading.value = false;
+                });
+        })
+        .catch(() => {
+            pageCode.value = '200';
+            errStatus.value = 'err-found';
+            loading.value = false;
+        });
 };
 
 onMounted(() => {

frontend/src/views/setting/safe/index.vue

@@ -223,40 +223,9 @@ const form = reactive({
     mfaInterval: 30,
     allowIPs: '',
     bindDomain: '',
-    noAuthSetting: i18n.global.t('setting.help200'),
+    noAuthSetting: '200 - ' + i18n.global.t('setting.help200'),
 });
 
-const noAuthOptions = [
-    {
-        value: '200',
-        label: i18n.global.t('setting.help200'),
-    },
-    {
-        value: '400',
-        label: '400 - ' + i18n.global.t('setting.error400'),
-    },
-    {
-        value: '401',
-        label: '401 - ' + i18n.global.t('setting.error401'),
-    },
-    {
-        value: '403',
-        label: '403 - ' + i18n.global.t('setting.error403'),
-    },
-    {
-        value: '404',
-        label: '404 - ' + i18n.global.t('setting.error404'),
-    },
-    {
-        value: '408',
-        label: '408 - ' + i18n.global.t('setting.error408'),
-    },
-    {
-        value: '416',
-        label: '416 - ' + i18n.global.t('setting.error416'),
-    },
-];
-
 const unset = ref(i18n.global.t('setting.unSetting'));
 
 const search = async () => {
@@ -277,11 +246,10 @@ const search = async () => {
     form.mfaInterval = Number(res.data.mfaInterval);
     form.allowIPs = res.data.allowIPs.replaceAll(',', '\n');
     form.bindDomain = res.data.bindDomain;
-
-    for (const item of noAuthOptions) {
-        if (item.value === res.data.noAuthSetting) {
-            form.noAuthSetting = item.label;
-        }
+    if (res.data.noAuthSetting !== '200') {
+        form.noAuthSetting = res.data.noAuthSetting + ' - ' + i18n.global.t('setting.error' + res.data.noAuthSetting);
+    } else {
+        form.noAuthSetting = res.data.noAuthSetting + ' - ' + i18n.global.t('setting.help200');
     }
 };
 
@@ -329,7 +297,7 @@ const onChangeBind = () => {
     bindRef.value.acceptParams({ ipv6: form.ipv6, bindAddress: form.bindAddress });
 };
 const onChangeResponse = () => {
-    responseRef.value.acceptParams({ noAuthSetting: form.noAuthSetting, noAuthOptions: noAuthOptions });
+    responseRef.value.acceptParams({ noAuthSetting: form.noAuthSetting });
 };
 const onChangeBindDomain = () => {
     domainRef.value.acceptParams({ bindDomain: form.bindDomain });

frontend/src/views/setting/safe/response/index.vue

@@ -12,14 +12,15 @@
                             prop="noAuthSetting"
                             :rules="Rules.requiredSelect"
                         >
-                            <el-select v-model="form.noAuthSetting" filterable>
+                            <el-select v-model="form.noAuthSetting">
                                 <el-option
                                     v-for="item in options"
-                                    :key="item"
+                                    :key="item.value"
                                     :label="item.label"
                                     :value="item.value"
                                 />
                             </el-select>
+                            <span class="input-help">{{ $t('setting.noAuthSettingHelper') }}</span>
                         </el-form-item>
                     </el-col>
                 </el-row>
@@ -54,7 +55,36 @@ const form = reactive({
     noAuthSetting: '',
 });
 
-const options = ref([]);
+const options = [
+    {
+        value: '200',
+        label: '200 - ' + i18n.global.t('setting.help200'),
+    },
+    {
+        value: '400',
+        label: '400 - ' + i18n.global.t('setting.error400'),
+    },
+    {
+        value: '401',
+        label: '401 - ' + i18n.global.t('setting.error401'),
+    },
+    {
+        value: '403',
+        label: '403 - ' + i18n.global.t('setting.error403'),
+    },
+    {
+        value: '404',
+        label: '404 - ' + i18n.global.t('setting.error404'),
+    },
+    {
+        value: '408',
+        label: '408 - ' + i18n.global.t('setting.error408'),
+    },
+    {
+        value: '416',
+        label: '416 - ' + i18n.global.t('setting.error416'),
+    },
+];
 
 interface DialogProps {
     noAuthSetting: string;
@@ -62,7 +92,6 @@ interface DialogProps {
 }
 
 const acceptParams = (params: DialogProps): void => {
-    options.value = params.noAuthOptions;
     form.noAuthSetting = params.noAuthSetting;
     drawerVisible.value = true;
 };