feat: 新增token过期 跳出提示框 并跳转登录页的逻辑

src/views/error/403.vue

@@ -1,12 +1,17 @@
 <script setup lang="ts">
-import { useRouter } from "vue-router";
+// import { useRouter } from "vue-router";
 import noAccess from "@/assets/status/403.svg?component";
+import * as CommonAPI from "@/api/common";
 
 defineOptions({
   name: "403"
 });
 
-const router = useRouter();
+async function getConfig() {
+  await CommonAPI.getLoginUserInfo().then(res => {
+    console.log(res);
+  });
+}
 </script>
 
 <template>
@@ -49,7 +54,7 @@ const router = useRouter();
       </p>
       <el-button
         type="primary"
-        @click="router.push('/')"
+        @click="getConfig"
         v-motion
         :initial="{
           opacity: 0,

src/views/login/index.vue

@@ -81,18 +81,22 @@ const onLogin = async (formEl: FormInstance | undefined) => {
         password: rsaEncrypt(ruleForm.password),
         captchaCode: ruleForm.captchaCode,
         captchaCodeKey: ruleForm.captchaCodeKey
-      }).then(({ data }) => {
-        // 登录成功后 将token存储到sessionStorage中
-        setTokenFromBackend(data);
-        // 获取后端路由
-        initRouter().then(() => {
-          router.push(getTopMenu(true).path);
-          message("登录成功", { type: "success" });
+      })
+        .then(({ data }) => {
+          // 登录成功后 将token存储到sessionStorage中
+          setTokenFromBackend(data);
+          // 获取后端路由
+          initRouter().then(() => {
+            router.push(getTopMenu(true).path);
+            message("登录成功", { type: "success" });
+          });
+          if (isRememberMe.value) {
+            savePassword(ruleForm.password);
+          }
+        })
+        .catch(() => {
+          loading.value = false;
         });
-        if (isRememberMe.value) {
-          savePassword(ruleForm.password);
-        }
-      });
     } else {
       loading.value = false;
       return fields;
@@ -221,13 +225,19 @@ onBeforeUnmount(() => {
                   :prefix-icon="useRenderIcon('ri:shield-keyhole-line')"
                 >
                   <template v-slot:append>
-                    <img
-                      width="120"
-                      height="40"
-                      class="cursor-pointer"
+                    <el-image
+                      style="
+                        justify-content: center;
+                        width: 120px;
+                        height: 40px;
+                      "
                       :src="captchaCodeBase64"
                       @click="getCaptchaCode"
-                    />
+                    >
+                      <template #error>
+                        <span>Loading</span>
+                      </template>
+                    </el-image>
                   </template>
                 </el-input>
               </el-form-item>