From 4409662db2ae4a6f04e198f311749bf7f407cd69 Mon Sep 17 00:00:00 2001
From: saparatayev <sopa.97@mail.ru>
Date: Tue, 13 Dec 2022 16:35:40 +0500
Subject: [PATCH] changed email verify page

---
 src/i18n/en.js                     |  4 +-
 src/i18n/ru.js                     |  4 +-
 src/i18n/tm.js                     |  4 +-
 src/stores/auth.js                 |  2 +
 src/views/register/EmailVerify.vue | 61 ++++++++++++++++--------------
 5 files changed, 44 insertions(+), 31 deletions(-)

diff --git a/src/i18n/en.js b/src/i18n/en.js
index 7328504..977eb2b 100644
--- a/src/i18n/en.js
+++ b/src/i18n/en.js
@@ -193,5 +193,7 @@ export const locale = {
   INFO_STEP_2: "ШАГ 2. Подайте документы онлайн, нажав кнопку «Подать заявку».",
 
   FAQ: "Frequently asked questions",
-  INSTRUCTIONS: "Read instruction"
+  INSTRUCTIONS: "Read instruction",
+
+  AUTH_CODE_SENT_TO_YOUR_EMAIL: "We have sent you an authorization code by email"
 };
diff --git a/src/i18n/ru.js b/src/i18n/ru.js
index e392b87..8dad859 100644
--- a/src/i18n/ru.js
+++ b/src/i18n/ru.js
@@ -192,5 +192,7 @@ export const locale = {
   INFO_FORM: `Заполните все поля. Проверьте правильность внесенной информации, поскольку все данные из этого раздела автоматически отобразятся в «Вопроснике», необходимого для регистрации. Обратите внимание, что Вы сможете подать документы онлайн только когда заполнены все поля в этом разделе.`,
 
   FAQ: "Часто задаваемые вопросы",
-  INSTRUCTIONS: "Прочитать инструкции"
+  INSTRUCTIONS: "Прочитать инструкции",
+
+  AUTH_CODE_SENT_TO_YOUR_EMAIL: "Мы отправили вам на почту код авторизации"
 };
diff --git a/src/i18n/tm.js b/src/i18n/tm.js
index 73fa2ba..1f24137 100644
--- a/src/i18n/tm.js
+++ b/src/i18n/tm.js
@@ -190,5 +190,7 @@ export const locale = {
   INFO_FORM: `Ähli meýdançalary dolduryň. Girizilen maglumatlaryň dogrulygyny barlaň, sebäbi bu bölümdäki maglumatlar awtomatiki usulda hasaba alynmak üçin zerur bolan "Sowalnama" geçer. Üns beriň, şu bölümde ähli meýdançalary dolduranyňyzdan soň resminamalary onlaýn tabşyrmaga mümkinçilik dörär.`,
 
   FAQ: "Köp soralýan soraglar",
-  INSTRUCTIONS: "Görkezmeleri okamak"
+  INSTRUCTIONS: "Görkezmeleri okamak",
+
+  AUTH_CODE_SENT_TO_YOUR_EMAIL: "Siziň Email-yňyza ygtyýarnama koduny iberdik."
 };
diff --git a/src/stores/auth.js b/src/stores/auth.js
index 82ab2f2..d6478bb 100644
--- a/src/stores/auth.js
+++ b/src/stores/auth.js
@@ -12,6 +12,7 @@ export const useAuthStore = defineStore({
     // initialize state from local storage to enable user to stay logged in
     user: JSON.parse(localStorage.getItem(USER)),
     returnUrl: null,
+    emailForVerification: null,
   }),
   actions: {
     async login(email, password) {
@@ -62,6 +63,7 @@ export const useAuthStore = defineStore({
         if (response.data && response.data.is_verified) {
           router.push({ path: "/login" });
         } else {
+          this.emailForVerification = response.data.email;
           router.push({ path: "/email-verify" });
         }
         ////console.warn(response.data);
diff --git a/src/views/register/EmailVerify.vue b/src/views/register/EmailVerify.vue
index 9ff1d58..fe50795 100644
--- a/src/views/register/EmailVerify.vue
+++ b/src/views/register/EmailVerify.vue
@@ -21,24 +21,8 @@
               {{$t('SING_IN_MOTIVATION_MOBILE')}}
             </div>
             <div class="intro-x mt-8">
+              <p>{{ $t('AUTH_CODE_SENT_TO_YOUR_EMAIL') }}</p>
               
-              <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=" $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 }}
-                </div>
-              </template>
-
               <div class="relative">
                 <input
                   type="text"
@@ -62,7 +46,7 @@
             
             <div class="intro-x mt-5 xl:mt-8 text-center xl:text-left">
               <button
-                class="btn btn-primary py-3 px-4 xl:mr-3 align-top w-full xl:w-auto custom-btns"
+                class="btn btn-primary py-3 px-4 xl:mr-3 align-top w-full custom-btns"
                 @click.prevent="verifyEmail"
                 :disabled="isLoading"
               >
@@ -74,10 +58,13 @@
                   v-if="isLoading"
                 />
               </button>
-              <button class="btn btn-outline-secondary py-3 px-4 mt-3 xl:mt-0 align-top w-full xl:w-auto custom-btns"
-                @click.prevent="onLogin">
-                {{ $t("SIGN_IN") }}
-              </button>
+            </div>
+            <div class="intro-x mt-5 xl:mt-8 text-primary xl:text-left">
+              <i18n-t keypath="ALREADY_HAS_ACCOUNT" for="REGISTER" class="w-full text-center" tag="p">
+                <a @click.prevent="onLogin" href="#" class="font-bold underline">
+                  {{ $t('SIGN_IN') }}
+                </a>
+              </i18n-t>
             </div>
           </div>
         </div>
@@ -102,19 +89,24 @@ import {
 } from "@vuelidate/validators";
 import { useVuelidate } from "@vuelidate/core";
 import { useAuthStore } from '@/stores'
+import { storeToRefs } from 'pinia';
+
+const authStore = useAuthStore();
+const { emailForVerification } = storeToRefs(authStore);
+console.log('user email: ', emailForVerification.value)
 
 const isLoading = ref(false);
 
 const formData = reactive({
-  email: "",
+  // email: "",
   token: "",
 });
 
 const rules = {
-  email: {
-    required,
-    email,
-  },
+  // email: {
+  //   required,
+  //   email,
+  // },
   token: {
     required,
     minLength: minLength(5),
@@ -133,7 +125,7 @@ const verifyEmail = async () => {
   // if form is valid
   if (!validate.value.$invalid) {
     isLoading.value = true;
-    await authStore.verifyEmail(formData.email, formData.token)
+    await authStore.verifyEmail(emailForVerification.value, formData.token)
     isLoading.value = false;
   }
 };
@@ -144,3 +136,16 @@ onMounted(() => {
   dom("body").removeClass("main").removeClass("error-page").addClass("login");
 });
 </script>
+
+<style scoped>
+.custom-btns {
+  min-width: 128px;
+}
+
+.form-check-input[type="radio"],
+.login .login__input,
+.form-select {
+  border-color: rgb(var(--color-slate-400) / var(--tw-border-opacity));
+  ;
+}
+</style>