refactor(user): 🌐 Add i18n for login page, registration page, forgot …

…password, and password recovery

locales/en-US.yml

@@ -164,17 +164,20 @@ user:
         fine: ' '
         tip: Username or email is required
         msg: Length must be between 2 to 32
+      label: Username / email
     password:
       placeholder: Password
       password-status:
         fine: ' '
         tip: Password
         msg: Length must be between 6 to 64
+      label: password
     login-status:
       ready: Login
       loading: Logging in...
       failed: Check your username or password
       error: Unknown error
+      refreshing: Refreshing data...
     signup: Sign up
     forget-password: Forget Password?
   signup:
@@ -187,12 +190,15 @@ user:
         msg: Length must be between 2 to 32
         res: Username taken
         err: Unknown error
+      username-label: username
     password:
       placeholder: Password
       password-status:
         fine: ' '
         tip: Password is required
         msg: Length must be between 6 to 64
+      password-label: password
+      password-rep-label: Repeat password
     password2:
       placeholder: Repeat password
       password2-status:
@@ -207,10 +213,16 @@ user:
         msg: Not a valid email
         res: Email already in use
         err: Unknown error
+      email-label: Mail
     signup-status:
       ready: Sign up
       loading: Please wait...
       error: Unknown error
+      success: |-
+        registration success! 
+        Jump to the login interface...
+      back-login: Return to login
+      forget-password: forget the password
     login: Login
   forget-password:
     title: Reset password
@@ -220,13 +232,16 @@ user:
         fine: ' '
         tip: Please enter your e-mail address
         msg: Please enter the e-mail address with the right form
+      email-label: Please enter the email associated with your account
     send-status:
       ready: send e-mail
       loading: Sending the e-mail for resetting password...
       successful: The e-mail has successfully sent to the address, please check it
       failed: This e-mail address is not bound to an account
       error: Unknown error
     login: Return to login page
+    back-login: Return to Login
+    signup: Register an account
   reset-password:
     title: Reset your password
     password:
@@ -235,16 +250,22 @@ user:
         fine: ' '
         tip: The length of your new password should between 4 to 64 characters
         msg: Please enter your new password
+      password-label: Password
     password2:
       placeholder: Please repeat your new password
       password2-status:
         fine: ' '
         tip: Please enter your new password again
         msg: The password entered was not identical
+      password2-label: Repeat password
     reset-status:
       ready: Reset
       loading: Resetting your password...
       error: Invalid password
+      success: Reset successful! Redirecting to the login page...
+    key-status:
+      msg: Invalid key!
+    reset-fail: Unknown error!
   redirect:
     title: Redirecting...
     from:

locales/zh-Hans.yml

@@ -172,12 +172,14 @@ user:
         fine: ' '
         tip: 请输入用户名或邮箱！
         msg: 长度在 2 到 32 个字符！
+      label: 用户名/邮箱
     password:
       placeholder: 请输入密码
       password-status:
         fine: ' '
         tip: 请输入密码！
         msg: 长度在 6 到 64 个字符！
+      label: 密码
     login-status:
       ready: 登录
       loading: 登录中...
@@ -196,12 +198,15 @@ user:
         msg: 长度在 2 到 32 个字符!
         res: 该用户名已被注册！
         err: 网络错误！
+      username-label: 用户名
     password:
       placeholder: 请输入密码
       password-status:
         fine: ' '
         tip: 请输入密码!
         msg: 长度在 6 到 64 个字符!
+      password-label: 密码
+      password-rep-label: 重复密码
     password2:
       placeholder: 请重复密码
       password2-status:
@@ -216,10 +221,14 @@ user:
         msg: 请输入正确的邮箱格式！
         res: 该邮箱已被注册！
         err: 网络错误！
+      email-label: 邮箱
     signup-status:
       ready: 注册
       loading: 注册中...
       error: 未知错误
+      success: 注册成功！跳转登陆界面...
+      back-login: 返回登陆
+      forget-password: 忘记密码
     login: 登录
   forget-password:
     title: 找回密码
@@ -229,31 +238,40 @@ user:
         fine: ' '
         tip: 请输入邮箱！
         msg: 请输入正确的邮箱格式！
+      email-label: 请输入账号绑定的邮箱
     send-status:
       ready: 发送
       loading: 发送中...
       successful: 邮件发送成功，请查收！
       failed: 该邮箱未绑定账号！
       error: 未知错误
     login: 返回登录
+    back-login: 返回登陆
+    signup: 注册账号
   reset-password:
     title: 重置密码
+    key-status:
+      msg: 无效的key！
     password:
       placeholder: 请设定新密码
       password-status:
         fine: ' '
         tip: 请输入密码！
         msg: 长度在4到64个字符！
+      password-label: 密码
     password2:
       placeholder: 请重复新密码
       password2-status:
         fine: ' '
         tip: 请再次输入密码！
         msg: 两次密码输入不一致！
+      password2-label: 重复密码
     reset-status:
+      success: 重置成功！跳转登陆界面...
       ready: 重置
       loading: 重置中...
       error: 无效的key
+    reset-fail: 未知错误！
   redirect:
     title: 跳转中...
     from:

pages/user/forget-password.vue

@@ -99,7 +99,7 @@ async function forget() {
           <PFormInput
             ref="emailEl"
             v-model="email"
-            label="请输入账号绑定的邮箱"
+            :label="t('user.forget-password.email.email-label')"
             type="text"
             :validator="emailRepValidator"
             @enter="() => emailEl?.focus()"
@@ -122,11 +122,11 @@ async function forget() {
 
         <div class="flex -mt-2 justify-center gap-2 text-purple-600 text-sm">
           <NuxtLink :to="{ path: '/user/login', query: { from: 'forget-password' } }">
-            返回登陆
+            {{ t('user.forget-password.back-login') }}
           </NuxtLink>
           <span class="text-gray-400">|</span>
           <NuxtLink to="/user/signup">
-            注册账号
+            {{ t('user.forget-password.signup') }}
           </NuxtLink>
         </div>
       </form>

pages/user/login.vue

@@ -170,7 +170,7 @@ async function login() {
           <PFormInput
             ref="usernameEl"
             v-model="username"
-            label="用户名/邮箱"
+            :label="t('user.login.username.label')"
             type="text"
             :validator="usernameValidator"
             @enter="() => passwordEl?.focus()"
@@ -181,7 +181,7 @@ async function login() {
           <PFormInput
             ref="passwordEl"
             v-model="password"
-            label="密码"
+            :label="t('user.login.password.label')"
             type="password"
             :validator="passwordValidator"
             @enter="login"
@@ -204,11 +204,11 @@ async function login() {
 
         <div class="flex -mt-2 justify-center gap-2 text-purple-600 text-sm">
           <NuxtLink to="/user/forget-password">
-            忘记密码
+            {{ t('user.login.forget-password') }}
           </NuxtLink>
           <span class="text-gray-400">|</span>
           <NuxtLink to="/user/signup">
-            注册帐号
+            {{ t('user.login.signup') }}
           </NuxtLink>
         </div>
       </form>

pages/user/reset-password.vue

@@ -34,7 +34,7 @@ const loading = ref<0 | 1 | 2>(0)
 const resetError = ref<string>()
 async function reset() {
   if (!resetKey.value) {
-    resetError.value = '无效的key！'
+    resetError.value = t('user.reset-password.key-status.msg')
     return
   }
   if (!password.value) {
@@ -75,7 +75,7 @@ async function reset() {
     })
 
     if (data.status !== 'SUCCEED') {
-      resetError.value = data.dataerr?.reason || '未知错误！'
+      resetError.value = data.dataerr?.reason || t('user.reset-password.reset-fail')
       return
     }
 
@@ -120,7 +120,7 @@ async function reset() {
           <PFormInput
             ref="passwordEl"
             v-model="password"
-            label="密码"
+            :label="t('user.reset-password.password.password-label')"
             type="password"
             :validator="passwordValidator"
             @enter="reset"
@@ -131,7 +131,7 @@ async function reset() {
           <PFormInput
             ref="passwordRepEl"
             v-model="passwordRep"
-            label="重复密码"
+            :label="t('user.reset-password.password2.password2-label')"
             type="password"
             :validator="passwordRepValidator"
             @enter="reset"
@@ -145,7 +145,7 @@ async function reset() {
             :disabled="loading > 0"
           >
             {{ loading === 2
-              ? '重置成功！跳转登陆界面...'
+              ? t('user.reset-password.reset-status.success')
               : loading === 1
                 ? t('user.reset-password.reset-status.loading')
                 : t('user.reset-password.reset-status.ready')

pages/user/signup.vue

@@ -234,7 +234,7 @@ async function signup() {
           <PFormInput
             ref="emailEl"
             v-model="email"
-            label="邮箱"
+            :label="t('user.signup.email.email-label')"
             type="text"
             :validator="emailRepValidator"
             @enter="() => emailEl?.focus()"
@@ -245,7 +245,7 @@ async function signup() {
           <PFormInput
             ref="usernameEl"
             v-model="username"
-            label="用户名"
+            :label="t('user.signup.username.username-label')"
             type="text"
             :validator="usernameValidator"
             @enter="() => passwordEl?.focus()"
@@ -256,7 +256,7 @@ async function signup() {
           <PFormInput
             ref="passwordEl"
             v-model="password"
-            label="密码"
+            :label="t('user.signup.password.password-label')"
             type="password"
             :validator="passwordValidator"
             @enter="signup"
@@ -267,7 +267,7 @@ async function signup() {
           <PFormInput
             ref="passwordRepEl"
             v-model="passwordRep"
-            label="重复密码"
+            :label="t('user.signup.password.password-rep-label')"
             type="password"
             :validator="passwordRepValidator"
             @enter="signup"
@@ -281,7 +281,7 @@ async function signup() {
             :disabled="loading > 0"
           >
             {{ loading === 2
-              ? '注册成功！跳转登陆界面...'
+              ? t('user.signup.signup-status.success')
               : loading === 1
                 ? t('user.signup.signup-status.loading')
                 : t('user.signup.signup-status.ready') }}
@@ -290,11 +290,11 @@ async function signup() {
 
         <div class="flex -mt-2 justify-center gap-2 text-purple-600 text-sm">
           <NuxtLink :to="{ path: '/user/login', query: { from: 'signup' } }">
-            返回登陆
+            {{ t('user.signup.signup-status.back-login') }}
           </NuxtLink>
           <span class="text-gray-400">|</span>
           <NuxtLink to="/user/forget-password">
-            忘记密码
+            {{ t('user.signup.signup-status.forget-password') }}
           </NuxtLink>
         </div>
       </form>