新增登录验证页面

src/pages/EmailVerify.vue

@@ -0,0 +1,61 @@
+<template>
+  <div class="container">
+    <h1>邮箱验证</h1>
+    <p>{{ textDisplay }}</p>
+    <el-button v-if="textDisplay !== '正在验证您的邮箱，请稍候...'" type="primary" @click="router.push('/login')">返回登录</el-button>
+  </div>
+</template>
+
+<script setup>
+import { ref, onMounted } from 'vue';
+import { useRoute, useRouter } from 'vue-router';
+import api from "../utils/axios.js";
+import swal from "../utils/sweetalert.js";
+
+// 初始化路由和参数
+const route = useRoute();
+const router = useRouter();
+
+const textDisplay = ref('正在验证您的邮箱，请稍候...');
+
+// 获取 URL 参数中的 key
+const key = route.query.key;
+
+// 组件挂载时执行验证
+onMounted(async () => {
+  if (!key) {
+    router.push('/');
+    return;
+  }
+
+  try {
+
+    const response = await api.get(`/signup?key=${key}`);
+    const { code, message } = response;
+
+    // 根据返回的 code 判断是否成功
+    if (code === 0) {
+      textDisplay.value = '验证成功! ';
+      swal.tip('success', '创建账户成功，即将跳转登录页面');
+      // 延迟跳转到登录页面
+      setTimeout(() => {
+        router.push('/login');
+      }, 2000);
+    } else {
+      textDisplay.value = '验证失败，请重试';
+      if (message === 'expired') {
+        textDisplay.value = '邮箱验证已过期，请重新注册';
+      }
+      swal.window('error', '验证失败', textDisplay.value, '确定');
+    }
+  } catch (error) {
+    console.error('验证请求失败:', error);
+    textDisplay.value = '服务器错误，请稍后再试';
+    swal.tip('error', '服务器错误，请稍后再试');
+  }
+});
+</script>
+
+<style scoped>
+
+</style>

src/pages/Login.vue

@@ -134,7 +134,7 @@ const handleRegister = async () => {
     return;
   }
   store.commit('stopLoading');
-  swal.window('info', '邮箱验证链接发送成功!', '请前往邮箱查看', '好的', 'ok');
+  swal.window('info', '邮箱验证链接发送成功!', '请前往邮箱查看', '好的');
 }
 
 onMounted(() => {

src/router/index.js

@@ -36,9 +36,11 @@ import SubmitBlog_page from "../pages/blogPages/submitBlogPages/SubmitBlog_page.
 import swal from "../utils/sweetalert.js";
 import GunGame_page from "../pages/demoPages/gunGame/gunGame_page.vue";
 import api from "../utils/axios.js";
+import EmailVerify from "../pages/EmailVerify.vue";
 
 const routes = [
-    {path: '/404',
+    {
+        path: '/404',
         name: '404',
         component: NotFound,
         meta: {title: '404'}
@@ -52,6 +54,11 @@ const routes = [
         name: 'Login',
         component: Login,
         meta: {title: '登录'}
+    }, {
+        path: '/verify',
+        name: 'EmailVerify',
+        component: EmailVerify,
+        meta: {title: '注册成功'}
     }, {
         path: '/blog',
         name: 'Blog',

src/utils/sweetalert.js

@@ -19,9 +19,8 @@ const swalInstantiations = {
         title: '确认?',
         text: '您确定吗?',
         icon: 'warning',
-        showCancelButton: true,
-        confirmButtonText: '删除',
-        cancelButtonText: '取消',
+        showCancelButton: false,
+        showConfirmButton: false,
         didOpen: (toast) => {
             Swal.getPopup().style.marginTop = '0';
             toast.addEventListener('mouseenter', Swal.stopTimer);
@@ -34,7 +33,23 @@ const swal = {
         swalInstantiations.tip.fire({icon: icon, title: title, text: text})
     },
     window: (icon, title, text, confirm, cancel) => {
-        return swalInstantiations.window.fire({icon: icon, title: title, text: text, confirmButtonText: confirm, cancelButtonText: cancel})
+        const obj = {
+            icon: icon,
+            title: title,
+            text: text
+        };
+        if (confirm?.length > 0) {
+            obj.confirmButtonText = confirm;
+            obj.showConfirmButton = true;
+        }
+        if (cancel?.length > 0) {
+            obj.cancelButtonText = cancel;
+            obj.showCancelButton = true;
+        }
+        if (!cancel?.length > 0 && !confirm?.length > 0 && !text) {
+            obj.text = '　';
+        }
+        return swalInstantiations.window.fire(obj)
     }
 }