jingrow/jcloud
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

注册登陆页面增加多语言支持

Browse Source
This commit is contained in:
jingrow 2025-12-29 19:05:24 +08:00
parent d05f2215b2
commit 9cf903a880
2 changed files with 116 additions and 66 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

132
dashboard/src/pages/LoginSignup.vue
View File

@ -11,7 +11,7 @@
<!-- 2FA 部分 -->
<template v-if="is2FA">
<FormControl
label="来自您的身份验证应用的2FA代码"
:label="$t('2FA code from your authenticator app')"
placeholder="123456"
v-model="twoFactorCode"
required
@ -31,7 +31,7 @@
})
"
>
验证
{{ $t('Verify') }}
</Button>
<ErrorMessage
class="mt-2"
@ -42,7 +42,7 @@
<!-- 忘记密码部分 -->
<template v-else-if="hasForgotPassword">
<FormControl
label="邮箱"
:label="$t('Email')"
type="email"
placeholder="email@example.com"
autocomplete="email"
@ -57,21 +57,21 @@
query: { ...$route.query, forgot: undefined },
}"
>
我记得我的密码
{{ $t('I remember my password') }}
</router-link>
<Button
class="mt-4"
:loading="$resources.resetPassword.loading"
variant="solid"
>
重置密码
{{ $t('Reset Password') }}
</Button>
</template>
<!-- 登录部分 -->
<template v-else-if="isLogin">
<FormControl
label="用户名或邮箱"
:label="$t('Username or Email')"
placeholder="email@example.com"
autocomplete="email"
v-model="email"
@ -83,7 +83,7 @@
<template v-if="!isOauthLogin && !useEmail">
<FormControl
class="mt-4"
label="密码"
:label="$t('Password')"
type="password"
placeholder="•••••"
v-model="password"
@ -99,7 +99,7 @@
query: { ...$route.query, forgot: 1 },
}"
>
忘记密码？
{{ $t('Forgot Password?') }}
</router-link>
</div>
<Button
@ -108,7 +108,7 @@
:loading="$session.login.loading"
type="submit"
>
登录
{{ $t('Log In') }}
</Button>
</template>
@ -118,7 +118,7 @@
<template v-if="otpSent">
<FormControl
class="mt-4"
label="验证码"
:label="$t('Verification Code')"
placeholder="123456"
v-model="otp"
required
@ -130,7 +130,7 @@
variant="solid"
@click="verifyOTPAndLogin"
>
登陆
{{ $t('Log In') }}
</Button>
<Button
class="w-full"
@ -139,10 +139,10 @@
:disabled="otpResendCountdown > 0"
@click="$resources.sendOTP.submit()"
>
重新发送验证码
{{ $t('Resend Verification Code') }}
{{
otpResendCountdown > 0
? `在 ${otpResendCountdown} 秒后`
? ` ${$t('in')} ${otpResendCountdown} ${$t('seconds')}`
: ''
}}
</Button>
@ -157,7 +157,7 @@
variant="solid"
@click="$resources.sendOTP.submit()"
>
发送验证码
{{ $t('Send Verification Code') }}
</Button>
</template>
</template>
@ -165,7 +165,7 @@
<!-- OAuth 验证 -->
<template v-else>
<Button class="mt-4" variant="solid">
使用 {{ oauthProviderName }} 登录
{{ $t('Log in with') }} {{ oauthProviderName }}
</Button>
</template>
@ -184,15 +184,15 @@
<!-- 注册部分 -->
<template v-else>
<FormControl
label="用户名"
:label="$t('Username')"
type="text"
placeholder="设置用户名"
:placeholder="$t('Set username')"
v-model="username"
autocomplete="username"
required
/>
<FormControl
label="邮箱 (可选)"
:label="$t('Email (optional)')"
type="email"
placeholder="email@example.com"
autocomplete="email"
@ -200,9 +200,9 @@
v-model="email"
/>
<FormControl
label="手机号"
:label="$t('Phone Number')"
type="tel"
placeholder="请输入您的手机号码"
:placeholder="$t('Please enter your phone number')"
class="mt-4"
v-model="phoneNumber"
autocomplete="tel"
@ -210,23 +210,23 @@
@blur="validatePhoneNumber"
/>
<div v-if="phoneNumberFormatError" class="mt-2 text-sm text-red-600">
请输入正确的手机号码格式
{{ $t('Please enter a valid phone number format') }}
</div>
<FormControl
label="密码"
:label="$t('Password')"
type="password"
placeholder="设置登录密码"
:placeholder="$t('Set login password')"
class="mt-4"
v-model="signupPassword"
autocomplete="new-password"
required
/>
<div class="mt-1 text-sm text-gray-600">
密码必须至少8个字符，并包含大小写字母和数字
{{ $t('Password must be at least 8 characters and contain uppercase and lowercase letters and numbers') }}
</div>
<div class="mt-2" v-if="signupPassword">
<div class="flex items-center">
<div class="text-sm w-20">密码强度:</div>
<div class="text-sm w-20">{{ $t('Password Strength') }}:</div>
<div class="flex-1 bg-gray-200 rounded-full h-2">
<div
class="h-2 rounded-full transition-all"
@ -237,16 +237,16 @@
</div>
</div>
<FormControl
label="确认密码"
:label="$t('Confirm Password')"
type="password"
placeholder="再次输入密码"
:placeholder="$t('Enter password again')"
class="mt-4"
v-model="confirmPassword"
autocomplete="new-password"
required
/>
<div v-if="passwordMismatch" class="mt-2 text-sm text-red-600">
两次输入的密码不一致
{{ $t('Passwords do not match') }}
</div>
<Button
class="mt-4"
@ -255,7 +255,7 @@
type="submit"
:disabled="(passwordMismatch && confirmPassword) || phoneNumberFormatError"
>
注册
{{ $t('Sign Up') }}
</Button>
</template>
@ -270,7 +270,7 @@
<span
class="relative bg-white px-2 text-sm font-medium leading-8 text-gray-800"
>
或
{{ $t('Or') }}
</span>
</div>
</div>
@ -281,14 +281,14 @@
@click="switchToEmailLogin"
icon-left="mail"
>
使用邮箱验证码登陆
{{ $t('Log in with email verification code') }}
</Button>
<Button
v-else-if="isLogin && useEmail"
@click="switchToPasswordLogin"
icon-left="key"
>
使用密码登陆
{{ $t('Log in with password') }}
</Button>
</div>
<div
@ -304,8 +304,8 @@
>
{{
$route.name == 'Login'
? '没有账户？创建一个账户。'
: '已有账户？登录。'
? $t('Don\'t have an account? Create one.')
: $t('Already have an account? Log in.')
}}
</router-link>
</div>
@ -314,7 +314,7 @@
<div v-else-if="otpRequested">
<form class="flex flex-col">
<FormControl
label="邮箱"
:label="$t('Email')"
type="email"
placeholder="email@example.com"
autocomplete="email"
@ -322,7 +322,7 @@
required
/>
<FormControl
label="验证码"
:label="$t('Verification Code')"
type="text"
class="mt-4"
placeholder="123456"
@ -340,7 +340,7 @@
:loading="$resources.verifyOTP.loading"
@click="$resources.verifyOTP.submit()"
>
验证
{{ $t('Verify') }}
</Button>
<Button
class="mt-2"
@ -349,10 +349,10 @@
@click="$resources.resendOTP.submit()"
:disabled="otpResendCountdown > 0"
>
重新发送验证码
{{ $t('Resend Verification Code') }}
{{
otpResendCountdown > 0
? `在 ${otpResendCountdown} 秒后`
? ` ${$t('in')} ${otpResendCountdown} ${$t('seconds')}`
: ''
}}
</Button>
@ -367,8 +367,8 @@
>
{{
$route.name == 'Login'
? '新用户？创建一个新账户。'
: '已有账户？登录。'
? $t('New user? Create a new account.')
: $t('Already have an account? Log in.')
}}
</router-link>
</div>
@ -378,9 +378,9 @@
v-else-if="resetPasswordEmailSent"
>
<p>
我们已向
{{ $t('We have sent an email to') }}
<span class="font-semibold">{{ email }}</span
>发送了一封邮件。请点击收到的链接重置您的密码。
>{{ $t('. Please click on the link received to reset your password.') }}
</p>
</div>
</template>
@ -401,7 +401,7 @@
<div
class="mt-2 flex w-full items-center justify-center text-sm text-gray-600"
>
由 今果 Jingrow 提供支持
{{ $t('Powered by Jingrow') }}
</div>
</template>
</LoginBox>
@ -463,7 +463,7 @@ export default {
this.account_request = account_request;
this.otpRequested = true;
this.otpResendCountdown = 30;
toast.success('验证码已发送至您的邮箱');
toast.success(this.$t('Verification code has been sent to your email'));
},
onError: (error) => {
if (error?.exc_type !== 'ValidationError') {
@ -514,11 +514,11 @@ export default {
onSuccess() {
this.otp = '';
this.otpResendCountdown = 30;
toast.success('验证码已发送至您的邮箱');
toast.success(this.$t('Verification code has been sent to your email'));
},
onError(err) {
toast.error(
getToastErrorMessage(err, '验证码重发失败'),
getToastErrorMessage(err, this.$t('Failed to resend verification code')),
);
},
};
@ -532,11 +532,11 @@ export default {
onSuccess() {
this.otpSent = true;
this.otpResendCountdown = 30;
toast.success('验证码已发送至您的邮箱');
toast.success(this.$t('Verification code has been sent to your email'));
},
onError(err) {
toast.error(
getToastErrorMessage(err, '验证码发送失败'),
getToastErrorMessage(err, this.$t('Failed to send verification code')),
);
},
};
@ -615,7 +615,7 @@ export default {
},
onSuccess(res) {
if (res && res.success === false) {
toast.error(res.message || '注册失败，请检查您的信息');
toast.error(res.message || this.$t('Sign up failed, please check your information'));
return;
}
@ -630,7 +630,7 @@ export default {
onError(err) {
const errorMessage = err?.messages?.length
? err.messages.join('\n')
: (err?.message || '注册失败，请检查您的信息');
: (err?.message || this.$t('Sign up failed, please check your information'));
toast.error(errorMessage);
},
};
@ -661,27 +661,27 @@ export default {
this.checkTwoFactorAndResetPassword();
} else {
if (!this.username) {
toast.error('用户名不能为空');
toast.error(this.$t('Username cannot be empty'));
return;
}
if (!this.phoneNumber) {
toast.error('手机号不能为空');
toast.error(this.$t('Phone number cannot be empty'));
return;
}
if (!this.isPhoneNumberValid) {
toast.error('请输入正确的手机号码格式');
toast.error(this.$t('Please enter a valid phone number format'));
return;
}
if (!this.signupPassword) {
toast.error('密码不能为空');
toast.error(this.$t('Password cannot be empty'));
return;
}
if (this.signupPassword !== this.confirmPassword) {
toast.error('两次输入的密码不一致');
toast.error(this.$t('Passwords do not match'));
return;
}
if (!this.isPasswordValid) {
toast.error('密码必须至少8个字符，并包含大小写字母和数字');
toast.error(this.$t('Password must be at least 8 characters and contain uppercase and lowercase letters and numbers'));
return;
}
this.$resources.signupWithUsername.submit();
@ -879,17 +879,17 @@ export default {
},
title() {
if (this.hasForgotPassword) {
return '重置密码';
return this.$t('Reset Password');
} else if (this.isLogin) {
if (this.saasProduct) {
return `登录您的账户以开始使用 ${this.saasProduct.title}`;
return this.$t('Log in to your account to start using {product}', { product: this.saasProduct.title });
}
return '登录您的账户';
return this.$t('Log in to your account');
} else {
if (this.saasProduct) {
return `注册以创建您的 ${this.saasProduct.title} 站点`;
return this.$t('Sign up to create your {product} site', { product: this.saasProduct.title });
}
return '创建新账户';
return this.$t('Create New Account');
}
},
useEmail() {
@ -925,10 +925,10 @@ export default {
return 'bg-green-500';
},
passwordStrengthText() {
if (this.passwordStrength < 40) return '弱';
if (this.passwordStrength < 60) return '一般';
if (this.passwordStrength < 80) return '强';
return '非常强';
if (this.passwordStrength < 40) return this.$t('Weak');
if (this.passwordStrength < 60) return this.$t('Fair');
if (this.passwordStrength < 80) return this.$t('Strong');
return this.$t('Very Strong');
},
passwordStrengthTextClass() {
if (this.passwordStrength < 40) return 'text-red-500';

50
jcloud/translations/zh.csv
View File

@ -1084,3 +1084,53 @@ Currently Active,当前激活,
Switch,切换,
Select Team,选择团队,
This feature is only available for system users,此功能仅对系统用户可用,
2FA code from your authenticator app,来自您的身份验证应用的2FA代码,
Verify,验证,
I remember my password,我记得我的密码,
Username or Email,用户名或邮箱,
Forgot Password?,忘记密码？,
Log In,登录,
Verification Code,验证码,
Resend Verification Code,重新发送验证码,
in,在,
seconds,秒后,
Send Verification Code,发送验证码,
Log in with,使用,
Username,用户名,
Set username,设置用户名,
Email (optional),邮箱 (可选),
Phone Number,手机号,
Please enter your phone number,请输入您的手机号码,
Please enter a valid phone number format,请输入正确的手机号码格式,
Set login password,设置登录密码,
Password must be at least 8 characters and contain uppercase and lowercase letters and numbers,密码必须至少8个字符，并包含大小写字母和数字,
Password Strength,密码强度,
Confirm Password,确认密码,
Enter password again,再次输入密码,
Passwords do not match,两次输入的密码不一致,
Sign Up,注册,
Or,或,
Log in with email verification code,使用邮箱验证码登陆,
Log in with password,使用密码登陆,
Don't have an account? Create one.,没有账户？创建一个账户。,
Already have an account? Log in.,已有账户？登录。,
New user? Create a new account.,新用户？创建一个新账户。,
We have sent an email to,我们已向,
. Please click on the link received to reset your password.,发送了一封邮件。请点击收到的链接重置您的密码。,
Powered by Jingrow,由 今果 Jingrow 提供支持,
Verification code has been sent to your email,验证码已发送至您的邮箱,
Failed to resend verification code,验证码重发失败,
Failed to send verification code,验证码发送失败,
Sign up failed, please check your information,注册失败，请检查您的信息,
Username cannot be empty,用户名不能为空,
Phone number cannot be empty,手机号不能为空,
Password cannot be empty,密码不能为空,
Reset Password,重置密码,
Log in to your account,登录您的账户,
Log in to your account to start using {product},登录您的账户以开始使用 {product},
Sign up to create your {product} site,注册以创建您的 {product} 站点,
Create New Account,创建新账户,
Weak,弱,
Fair,一般,
Strong,强,
Very Strong,非常强,

Can't render this file because it has a wrong number of fields in line 390.