aidlab/aida_front
7
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: i18n

Browse Source
This commit is contained in:
zhangyh
2025-11-25 09:59:20 +08:00
committed by zhangyahui
parent 4bd8a54b34
commit 3dcb6330e3
8 changed files with 726 additions and 381 deletions
Download Patch File Download Diff File Expand all files Collapse all files

83
src/component/LoginPage/login/enterprise.vue
View File

@@ -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 = {

89
src/component/LoginPage/login/personal.vue
View File

@@ -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 = {

87
src/component/LoginPage/login/school.vue
View File

@@ -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 = {

44
src/component/mainPage/signUp/index.vue
View File

@@ -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',

109
src/lang/cn.ts
View File

@@ -1530,5 +1530,114 @@ export default {
ChatRobot: '对话生成',
Yes: '是',
No: '否'
},
Login: {
Login: '登录',
SignUp: '注册',
ForgotPassword: '忘记密码',
Welcome: '欢迎来到',
AiDA: 'AiDA',
Slogan:
'AiDA是一个业界首创的平台，致力于赋能时装设计师融汇灵感，人机协同，共创原创设计。',
LoginMethod: '使用以下方式登录：',
Individual: '个人账号',
Academic: '学术账号',
LogoOnToAiDA: '登录到AiDA 3.1',
Infomation: '请填写以下信息',
Device: '请使用iPad或电脑登录',
AgreePolicies: '请勾选条款、隐私政策和费用',
PasswordConditions: '您必须满足所有密码条件才能注册'
},
LoginPersonal: {
Email: '邮箱',
Password: '密码',
EnterEmail: '请输入您的邮箱地址',
EnterPassword: '请输入您的密码',
EnterCode: '输入验证码',
Resend: '重发',
SentCodeToEmail: '我们已向您的邮箱发送验证码',
ForgotPassword: '忘记密码',
AgreeTo: '我同意',
Terms: '条款',
PrivacyPolicy: '隐私政策',
AndFees: '和费用',
SignIn: '登录',
CreateNewAccount: '创建新账号',
Or: '或',
RetrievePassword: '找回密码',
NextStep: '下一步',
VerificationCode: '验证码',
SentTo: '发送至',
Submit: '提交',
AtLeast8Chars: '至少8个字符',
MustContainSpecial: '必须包含特殊字符',
MixUpperLowerNumbers: '大小写字母和数字的组合',
EnterNewPassword: '请输入新密码',
NeedEmail: '请输入邮箱',
IncorrectEmail: '请输入正确的邮箱地址',
IncorrectEmailFormat: '请输入正确的邮箱格式',
CompleteVerificationCode: '请输入完整的验证码',
PleaseEnterYourAccountNumberOrPassword: '请输入您的账号或密码'
},
LoginSchool: {
School: '学校',
SelectSchool: '请选择学校',
Email: '邮箱',
Password: '密码',
EnterEmail: '请输入您的邮箱地址',
EnterPassword: '请输入您的密码',
EnterCode: '输入验证码',
Resend: '重发',
SentCodeToEmail: '我们已向您的邮箱发送验证码',
ForgotPassword: '忘记密码',
AgreeTo: '我同意',
Terms: '条款',
PrivacyPolicy: '隐私政策',
AndFees: '和费用',
SignIn: '登录',
RetrievePassword: '找回密码',
NextStep: '下一步',
VerificationCode: '验证码',
SentTo: '发送至',
Submit: '提交',
AtLeast8Chars: '至少8个字符',
MustContainSpecial: '必须包含特殊字符',
MixUpperLowerNumbers: '大小写字母和数字的组合',
EnterNewPassword: '请输入新密码',
NeedEmail: '请输入邮箱',
IncorrectEmail: '请输入正确的邮箱地址',
IncorrectEmailFormat: '请输入正确的邮箱格式',
CompleteVerificationCode: '请输入完整的验证码',
PleaseEnterYourAccountNumberOrPassword: '请输入您的账号或密码'
},
LoginEnterprise: {
Enterprise: '企业',
SelectEnterprise: '请选择企业',
Email: '邮箱',
Password: '密码',
EnterEmail: '请输入您的邮箱地址',
EnterPassword: '请输入您的密码',
EnterCode: '输入验证码',
Resend: '重发',
SentCodeToEmail: '我们已向您的邮箱发送验证码',
AgreeTo: '我同意',
Terms: '条款',
PrivacyPolicy: '隐私政策',
AndFees: '和费用',
SignIn: '登录',
RetrievePassword: '找回密码',
NextStep: '下一步',
VerificationCode: '验证码',
SentTo: '发送至',
Submit: '提交',
AtLeast8Chars: '至少8个字符',
MustContainSpecial: '必须包含特殊字符',
MixUpperLowerNumbers: '大小写字母和数字的组合',
EnterNewPassword: '请输入新密码',
NeedEmail: '请输入邮箱',
IncorrectEmail: '请输入正确的邮箱地址',
IncorrectEmailFormat: '请输入正确的邮箱格式',
CompleteVerificationCode: '请输入完整的验证码',
PleaseEnterYourAccountNumberOrPassword: '请输入您的账号或密码'
}
}

326
src/lang/en.ts
View File

@@ -107,7 +107,8 @@ export default {
FillBack: 'Fill & Border',
Layer: 'Layer',
More: 'Adjustments',
insufficient: 'Your points balance is insufficient, if you need to use this feature, please click the top left corner to recharge',
insufficient:
'Your points balance is insufficient, if you need to use this feature, please click the top left corner to recharge',
HDExport: 'UpScale',
Save: 'Save',
Share: 'Share',
@@ -130,11 +131,13 @@ export default {
Copy: 'Copy',
Paste: 'Paste',
UploadOpenimage: 'Upload/Open image',
jsContent1: "Have you saved your canvas content? If not, please click 'Save' before closing.",
jsContent1:
"Have you saved your canvas content? If not, please click 'Save' before closing.",
jsContent2: 'We only provide super-resolution capabilities for printboard images.',
jsContent3: 'Your points are less than one SR',
jsContent4: 'Your points balance is insufficient',
jsContent5: 'After super-resolution enhancement, the {str} th image you selected has a resolution exceeding 2048, Please choose a lower magnification level.',
jsContent5:
'After super-resolution enhancement, the {str} th image you selected has a resolution exceeding 2048, Please choose a lower magnification level.',
jsContent6: 'Please select the picture that requires upscale',
jsContent7: 'It has been successfully saved to the project canvas.',
jsContent8: 'Whether to continue editing',
@@ -199,16 +202,21 @@ export default {
Complete: 'Complete',
jsContent1: 'Whether to delete the workspace?',
jsContent2: 'Please enter a workbench name',
jsContent3: "It looks like you've changed the style. Would you like to replace the currently used mannequin with the system-recommended model for this style?",
jsContent3:
"It looks like you've changed the style. Would you like to replace the currently used mannequin with the system-recommended model for this style?",
currentProject: 'Current Project'
},
RobotAssist: {
inputContent1: 'write a message~',
jsContent1: 'Please enter content',
jsContent2: "Welcome to AiDA. I am your friendly fashion design assistant. If you have any questions or need assistance, please don't hesitate to ask",
jsContent3: "I see you might be new here, and I'd love to guide you through a tutorial to help you get acquainted with our new and improved AiDA system. Would you like to start the tutorial now?",
jsContent4: 'You can start the tutorial at any time by simply telling me that you want to.',
jsContent5: 'We need to refresh the page before starting the tutorial. Would you like to start the tutorial now?'
jsContent2:
"Welcome to AiDA. I am your friendly fashion design assistant. If you have any questions or need assistance, please don't hesitate to ask",
jsContent3:
"I see you might be new here, and I'd love to guide you through a tutorial to help you get acquainted with our new and improved AiDA system. Would you like to start the tutorial now?",
jsContent4:
'You can start the tutorial at any time by simply telling me that you want to.',
jsContent5:
'We need to refresh the page before starting the tutorial. Would you like to start the tutorial now?'
},
HomeView: {
GetStarted: 'Get Started',
@@ -228,24 +236,30 @@ export default {
colorboard: 'colorboard',
sketchboard: 'sketchboard',
mannequins: 'mannequins',
masnnequinHint: 'The mannequin you use is not matched with the current clothes, which will cause the generated model to not use the selected clothes',
masnnequinHint:
'The mannequin you use is not matched with the current clothes, which will cause the generated model to not use the selected clothes',
FinalizeCollection: 'complete series',
jsContent1: 'You must choose one or more colors for further process.',
jsContent2: 'You must choose one or more colors for further process.',
jsContent3: 'Failed to export the file',
jsContent4: 'Your subscription will expire in {days} days and {hours} hours. To ensure uninterrupted service, please click here to renew -> ',
jsContent4:
'Your subscription will expire in {days} days and {hours} hours. To ensure uninterrupted service, please click here to renew -> ',
jsContent8: 'Renew Subscription.',
jsContent7: 'Friendly Reminder',
jsContent5: "We're delighted to have you experience AiDA. Please be aware that some services may be limited during the trial period. If you're ready to fully dive in and enjoy the complete experience, we warmly invite you to subscribe. Just visit ",
jsContent5:
"We're delighted to have you experience AiDA. Please be aware that some services may be limited during the trial period. If you're ready to fully dive in and enjoy the complete experience, we warmly invite you to subscribe. Just visit ",
jsContent6: ' to get started. Thank you for trying our services!',
jsContent9: 'Are you sure to erase current collection and start over?',
jsContent10: "Re-created works are not allowed to use 'design', but you can use 'redesign'",
jsContent11: 'By unliking this, all connected posts will be deleted. Are you sure you want to continue?',
jsContent10:
"Re-created works are not allowed to use 'design', but you can use 'redesign'",
jsContent11:
'By unliking this, all connected posts will be deleted. Are you sure you want to continue?',
jsContent12: 'Are you sure about deleting the current brand DNA?'
},
ProductImg: {
productInput: 'Enter keyword(style,texture)',
relightInput: 'Using revised phrase(e.g. change...to...,replace...with...,add,remove)',
relightInput:
'Using revised phrase(e.g. change...to...,replace...with...,add,remove)',
Finalize: 'Finalize',
SelectCollection: 'Line Drawing',
SelectCollectionRelight: 'Product Image',
@@ -272,7 +286,8 @@ export default {
TopLight: 'Top Light',
BottomLight: 'Bottom Light',
Clear: 'Clear',
jsContent1: 'Your changes will be lost if you navigate away from this page. Are you sure you want to leave this page?',
jsContent1:
'Your changes will be lost if you navigate away from this page. Are you sure you want to leave this page?',
jsContent2: 'Please select at least one picture',
jsContent3: 'One of your images failed to generate. Please try again.',
Prompt: 'Prompt',
@@ -283,7 +298,7 @@ export default {
CopyFiled: 'Failed to copy',
noPrompt: 'Please enter prompt',
OriginalImage: 'Original Image',
EditGarmen: 'You can edit the Model',
EditGarmen: 'You can edit the Model',
EditGarmen2: 'You can edit the Scene',
Background: 'White Background',
BackgroundColor: 'Background with Pure Color',
@@ -310,18 +325,29 @@ export default {
ChangeBarInfo: 'Remove Garment',
ChangeGarden: 'In the garden, in the morning.',
ChangeGardenInfo: 'Add Accessories',
SingleGarment: 'Professional product photo: garment on invisible mannequin, no model visible. Preserve exact design - all patterns, colors, textures, details.', // 单品样衣
SingleChildMaleWithoutModel: 'Transform this image into a real garment showing in the white studio: garment on invisible mannequin.',
SingleChildMaleWithModel: 'Transform this image into a real child model stand and wear this garment, in the white studio, facing camera, standing posture.',
SingleChildFemaleWithoutModel: 'Transform this image into a real garment showing in the white studio: garment on invisible mannequin.',
SingleChildFemaleWithModel: 'Transform this image into a real child model stand and wear this garment, in the white studio, facing camera, standing posture.',
SingleAdultMaleWithoutModel: 'Transform this image into a real garment showing in the white studio: garment on invisible mannequin.',
SingleAdultMaleWithModel: 'Transform this image into a real model stand and wear this garment, in the white studio, facing camera, standing posture.',
SingleAdultFemaleWithoutModel: 'Transform this image into a real garment showing in the white studio: garment on invisible mannequin.',
SingleAdultFemaleWithModel: 'Transform this image into a real model stand and wear this garment, in the white studio, facing camera, standing posture.',
Series: 'In the white studio, facing camera, standing posture.',
UploadWithModel: 'Create realistic studio photo with real people model standing and wearing this garment, in white studio, Keep original model if present, or generate appropriate model, Standing pose, facing camera.', // 上传线稿,带模特
UploadWithoutModel: 'Transform this image into a real garment showing in the white studio: garment on invisible mannequin' // 上传线稿,不带模特
SingleGarment:
'Professional product photo: garment on invisible mannequin, no model visible. Preserve exact design - all patterns, colors, textures, details.', // 单品样衣
SingleChildMaleWithoutModel:
'Transform this image into a real garment showing in the white studio: garment on invisible mannequin.',
SingleChildMaleWithModel:
'Transform this image into a real child model stand and wear this garment, in the white studio, facing camera, standing posture.',
SingleChildFemaleWithoutModel:
'Transform this image into a real garment showing in the white studio: garment on invisible mannequin.',
SingleChildFemaleWithModel:
'Transform this image into a real child model stand and wear this garment, in the white studio, facing camera, standing posture.',
SingleAdultMaleWithoutModel:
'Transform this image into a real garment showing in the white studio: garment on invisible mannequin.',
SingleAdultMaleWithModel:
'Transform this image into a real model stand and wear this garment, in the white studio, facing camera, standing posture.',
SingleAdultFemaleWithoutModel:
'Transform this image into a real garment showing in the white studio: garment on invisible mannequin.',
SingleAdultFemaleWithModel:
'Transform this image into a real model stand and wear this garment, in the white studio, facing camera, standing posture.',
Series: 'In the white studio, facing camera, standing posture.',
UploadWithModel:
'Create realistic studio photo with real people model standing and wearing this garment, in white studio, Keep original model if present, or generate appropriate model, Standing pose, facing camera.', // 上传线稿,带模特
UploadWithoutModel:
'Transform this image into a real garment showing in the white studio: garment on invisible mannequin' // 上传线稿,不带模特
},
poseTransfer: {
SelectDesign: 'Product image',
@@ -346,7 +372,8 @@ export default {
firstAndLastFramePlaceholder1: 'Camera Movement',
firstAndLastFrameText2: ' to follow the motion, under',
firstAndLastFramePlaceholder2: 'Light',
firstAndLastFrameText3: ' , maintaining full consistency of model identity, styling, and outfit across all frames.',
firstAndLastFrameText3:
' , maintaining full consistency of model identity, styling, and outfit across all frames.',
firstFrameText1: 'Set the ',
firstFramePlaceholder1: 'Scene',
firstFrameText2: ', where the model ',
@@ -411,8 +438,10 @@ export default {
jsContent10: 'Save as New or Overwrite Current Mannequin?',
jsContent11: 'Are you sure about deleting the current brand DNA?',
jsContent12: 'Please deselect first, then try deleting again.',
jsContent13: 'You must select at least one model of the current gender, and no more than four.',
jsContent14: 'You must select a model whose gender is the same as that of the current project.'
jsContent13:
'You must select at least one model of the current gender, and no more than four.',
jsContent14:
'You must select a model whose gender is the same as that of the current project.'
},
HistoryPage: {
History: 'History',
@@ -452,11 +481,13 @@ export default {
Point: 'Point',
addPoint: 'Add points',
RemovePoint: 'Remove points',
mannequinHint: 'Please change the pure white inside the mannequin for another color to enhance your experience',
mannequinHint:
'Please change the pure white inside the mannequin for another color to enhance your experience',
SHOULDER: 'SHOULDER',
WAISTBAND: 'WAISTBAND',
HAND: 'HAND',
jsContent1: "You haven't marked the image yet, and the model will not be uploaded. Are you sure you want to close it?",
jsContent1:
"You haven't marked the image yet, and the model will not be uploaded. Are you sure you want to close it?",
jsContent2: 'This picture has been uploaded whether to continue uploading？'
},
ModelPlacementMobile: {
@@ -469,11 +500,13 @@ export default {
Library: 'Library',
Point: 'Point',
RemovePoint: 'Remove Point',
mannequinHint: 'Please change the pure white inside the mannequin for another color to enhance your experience',
mannequinHint:
'Please change the pure white inside the mannequin for another color to enhance your experience',
SHOULDER: 'SHOULDER',
WAISTBAND: 'WAISTBAND',
HAND: 'HAND',
jsContent1: "You haven't marked the image yet, and the model will not be uploaded. Are you sure you want to close it?",
jsContent1:
"You haven't marked the image yet, and the model will not be uploaded. Are you sure you want to close it?",
jsContent2: 'This picture has been uploaded whether to continue uploading？'
},
Upload: {
@@ -522,8 +555,10 @@ export default {
GeneratePrint: 'Pattern',
maximumLength: 'The entered content exceeds the maximum length.',
PatternTitle: 'Generates repeatable designs that can be fully tiled across garments.',
LogoTitle: 'Creates standalone graphic designs that can be placed individually or tiled.',
SloganTitle: 'Produces artistic typography for text, suitable for various slogans or phrases.',
LogoTitle:
'Creates standalone graphic designs that can be placed individually or tiled.',
SloganTitle:
'Produces artistic typography for text, suitable for various slogans or phrases.',
jsContent1: 'You can only upload Image file!',
jsContent2: 'Image must smaller than 5MB!',
jsContent3: 'Maximum number of allowable file uploads has been exceeded',
@@ -617,8 +652,10 @@ export default {
currently: 'You are currently in the {generateLineUp} th position in the queue',
Merge: 'Merge',
maximumLength: 'The entered content exceeds the maximum length.',
effectPoor: 'The quality of the generated images currently falls below standard. Please consider adjusting your prompt and trying again.',
everyTimeEffectPoor: 'One generated image falls below quality thresholds. Modify your text prompt and regenerate.',
effectPoor:
'The quality of the generated images currently falls below standard. Please consider adjusting your prompt and trying again.',
everyTimeEffectPoor:
'One generated image falls below quality thresholds. Modify your text prompt and regenerate.',
Model: 'Model',
uploadTitle: 'Upload reference image',
uploadproduct: 'Upload product picture',
@@ -634,7 +671,8 @@ export default {
GoldSunflower: 'Golden Sunflower',
EmrldJungle: 'Emerald Jungle Canopy',
PinkSakura: 'Pink Sakura Blossom',
generateLoading: 'Please wait while we extract text from your images. This will just take a moment.',
generateLoading:
'Please wait while we extract text from your images. This will just take a moment.',
jsContent1: 'You can only upload Image file!',
jsContent2: 'Image must smaller than 5MB!',
jsContent3: 'Please enter content',
@@ -645,7 +683,8 @@ export default {
jsContent8: 'You have {num} remaining opportunity to generate {str}.',
jsContent9: 'You have exhausted your generation opportunities {str}.',
jsContent10: 'Please complete the slogan picture',
jsContent11: 'See the input content may overlap, overlap will affect the final effect oh',
jsContent11:
'See the input content may overlap, overlap will affect the final effect oh',
jsContent12: 'Complete at least one slogan'
},
collectionModal: {
@@ -659,11 +698,14 @@ export default {
PrinCollection: 'select printboard for your collection',
ColorCollection: 'select colors for your collection',
SketchCollection: 'select sketchboard for your collection',
jsContent1: "Since you have selected multiple images, please click 'Layout' to proceed.",
jsContent1:
"Since you have selected multiple images, please click 'Layout' to proceed.",
jsContent2: 'The uploaded files will not be saved, being sure to continue? ',
jsContent3: 'You must choose one or more colors for further process.',
jsContent5: "We've detected that the number of pins on your ({str}) exceeds eight, which may result in some pinned items not being used. Would you like to continue anyway?",
jsContent6: 'The content on the canvas has not been saved. Please click "Preview" to continue.',
jsContent5:
"We've detected that the number of pins on your ({str}) exceeds eight, which may result in some pinned items not being used. Would you like to continue anyway?",
jsContent6:
'The content on the canvas has not been saved. Please click "Preview" to continue.',
jsContent7: 'Please select at least one model.'
},
DesignDetail: {
@@ -755,7 +797,8 @@ export default {
available: 'This feature is not available to trial users',
src: 'This function is not open to trial users, if you need to subscribe, please visit ',
userName: 'Trial User',
loginIsTest: "You are a trial user, Probation period until{date}. For the security of users' data, we do not save any personal data uploaded by trial users, and will erase personal data after each logout. if you need to subscribe, please click ->",
loginIsTest:
"You are a trial user, Probation period until{date}. For the security of users' data, we do not save any personal data uploaded by trial users, and will erase personal data after each logout. if you need to subscribe, please click ->",
image: 'Because you are a trial user, you can only upload 10 images'
},
setLabel: {
@@ -782,7 +825,8 @@ export default {
UpdatePublish: 'Update Publish',
jsContent1: 'Are you sure to leave this page? Your changes are not saved. ',
jsContent2: 'Please enter the name of your work',
jsContent3: 'This will publish your work to the square for all users to see. Please confirm whether to publish?',
jsContent3:
'This will publish your work to the square for all users to see. Please confirm whether to publish?',
jsContent4: 'Release success! You can find it in my work'
},
newScaleImage: {
@@ -916,7 +960,8 @@ export default {
Yearly: 'Yearly',
promotionCode: 'Coupon',
use: 'Apply',
PromoCodeError: 'Please check if the promo code is correct or if the date has expired',
PromoCodeError:
'Please check if the promo code is correct or if the date has expired',
CreditCard: 'Credit Card',
Alipay: 'Alipay',
Payment: 'Payment method',
@@ -958,26 +1003,34 @@ export default {
subscriptionRenewal: 'There are no subscription plans with automatic renewal.'
},
guide: {
guide1: "You can personalize your design settings right here in the <strong>Workspace</strong>, including choosing to design for men's or women's wear, as well as selecting the mannequin to use for your creations.",
guide1:
"You can personalize your design settings right here in the <strong>Workspace</strong>, including choosing to design for men's or women's wear, as well as selecting the mannequin to use for your creations.",
guide2: "Select the apparel type you'd like to work on.",
guide3: 'Change the mannequin here.',
guide4: 'You can currently select a mannequin from our system library. Later, you can also choose from the user library after registering your own mannequin.',
guide4:
'You can currently select a mannequin from our system library. Later, you can also choose from the user library after registering your own mannequin.',
guide5: 'Begin your creative journey here. ',
guide6: 'For the Moodboard, Printboard, or Sketchboard, we provide three different sourcing methods to add images. The first option is <strong>Upload</strong>, allowing you to <stront>upload</stront> directly from your local device.',
guide7: "The second method is to select from your <strong>Library</strong>. <br> You might notice that your library page is currently empty; there's no need to worry. All the images you upload will be automatically added to your library. In the future, you won't have to upload each time—you can simply choose from your library instead.",
guide8: 'The third method is to <strong>Generate</strong> images using the latest Image Generation technology.',
guide9: 'Enter keywords that capture the mood you wish to express and then click the <strong>Low Quality</strong> button.',
guide6:
'For the Moodboard, Printboard, or Sketchboard, we provide three different sourcing methods to add images. The first option is <strong>Upload</strong>, allowing you to <stront>upload</stront> directly from your local device.',
guide7:
"The second method is to select from your <strong>Library</strong>. <br> You might notice that your library page is currently empty; there's no need to worry. All the images you upload will be automatically added to your library. In the future, you won't have to upload each time—you can simply choose from your library instead.",
guide8:
'The third method is to <strong>Generate</strong> images using the latest Image Generation technology.',
guide9:
'Enter keywords that capture the mood you wish to express and then click the <strong>Low Quality</strong> button.',
guide10: 'Select two images for your moodboard.',
guide11: 'Click here to layout your moodboard.',
guide12: 'Click here for next step.',
guide13: 'Click here to generate print images.',
// guide14:"We provide three input options for generating images: Image Only, Text Only, and Text-Image.",
// guide15:"Select this option and we will generate four print images using both the picture you upload and the text you enter.",
guide16: 'Choose a generation model here; different models will generate images in various styles.',
guide16:
'Choose a generation model here; different models will generate images in various styles.',
// guide17:"Choose a generation model here; different models will generate images in various styles.",
guide18: 'Upload the input picture here.',
// guide19:"Click on this image to select it.",
guide20: 'Enter keywords about the print you wish to create and then click the <strong>Generate</strong> button.',
guide20:
'Enter keywords about the print you wish to create and then click the <strong>Generate</strong> button.',
guide21: 'Select the generated prints you like best.',
guide22: 'Click here for next step.',
guide23: 'Click here to extract primary colors from image.',
@@ -987,7 +1040,8 @@ export default {
guide27: 'Click here for next step.',
guide28: 'Click here to generate clothing sketches.',
// guide29:"Using text only option for generation.",
guide30: 'Enter keywords about the sketch you wish to create and then click the <strong>Generate</strong> button.',
guide30:
'Enter keywords about the sketch you wish to create and then click the <strong>Generate</strong> button.',
guide31: 'Click here to choose a category for the generated sketch.',
guide32: 'Choose correct category for the sketch.',
guide33: 'Select the generated sketches you like best.',
@@ -995,7 +1049,8 @@ export default {
guide35: 'Click here to let AI generate design illustrations.',
guide36: 'Please wait a few seconds.',
guide37: 'Click the little red heart to save your favorite design.',
guide38: "Click '<strong>Redesign</strong>' to generate eight new outfits for your collection to choose from.",
guide38:
"Click '<strong>Redesign</strong>' to generate eight new outfits for your collection to choose from.",
guide39: 'Click here to let AI generate design illustrations.',
guide40: 'Click on any design image you are interested in to modify the details.',
guide41: 'Click on the clothes to modify its details.',
@@ -1007,7 +1062,8 @@ export default {
guide47: 'Save printed design here.',
guide48: 'Click here to finalize your modification.',
guide49: 'Click here to access the finalize page.',
guide51: 'This interface allows you to transform design results into product images. You can achieve your desired effect by adjusting the text and similarity. Click this product image to proceed to the next step.',
guide51:
'This interface allows you to transform design results into product images. You can achieve your desired effect by adjusting the text and similarity. Click this product image to proceed to the next step.',
guide52: 'Click here to generate the product image.',
guide53: 'Click this button to apply more tools to the product image. ',
guide54: 'We can adjust the lighting and background of this image. ',
@@ -1015,7 +1071,8 @@ export default {
guide56: 'If you like this result, click the little heart to save it.',
guide57: 'Click here to go to the export page. ',
guide58: 'You can share your work to the gallery or export to your local device.',
guide50: "Your guide is complete, and now the canvas is yours to create freely. For more insights and details, check out our demo video on the homepage at <a href='https://code-create.com.hk/aida/' style='pointer-events: auto;' target='_blank'>https://code-create.com.hk/aida/</a><br>You can restart the tutorial at any time by simply telling the robot that you want to."
guide50:
"Your guide is complete, and now the canvas is yours to create freely. For more insights and details, check out our demo video on the homepage at <a href='https://code-create.com.hk/aida/' style='pointer-events: auto;' target='_blank'>https://code-create.com.hk/aida/</a><br>You can restart the tutorial at any time by simply telling the robot that you want to."
},
createSlogan: {
title: 'Create Slogan',
@@ -1037,13 +1094,16 @@ export default {
Setting: 'Manual Mode',
SeriesDesign: 'Overall Illustration Design',
series: 'Series Design',
SeriesDesignInfo: 'Series Design focuses on the coordinated design of multi-category clothing, ideal for creating a unified fashion collection. Gather and arrange your inspiration using the Moodboard, Printboard, Colorboard, Sketchboard, and Mannequin tools in the Design Assets panel to build harmonious outfit combinations. Refine your creations in the Draft and Collection panels using powerful tools like To Product Image, Relight, and Transfer Pose. When you’re ready, export everything to the Canvas to display your complete series design.',
SeriesDesignInfo:
'Series Design focuses on the coordinated design of multi-category clothing, ideal for creating a unified fashion collection. Gather and arrange your inspiration using the Moodboard, Printboard, Colorboard, Sketchboard, and Mannequin tools in the Design Assets panel to build harmonious outfit combinations. Refine your creations in the Draft and Collection panels using powerful tools like To Product Image, Relight, and Transfer Pose. When you’re ready, export everything to the Canvas to display your complete series design.',
SingleDesign: 'Single item design',
single: 'Single Design',
DeepThinking: 'Deep Thinking',
SingleDesignInfo: 'Single Design focuses on creating an individual clothing item, such as a T-shirt, dress, or jacket, without coordinating it with other pieces. Use the Moodboard, Printboard, Colorboard, and Sketchboard sections in the Design Assets panel to gather inspiration and develop a unique design. Once finished, refine your work in the Draft and Collection panels using tools like To Product Image, Relight, and Transfer Pose, then export to the Canvas to showcase your standalone creation. ',
SingleDesignInfo:
'Single Design focuses on creating an individual clothing item, such as a T-shirt, dress, or jacket, without coordinating it with other pieces. Use the Moodboard, Printboard, Colorboard, and Sketchboard sections in the Design Assets panel to gather inspiration and develop a unique design. Once finished, refine your work in the Draft and Collection panels using tools like To Product Image, Relight, and Transfer Pose, then export to the Canvas to showcase your standalone creation. ',
selectDesignType: 'Please select the design type',
hintListSERIES1: 'Design a collection of futuristic clothes, deep purple color scheme.',
hintListSERIES1:
'Design a collection of futuristic clothes, deep purple color scheme.',
hintListSERIES2: 'Design a set of bright-colored, Bohemian-style dresses.',
hintListSERIES3: 'Design a set of hip-hop street style denim jackets for boys.',
hintListSIGNLE1: 'A silver-gray, steampunk-style windbreaker.',
@@ -1104,7 +1164,8 @@ export default {
Delete: 'Delete',
Finish: 'We have calculated your preferred style.',
LastCompletionTime: 'Last completion time',
textarea: 'Please enter your thoughts about this brand, and we will help you generate the name, logo, and slogan.'
textarea:
'Please enter your thoughts about this brand, and we will help you generate the name, logo, and slogan.'
},
chat: {
DeepThinking: 'Deep Thinking',
@@ -1250,11 +1311,13 @@ export default {
SpecialEffectsBrush: 'Special Effects Brush',
PencilSettings: 'Pencil Settings',
ParticleSeparationDegree: 'Particle separation degree',
ParticleSeparationDegreeDescription: 'Control the degree of separation of the crayon particles',
ParticleSeparationDegreeDescription:
'Control the degree of separation of the crayon particles',
TheAmountOfInk: 'The Amount Of Ink',
TheAmountOfInkDescription: 'Control the amount of pigment in the crayons',
randomness: 'Randomness',
randomnessDescription: 'Controlling the degree of randomness in the texture of the crayon',
randomnessDescription:
'Controlling the degree of randomness in the texture of the crayon',
TextureType: 'Texture Type',
TextureTypeDescription: 'Set the texture type of the crayons',
Default: 'Default',
@@ -1389,28 +1452,36 @@ export default {
back: 'Back',
confirm: 'Confirm',
RasterizedLayer: 'Rasterized Layer',
rasterizeImmediately: 'You need to rasterize first before performing the distortion operation. Do you want to rasterize immediately?',
rasterizeImmediately:
'You need to rasterize first before performing the distortion operation. Do you want to rasterize immediately?',
ConfirmRasterization: 'Confirm Rasterization',
beingRasterized: 'Currently, it is being rasterized.',
waitRasterizing: 'Rasterizing the layer. Please wait...',
successRasterizing: 'The layer has been successfully rasterized and can now undergo the distortion operation.',
successRasterizing:
'The layer has been successfully rasterized and can now undergo the distortion operation.',
gridingFailed: 'Griding Failed',
gridingFailedNoOperation: 'Griding failed. Unable to perform the liquefaction operation.',
gridingFailedNoOperation:
'Griding failed. Unable to perform the liquefaction operation.',
gridingError: 'Griding Error',
LayerError: 'Layer Error',
LayerDoesNotExist: 'The layer does not exist.',
backgroundEmpty: 'The background layer is empty.',
backgroundEmptyNoLiquidation: 'The background layer is empty, so the liquidation operation cannot be performed.',
backgroundEmptyNoLiquidation:
'The background layer is empty, so the liquidation operation cannot be performed.',
layerEmpty: 'The layer is empty.',
layerEmptyNoLiquidation: 'The layer is empty and cannot perform the liquefaction operation.',
layerEmptyNoLiquidation:
'The layer is empty and cannot perform the liquefaction operation.',
liqueficationManagerError: 'Liquefication Manager Error',
liqueficationManagerErrorInitialized: 'The liquefaction manager has not been initialized.',
liqueficationManagerErrorInitialized:
'The liquefaction manager has not been initialized.',
liquefactionEnvironment: 'Prepare for the liquefaction environment',
liquefactionEnvironmentLoading: 'The liquefaction environment is being prepared. Please wait a moment...',
liquefactionEnvironmentLoading:
'The liquefaction environment is being prepared. Please wait a moment...',
LiqueficationFailed: 'Liquefication tool failed to start.',
TextLayer: 'Text Layer',
DoubleClickText: 'Double-click to edit the text',
LiquidationError: 'No valid image selected or the layer does not fit the liquefaction operation.',
LiquidationError:
'No valid image selected or the layer does not fit the liquefaction operation.',
ErrorMessage: 'Error Message',
preset: 'Preset',
presetNamePrompt: 'Please enter the preset name:',
@@ -1503,5 +1574,114 @@ export default {
ChatRobot: 'ChatRobot',
Yes: 'Yes',
No: 'No'
},
Login: {
Login: 'Login',
SignUp: 'Sign Up',
ForgotPassword: '忘记密码',
Welcome: 'Welcome to',
AiDA: 'AiDA',
Slogan:
'AiDA, a first-to-market technology that empowers fashion designers, based on their creative inspirations, to work with AI to create original designs.',
LoginMethod: 'Continue with one of these:',
Individual: 'Individual',
Academic: 'Academic',
LogonToAiDA: 'Log on to AiDA 3.1',
Infomation: 'Please fill your information below',
Device: 'If you need to design, please log in using an iPad or computer.',
AgreePolicies: 'Please agree to all terms, privacy policy, and fees.',
PasswordConditions: 'You must satisfy ALL password conditions to register.'
},
LoginPersonal: {
Email: 'Email',
Password: 'Password',
EnterEmail: 'Enter your email address',
EnterPassword: 'Enter your password',
EnterCode: 'Enter Code',
Resend: 'Resend',
SentCodeToEmail: "We've sent an code to your email",
ForgotPassword: 'Forgot your password',
AgreeTo: 'I agree to the',
Terms: 'Terms',
PrivacyPolicy: 'Privacy Policy',
AndFees: 'and Fees.',
SignIn: 'Sign in',
CreateNewAccount: 'Create New Account',
Or: 'or',
RetrievePassword: 'Retrieve password',
NextStep: 'Next step',
VerificationCode: 'Verification Code',
SentTo: 'Sent to',
Submit: 'Submit',
AtLeast8Chars: 'At least 8 characters long',
MustContainSpecial: 'Must contain special characters',
MixUpperLowerNumbers: 'Mix of uppercase, lowercase and numbers',
EnterNewPassword: 'Enter a new password',
NeedEmail: 'Please enter your email address',
IncorrectEmail: 'The email format is incorrect',
IncorrectEmailFormat: 'The email format is incorrect',
CompleteVerificationCode: 'Please enter the complete verification code.',
PleaseEnterYourAccountNumberOrPassword: 'Please enter your account number or password'
},
LoginSchool: {
School: 'School',
SelectSchool: 'Select a school',
Email: 'Email',
Password: 'Password',
EnterEmail: 'Enter your email address',
EnterPassword: 'Enter your password',
EnterCode: 'Enter Code',
Resend: 'Resend',
SentCodeToEmail: "We've sent an code to your email",
ForgotPassword: 'Forgot your password',
AgreeTo: 'I agree to the',
Terms: 'Terms',
PrivacyPolicy: 'Privacy Policy',
AndFees: 'and Fees.',
SignIn: 'Sign in',
RetrievePassword: 'Retrieve password',
NextStep: 'Next step',
VerificationCode: 'Verification Code',
SentTo: 'Sent to',
Submit: 'Submit',
AtLeast8Chars: 'At least 8 characters long',
MustContainSpecial: 'Must contain special characters',
MixUpperLowerNumbers: 'Mix of uppercase, lowercase and numbers',
EnterNewPassword: 'Enter a new password',
NeedEmail: 'Please enter your email address',
IncorrectEmail: 'The email format is incorrect',
IncorrectEmailFormat: 'The email format is incorrect',
CompleteVerificationCode: 'Please enter the complete verification code.',
PleaseEnterYourAccountNumberOrPassword: 'Please enter your account number or password'
},
LoginEnterprise: {
Enterprise: 'Enterprise',
SelectEnterprise: 'Select an enterprise',
Email: 'Email',
Password: 'Password',
EnterEmail: 'Enter your email address',
EnterPassword: 'Enter your password',
EnterCode: 'Enter Code',
Resend: 'Resend',
SentCodeToEmail: "We've sent an code to your email",
AgreeTo: 'I agree to the',
Terms: 'Terms',
PrivacyPolicy: 'Privacy Policy',
AndFees: 'and Fees.',
SignIn: 'Sign in',
RetrievePassword: 'Retrieve password',
NextStep: 'Next step',
VerificationCode: 'Verification Code',
SentTo: 'Sent to',
Submit: 'Submit',
AtLeast8Chars: 'At least 8 characters long',
MustContainSpecial: 'Must contain special characters',
MixUpperLowerNumbers: 'Mix of uppercase, lowercase and numbers',
EnterNewPassword: 'Enter a new password',
NeedEmail: 'Please enter your email address',
IncorrectEmail: 'The email format is incorrect',
IncorrectEmailFormat: 'The email format is incorrect',
CompleteVerificationCode: 'Please enter the complete verification code.',
PleaseEnterYourAccountNumberOrPassword: 'Please enter your account number or password'
}
}

336
src/views/HomeRecommend.vue
View File

@@ -1,166 +1,195 @@
<template>
<div class="homeRecommend_max">
<div class="header">
<img
<img
class="homeRecommend_logo"
@click="turnToNewPage('/')"
src="@/assets/images/homePage/aidaIcon.png"
/>
<div class="gallery_btn login white" @click="setLogin">{{ t('Login.Login') }}</div>
<div class="gallery_btn" @click="signUp">{{ t('Login.SignUp') }}</div>
<div class="language_btn">
<div @click="handleChangeLanguage">
<i class="fi fi-rr-globe"></i>
{{ isChinese ? 'CN' : 'EN' }}
</div>
</div>
<div class="gallery_btn login white" @click="setLogin">{{ t('Login.Login') }}</div>
<div class="gallery_btn" @click="signUp">{{ t('Login.SignUp') }}</div>
</div>
<div class="content">
<img class="bg pc" src="@/assets/images/homePage/squareBg.png" alt="">
<img class="bg mobile" src="@/assets/images/homePage/squareBgMobile.png" alt="">
<div class="beForm">Developed by AiDLab<br />
Commercialized by Code-Create</div>
<div class="title">
<img src="@/assets/images/homePage/recommendtitleMobile.png" alt="">
<div class="text">
AI-based Interactive Design <br />Assistant for Fashion
</div>
</div>
<div class="learnMore">
<img src="@/assets/images/homePage/learnMore.png" alt="">
<!-- <div class="title">AiDA</div>
<div class="content">
<img class="bg pc" src="@/assets/images/homePage/squareBg.png" alt="" />
<img class="bg mobile" src="@/assets/images/homePage/squareBgMobile.png" alt="" />
<div class="beForm">
Developed by AiDLab
<br />
Commercialized by Code-Create
</div>
<div class="title">
<img src="@/assets/images/homePage/recommendtitleMobile.png" alt="" />
<div class="text">
AI-based Interactive Design
<br />
Assistant for Fashion
</div>
</div>
<div class="learnMore">
<img src="@/assets/images/homePage/learnMore.png" alt="" />
<!-- <div class="title">AiDA</div>
<div class="info">
AI-based Interactive Design Assistant for Fashion
</div> -->
<!-- <div class="btn gallery_btn" @click="goLearnMore">Learn More</div> -->
</div>
</div>
<!-- <div class="btn gallery_btn" @click="goLearnMore">Learn More</div> -->
</div>
</div>
</div>
</template>
<script >
import { defineComponent, toRefs, reactive, ref , nextTick,computed, onMounted, onBeforeUnmount } from "vue";
import { isEmail } from "@/tool/util";
import { setCookie, getCookie, WriteCookie,clonAllCookie } from "@/tool/cookie";
import { Https } from "@/tool/https";
import { Modal, message } from "ant-design-vue";
import { ExclamationCircleOutlined } from "@ant-design/icons-vue";
import { useStore } from "vuex";
import { setLang } from "@/tool/guide";
import { useI18n } from "vue-i18n";
import { useRouter } from 'vue-router';
import { gsap, TweenMax } from "gsap";
import { ScrollTrigger } from "gsap/ScrollTrigger";
<script>
import {
defineComponent,
toRefs,
reactive,
ref,
nextTick,
computed,
onMounted,
onBeforeUnmount
} from 'vue'
import { isEmail } from '@/tool/util'
import { setCookie, getCookie, WriteCookie, clonAllCookie } from '@/tool/cookie'
import { Https } from '@/tool/https'
import { Modal, message } from 'ant-design-vue'
import { ExclamationCircleOutlined } from '@ant-design/icons-vue'
import { useStore } from 'vuex'
import { setLang } from '@/tool/guide'
import { useI18n } from 'vue-i18n'
import { useRouter } from 'vue-router'
import { gsap, TweenMax } from 'gsap'
import { ScrollTrigger } from 'gsap/ScrollTrigger'
export default defineComponent({
components: {
},
setup(){
const store = useStore();
const router = useRouter();
let registerModel = ref()
let data = reactive({
})
let userDetail = computed(()=>{
return store.state.UserHabit.userDetail
})
let setLogin = ()=>{
router.push("/login");
}
let logout = ()=>{
let userInfo = store.state.UserHabit.userDetail;
let data = {
userId: userInfo?.userId,
};
store.commit('createDetail')
store.commit('createProbject')
if(!data.userId) return
Https.axiosPost(Https.httpUrls.accountLogout, data).then((rv) => {
clonAllCookie();
});
}
let goHome = ()=>{
router.push('/home');
}
let time
let updataIsMoblie = ()=>{
clearTimeout(time)
time = setTimeout(()=>{
},500)
}
const signUp = ()=>{
router.push('/register');
}
const goLearnMore = ()=>{
window.open('https://www.aida.com.hk/Square/works', '_blank');
}
onMounted(()=>{
window.addEventListener('resize',updataIsMoblie)
})
onBeforeUnmount(() => {
window.removeEventListener('resize', updataIsMoblie);
});
return {
...toRefs(data),
userDetail,
setLogin,
registerModel,
logout,
goHome,
signUp,
goLearnMore,
}
},
data() {
return {
};
},
watch: {
// credits.value(newVal,oldVal){
// console.log(String(newVal).length);
// }
},
mounted() {
// nextTick().then(()=>{
// let dom = document.querySelector('.homeRecommend_content_body')
// let codeTween = document.querySelectorAll('.homeRecommend_content_body_recommend .content_body_img')
// let codeTweenText = document.querySelectorAll('.homeRecommend_content_body_recommend .content_body_text')
// for (let index = 0; index < codeTween.length; index++) {
// gsap.from(codeTween[index],.5, {scale:.6 },);
// gsap.registerPlugin(ScrollTrigger);
// let tl1 = gsap.timeline();
// tl1.to(codeTween[index],1, {y:'-30px',opacity:0},)
// ScrollTrigger.create({
// trigger: codeTween[index], // 触发器元素
// start: "top 0%", // 滚动触发器的起始滚动位置
// end: '200% 20%', // 滚动触发器的结束滚动位置
// // markers: true, // 开启标注功能
// scrub: true,
// animation:tl1,
// scroller:dom,//设置指定元素为滚动依据
// scrub:2,
// });
// }
// gsap.registerPlugin(ScrollTrigger);
// let tl1 = gsap.timeline();
// tl1.from(codeTweenText,1, {'margin-top':'30px',opacity:1},)
// ScrollTrigger.create({
// trigger: codeTweenText, // 触发器元素
// start: "top 0%", // 滚动触发器的起始滚动位置
// end: '200% 20%', // 滚动触发器的结束滚动位置
// // markers: true, // 开启标注功能
// scrub: true,
// animation:tl1,
// scroller:dom,//设置指定元素为滚动依据
// scrub:2,
// });
// })
},
methods: {
turnToWindow(url) {
window.open(url);
},
},
});
components: {},
setup() {
const {t, locale} = useI18n()
const store = useStore()
const router = useRouter()
let registerModel = ref()
let data = reactive({})
const isChinese = ref(false)
const handleChangeLanguage = () => {
isChinese.value = !isChinese.value
const lang = isChinese.value ? 'CHINESE_SIMPLIFIED' : 'ENGLISH'
localStorage.setItem('loginLanguage', lang)
locale.value = lang
}
let userDetail = computed(() => {
return store.state.UserHabit.userDetail
})
let setLogin = () => {
router.push('/login')
}
let logout = () => {
let userInfo = store.state.UserHabit.userDetail
let data = {
userId: userInfo?.userId
}
store.commit('createDetail')
store.commit('createProbject')
if (!data.userId) return
Https.axiosPost(Https.httpUrls.accountLogout, data).then(rv => {
clonAllCookie()
})
}
let goHome = () => {
router.push('/home')
}
let time
let updataIsMoblie = () => {
clearTimeout(time)
time = setTimeout(() => {}, 500)
}
const signUp = () => {
router.push('/register')
}
const goLearnMore = () => {
window.open('https://www.aida.com.hk/Square/works', '_blank')
}
onMounted(() => {
window.addEventListener('resize', updataIsMoblie)
// 初始化语言设置
const savedLang = localStorage.getItem('loginLanguage')
if (savedLang) {
isChinese.value = savedLang === 'CHINESE_SIMPLIFIED'
locale.value = savedLang
}
})
onBeforeUnmount(() => {
window.removeEventListener('resize', updataIsMoblie)
})
return {
...toRefs(data),
userDetail,
setLogin,
registerModel,
logout,
goHome,
signUp,
goLearnMore,
isChinese,
handleChangeLanguage,
t
}
},
data() {
return {}
},
watch: {
// credits.value(newVal,oldVal){
// console.log(String(newVal).length);
// }
},
mounted() {
// nextTick().then(()=>{
// let dom = document.querySelector('.homeRecommend_content_body')
// let codeTween = document.querySelectorAll('.homeRecommend_content_body_recommend .content_body_img')
// let codeTweenText = document.querySelectorAll('.homeRecommend_content_body_recommend .content_body_text')
// for (let index = 0; index < codeTween.length; index++) {
// gsap.from(codeTween[index],.5, {scale:.6 },);
// gsap.registerPlugin(ScrollTrigger);
// let tl1 = gsap.timeline();
// tl1.to(codeTween[index],1, {y:'-30px',opacity:0},)
// ScrollTrigger.create({
// trigger: codeTween[index], // 触发器元素
// start: "top 0%", // 滚动触发器的起始滚动位置
// end: '200% 20%', // 滚动触发器的结束滚动位置
// // markers: true, // 开启标注功能
// scrub: true,
// animation:tl1,
// scroller:dom,//设置指定元素为滚动依据
// scrub:2,
// });
// }
// gsap.registerPlugin(ScrollTrigger);
// let tl1 = gsap.timeline();
// tl1.from(codeTweenText,1, {'margin-top':'30px',opacity:1},)
// ScrollTrigger.create({
// trigger: codeTweenText, // 触发器元素
// start: "top 0%", // 滚动触发器的起始滚动位置
// end: '200% 20%', // 滚动触发器的结束滚动位置
// // markers: true, // 开启标注功能
// scrub: true,
// animation:tl1,
// scroller:dom,//设置指定元素为滚动依据
// scrub:2,
// });
// })
},
methods: {
turnToWindow(url) {
window.open(url)
}
}
})
</script>
<style lang="less" scoped>
@@ -183,7 +212,7 @@ export default defineComponent({
right: 0;
@media (max-width: 768px) {
position: relative;
justify-content: flex-end;
justify-content: space-between;
width: 100%;
padding: 0.7rem 1.4rem;
margin-left: auto;
@@ -194,32 +223,11 @@ export default defineComponent({
@media (max-width: 768px) {
display: block;
height: 2.5rem;
margin-right: auto;
}
}
.language_btn {
color: #fff;
cursor: pointer;
font-size: 2.5rem;
>div {
display: flex;
>i{
display: flex;
align-items: center;
font-size: 2.5rem;
margin-right: .7rem;
}
}
@media (max-width: 768px) {
font-size: 1.5rem;
color: #000;
>div {
>i{
font-size: 1.5rem;
margin-right: .7rem;
}
}
}
}
> .gallery_btn {
// margin-right: 2rem;

33
src/views/Login.vue
View File

@@ -15,21 +15,21 @@
<div class="Text" v-show="!loginType">
<img src="@/assets/images/homePage/aidaIcon.png" alt="">
<div class="title">
<p>Welcome to <span>AiDA</span></p>
<p>{{ t('Login.Welcome') }} <span>{{ t('Login.AiDA') }}</span></p>
</div>
<div class="info">
AiDA, a first-to-market technology that empowers fashion designers, based on their creative inspirations, to work with AI to create original designs.
{{ t('Login.Slogan') }}
</div>
</div>
<div class="loginBox" :class="{'active':loginType}">
<div class="selectType" v-show="!loginType">
<div class="text">Continue with one of these:</div>
<div class="text">{{ t('Login.LoginMethod') }}</div>
<div class="typeList">
<div class="gallery_btn" @click="setLoginType('personal')">
Individual
{{ t('Login.Individual') }}
</div>
<div class="gallery_btn" @click="setLoginType('school')">
Academic
{{ t('Login.Academic') }}
</div>
<!-- <div class="gallery_btn" @click="setLoginType('enterprise')">
Enterprise
@@ -40,9 +40,9 @@
<div class="title">
<i class="fi fi-br-angle-left" @click="loginBack"></i>
<!-- <i class="fi fi-rr-arrow-left" @click="()=>loginType = ''"></i> -->
<span>Log on to AiDA 3.1</span>
<span>{{ t('Login.LogonToAiDA') }}</span>
</div>
<div class="info" v-show="!loginType">Please fill your information below</div>
<div class="info" v-show="!loginType">{{ t('Login.Infomation') }}</div>
<personal ref="personal" v-if="loginType == 'personal'" v-model:isMask="isMask"></personal>
<school ref="school" v-if="loginType == 'school'"></school>
<enterprise ref="enterprise" v-if="loginType == 'enterprise'"></enterprise>
@@ -90,9 +90,17 @@ export default defineComponent({
props: {},
emits: [],
setup(props, { emit }) {
const {t,locale} = useI18n()
const store = useStore();
const router = useRouter()
const route = useRoute()
// 通过 provide 传递 i18n 给子组件
provide('i18n', {
t,
locale
})
const loginData = reactive({
loginType: "",
isMask: false,
@@ -137,7 +145,7 @@ export default defineComponent({
store.commit("upUserDetail", userid);
if (window.innerWidth < 768) {
message.info(
"If you need to design, please log in using an iPad or computer."
t('Login.Device')
);
turnToHomePage("/Square");
} else {
@@ -174,6 +182,10 @@ export default defineComponent({
if (data?.state == "weiXin") {
wechatLogin(data);
}
const savedLang = localStorage.getItem('loginLanguage')
if (savedLang) {
locale.value = savedLang
}
})
return {
...toRefs(dataDom),
@@ -181,11 +193,10 @@ export default defineComponent({
setLoginType,
loginBack,
toBack,
t,
locale
};
},
provide() {
return {};
},
});
</script>
<style lang="less" scoped>