Merge pull request #157 from CheaterScript/main

feat: sinicize signup and signin pages.
2023-04-17 09:47:45 +08:00
parent 09f470111e 534ecb132c
commit 9fe7943152
12 changed files with 111 additions and 32 deletions
--- a/docker-compose.yml
+++ b/docker-compose.yml
@@ -5,6 +5,7 @@ services:
    image: wongsaang/chatgpt-ui-client:latest
    environment:
      - SERVER_DOMAIN=http://backend-web-server
+      - DEFAULT_LOCALE=en
 #      - NUXT_PUBLIC_APP_NAME='ChatGPT UI' # The name of the application
 #      - NUXT_PUBLIC_TYPEWRITER=true # Whether to enable the typewriter effect, default false
 #      - NUXT_PUBLIC_TYPEWRITER_DELAY=50 # The delay time of the typewriter effect, default 50ms
--- a/docs/guide/configuration.md
+++ b/docs/guide/configuration.md
@@ -66,6 +66,7 @@ backend-wsgi-server:
 | Parameter             | Description                                 | Default Value              |
 |-----------------------|---------------------------------------------|----------------------------|
 | SERVER_DOMAIN         | Server Address                              | http://backend-web-server |
+| DEFAULT_LOCALE         | Default Language                           | en                        |
 | NUXT_PUBLIC_APP_NAME  | Application Name                            | ChatGPT UI                 |
 | NUXT_PUBLIC_TYPEWRITER| Enable Typewriter Effect [true/false]       | true                       |
 | NUXT_PUBLIC_TYPEWRITER_DELAY | Typewriter Effect Delay in milliseconds | 50                         |
--- a/docs/guide/quick-start.md
+++ b/docs/guide/quick-start.md
@@ -35,6 +35,7 @@ services:
    image: wongsaang/chatgpt-ui-client:latest
    environment:
      - SERVER_DOMAIN=http://backend-web-server
+      - DEFAULT_LOCALE=en
 #      - NUXT_PUBLIC_APP_NAME='ChatGPT UI' # The name of the application
 #      - NUXT_PUBLIC_TYPEWRITER=true # Whether to enable the typewriter effect, default false
 #      - NUXT_PUBLIC_TYPEWRITER_DELAY=50 # The delay time of the typewriter effect, default 50ms
--- a/docs/zh/guide/configuration.md
+++ b/docs/zh/guide/configuration.md
@@ -66,6 +66,7 @@ backend-wsgi-server:
 | 参数                  | 说明                                      | 默认值                    |
 |----------------------|-------------------------------------------|---------------------------|
 | SERVER_DOMAIN                     | 服务端地址                    | http://backend-web-server |
+| DEFAULT_LOCALE                    | 默认语言                      | en                        |
 | NUXT_PUBLIC_APP_NAME              | 应用名称                      |  ChatGPT UI               |
 | NUXT_PUBLIC_TYPEWRITER            | 是否开启 打字机 效果[true/false]|  true                    |
 | NUXT_PUBLIC_TYPEWRITER_DELAY      | 打字机效果的延迟时间，单位：毫秒|  50                       |
--- a/docs/zh/guide/quick-start.md
+++ b/docs/zh/guide/quick-start.md
@@ -37,6 +37,7 @@ services:
    image: wongsaang/chatgpt-ui-client:latest
    environment:
      - SERVER_DOMAIN=http://backend-web-server
+      - DEFAULT_LOCALE=zh
    #      - NUXT_PUBLIC_APP_NAME='ChatGPT UI' # APP 名称
    #      - NUXT_PUBLIC_TYPEWRITER=true # 是否开启 打字机 效果
    #      - NUXT_PUBLIC_TYPEWRITER_DELAY=50 # 打字机效果的延迟时间，单位：毫秒，默认：50
--- a/lang/en-US.json
+++ b/lang/en-US.json
@@ -1,4 +1,21 @@
 {
+  "signIn":"Sign In",
+  "signUp":"Sign Up",
+  "username":"User Name",
+  "password":"Password",
+  "Username is required":"Username is required",
+  "Password is required":"Password is required",
+  "Create your account":"Create your account",
+  "createAccount":"Create Account",
+  "email":"E-mail",
+  "Sign in instead":"Sign in instead",
+  "Please enter your username":"Please enter your username",
+  "Username must be at least 4 characters":"Username must be at least 4 characters",
+  "Please enter your e-mail address":"Please enter your e-mail address",
+  "E-mail address must be valid":"E-mail address must be valid",
+  "Please enter your password":"Please enter your password",
+  "Password must be at least 8 characters":"Password must be at least 8 characters",
+  "Please confirm your password":"Please confirm your password",
  "welcomeTo": "Welcome to",
  "language": "Language",
  "setApiKey": "Set API Key",
--- a/lang/ru-RU.json
+++ b/lang/ru-RU.json
@@ -1,4 +1,21 @@
 {
+  "signIn":"Sign In",
+  "signUp":"Sign Up",
+  "username":"User Name",
+  "password":"Password",
+  "Username is required":"Username is required",
+  "Password is required":"Password is required",
+  "Create your account":"Create your account",
+  "createAccount":"Create Account",
+  "email":"E-mail",
+  "Sign in instead":"Sign in instead",
+  "Please enter your username":"Please enter your username",
+  "Username must be at least 4 characters":"Username must be at least 4 characters",
+  "Please enter your e-mail address":"Please enter your e-mail address",
+  "E-mail address must be valid":"E-mail address must be valid",
+  "Please enter your password":"Please enter your password",
+  "Password must be at least 8 characters":"Password must be at least 8 characters",
+  "Please confirm your password":"Please confirm your password",
  "welcomeTo": "Добро пожаловать в",
  "language": "Язык",
  "setApiKey": "Установить ключ API",
--- a/lang/zh-CN.json
+++ b/lang/zh-CN.json
@@ -1,4 +1,29 @@
 {
+  "invitation code":"邀请码",
+  "Please enter your code":"请填写邀请码",
+  "signIn":"登录",
+  "signUp":"注册",
+  "username":"用户名",
+  "password":"密码",
+  "Username is required":"请填写用户名",
+  "Password is required":"请填写密码",
+  "Create your account":"创建你的账号",
+  "createAccount":"创建账号",
+  "email":"邮箱",
+  "Sign in instead":"返回登录",
+  "Please enter your username":"请输入你的用户名",
+  "Username must be at least 4 characters":"用户名至少四个字符",
+  "Please enter your e-mail address":"请输入你的电子邮箱",
+  "E-mail address must be valid":"电子邮箱地址格式不正确",
+  "Please enter your password":"请输入你的密码",
+  "Password must be at least 8 characters":"密码至少八个字符",
+  "Please confirm your password":"请输入确认密码",
+  "Something went wrong. Please try again.":"网络错误请稍后重试",
+  "This password is too common.":"密码过于简单",
+  "This password is entirely numeric.":"密码不能全是数字",
+  "Your registration is successful":"恭喜你，注册成功！",
+  "You can now":"现在你可以",
+  "to your account.":"你的账号了。",
  "welcomeTo": "欢迎来到",
  "language": "语言",
  "setApiKey": "设置API密钥",
--- a/nuxt.config.ts
+++ b/nuxt.config.ts
@@ -63,7 +63,7 @@ export default defineNuxtConfig({
        ],
        lazy: true,
        langDir: 'lang',
-        defaultLocale: 'en',
+        defaultLocale: process.env.DEFAULT_LOCALE || 'en',
        vueI18n: {
            fallbackLocale: 'en',
        },
--- a/pages/account/onboarding.vue
+++ b/pages/account/onboarding.vue
@@ -47,9 +47,9 @@ onNuxtReady(() => {
          >
            <div class="text-center">
              <div v-if="route.query.email_verification_required && route.query.email_verification_required === 'none'">
-                <h2 class="text-h4">Your registration is successful</h2>
+                <h2 class="text-h4">{{$('Your registration is successful')}}</h2>
                <p class="mt-5">
-                  You can now <NuxtLink to="/account/signin">login</NuxtLink> to your account.
+                  {{$('You can now')}} <NuxtLink to="/account/signin">{{$('signIn')}}</NuxtLink> {{$t('to your account.')}}
                </p>
              </div>
              <div v-else>
--- a/pages/account/signin.vue
+++ b/pages/account/signin.vue
@@ -3,6 +3,7 @@
      style="height: 100vh"
  >
    <v-container>
+      <SettingsLanguages/>
      <v-row>
        <v-col
            sm="9"
@@ -14,20 +15,20 @@
              class="mt-15"
              elevation="0"
          >
-            <div class="text-center text-h4">Sign in</div>
+            <div class="text-center text-h4">{{$t('signIn')}}</div>
            <v-card-text>
              <v-form ref="signInForm">
                <v-text-field
                    v-model="formData.username"
                    :rules="formRules.username"
-                    label="User name"
+                    :label="$t('username')"
                    variant="underlined"
                    clearable
                ></v-text-field>
                <v-text-field
                    v-model="formData.password"
                    :rules="formRules.password"
-                    label="Password"
+                    :label="$t('password')"
                    variant="underlined"
                    @keyup.enter="submit"
                    clearable
@@ -35,7 +36,6 @@
                    :append-inner-icon="passwordInputType === 'password' ? 'visibility' : 'visibility_off'"
                    @click:append-inner="passwordInputType = passwordInputType === 'password' ? 'text' : 'password'"
                ></v-text-field>
-
              </v-form>

              <div v-if="errorMsg" class="text-red">{{ errorMsg }}</div>
@@ -47,14 +47,14 @@
                    @click="navigateTo('/account/signup')"
                    variant="text"
                    color="primary"
-                >Create account</v-btn>
+                >{{$t('createAccount')}}</v-btn>

                <v-btn
                    color="primary"
                    :loading="submitting"
                    @click="submit"
                    size="large"
-                >Submit</v-btn>
+                >{{$t('signIn')}}</v-btn>
              </div>

            </v-card-text>
@@ -68,7 +68,7 @@

 <script setup>
 import {useUser} from "~/composables/states";
-
+const { $i18n } = useNuxtApp()
 definePageMeta({
  layout: 'vuetify-app'
 })
@@ -78,10 +78,10 @@ const formData = ref({
 })
 const formRules = ref({
  username: [
-      v => !!v || 'Username is required'
+      v => !!v || $i18n.t('Username is required')
  ],
  password: [
-      v => !!v || 'Password is required'
+      v => !!v || $i18n.t('Password is required')
  ]
 })
 const errorMsg = ref(null)
--- a/pages/account/signup.vue
+++ b/pages/account/signup.vue
@@ -1,4 +1,5 @@
 <script setup>
+const { $i18n } = useNuxtApp()
 definePageMeta({
  layout: 'vuetify-app'
 })
@@ -8,6 +9,7 @@ const formData = ref({
  email: '',
  password1: '',
  password2: '',
+  code:'',
 })

 const fieldErrors = ref({
@@ -15,26 +17,30 @@ const fieldErrors = ref({
  email: '',
  password1: '',
  password2: '',
+  code:'',
 })

 const formRules = ref({
  username: [
-    v => !!v || 'Please enter your username',
-    v => v.length >= 4 || 'Username must be at least 4 characters'
+    v => !!v || $i18n.t('Please enter your username'),
+    v => v.length >= 4 || $i18n.t('Username must be at least 4 characters')
  ],
  email: [
-    v => !!v || 'Please enter your e-mail address',
-    v => /.+@.+\..+/.test(v) || 'E-mail address must be valid'
+    v => !!v || $i18n.t('Please enter your e-mail address'),
+    v => /.+@.+\..+/.test(v) || $i18n.t('E-mail address must be valid')
  ],
  password1: [
-    v => !!v || 'Please enter your password',
-    v => v.length >= 8 || 'Password must be at least 8 characters'
+    v => !!v || $i18n.t('Please enter your password'),
+    v => v.length >= 8 || $i18n.t('Password must be at least 8 characters')
  ],
  password2: [
-    v => !!v || 'Please confirm your password',
-    v => v.length >= 8 || 'Password must be at least 8 characters',
-    v => v === formData.value.password1 || 'Confirm password must match password'
-  ]
+    v => !!v || $i18n.t('Please confirm your password'),
+    v => v.length >= 8 || $i18n.t('Password must be at least 8 characters'),
+    v => v === formData.value.password1 || $i18n.t('Confirm password must match password')
+  ],
+  code: [
+    v => !!v || $i18n.t('Please enter your code'),
+  ],
 })

 const submitting = ref(false)
@@ -58,15 +64,15 @@ const submit = async () => {
      if (error.value.status === 400) {
        for (const key in formData.value) {
          if (error.value.data[key]) {
-            fieldErrors.value[key] = error.value.data[key][0]
+            fieldErrors.value[key] = $i18n.t(error.value.data[key][0])
          }
        }
        if (error.value.data.non_field_errors) {
-          errorMsg.value = error.value.data.non_field_errors[0]
+          errorMsg.value = $i18n.t(error.value.data.non_field_errors[0])
        }
      } else {
        if (error.value.data.detail) {
-          errorMsg.value = error.value.data.detail
+          errorMsg.value = $i18n.t(error.value.data.detail)
        } else {
          errorMsg.value = 'Something went wrong. Please try again.'
        }
@@ -101,14 +107,14 @@ const handleFieldUpdate = (field) => {
              class="mt-15"
              elevation="0"
          >
-            <div class="text-center text-h4">Create your account</div>
+            <div class="text-center text-h4">{{$t('Create your account')}}</div>
            <v-card-text>
              <v-form ref="signUpForm" class="mt-5">
                <v-text-field
                    v-model="formData.username"
                    :rules="formRules.username"
                    :error-messages="fieldErrors.username"
-                    label="User name"
+                    :label="$t('username')"
                    variant="underlined"
                    @update:modelValue="handleFieldUpdate('username')"
                    clearable
@@ -118,7 +124,7 @@ const handleFieldUpdate = (field) => {
                    v-model="formData.email"
                    :rules="formRules.email"
                    :error-messages="fieldErrors.email"
-                    label="Email"
+                    :label="$t('email')"
                    variant="underlined"
                    @update:modelValue="handleFieldUpdate('email')"
                    clearable
@@ -128,7 +134,7 @@ const handleFieldUpdate = (field) => {
                    v-model="formData.password1"
                    :rules="formRules.password1"
                    :error-messages="fieldErrors.password1"
-                    label="Password"
+                    :label="$t('password')"
                    variant="underlined"
                    @update:modelValue="handleFieldUpdate('password1')"
                    clearable
@@ -138,12 +144,21 @@ const handleFieldUpdate = (field) => {
                    v-model="formData.password2"
                    :rules="formRules.password2"
                    :error-messages="fieldErrors.password2"
-                    label="Confirm password"
+                    :label="$t('confirmPassword')"
                    variant="underlined"
                    @update:modelValue="handleFieldUpdate('password2')"
                    clearable
                ></v-text-field>

+                <v-text-field
+                    v-model="formData.code"
+                    :rules="formRules.code"
+                    :label="$t('invitation code')"
+                    variant="underlined"
+                    @keyup.enter="submit"
+                    clearable
+                ></v-text-field>
+
              </v-form>

              <div v-if="errorMsg" class="text-red">{{ errorMsg }}</div>
@@ -155,14 +170,14 @@ const handleFieldUpdate = (field) => {
                    @click="navigateTo('/account/signin')"
                    variant="text"
                    color="primary"
-                >Sign in instead</v-btn>
+                >{{$t('Sign in instead')}}</v-btn>

                <v-btn
                    size="large"
                    color="primary"
                    :loading="submitting"
                    @click="submit"
-                >Submit</v-btn>
+                >{{$t('signUp')}}</v-btn>
              </div>

            </v-card-text>