🐛 fix(auth): resolve password reset confirmation display and functionality issues

- Fix input field display issues in password reset confirmation page
  * Replace `readOnly` with `disabled={true}` for proper field state
  * Improve URL parameter parsing and state management
  * Add proper null checks and fallback values

- Enhance user experience and error handling
  * Add validation for invalid reset links
  * Display appropriate error messages and placeholders
  * Add debug logging for troubleshooting
  * Improve button states and loading indicators

- Improve password reset form validation
  * Add proper email input validation with error messages
  * Enhance user feedback for empty email submissions

- Add missing English translations
  * Add i18n support for new UI text strings
  * Ensure proper internationalization coverage

The password reset confirmation page now correctly displays email addresses
from URL parameters and prevents user input as intended. Error handling
has been improved to provide better user guidance when reset links are
invalid or malformed.

Fixes: Password reset input fields showing empty and allowing user input
when they should display email/password and be read-only.

web/src/components/auth/PasswordResetConfirm.js

@@ -15,12 +15,12 @@ const PasswordResetConfirm = () => {
     token: '',
   });
   const { email, token } = inputs;
+  const isValidResetLink = email && token;
 
   const [loading, setLoading] = useState(false);
   const [disableButton, setDisableButton] = useState(false);
   const [countdown, setCountdown] = useState(30);
   const [newPassword, setNewPassword] = useState('');
-
   const [searchParams, setSearchParams] = useSearchParams();
 
   const logo = getLogo();
@@ -30,10 +30,10 @@ const PasswordResetConfirm = () => {
     let token = searchParams.get('token');
     let email = searchParams.get('email');
     setInputs({
-      token,
-      email,
+      token: token || '',
+      email: email || '',
     });
-  }, []);
+  }, [searchParams]);
 
   useEffect(() => {
     let countdownInterval = null;
@@ -49,7 +49,10 @@ const PasswordResetConfirm = () => {
   }, [disableButton, countdown]);
 
   async function handleSubmit(e) {
-    if (!email || !token) return;
+    if (!email || !token) {
+      showError(t('无效的重置链接，请重新发起密码重置请求'));
+      return;
+    }
     setDisableButton(true);
     setLoading(true);
     const res = await API.post(`/api/user/reset`, {
@@ -94,6 +97,11 @@ const PasswordResetConfirm = () => {
                 <Title heading={3} className="text-gray-800 dark:text-gray-200">{t('密码重置确认')}</Title>
               </div>
               <div className="px-2 py-8">
+                {!isValidResetLink && (
+                  <div className="mb-4 p-3 bg-red-100 border border-red-400 text-red-700 rounded">
+                    <Text>{t('无效的重置链接，请重新发起密码重置请求')}</Text>
+                  </div>
+                )}
                 <Form className="space-y-3">
                   <Form.Input
                     field="email"
@@ -101,9 +109,10 @@ const PasswordResetConfirm = () => {
                     name="email"
                     size="large"
                     className="!rounded-md"
-                    value={email}
-                    readOnly
+                    value={email || ''}
+                    disabled={true}
                     prefix={<IconMail />}
+                    placeholder={email ? '' : t('等待获取邮箱信息...')}
                   />
 
                   {newPassword && (
@@ -114,7 +123,7 @@ const PasswordResetConfirm = () => {
                       size="large"
                       className="!rounded-md"
                       value={newPassword}
-                      readOnly
+                      disabled={true}
                       prefix={<IconLock />}
                       onClick={(e) => {
                         e.target.select();
@@ -133,9 +142,9 @@ const PasswordResetConfirm = () => {
                       size="large"
                       onClick={handleSubmit}
                       loading={loading}
-                      disabled={disableButton || newPassword}
+                      disabled={disableButton || newPassword || !isValidResetLink}
                     >
-                      {newPassword ? t('密码重置完成') : t('提交')}
+                      {newPassword ? t('密码重置完成') : t('确认重置密码')}
                     </Button>
                   </div>
                 </Form>

web/src/components/auth/PasswordResetForm.js

@@ -55,7 +55,10 @@ const PasswordResetForm = () => {
   }
 
   async function handleSubmit(e) {
-    if (!email) return;
+    if (!email) {
+      showError(t('请输入邮箱地址'));
+      return;
+    }
     if (turnstileEnabled && turnstileToken === '') {
       showInfo(t('请稍后几秒重试，Turnstile 正在检查用户环境！'));
       return;

web/src/i18n/locales/en.json

@@ -269,6 +269,10 @@
   "密码重置确认": "Password Reset Confirmation",
   "邮箱地址": "Email address",
   "提交": "Submit",
+  "等待获取邮箱信息...": "Waiting to get email information...",
+  "确认重置密码": "Confirm Password Reset",
+  "无效的重置链接，请重新发起密码重置请求": "Invalid reset link, please initiate a new password reset request",
+  "请输入邮箱地址": "Please enter the email address",
   "请稍后几秒重试": "Please retry in a few seconds",
   "正在检查用户环境": "Checking user environment",
   "重置邮件发送成功": "Reset mail sent successfully",