diff --git a/web/src/components/auth/RegisterForm.js b/web/src/components/auth/RegisterForm.js index 897881ad..071631c6 100644 --- a/web/src/components/auth/RegisterForm.js +++ b/web/src/components/auth/RegisterForm.js @@ -80,6 +80,8 @@ const RegisterForm = () => { const [verificationCodeLoading, setVerificationCodeLoading] = useState(false); const [otherRegisterOptionsLoading, setOtherRegisterOptionsLoading] = useState(false); const [wechatCodeSubmitLoading, setWechatCodeSubmitLoading] = useState(false); + const [disableButton, setDisableButton] = useState(false); + const [countdown, setCountdown] = useState(30); const logo = getLogo(); const systemName = getSystemName(); @@ -106,6 +108,19 @@ const RegisterForm = () => { } }, [status]); + useEffect(() => { + let countdownInterval = null; + if (disableButton && countdown > 0) { + countdownInterval = setInterval(() => { + setCountdown(countdown - 1); + }, 1000); + } else if (countdown === 0) { + setDisableButton(false); + setCountdown(30); + } + return () => clearInterval(countdownInterval); // Clean up on unmount + }, [disableButton, countdown]); + const onWeChatLoginClicked = () => { setWechatLoading(true); setShowWeChatLoginModal(true); @@ -198,6 +213,7 @@ const RegisterForm = () => { const { success, message } = res.data; if (success) { showSuccess('验证码发送成功,请检查你的邮箱!'); + setDisableButton(true); // 发送成功后禁用按钮,开始倒计时 } else { showError(message); } @@ -454,9 +470,10 @@ const RegisterForm = () => { } />