优化代码

src/views/emailRegistration.vue

@@ -38,9 +38,13 @@
       <div class="Hint">
           已向您的{{Email}}邮箱发送了一封验证邮件，请点击邮件中的链接完成注册。
       </div>
-      <div class="ResendEmail" @click="ResendEmail">
-        重发邮件
-      </div>
+      <div 
+          class="ResendEmail" 
+          @click="ResendEmail"
+          :style="isCounting ? 'background-image: linear-gradient(0deg, #cccccc, #dddddd); cursor: not-allowed;' : ''"
+        >
+          {{ isCounting ? `${countdown}秒后重发` : '重发邮件' }}
+        </div>
     </div>
   </div>
 </template>
@@ -67,6 +71,23 @@ const ConfirmPassword = ref("");// 确认密码
 const token = tokenStore()
 const user = UserStore()
 const userNamebtn = ref(false)
+const countdown = ref(0); // 倒计时秒数
+const isCounting = ref(false); // 是否正在倒计时
+let timer = null; // 定时器
+
+function startCountdown() {
+  countdown.value = 60;
+  isCounting.value = true;
+  timer = setInterval(() => {
+    countdown.value--;
+    if (countdown.value <= 0) {
+      clearInterval(timer);
+      isCounting.value = false;
+    }
+  }, 1000);
+}
+
+
 // 用户名失去焦点
 function userNameBlur() {
   if (userName.value.length < 6 || userName.value.length > 16 || userName.value == '' || userName.value == null) {
@@ -121,6 +142,7 @@ function nextStep() {
     check(res.id);
     token.setToken(res.token);
     setStorage('token', res.token)
+    startCountdown();
   }).catch(err => {});
 }
 
@@ -146,6 +168,7 @@ function pollstop() {
 function ResendEmail() {
   resendEmail({mailAddress: Email.value,type:1}).then(res => {
     ElMessage.success('邮件已重新发送');
+    startCountdown();
   }).catch(err => {});
 }
 //返回登录页