added translations

This commit is contained in:
Komek Hayytnazarov 2022-10-01 11:07:42 +05:00
parent 7eed5d8d60
commit 6be8785cd1
10 changed files with 144 additions and 225 deletions

View File

@ -79,8 +79,3 @@ async function handleResponse(response) {
return data;
}
// {
// }

View File

@ -54,6 +54,7 @@ export const locale = {
SURNAME: "Surname",
NAME: "Name",
COMP_NAME: "Company name",
SHORT_NAME: "Short Name",
DOB: "Date of Birth",
POB: "Place of Birth",
@ -93,4 +94,18 @@ export const locale = {
REGISTER: "Register",
EDIT: "Edit",
LOGIN: "Login",
FORGOT_PASSWORD: "Forgot Password ?",
TERMS_AND_CONDITIONS: "Terms and Conditions",
PRIVACY_LEGACY: "Privacy Legacy",
BY_SIGN_UP: "By signing up, you agree to our",
SIGN_IN_MOTIVATION: "A few more clicks to",
SING_IN_MOTIVATION_RIGHT: "sign in to your account.",
SING_IN_MOTIVATION_MOBILE:
" A few more clicks to sign in to your account. Manage all your e-commerce accounts in one place",
MANAGE_DOCS: "Manage all your documents in one place",
UPDATE: "Update",
UPDATE_PWD: "Update password",
};

View File

@ -30,7 +30,7 @@ export const locale = {
ENTER_FIRSTNAME: "Enter firstname",
LASTNAME: "Last Name",
ENTER_LASTNAME: "Enter lastname",
EMAIL: "Email",
EMAIL: "Эл. адрес",
ENTER_EMAIL: "Enter Email",
PASSWORD: "Password",
ENTER_PASSWORD: "Enter password",
@ -54,6 +54,7 @@ export const locale = {
SURNAME: "Surname",
NAME: "Name",
COMP_NAME: "Company name",
SHORT_NAME: "Short Name",
DOB: "Date of Birth",
POB: "Place of Birth",
@ -93,4 +94,18 @@ export const locale = {
REGISTER: "Register",
EDIT: "Edit",
LOGIN: "Login",
FORGOT_PASSWORD: "Forgot Password ?",
TERMS_AND_CONDITIONS: "Terms and Conditions",
PRIVACY_LEGACY: "Privacy Legacy",
BY_SIGN_UP: "By signing up, you agree to our",
SIGN_IN_MOTIVATION: "A few more clicks to",
SING_IN_MOTIVATION_RIGHT: "sign in to your account.",
SING_IN_MOTIVATION_MOBILE:
" A few more clicks to sign in to your account. Manage all your e-commerce accounts in one place",
MANAGE_DOCS: "Manage all your documents in one place",
UPDATE: "Update",
UPDATE_PWD: "Update password",
};

View File

@ -54,6 +54,7 @@ export const locale = {
SURNAME: "Surname",
NAME: "Name",
COMP_NAME: "Company name",
SHORT_NAME: "Short Name",
DOB: "Date of Birth",
POB: "Place of Birth",
@ -93,4 +94,18 @@ export const locale = {
REGISTER: "Register",
EDIT: "Edit",
LOGIN: "Login",
FORGOT_PASSWORD: "Forgot Password ?",
TERMS_AND_CONDITIONS: "Terms and Conditions",
PRIVACY_LEGACY: "Privacy Legacy",
BY_SIGN_UP: "By signing up, you agree to our",
SIGN_IN_MOTIVATION: "A few more clicks to",
SING_IN_MOTIVATION_RIGHT: "sign in to your account.",
SING_IN_MOTIVATION_MOBILE:
" A few more clicks to sign in to your account. Manage all your e-commerce accounts in one place",
MANAGE_DOCS: "Manage all your documents in one place",
UPDATE: "Update",
UPDATE_PWD: "Update password",
};

View File

@ -7,26 +7,19 @@
<a href="" class="-intro-x flex items-center pt-5">
<Logo />
<span class="text-white text-lg ml-3">
Türkmenistanyň Döwlet haryt-çig mal biržasy
{{$t('APP_TITLE')}}
</span>
</a>
<div class="my-auto">
<img
alt="Midone Tailwind HTML Admin Template"
class="-intro-x w-1/2 -mt-16"
src="@/assets/images/illustration.svg"
/>
<div
class="-intro-x text-white font-medium text-4xl leading-tight mt-10"
>
A few more clicks to <br />
sign in to your account.
<img alt="Midone Tailwind HTML Admin Template" class="-intro-x w-1/2 -mt-16"
src="@/assets/images/illustration.svg" />
<div class="-intro-x text-white font-medium text-4xl leading-tight mt-10">
{{$t('SIGN_IN_MOTIVATION')}} <br />
{{$t('SING_IN_MOTIVATION_RIGHT')}}
</div>
<div
class="-intro-x mt-5 text-lg text-white text-opacity-70 dark:text-slate-400"
>
Manage all your documents in one place
<div class="-intro-x mt-5 text-lg text-white text-opacity-70 dark:text-slate-400">
{{$t('MANAGE_DOCS')}}
</div>
</div>
</div>
@ -38,107 +31,63 @@
<a>
<Logo class="mx-auto mb-2" />
<div class="text-center text-white text-lg ml-3">
Türkmenistanyň Döwlet haryt-çig mal biržasy
{{$t('APP_TITLE')}}
</div>
</a>
</div>
<div
class="my-auto mx-auto xl:ml-20 bg-white dark:bg-darkmode-600 xl:bg-transparent px-5 sm:px-8 py-8 xl:p-0 rounded-md shadow-md xl:shadow-none w-full sm:w-3/4 lg:w-2/4 xl:w-auto"
>
class="my-auto mx-auto xl:ml-20 bg-white dark:bg-darkmode-600 xl:bg-transparent px-5 sm:px-8 py-8 xl:p-0 rounded-md shadow-md xl:shadow-none w-full sm:w-3/4 lg:w-2/4 xl:w-auto">
<div class="flex items-center justify-between">
<h2
class="intro-x font-bold text-2xl xl:text-3xl text-center xl:text-left"
>
<h2 class="intro-x font-bold text-2xl xl:text-3xl text-center xl:text-left">
{{ $t("SIGN_IN") }}
</h2>
<Lang />
</div>
<div class="intro-x mt-2 text-slate-400 xl:hidden text-center">
A few more clicks to sign in to your account. Manage all your
e-commerce accounts in one place
{{$t('SING_IN_MOTIVATION_MOBILE')}}
</div>
<div class="intro-x mt-8">
<input
type="text"
v-model.trim="validate.email.$model"
<input type="text" v-model.trim="validate.email.$model"
class="intro-x login__input form-control py-3 px-4 block mt-4"
:class="{ 'border-danger': validate.email.$error }"
placeholder="Email"
/>
:class="{ 'border-danger': validate.email.$error }" :placeholder="$t('EMAIL')" />
<template v-if="validate.email.$error">
<div
v-for="(error, index) in validate.email.$errors"
:key="index"
class="text-danger mt-2"
>
<div v-for="(error, index) in validate.email.$errors" :key="index" class="text-danger mt-2">
{{ error.$message }}
</div>
</template>
<input
type="password"
v-model.trim="validate.password.$model"
<input type="password" v-model.trim="validate.password.$model"
class="intro-x login__input form-control py-3 px-4 block mt-4"
:class="{ 'border-danger': validate.password.$error }"
placeholder="Password"
@keyup.enter="onLogin"
/>
:class="{ 'border-danger': validate.password.$error }" :placeholder="$t('PASSWORD')"
@keyup.enter="onLogin" />
<template v-if="validate.password.$error">
<div
v-for="(error, index) in validate.password.$errors"
:key="index"
class="text-danger mt-2"
>
<div v-for="(error, index) in validate.password.$errors" :key="index" class="text-danger mt-2">
{{ error.$message }}
</div>
</template>
</div>
<div
class="intro-x flex text-slate-600 dark:text-slate-500 text-xs sm:text-sm mt-4"
>
<a
type="button"
class="flex items-center ml-auto cursor-pointer"
@click="onForgotPassword"
>Forgot Password?
<LoadingIcon
icon="oval"
class="w-4 h-4 ml-2 primary"
v-if="isForgotPwdLoading"
/></a>
<div class="intro-x flex text-slate-600 dark:text-slate-500 text-xs sm:text-sm mt-4">
<a type="button" class="flex items-center ml-auto cursor-pointer" @click="onForgotPassword">
{{$t('FORGOT_PASSWORD')}}
<LoadingIcon icon="oval" class="w-4 h-4 ml-2 primary" v-if="isForgotPwdLoading" />
</a>
</div>
<div class="intro-x mt-5 xl:mt-8 text-center xl:text-left">
<button
class="btn btn-primary py-3 px-4 w-full xl:w-32 xl:mr-3 align-top"
@click.prevent="onLogin"
>
Login
<LoadingIcon
icon="oval"
color="white"
class="w-4 h-4 ml-2"
v-if="isLoading"
/>
<button class="btn btn-primary py-3 px-4 w-full xl:w-32 xl:mr-3 align-top" @click.prevent="onLogin">
{{$t('LOGIN')}}
<LoadingIcon icon="oval" color="white" class="w-4 h-4 ml-2" v-if="isLoading" />
</button>
<button
class="btn btn-outline-secondary py-3 px-4 w-full xl:w-32 mt-3 xl:mt-0 align-top"
@click.prevent="onRegister"
>
Register
<button class="btn btn-outline-secondary py-3 px-4 w-full xl:w-32 mt-3 xl:mt-0 align-top"
@click.prevent="onRegister">
{{$t('REGISTER')}}
</button>
</div>
<div
class="intro-x mt-10 xl:mt-24 text-slate-600 dark:text-slate-500 text-center xl:text-left"
>
By signing up, you agree to our
<a class="text-primary dark:text-slate-200" href=""
>Terms and Conditions</a
>
<div class="intro-x mt-10 xl:mt-24 text-slate-600 dark:text-slate-500 text-center xl:text-left">
{{$t('BY_SIGN_UP')}}
<a class="text-primary dark:text-slate-200" href="">{{$t('TERMS_AND_CONDITIONS')}}</a>
&
<a class="text-primary dark:text-slate-200" href=""
>Privacy Policy</a
>
<a class="text-primary dark:text-slate-200" href="">{{$t('PRIVACY_LEGACY')}}</a>
</div>
</div>
</div>

View File

@ -16,13 +16,13 @@
<div class="input-form">
<label for="validation-form-6" class="form-label w-full flex flex-col sm:flex-row">
{{$t('ACC_NUMBER')}}
<span class="sm:ml-auto mt-1 sm:mt-0 text-xs text-slate-500"><span class="text-red-600">*</span> {{
<span class="sm:ml-auto mt-1 sm:mt-0 text-xs text-slate-500"><span class="text-red-600">*</span> {{
$t("REQUIRED") }}
</span>
</label>
<input type="text" id="validation-form-6" v-model.trim="validate.account_number.$model"
class="form-control" :class="{ 'border-danger': validate.account_number.$error }" name="account number"
placeholder="Type your account number" />
:placeholder="$t('ACC_NUMBER')" />
<template v-if="validate.account_number.$error">
<div v-for="(error, index) in validate.account_number.$errors" :key="index" class="text-danger mt-2">
{{ error.$message }}
@ -35,19 +35,12 @@
<div class="input-form mt-3">
<label for="validation-form-2" class="form-label w-full flex flex-col sm:flex-row">
{{$t('ACC_DATE')}}
<span class="sm:ml-auto mt-1 sm:mt-0 text-xs text-slate-500"><span class="text-red-600">*</span> {{
<span class="sm:ml-auto mt-1 sm:mt-0 text-xs text-slate-500"><span class="text-red-600">*</span> {{
$t("REQUIRED") }}
</span>
</label>
<!-- <input
id="validation-form-2"
v-model.trim="validate.account_date.$model"
type="text"
name="account_date"
class="form-control"
:class="{ 'border-danger': validate.account_date.$error }"
placeholder="Select account date"
/> -->
<!-- End Account Date -->
<!-- Begin Date picker -->
<div class="relative mx-auto mt-3">
<div
@ -77,8 +70,8 @@
<!-- Begin Currency -->
<div class="input-form mt-3">
<label for="validation-form-4" class="form-label w-full flex flex-col sm:flex-row">
Currency
<span class="sm:ml-auto mt-1 sm:mt-0 text-xs text-slate-500"><span class="text-red-600">*</span> {{
{{$t('CURRENCY')}}
<span class="sm:ml-auto mt-1 sm:mt-0 text-xs text-slate-500"><span class="text-red-600">*</span> {{
$t("REQUIRED") }}
</span>
</label>
@ -96,12 +89,12 @@
<div class="input-form mt-3">
<label for="validation-form-4" class="form-label w-full flex flex-col sm:flex-row">
{{$t('IBAN')}}
<span class="sm:ml-auto mt-1 sm:mt-0 text-xs text-slate-500"><span class="text-red-600">*</span> {{
<span class="sm:ml-auto mt-1 sm:mt-0 text-xs text-slate-500"><span class="text-red-600">*</span> {{
$t("REQUIRED") }}
</span>
</label>
<input id="validation-form-4" v-model.trim="validate.iban.$model" type="text" name="iban"
class="form-control" :class="{ 'border-danger': validate.iban.$error }" placeholder="TTMK" />
class="form-control" :class="{ 'border-danger': validate.iban.$error }" :placeholder="$t('IBAN')" />
<template v-if="validate.iban.$error">
<div v-for="(error, index) in validate.iban.$errors" :key="index" class="text-danger mt-2">
{{ error.$message }}
@ -114,13 +107,13 @@
<div class="input-form mt-3">
<label for="validation-form-4" class="form-label w-full flex flex-col sm:flex-row">
{{$t('BANK_NAME')}}
<span class="sm:ml-auto mt-1 sm:mt-0 text-xs text-slate-500"><span class="text-red-600">*</span> {{
<span class="sm:ml-auto mt-1 sm:mt-0 text-xs text-slate-500"><span class="text-red-600">*</span> {{
$t("REQUIRED") }}
</span>
</label>
<input id="validation-form-4" v-model.trim="validate.bank_name.$model" type="text" name="bank_name"
class="form-control" :class="{ 'border-danger': validate.bank_name.$error }"
placeholder="Type bank name" />
:placeholder="$t('BANK_NAME')" />
<template v-if="validate.bank_name.$error">
<div v-for="(error, index) in validate.bank_name.$errors" :key="index" class="text-danger mt-2">
{{ error.$message }}
@ -133,12 +126,13 @@
<div class="input-form mt-3">
<label for="validation-form-4" class="form-label w-full flex flex-col sm:flex-row">
{{$t('COUNTRY')}}
<span class="sm:ml-auto mt-1 sm:mt-0 text-xs text-slate-500"><span class="text-red-600">*</span> {{
<span class="sm:ml-auto mt-1 sm:mt-0 text-xs text-slate-500"><span class="text-red-600">*</span> {{
$t("REQUIRED") }}
</span>
</label>
<input id="validation-form-4" v-model.trim="validate.country.$model" type="text" name="country"
class="form-control" :class="{ 'border-danger': validate.country.$error }" placeholder="Type country" />
class="form-control" :class="{ 'border-danger': validate.country.$error }"
:placeholder="$t('COUNTRY')" />
<template v-if="validate.country.$error">
<div v-for="(error, index) in validate.country.$errors" :key="index" class="text-danger mt-2">
{{ error.$message }}

View File

@ -21,7 +21,7 @@
</span>
</label>
<input type="text" id="validation-form-6" v-model.trim="validate.surname.$model" class="form-control"
:class="{ 'border-danger': validate.surname.$error }" name="surname" placeholder="Type your surname" />
:class="{ 'border-danger': validate.surname.$error }" name="surname" :placeholder="$t('SURNAME')" />
<template v-if="validate.surname.$error">
<div v-for="(error, index) in validate.surname.$errors" :key="index" class="text-danger mt-2">
{{ error.$message }}
@ -39,7 +39,7 @@
</span>
</label>
<input type="text" id="validation-form-6" v-model.trim="validate.name.$model" class="form-control"
:class="{ 'border-danger': validate.name.$error }" name="name" placeholder="Type your name" />
:class="{ 'border-danger': validate.name.$error }" name="name" :placeholder="$t('NAME')" />
<template v-if="validate.name.$error">
<div v-for="(error, index) in validate.name.$errors" :key="index" class="text-danger mt-2">
{{ error.$message }}
@ -58,7 +58,7 @@
</label>
<input type="text" id="validation-form-6" v-model.trim="validate.patronomic_name.$model"
class="form-control" :class="{ 'border-danger': validate.patronomic_name.$error }"
name="patronomic_name" placeholder="Type your patronimic name" />
name="patronomic_name" :placeholder="$t('PNAME')" />
<template v-if="validate.patronomic_name.$error">
<div v-for="(error, index) in validate.patronomic_name.$errors" :key="index" class="text-danger mt-2">
{{ error.$message }}
@ -75,15 +75,9 @@
$t("REQUIRED") }}
</span>
</label>
<!-- <input
id="validation-form-2"
v-model.trim="validate.account_date.$model"
type="text"
name="account_date"
class="form-control"
:class="{ 'border-danger': validate.account_date.$error }"
placeholder="Select account date"
/> -->
<!-- End Date of Birth -->
<!-- Begin Date picker -->
<div class="relative mx-auto mt-3">
<div
@ -120,7 +114,7 @@
</label>
<input id="validation-form-4" v-model.trim="validate.birth_place.$model" type="text" name="birth_place"
class="form-control" :class="{ 'border-danger': validate.birth_place.$error }"
placeholder="Type place of birth" />
:placeholder="$t('POB')" />
<template v-if="validate.birth_place.$error">
<div v-for="(error, index) in validate.birth_place.$errors" :key="index" class="text-danger mt-2">
{{ error.$message }}
@ -157,7 +151,7 @@
<input id="validation-form-4" v-model.trim="validate.registration_address.$model" type="text"
name="registration_address" class="form-control" :class="{
'border-danger': validate.registration_address.$error,
}" placeholder="Type registration address" />
}" :placeholder="$t('REG_ADDR')" />
<template v-if="validate.registration_address.$error">
<div v-for="(error, index) in validate.registration_address
.$errors" :key="index" class="text-danger mt-2">

View File

@ -15,13 +15,13 @@
<!-- Begin name -->
<div class="input-form">
<label for="validation-form-6" class="form-label w-full flex flex-col sm:flex-row">
{{$t('NAME')}}
{{$t('COMP_NAME')}}
<span class="sm:ml-auto mt-1 sm:mt-0 text-xs text-slate-500"><span class="text-red-600">*</span> {{
$t("REQUIRED") }}
</span>
</label>
<input type="text" id="validation-form-6" v-model.trim="validate.name.$model" class="form-control"
:class="{ 'border-danger': validate.name.$error }" name="name" placeholder="Type company name" />
:class="{ 'border-danger': validate.name.$error }" name="name" :placeholder="$t('COMP_NAME')" />
<template v-if="validate.name.$error">
<div v-for="(error, index) in validate.name.$errors" :key="index" class="text-danger mt-2">
{{ error.$message }}
@ -40,7 +40,7 @@
</label>
<input type="text" id="validation-form-6" v-model.trim="validate.short_name.$model" class="form-control"
:class="{ 'border-danger': validate.short_name.$error }" name="short_name"
placeholder="Type company short name" />
:placeholder="$t('SHORT_NAME')" />
<template v-if="validate.short_name.$error">
<div v-for="(error, index) in validate.short_name.$errors" :key="index" class="text-danger mt-2">
{{ error.$message }}
@ -60,7 +60,7 @@
<input type="text" id="validation-form-6" v-model.trim="validate.registration_number.$model"
class="form-control" :class="{
'border-danger': validate.registration_number.$error,
}" name="registration_number" placeholder="Type registration number" />
}" name="registration_number" :placeholder="$t('REG_NUMBER')" />
<template v-if="validate.registration_number.$error">
<div v-for="(error, index) in validate.registration_number.$errors" :key="index"
class="text-danger mt-2">
@ -78,15 +78,9 @@
$t("REQUIRED") }}
</span>
</label>
<!-- <input
id="validation-form-2"
v-model.trim="validate.account_date.$model"
type="text"
name="account_date"
class="form-control"
:class="{ 'border-danger': validate.account_date.$error }"
placeholder="Select account date"
/> -->
<!-- End Registration Date -->
<!-- Begin Date picker -->
<div class="relative mx-auto mt-3">
<div
@ -124,7 +118,7 @@
<input id="validation-form-4" v-model.trim="validate.state_registration_agency.$model" type="text"
name="state_registration_agency" class="form-control" :class="{
'border-danger': validate.state_registration_agency.$error,
}" placeholder="Type state registration agency" />
}" :placeholder="$t('REG_AGENCY')" />
<template v-if="validate.state_registration_agency.$error">
<div v-for="(error, index) in validate.state_registration_agency
.$errors" :key="index" class="text-danger mt-2">
@ -145,7 +139,7 @@
<input id="validation-form-4" v-model.trim="validate.registration_place.$model" type="text"
name="registration_place" class="form-control"
:class="{ 'border-danger': validate.registration_place.$error }"
placeholder="Type company registration place" />
:placeholder="$t('REG_PLACE')" />
<template v-if="validate.registration_place.$error">
<div v-for="(error, index) in validate.registration_place.$errors" :key="index"
class="text-danger mt-2">
@ -166,7 +160,7 @@
<input id="validation-form-4" v-model.trim="validate.registration_address.$model" type="text"
name="registration_address" class="form-control" :class="{
'border-danger': validate.registration_address.$error,
}" placeholder="Type registration address" />
}" :placeholder="$t('REG_ADDR')" />
<template v-if="validate.registration_address.$error">
<div v-for="(error, index) in validate.registration_address
.$errors" :key="index" class="text-danger mt-2">

View File

@ -23,7 +23,7 @@
</label>
<textarea id="validation-form-6" v-model.trim="validate.address.$model" class="form-control"
:class="{ 'border-danger': validate.address.$error }" name="address"
placeholder="Type your address"></textarea>
:placeholder="$t('ADDRESS')"></textarea>
<template v-if="validate.address.$error">
<div v-for="(error, index) in validate.address.$errors" :key="index" class="text-danger mt-2">
{{ error.$message }}
@ -42,7 +42,7 @@
</label>
<input id="validation-form-2" v-model.trim="validate.email.$model" type="email" name="email"
class="form-control" :class="{ 'border-danger': validate.email.$error }"
placeholder="example@gmail.com" />
:placeholder="$t('EMAIL')" />
<template v-if="validate.email.$error">
<div v-for="(error, index) in validate.email.$errors" :key="index" class="text-danger mt-2">
{{ error.$message }}
@ -60,7 +60,7 @@
</span>
</label>
<input id="validation-form-4" v-model.trim="validate.phone.$model" type="number" name="phone"
class="form-control" :class="{ 'border-danger': validate.phone.$error }" placeholder="99365111111" />
class="form-control" :class="{ 'border-danger': validate.phone.$error }" placeholder="9936xxxxxxx" />
<template v-if="validate.phone.$error">
<div v-for="(error, index) in validate.phone.$errors" :key="index" class="text-danger mt-2">
{{ error.$message }}
@ -78,7 +78,7 @@
</span>
</label>
<input id="validation-form-4" v-model.trim="validate.fax.$model" type="number" name="fax"
class="form-control" :class="{ 'border-danger': validate.fax.$error }" placeholder="99312111111" />
class="form-control" :class="{ 'border-danger': validate.fax.$error }" placeholder="99312xxxxxx" />
<template v-if="validate.fax.$error">
<div v-for="(error, index) in validate.fax.$errors" :key="index" class="text-danger mt-2">
{{ error.$message }}

View File

@ -12,21 +12,14 @@
</a>
<div class="my-auto">
<img
alt="Midone Tailwind HTML Admin Template"
class="-intro-x w-1/2 -mt-16"
src="@/assets/images/illustration.svg"
/>
<div
class="-intro-x text-white font-medium text-4xl leading-tight mt-10"
>
A few more clicks to <br />
sign in to your account.
<img alt="" class="-intro-x w-1/2 -mt-16"
src="@/assets/images/illustration.svg" />
<div class="-intro-x text-white font-medium text-4xl leading-tight mt-10">
{{$t('SIGN_IN_MOTIVATION')}} <br />
{{$t('SING_IN_MOTIVATION_RIGHT')}}
</div>
<div
class="-intro-x mt-5 text-lg text-white text-opacity-70 dark:text-slate-400"
>
Manage all your documents in one place
<div class="-intro-x mt-5 text-lg text-white text-opacity-70 dark:text-slate-400">
{{$t('MANAGE_DOCS')}}
</div>
</div>
</div>
@ -44,12 +37,9 @@
</div>
<div
class="my-auto mx-auto xl:ml-20 bg-white dark:bg-darkmode-600 xl:bg-transparent px-5 sm:px-8 py-8 xl:p-0 rounded-md shadow-md xl:shadow-none w-full sm:w-3/4 lg:w-2/4 xl:w-auto"
>
<h2
class="intro-x font-bold text-2xl xl:text-3xl text-center xl:text-left"
>
Update password
class="my-auto mx-auto xl:ml-20 bg-white dark:bg-darkmode-600 xl:bg-transparent px-5 sm:px-8 py-8 xl:p-0 rounded-md shadow-md xl:shadow-none w-full sm:w-3/4 lg:w-2/4 xl:w-auto">
<h2 class="intro-x font-bold text-2xl xl:text-3xl text-center xl:text-left">
{{$t('UPDATE_PWD')}}
</h2>
<div class="intro-x mt-2 text-slate-400 xl:hidden text-center">
A few more clicks to sign in to your account. Manage all your
@ -57,92 +47,50 @@
</div>
<div class="intro-x mt-8">
<input
type="text"
v-model.trim="validate.email.$model"
<input type="text" v-model.trim="validate.email.$model"
class="intro-x login__input form-control py-3 px-4 block mt-4"
:class="{ 'border-danger': validate.email.$error }"
placeholder="Email"
/>
:class="{ 'border-danger': validate.email.$error }" placeholder="Email" />
<template v-if="validate.email.$error">
<div
v-for="(error, index) in validate.email.$errors"
:key="index"
class="text-danger mt-2"
>
<div v-for="(error, index) in validate.email.$errors" :key="index" class="text-danger mt-2">
{{ error.$message }}
</div>
</template>
<input
type="text"
v-model.trim="validate.token.$model"
<input type="text" v-model.trim="validate.token.$model"
class="intro-x login__input form-control py-3 px-4 block mt-4"
:class="{ 'border-danger': validate.token.$error }"
placeholder="Type token you received in mail"
/>
:class="{ 'border-danger': validate.token.$error }" placeholder="Type token you received in mail" />
<template v-if="validate.token.$error">
<div
v-for="(error, index) in validate.token.$errors"
:key="index"
class="text-danger mt-2"
>
<div v-for="(error, index) in validate.token.$errors" :key="index" class="text-danger mt-2">
{{ error.$message }}
</div>
</template>
<input
type="password"
v-model.trim="validate.password.$model"
<input type="password" v-model.trim="validate.password.$model"
class="intro-x login__input form-control py-3 px-4 block mt-4"
:class="{ 'border-danger': validate.password.$error }"
placeholder="Password"
/>
:class="{ 'border-danger': validate.password.$error }" placeholder="Password" />
<template v-if="validate.password.$error">
<div
v-for="(error, index) in validate.password.$errors"
:key="index"
class="text-danger mt-2"
>
<div v-for="(error, index) in validate.password.$errors" :key="index" class="text-danger mt-2">
{{ error.$message }}
</div>
</template>
<input
type="password"
v-model.trim="validate.confirm_password.$model"
<input type="password" v-model.trim="validate.confirm_password.$model"
class="intro-x login__input form-control py-3 px-4 block mt-4"
:class="{ 'border-danger': validate.confirm_password.$error }"
placeholder="New password"
/>
:class="{ 'border-danger': validate.confirm_password.$error }" placeholder="New password" />
<template v-if="validate.confirm_password.$error">
<div
v-for="(error, index) in validate.confirm_password.$errors"
:key="index"
class="text-danger mt-2"
>
<div v-for="(error, index) in validate.confirm_password.$errors" :key="index" class="text-danger mt-2">
{{ error.$message }}
</div>
</template>
</div>
<div class="intro-x mt-5 xl:mt-8 text-center xl:text-left">
<button
class="btn btn-primary py-3 px-4 w-full xl:w-32 xl:mr-3 align-top"
@click.prevent="onUpdate"
>
Update
<LoadingIcon
icon="oval"
color="white"
class="w-4 h-4 ml-2"
v-if="isLoading"
/>
<button class="btn btn-primary py-3 px-4 w-full xl:w-32 xl:mr-3 align-top" @click.prevent="onUpdate">
{{$t('UPDATE')}}
<LoadingIcon icon="oval" color="white" class="w-4 h-4 ml-2" v-if="isLoading" />
</button>
<button
class="btn btn-outline-secondary py-3 px-4 w-full xl:w-32 mt-3 xl:mt-0 align-top"
@click.prevent="onLogin"
>
Sign in
<button class="btn btn-outline-secondary py-3 px-4 w-full xl:w-32 mt-3 xl:mt-0 align-top"
@click.prevent="onLogin">
{{$t('SIGN_IN')}}
</button>
</div>
</div>