From 88349683e71018190f4ca5e7a681d87670e68fd4 Mon Sep 17 00:00:00 2001
From: heshunme <heshunme@outlook.com>
Date: Tue, 2 Jul 2024 22:28:34 +0800
Subject: [PATCH] =?UTF-8?q?=E6=B7=BB=E5=8A=A0=E4=BA=86=E9=AA=8C=E8=AF=81?=
 =?UTF-8?q?=E7=A0=81=E5=9B=BE=E7=89=87=E6=94=AF=E6=8C=81=E4=B9=9F=E9=AA=8C?=
 =?UTF-8?q?=E8=AF=81=E7=A0=81=E5=89=8D=E7=AB=AF=E6=A0=A1=E9=AA=8C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/authentication/Register.vue | 26 +++++++++++++++++---------
 1 file changed, 17 insertions(+), 9 deletions(-)

diff --git a/src/views/authentication/Register.vue b/src/views/authentication/Register.vue
index 0df9493..98f810d 100644
--- a/src/views/authentication/Register.vue
+++ b/src/views/authentication/Register.vue
@@ -9,7 +9,9 @@ const username = ref('');
 const phoneNumber = ref('');
 const password = ref('');
 const verificationCode = ref('');
+const correctCode = ref('');
 const router = useRouter();
+const verificationCodeImage = ref('');
 
 const handleRegister = async () => {
   console.log('Registering with', {
@@ -18,6 +20,10 @@ const handleRegister = async () => {
     password: password.value,
     verificationCode: verificationCode.value
   });
+  if (verificationCode.value!==correctCode.value){
+    await ElMessageBox.alert("验证码错误");
+    return
+  }
 
   try {
     const response = await axios.post('/api/register', {
@@ -38,20 +44,19 @@ const handleRegister = async () => {
   }
 };
 
-const sendVerificationCode = async () => {
+const getVerificationCode = async () => {
   try {
-    const response = await axios.post('/api/sendVerificationCode', {
-      phoneNumber: phoneNumber.value,
-    });
+    const response = await axios.get('/api/getVerificationCode');
 
     if (response.status === 200) {
-      verificationCode.value = response.data.code;
-      ElMessage.success('验证码已发送');
+      verificationCodeImage.value = '/api/'+response.data.path; // 更新验证码图片路径
+      correctCode.value = response.data.code;
+      ElMessage.success('验证码已获取');
     } else {
-      ElMessage.error('发送验证码失败，请稍后再试');
+      ElMessage.error('获取验证码失败，请稍后再试');
     }
   } catch (error) {
-    ElMessage.error('发送验证码失败，请稍后再试');
+    ElMessage.error('获取验证码失败，请稍后再试');
   }
 };
 </script>
@@ -77,10 +82,13 @@ const sendVerificationCode = async () => {
           <label for="verificationCode">验证码</label>
           <ElInput v-model="verificationCode" type="text" id="verificationCode" placeholder="请输入验证码" required>
             <template #append>
-              <ElButton type="primary" @click="sendVerificationCode" class="verification-button">获取验证码</ElButton>
+              <ElButton type="primary" @click="getVerificationCode" class="verification-button">获取验证码</ElButton>
             </template>
           </ElInput>
         </ElFormItem>
+        <ElFormItem v-if="verificationCodeImage">
+          <img :src="verificationCodeImage" alt="验证码" />
+        </ElFormItem>
         <ElFormItem>
           <ElButton type="primary" native-type="submit" class="register-button">注册</ElButton>
         </ElFormItem>