feat: i18n

2025-11-25 09:59:20 +08:00
parent 4bd8a54b34
commit 3dcb6330e3
8 changed files with 726 additions and 381 deletions
--- a/src/component/LoginPage/login/enterprise.vue
+++ b/src/component/LoginPage/login/enterprise.vue
@@ -9,14 +9,14 @@
          <div>
            <div class="login_form_content" :state="emailStap">
              <div v-show="emailStap === 1">
-                <div class="login_form_title marign_top30">Enterprise</div>
+                <div class="login_form_title marign_top30">{{ t('LoginEnterprise.Enterprise') }}</div>
                <div class="generalModel_state">
                  <div
                    class="generalModel_state_item"
                    style="width: 100%; margin: 0"
                  >
                    <a-select
-                      placeholder="Select a school"
+                      :placeholder="t('LoginEnterprise.SelectEnterprise')"
                      v-model:value="selectEnterprise"
                      :options="schoolList"
                      @change="schoolListChange"
@@ -36,21 +36,21 @@
                    </a-select>
                  </div>
                </div>
-                <div class="login_form_title marign_top30">Email</div>
+                <div class="login_form_title marign_top30">{{ t('LoginEnterprise.Email') }}</div>
                <input
                  class="login_form_input"
-                  placeholder="Enter your email address"
+                  :placeholder="t('LoginEnterprise.EnterEmail')"
                  v-model="email"
                  @keydown.enter="submitPerLogin()"
                />
                <div class="login_form_title marign_top30">
-                  <div>Password</div>
+                  <div>{{ t('LoginEnterprise.Password') }}</div>
                </div>
                <div class="password_input_block">
                  <input
                    class="login_form_input"
                    :type="passwordType"
-                    placeholder="Enter your password"
+                    :placeholder="t('LoginEnterprise.EnterPassword')"
                    v-model="password"
                    @keydown.enter="submitPerLogin()"
                  />
@@ -79,15 +79,15 @@
                  </div> -->
                  <div class="email_last_step_bottom">
                    <div class="email_last_step_des">
-                      <div class="sent_email_content">Enter Code</div>
+                      <div class="sent_email_content">{{ t('LoginEnterprise.EnterCode') }}</div>
                      <div class="tip_content">
                        <span v-show="time">{{ time }}s</span>
                        <span v-show="!time" @click="emailNextStepFun()"
-                          >Resend</span
+                          >{{ t('LoginEnterprise.Resend') }}</span
                        >
                      </div>
                    </div>
-					<div class="codeEmail">We’ve sent an code to your email <span>{{ email }}</span></div>
+					<div class="codeEmail">{{ t('LoginEnterprise.SentCodeToEmail') }} <span>{{ email }}</span></div>
 					<div class="codeEmailInput">
 						<VerificationCodeInput
 						:ct="emailCode"
@@ -103,10 +103,10 @@
              <label :class="{ active: emailStap == 2 }">
                <input :state="emailStap" type="checkbox" v-model="checked" />
 				<span>
-					I agree to the 
-					<a href="https://code-create.com.hk/aida-terms-and-conditions/" style="text-decoration: underline;color: #000;">Terms</a>, 
-					<a href="https://aida.com.hk/privacy-policy.html" target="_blank" style="text-decoration: underline;color: #000;">Privacy Policy</a>, 
-					 and Fees.
+					{{ t('LoginEnterprise.AgreeTo') }} 
+					<a href="https://code-create.com.hk/aida-terms-and-conditions/" style="text-decoration: underline;color: #000;">{{ t('LoginEnterprise.Terms') }}</a>, 
+					<a href="https://aida.com.hk/privacy-policy.html" target="_blank" style="text-decoration: underline;color: #000;">{{ t('LoginEnterprise.PrivacyPolicy') }}</a>, 
+					{{ t('LoginEnterprise.AndFees') }}
 				</span>
              </label>
            </div>
@@ -125,7 +125,7 @@
              :state="emailStap"
              @click="submitPerLogin()"
            >
-              Sign in
+              {{ t('LoginEnterprise.SignIn') }}
            </div>

            <!-- <div class="login_text">
@@ -151,14 +151,14 @@
        >
          <!-- <i class="fi fi-br-arrow-left"></i> -->
 			<i class="fi fi-br-angle-left"></i>
-          <span class="forget_password_content_title">Retrieve password</span>
+          <span class="forget_password_content_title">{{ t('LoginEnterprise.RetrievePassword') }}</span>
        </div>
        <div v-show="frogetPasswordStep === 1">
          <div class="forget_passored_form_content">
-            <div class="forget_passored_form_title">Email</div>
+            <div class="forget_passored_form_title">{{ t('LoginEnterprise.Email') }}</div>
            <input
              class="forget_passored_form_input"
-              placeholder="Enter your email"
+              :placeholder="t('LoginEnterprise.EnterEmail')"
              v-model="forgetPasswordEmail"
              @keydown.enter="forgetPasswordNextStepFun()"
            />
@@ -167,20 +167,20 @@
            class="forget_submit_button marign_top40"
            @click="forgetPasswordNextStepFun()"
          >
-            Next step
+            {{ t('LoginEnterprise.NextStep') }}
          </div>
        </div>

        <div v-show="frogetPasswordStep === 2">
-          <div class="forget_verif_code_des">Verification Code</div>
+          <div class="forget_verif_code_des">{{ t('LoginEnterprise.VerificationCode') }}</div>
          <div class="email_last_step_des">
            <div class="sent_email_content">
-              Sent to {{ forgetPasswordEmail }}
+              {{ t('LoginEnterprise.SentTo') }} {{ forgetPasswordEmail }}
            </div>
            <div class="tip_content">
              <span v-show="time">{{ time }}s</span>
              <span v-show="!time" @click="forgetPasswordNextStepFun()"
-                >Resend</span
+                >{{ t('LoginEnterprise.Resend') }}</span
              >
            </div>
          </div>
@@ -192,7 +192,7 @@

        <div v-show="frogetPasswordStep === 3">
          <div class="forget_passored_form_content">
-            <div class="forget_passored_form_title">Password</div>
+            <div class="forget_passored_form_title">{{ t('LoginEnterprise.Password') }}</div>
 			<div v-show="passwordConditionShow" class="conditionShow">
 				<div class="item">
 					<div class="icon">
@@ -205,7 +205,7 @@
 						class="fi fi-br-check"
 					></i>
 					</div>
-					<div class="text">At least 8 characters long</div>
+					<div class="text">{{ t('LoginEnterprise.AtLeast8Chars') }}</div>
 				</div>
 				<div class="item">
 					<div class="icon">
@@ -218,7 +218,7 @@
 						class="fi fi-br-check"
 					></i>
 					</div>
-					<div class="text">Must contain special characters</div>
+					<div class="text">{{ t('LoginEnterprise.MustContainSpecial') }}</div>
 				</div>
 				<div class="item">
 					<div class="icon">
@@ -232,13 +232,13 @@
 					></i>
 					</div>
 					<div class="text">
-					Mix of uppercase, lowercase and numbers
+					{{ t('LoginEnterprise.MixUpperLowerNumbers') }}
 					</div>
 				</div>
 			</div>
            <input
              class="forget_passored_form_input"
-              placeholder="Enter a new password"
+              :placeholder="t('LoginEnterprise.EnterNewPassword')"
              v-model="newPassword"
 			  @focus="() => (passwordConditionShow = true)"
 			@blur="() => (passwordConditionShow = false)"
@@ -250,7 +250,7 @@
            class="forget_submit_button marign_top40"
            @click="submitResetPassword()"
          >
-            Submit
+            {{ t('LoginEnterprise.Submit') }}
          </div>
        </div>
      </div>
@@ -263,7 +263,7 @@
 </template>

 <script lang="ts">
-import { defineComponent, ref, onMounted, reactive, toRefs } from "vue";
+import { defineComponent, ref, onMounted, reactive, toRefs, inject } from "vue";
 import { Https } from "@/tool/https";
 import { isEmail } from "@/tool/util";
 import { setCookie, WriteCookie } from "@/tool/cookie";
@@ -273,7 +273,6 @@ import googleLogin from "@/component/LoginPage/googleLogin.vue";
 import weiXinLogin from "@/component/LoginPage/weiXinLogin.vue";
 import phoneLogin from "@/component/LoginPage/phoneLogin.vue";
 import { useStore } from "vuex";
-import { useI18n } from "vue-i18n";
 import { setLang } from "@/tool/guide";
 import md5 from "md5";
 export default defineComponent({
@@ -285,7 +284,8 @@ export default defineComponent({
  },
  setup() {
    let timer: any = 0;
-    const { locale } = useI18n();
+    // 从父组件注入 i18n
+    const i18n = inject('i18n') as { t: any, locale: any };
    const store = useStore();
    let loadingShow = ref(false);
    const data = reactive({
@@ -320,7 +320,8 @@ export default defineComponent({
      ...toRefs(data),
      store,
      timer,
-      locale,
+      locale: i18n?.locale,
+      t: i18n?.t,
      loadingShow,
      schoolListChange,
      filterOption,
@@ -383,7 +384,7 @@ export default defineComponent({
    //邮箱登录的下一步
    emailNextStepFun() {
      if (!isEmail(this.email)) {
-        message.info("The email format is incorrect");
+        message.info(this.t('LoginEnterprise.IncorrectEmailFormat'));
        return;
      }
      let data = {
@@ -413,7 +414,7 @@ export default defineComponent({
    //忘记密码的下一步
    forgetPasswordNextStepFun() {
      if (!isEmail(this.forgetPasswordEmail)) {
-        message.info("The email format is incorrect");
+        message.info(this.t('LoginEnterprise.IncorrectEmail'));
        return;
      }
      let data = {
@@ -468,26 +469,26 @@ export default defineComponent({
        return;
      } else {
        if (!this.password) {
-          message.info("Please enter your account number or password");
+          message.info(this.t('LoginEnterprise.PleaseEnterYourAccountNumberOrPassword'));
          return;
        }
        //输入邮箱
        if (!this.email) {
-          message.info("Please enter your email address");
+          message.info(this.t('LoginEnterprise.NeedEmail'));
          return;
        }
        if (!this.selectEnterprise) {
-          message.info("Please select a school");
+          message.info(this.t('LoginEnterprise.SelectEnterprise'));
          return;
        }
        //判断邮箱格式是否正确
        if (!isEmail(this.email)) {
-          message.info("The email format is incorrect");
+          message.info(this.t('LoginEnterprise.IncorrectEmailFormat'));
          return;
        }
        //判断是否同意隐私政策
        if (!this.checked) {
-          message.info("Agree to all terms, privacy fees and policies");
+          message.info(this.t('Login.AgreePolicies'));
          return;
        }
        let data = {
@@ -547,7 +548,7 @@ export default defineComponent({
 		});
    },
    isCheckAgreement() {
-      message.info("Agree to all terms, privacy fees and policies");
+      message.info(this.t('Login.AgreePolicies'));
    },
   
    //谷歌登录
@@ -584,7 +585,7 @@ export default defineComponent({

        if (window.innerWidth < 768) {
          message.info(
-            "If you need to design, please log in using an iPad or computer."
+            this.t('Login.Device')
          );
          this.turnToHomePage("/Square");
        } else {
@@ -613,7 +614,7 @@ export default defineComponent({
    //修改密码提交
    submitResetPassword() {
 		if (this.isPassword(this.newPassword) < 3) {
-          message.info("You must satisfy ALL password conditions to register.");
+          message.info(this.t('Login.PasswordConditions'));
          return;
        }
      let data = {
--- a/src/component/LoginPage/login/personal.vue
+++ b/src/component/LoginPage/login/personal.vue
@@ -14,21 +14,21 @@
                                v-model="username"
                            /> -->
              <div v-show="emailStap === 1">
-                <div class="login_form_title marign_top30">Email</div>
+                <div class="login_form_title marign_top30">{{ t('LoginPersonal.Email') }}</div>
                <input
                  class="login_form_input"
-                  placeholder="Enter your email address"
+                  :placeholder="t('LoginPersonal.EnterEmail')"
                  v-model="email"
                  @keydown.enter="submitPerLogin()"
                />
                <div class="login_form_title marign_top30">
-                  <div>Password</div>
+                  <div>{{ t('LoginPersonal.Password') }}</div>
                </div>
                <div class="password_input_block">
                  <input
                    class="login_form_input"
                    :type="passwordType"
-                    placeholder="Enter your password"
+                    :placeholder="t('LoginPersonal.EnterPassword')"
                    v-model="password"
                    @keydown.enter="submitPerLogin()"
                  />
@@ -57,15 +57,15 @@
                  </div> -->
                  <div class="email_last_step_bottom">
                    <div class="email_last_step_des">
-                      <div class="sent_email_content">Enter Code</div>
+                      <div class="sent_email_content">{{ t('LoginPersonal.EnterCode') }}</div>
                      <div class="tip_content">
                        <span v-show="time">{{ time }}s</span>
                        <span v-show="!time" @click="emailNextStepFun()"
-                          >Resend</span
+                          >{{ t('LoginPersonal.Resend') }}</span
                        >
                      </div>
                    </div>
-					<div class="codeEmail">We’ve sent an code to your email <span>{{ email }}</span></div>
+					<div class="codeEmail">{{ t('LoginPersonal.SentCodeToEmail') }} <span>{{ email }}</span></div>
 					<div class="codeEmailInput">
 						<VerificationCodeInput
 						ref="verificationCodeInputDom"
@@ -80,17 +80,17 @@
 			<div class="login_text" v-show="emailStap !== 2">

              <div class="forget_password_text" @click="changeIsLogin(2)">
-                Forgot your password
+                {{ t('LoginPersonal.ForgotPassword') }}
              </div>
            </div>
            <div class="login_form_title marign_top40">
              <label :class="{ active: emailStap == 2 }">
                <input :state="emailStap" type="checkbox" v-model="checked" />
                <span>
-					I agree to the 
-					<a href="https://code-create.com.hk/aida-terms-and-conditions/" style="text-decoration: underline;color: #000;">Terms</a>, 
-					<a href="https://aida.com.hk/privacy-policy.html" target="_blank" style="text-decoration: underline;color: #000;">Privacy Policy</a>, 
-					 and Fees.
+					{{ t('LoginPersonal.AgreeTo') }} 
+					<a href="https://code-create.com.hk/aida-terms-and-conditions/" style="text-decoration: underline;color: #000;">{{ t('LoginPersonal.Terms') }}</a>, 
+					<a href="https://aida.com.hk/privacy-policy.html" target="_blank" style="text-decoration: underline;color: #000;">{{ t('LoginPersonal.PrivacyPolicy') }}</a>, 
+					{{ t('LoginPersonal.AndFees') }}
 				</span>
              </label>
            </div>
@@ -102,12 +102,12 @@
              @click="submitPerLogin()"
 			  @mousedown="loginBtnMousedown"
            >
-              Sign in
+              {{ t('LoginPersonal.SignIn') }}
            </div>
-			<div class="NewAccount" @click="newAccount()">Create New Account</div>
+			<div class="NewAccount" @click="newAccount()">{{ t('LoginPersonal.CreateNewAccount') }}</div>
 			<div class="segmentation">
 				<div class="wire"></div>
-				<div class="text">or</div>
+				<div class="text">{{ t('LoginPersonal.Or') }}</div>
 				<div class="wire"></div>
 			</div>
 			<div class="thirdPartyLogin marign_top30">
@@ -147,14 +147,14 @@
                    > -->
          <!-- <i class="fi fi-br-arrow-left"></i> -->
 			<i class="fi fi-br-angle-left"></i>
-          <span class="forget_password_content_title">Retrieve password</span>
+          <span class="forget_password_content_title">{{ t('LoginPersonal.RetrievePassword') }}</span>
        </div>
        <div v-show="frogetPasswordStep === 1">
          <div class="forget_passored_form_content">
-            <div class="forget_passored_form_title">Email</div>
+            <div class="forget_passored_form_title">{{ t('LoginPersonal.Email') }}</div>
            <input
              class="forget_passored_form_input"
-              placeholder="Enter your email"
+              :placeholder="t('LoginPersonal.EnterEmail')"
              v-model="forgetPasswordEmail"
              @keydown.enter="forgetPasswordNextStepFun()"
            />
@@ -163,20 +163,20 @@
            class="forget_submit_button marign_top40"
            @click="forgetPasswordNextStepFun()"
          >
-            Next step
+            {{ t('LoginPersonal.NextStep') }}
          </div>
        </div>

        <div v-show="frogetPasswordStep === 2">
-          <div class="forget_verif_code_des">Verification Code</div>
+          <div class="forget_verif_code_des">{{ t('LoginPersonal.VerificationCode') }}</div>
          <div class="email_last_step_des">
            <div class="sent_email_content">
-              Sent to {{ forgetPasswordEmail }}
+              {{ t('LoginPersonal.SentTo') }} {{ forgetPasswordEmail }}
            </div>
            <div class="tip_content">
              <span v-show="time">{{ time }}s</span>
              <span v-show="!time" @click="forgetPasswordNextStepFun()"
-                >Resend</span
+                >{{ t('LoginPersonal.Resend') }}</span
              >
            </div>
          </div>
@@ -188,7 +188,7 @@

        <div v-show="frogetPasswordStep === 3">
          <div class="forget_passored_form_content">
-            <div class="forget_passored_form_title">Password</div>
+            <div class="forget_passored_form_title">{{ t('LoginPersonal.Password') }}</div>
 			<div v-show="passwordConditionShow" class="conditionShow">
 				<div class="item">
 					<div class="icon">
@@ -201,7 +201,7 @@
 						class="fi fi-br-check"
 					></i>
 					</div>
-					<div class="text">At least 8 characters long</div>
+					<div class="text">{{ t('LoginPersonal.AtLeast8Chars') }}</div>
 				</div>
 				<div class="item">
 					<div class="icon">
@@ -214,7 +214,7 @@
 						class="fi fi-br-check"
 					></i>
 					</div>
-					<div class="text">Must contain special characters</div>
+					<div class="text">{{ t('LoginPersonal.MustContainSpecial') }}</div>
 				</div>
 				<div class="item">
 					<div class="icon">
@@ -228,13 +228,13 @@
 					></i>
 					</div>
 					<div class="text">
-					Mix of uppercase, lowercase and numbers
+					{{ t('LoginPersonal.MixUpperLowerNumbers') }}
 					</div>
 				</div>
 			</div>
            <input
              class="forget_passored_form_input"
-              placeholder="Enter a new password"
+              :placeholder="t('LoginPersonal.EnterNewPassword')"
              v-model="newPassword"
 			  @focus="() => (passwordConditionShow = true)"
 			@blur="() => (passwordConditionShow = false)"
@@ -246,7 +246,7 @@
            class="forget_submit_button marign_top40"
            @click="submitResetPassword()"
          >
-            Submit
+            {{ t('LoginPersonal.Submit') }}
          </div>
        </div>
      </div>
@@ -290,7 +290,7 @@
 </template>

 <script lang="ts">
-import { defineComponent, ref, onMounted } from "vue";
+import { defineComponent, ref, onMounted, inject } from "vue";
 import { Https } from "@/tool/https";
 import { isEmail } from "@/tool/util";
 import { setCookie, WriteCookie } from "@/tool/cookie";
@@ -300,11 +300,9 @@ import googleLogin from "@/component/LoginPage/googleLogin.vue";
 import weiXinLogin from "@/component/LoginPage/weiXinLogin.vue";
 import phoneLogin from "@/component/LoginPage/phoneLogin.vue";
 import { useStore } from "vuex";
-import { useI18n } from "vue-i18n";
+import { useRouter } from "vue-router";
 import { setLang } from "@/tool/guide";
 import md5 from "md5";
-import router from "@/router";
-import { pass } from "three/tsl";
 export default defineComponent({
  components: {
    VerificationCodeInput,
@@ -316,17 +314,18 @@ export default defineComponent({
    let timer: any = 0;
 	let router = useRouter()

-    const { locale } = useI18n();
+    // 从父组件注入 i18n
+    const i18n = inject('i18n') as { t: any, locale: any };
    const store = useStore();
    let loadingShow = ref(false);
 	const newAccount = ()=>{
-		// router.spuh({path:'/register'})
 		router.push({path:'/register'})
 	}
    return {
      store,
      timer,
-      locale,
+      locale: i18n?.locale,
+      t: i18n?.t,
      loadingShow,
 	  newAccount,
    };
@@ -389,7 +388,7 @@ export default defineComponent({
    //邮箱登录的下一步
    emailNextStepFun() {
      if (!isEmail(this.email)) {
-        message.info("The email format is incorrect");
+        message.info(this.$t('LoginPersonal.IncorrectEmailFormat'));
        return;
      }
      let data = {
@@ -419,7 +418,7 @@ export default defineComponent({
    //忘记密码的下一步
    forgetPasswordNextStepFun() {
      if (!isEmail(this.forgetPasswordEmail)) {
-        message.info("The email format is incorrect");
+        message.info(this.t('LoginPersonal.IncorrectEmail'));
        return;
      }
      let data = {
@@ -473,7 +472,7 @@ export default defineComponent({
 		let verificationCodeInputDom:any = this.$refs.verificationCodeInputDom
 		let code =  verificationCodeInputDom.getCtData.map(item => item).join('');
 		if(code.length !== this.emailCode.length){
-			message.info("Please enter the complete verification code.");
+			message.info(this.t('LoginPersonal.CompleteVerificationCode'));
 		}else{
 			this.submitEmailLogin(code)
 		}
@@ -482,22 +481,22 @@ export default defineComponent({
        return;
      } else {
        if (!this.password) {
-          message.info("Please enter your account number or password");
+          message.info(this.t('LoginPersonal.PleaseEnterYourAccountNumberOrPassword'));
          return;
        }
        //输入邮箱
        if (!this.email) {
-          message.info("Please enter your email address");
+          message.info(this.t('LoginPersonal.NeedEmail'));
          return;
        }
        //判断邮箱格式是否正确
        if (!isEmail(this.email)) {
-          message.info("The email format is incorrect");
+          message.info(this.t('LoginPersonal.IncorrectEmailFormat'));
          return;
        }
        //判断是否同意隐私政策
        if (!this.checked) {
-          message.info("Agree to all terms, privacy fees and policies");
+          message.info(this.t('Login.AgreePolicies'));
          return;
        }
        let data = {
@@ -565,7 +564,7 @@ export default defineComponent({
 		},1000)
    },
    isCheckAgreement() {
-      message.info("Agree to all terms, privacy fees and policies");
+      message.info(this.t('Login.AgreePolicies'));
    },
    //谷歌登录
    googelLogin(value: any) {
@@ -601,7 +600,7 @@ export default defineComponent({

        if (window.innerWidth < 768) {
          message.info(
-            "If you need to design, please log in using an iPad or computer."
+            this.t('Login.Device')
          );
          this.turnToHomePage("/Square");
        } else {
@@ -630,7 +629,7 @@ export default defineComponent({
    //修改密码提交
    submitResetPassword() {
 		if (this.isPassword(this.newPassword) < 3) {
-          message.info("You must satisfy ALL password conditions to register.");
+          message.info(this.t('Login.PasswordConditions'));
          return;
        }
      let data = {
--- a/src/component/LoginPage/login/school.vue
+++ b/src/component/LoginPage/login/school.vue
@@ -9,14 +9,14 @@
          <div>
            <div class="login_form_content" :state="emailStap">
              <div v-show="emailStap === 1">
-                <div class="login_form_title marign_top30">School</div>
+                <div class="login_form_title marign_top30">{{ t('LoginSchool.School') }}</div>
                <div class="generalModel_state">
                  <div
                    class="generalModel_state_item"
                    style="width: 100%; margin: 0"
                  >
                    <a-select
-                      placeholder="Select a school"
+                      :placeholder="t('LoginSchool.SelectSchool')"
                      v-model:value="selectSchool"
                      :options="schoolList"
                      @change="schoolListChange"
@@ -36,21 +36,21 @@
                    </a-select>
                  </div>
                </div>
-                <div class="login_form_title marign_top30">Email</div>
+                <div class="login_form_title marign_top30">{{ t('LoginSchool.Email') }}</div>
                <input
                  class="login_form_input"
-                  placeholder="Enter your email address"
+                  :placeholder="t('LoginSchool.EnterEmail')"
                  v-model="email"
                  @keydown.enter="submitPerLogin()"
                />
                <div class="login_form_title marign_top30">
-                  <div>Password</div>
+                  <div>{{ t('LoginSchool.Password') }}</div>
                </div>
                <div class="password_input_block">
                  <input
                    class="login_form_input"
                    :type="passwordType"
-                    placeholder="Enter your password"
+                    :placeholder="t('LoginSchool.EnterPassword')"
                    v-model="password"
                    @keydown.enter="submitPerLogin()"
                  />
@@ -79,15 +79,15 @@
                  </div> -->
                  <div class="email_last_step_bottom">
                    <div class="email_last_step_des">
-                      <div class="sent_email_content">Enter Code</div>
+                      <div class="sent_email_content">{{ t('LoginSchool.EnterCode') }}</div>
                      <div class="tip_content">
                        <span v-show="time">{{ time }}s</span>
                        <span v-show="!time" @click="emailNextStepFun()"
-                          >Resend</span
+                          >{{ t('LoginSchool.Resend') }}</span
                        >
                      </div>
                    </div>
-					<div class="codeEmail">We’ve sent an code to your email <span>{{ email }}</span></div>
+					<div class="codeEmail">{{ t('LoginSchool.SentCodeToEmail') }} <span>{{ email }}</span></div>
 					<div class="codeEmailInput">
 						<VerificationCodeInput
 						ref="verificationCodeInputDom"
@@ -101,17 +101,17 @@
            </div>
 			<div class="login_text" v-show="emailStap !== 2">
 				<div class="forget_password_text" @click="changeIsLogin(2)">
-				Forgot your password
+				{{ t('LoginSchool.ForgotPassword') }}
 				</div>
 			</div>
            <div class="login_form_title marign_top30">
              <label :class="{ active: emailStap == 2 }">
                <input :state="emailStap" type="checkbox" v-model="checked" />
 				<span>
-					I agree to the 
-					<a href="https://code-create.com.hk/aida-terms-and-conditions/" style="text-decoration: underline;color: #000;">Terms</a>, 
-					<a href="https://aida.com.hk/privacy-policy.html" target="_blank" style="text-decoration: underline;color: #000;">Privacy Policy</a>, 
-					 and Fees.
+					{{ t('LoginSchool.AgreeTo') }} 
+					<a href="https://code-create.com.hk/aida-terms-and-conditions/" style="text-decoration: underline;color: #000;">{{ t('LoginSchool.Terms') }}</a>, 
+					<a href="https://aida.com.hk/privacy-policy.html" target="_blank" style="text-decoration: underline;color: #000;">{{ t('LoginSchool.PrivacyPolicy') }}</a>, 
+					{{ t('LoginSchool.AndFees') }}
 				</span>
              </label>
            </div>
@@ -132,7 +132,7 @@
              @click="submitPerLogin()"
 			  @mousedown="loginBtnMousedown"
            >
-              Sign in
+              {{ t('LoginSchool.SignIn') }}
            </div>

            <!-- <div class="login_text">
@@ -158,14 +158,14 @@
        >
          <!-- <i class="fi fi-br-arrow-left"></i> -->
 			<i class="fi fi-br-angle-left"></i>
-          <span class="forget_password_content_title">Retrieve password</span>
+          <span class="forget_password_content_title">{{ t('LoginSchool.RetrievePassword') }}</span>
        </div>
        <div v-show="frogetPasswordStep === 1">
          <div class="forget_passored_form_content">
-            <div class="forget_passored_form_title">Email</div>
+            <div class="forget_passored_form_title">{{ t('LoginSchool.Email') }}</div>
            <input
              class="forget_passored_form_input"
-              placeholder="Enter your email"
+              :placeholder="t('LoginSchool.EnterEmail')"
              v-model="forgetPasswordEmail"
              @keydown.enter="forgetPasswordNextStepFun()"
            />
@@ -174,20 +174,20 @@
            class="forget_submit_button marign_top40"
            @click="forgetPasswordNextStepFun()"
          >
-            Next step
+            {{ t('LoginSchool.NextStep') }}
          </div>
        </div>

        <div v-show="frogetPasswordStep === 2">
-          <div class="forget_verif_code_des">Verification Code</div>
+          <div class="forget_verif_code_des">{{ t('LoginSchool.VerificationCode') }}</div>
          <div class="email_last_step_des">
            <div class="sent_email_content">
-              Sent to {{ forgetPasswordEmail }}
+              {{ t('LoginSchool.SentTo') }} {{ forgetPasswordEmail }}
            </div>
            <div class="tip_content">
              <span v-show="time">{{ time }}s</span>
              <span v-show="!time" @click="forgetPasswordNextStepFun()"
-                >Resend</span
+                >{{ t('LoginSchool.Resend') }}</span
              >
            </div>
          </div>
@@ -199,7 +199,7 @@

        <div v-show="frogetPasswordStep === 3">
          <div class="forget_passored_form_content">
-            <div class="forget_passored_form_title">Password</div>
+            <div class="forget_passored_form_title">{{ t('LoginSchool.Password') }}</div>
 			<div v-show="passwordConditionShow" class="conditionShow">
 				<div class="item">
 					<div class="icon">
@@ -212,7 +212,7 @@
 						class="fi fi-br-check"
 					></i>
 					</div>
-					<div class="text">At least 8 characters long</div>
+					<div class="text">{{ t('LoginSchool.AtLeast8Chars') }}</div>
 				</div>
 				<div class="item">
 					<div class="icon">
@@ -225,7 +225,7 @@
 						class="fi fi-br-check"
 					></i>
 					</div>
-					<div class="text">Must contain special characters</div>
+					<div class="text">{{ t('LoginSchool.MustContainSpecial') }}</div>
 				</div>
 				<div class="item">
 					<div class="icon">
@@ -239,13 +239,13 @@
 					></i>
 					</div>
 					<div class="text">
-					Mix of uppercase, lowercase and numbers
+					{{ t('LoginSchool.MixUpperLowerNumbers') }}
 					</div>
 				</div>
 			</div>
            <input
              class="forget_passored_form_input"
-              placeholder="Enter a new password"
+              :placeholder="t('LoginSchool.EnterNewPassword')"
              v-model="newPassword"
 			  @focus="() => (passwordConditionShow = true)"
 			@blur="() => (passwordConditionShow = false)"
@@ -257,7 +257,7 @@
            class="forget_submit_button marign_top40"
            @click="submitResetPassword()"
          >
-            Submit
+            {{ t('LoginSchool.Submit') }}
          </div>
        </div>
      </div>
@@ -270,7 +270,7 @@
 </template>

 <script lang="ts">
-import { defineComponent, ref, onMounted, reactive, toRefs } from "vue";
+import { defineComponent, ref, onMounted, reactive, toRefs, inject } from "vue";
 import { Https } from "@/tool/https";
 import { isEmail } from "@/tool/util";
 import { setCookie, WriteCookie } from "@/tool/cookie";
@@ -280,7 +280,6 @@ import googleLogin from "@/component/LoginPage/googleLogin.vue";
 import weiXinLogin from "@/component/LoginPage/weiXinLogin.vue";
 import phoneLogin from "@/component/LoginPage/phoneLogin.vue";
 import { useStore } from "vuex";
-import { useI18n } from "vue-i18n";
 import { setLang } from "@/tool/guide";
 import md5 from "md5";
 export default defineComponent({
@@ -292,7 +291,8 @@ export default defineComponent({
  },
  setup() {
    let timer: any = 0;
-    const { locale } = useI18n();
+    // 从父组件注入 i18n
+    const i18n = inject('i18n') as { t: any, locale: any };
    const store = useStore();
    let loadingShow = ref(false);
    const data = reactive({
@@ -331,7 +331,8 @@ export default defineComponent({
      ...toRefs(data),
      store,
      timer,
-      locale,
+      locale: i18n?.locale,
+      t: i18n?.t,
      loadingShow,
      schoolListChange,
      filterOption,
@@ -396,7 +397,7 @@ export default defineComponent({
    //邮箱登录的下一步
    emailNextStepFun() {
      if (!isEmail(this.email)) {
-        message.info("The email format is incorrect");
+        message.info(this.t('LoginSchool.IncorrectEmailFormat'));
        return;
      }
      let data = {
@@ -426,7 +427,7 @@ export default defineComponent({
    //忘记密码的下一步
    forgetPasswordNextStepFun() {
      if (!isEmail(this.forgetPasswordEmail)) {
-        message.info("The email format is incorrect");
+        message.info(this.t('LoginSchool.IncorrectEmail'));
        return;
      }
      let data = {
@@ -482,7 +483,7 @@ export default defineComponent({
 		let code =  verificationCodeInputDom.getCtData.map(item => item).join('');
 		console.log(code)
 		if(code.length !== this.emailCode.length){
-			message.info("Please enter the complete verification code.");
+			message.info(this.t('LoginSchool.CompleteVerificationCode'));
 		}else{
 			this.submitEmailLogin(code)
 		}
@@ -491,26 +492,26 @@ export default defineComponent({
        return;
      } else {
        if (!this.password) {
-          message.info("Please enter your account number or password");
+          message.info(this.t('LoginSchool.PleaseEnterYourAccountNumberOrPassword'));
          return;
        }
        //输入邮箱
        if (!this.email) {
-          message.info("Please enter your email address");
+          message.info(this.t('LoginSchool.NeedEmail'));
          return;
        }
        if (!this.selectSchool) {
-          message.info("Please select a school");
+          message.info(this.t('LoginSchool.SelectSchool'));
          return;
        }
        //判断邮箱格式是否正确
        if (!isEmail(this.email)) {
-          message.info("The email format is incorrect");
+          message.info(this.t('LoginSchool.IncorrectEmailFormat'));
          return;
        }
        //判断是否同意隐私政策
        if (!this.checked) {
-          message.info("Agree to all terms, privacy fees and policies");
+          message.info(this.t('Login.AgreePolicies'));
          return;
        }
        let data = {
@@ -576,7 +577,7 @@ export default defineComponent({
 		},1000)
    },
    isCheckAgreement() {
-      message.info("Agree to all terms, privacy fees and policies");
+      message.info(this.t('Login.AgreePolicies'));
    },
    //谷歌登录
    googelLogin(value: any) {
@@ -612,7 +613,7 @@ export default defineComponent({

        if (window.innerWidth < 768) {
          message.info(
-            "If you need to design, please log in using an iPad or computer."
+            this.t('Login.Device')
          );
          this.turnToHomePage("/Square");
        } else {
@@ -641,7 +642,7 @@ export default defineComponent({
    //修改密码提交
    submitResetPassword() {
 		if (this.isPassword(this.newPassword) < 3) {
-          message.info("You must satisfy ALL password conditions to register.");
+          message.info(this.t('Login.PasswordConditions'));
          return;
        }
      let data = {
--- a/src/component/mainPage/signUp/index.vue
+++ b/src/component/mainPage/signUp/index.vue
@@ -59,6 +59,24 @@
 					Monthly: '月度',
 					Yearly: '年度',
 					monthly: [
+						{
+							title: "试用版",
+							img: '/image/homeIntroduct/personal.png',
+							type:'personal',
+							info: "您的AI时尚设计助手",
+							price: '100积分',
+							detail: "",
+							highlight: "",
+							discounts: '9折优惠',
+							detailList: [
+								'轻松充值积分',
+								'可在公共化画廊分享设计并与设计师互动',
+								'支持月付/年付选项',
+								'适合个人创作者、独立设计师以及所有时尚爱好者',
+								'客户支持',
+							],
+							btn: '立即开始',
+						},
 						{
 							title: "个人版",
 							img: '/image/homeIntroduct/personal.png',
@@ -66,7 +84,7 @@
 							info: "您的AI时尚设计助手",
 							price: 'HK$100',
 							detail: "每月·500积分",
-							highlight: "免费试用5天",
+							highlight: "",
 							discounts: '9折优惠',
 							detailList: [
 								'轻松充值积分',
@@ -84,7 +102,7 @@
 							info: "您的AI时尚设计助手",
 							price: 'HK$500',
 							detail: "每月·3500积分",
-							highlight: "免费试用5天",
+							highlight: "",
 							discounts: '9折优惠',
 							detailList: [
 								'轻松充值积分',
@@ -164,6 +182,24 @@
 					Monthly: 'Monthly',
 					Yearly: 'Yearly',
 					monthly:[
+						{
+							title:"Personal",
+							img:'/image/homeIntroduct/personal.png',
+							type:'personal',
+							info:"Your AI Fashion Design Assistant",
+							price:'100 credits',
+							detail:"",
+							highlight:"",
+							discounts:'10% off',
+							detailList: [
+								'Easy to Top up Credits',
+								'Option to Share Design and Interact with Designers in Public Gallery',
+								'Support Monthly/Annual Payment Options',
+								'Suitable for Individual Creator, Independent Designers and Fun for all Fashion Lovers',
+								'Customer and Technical Support',
+							],
+							btn:'Get Started',
+						},
 						{
 							title:"Personal",
 							img:'/image/homeIntroduct/personal.png',
@@ -171,7 +207,7 @@
 							info:"Your AI Fashion Design Assistant",
 							price:'HK$100',
 							detail:"per month · 500 credits",
-							highlight:"Free 5-Days Trial",
+							highlight:"",
 							discounts:'10% off',
 							detailList: [
 								'Easy to Top up Credits',
@@ -189,7 +225,7 @@
 							info:"Your AI Fashion Design Assistant",
 							price:'HK$500',
 							detail:"per month · 3500 credits",
-							highlight:"Free 5-Days Trial",
+							highlight:"",
 							discounts:'10% off',
 							detailList:[
 								'Easy to Top up Credits',