From ba31453ff65bf11819b144617beed7656eed688f Mon Sep 17 00:00:00 2001
From: "DESKTOP-1R2VSQH\\Lenovo ThinkPad E490" <nicey2t1096@gmail.com>
Date: Fri, 22 Nov 2024 10:56:45 +0700
Subject: [PATCH] verifyEmail

---
 src/router/index.ts       |  2 +-
 src/views/VerifyEmail.vue | 50 +++++++++++++++++++++++++--------------
 2 files changed, 33 insertions(+), 19 deletions(-)

diff --git a/src/router/index.ts b/src/router/index.ts
index 3e6cc89..103e994 100644
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -79,7 +79,7 @@ const router = createRouter({
       },
     },
     {
-      path: "/verifyemail/:token",
+      path: "/verifyemail",
       name: "verifyemail",
       component: VerifyEmail,
     },
diff --git a/src/views/VerifyEmail.vue b/src/views/VerifyEmail.vue
index d9e2ed6..a0e04dc 100644
--- a/src/views/VerifyEmail.vue
+++ b/src/views/VerifyEmail.vue
@@ -11,24 +11,24 @@ const $q = useQuasar();
 const route = useRoute();
 const { showLoader, hideLoader, messageError } = useCounterMixin();
 
-const pathApi = ref<string>(`${env.API_URI}/profile/verify-email`);
-const token = ref(route.params.token);
+const pathApi = ref<string>(`${env.API_URI}/org/unauthorize/verify-email`);
+const token = ref(route.query.upn);
+const isCheckEmail = ref<boolean>(false);
 
 async function fetchCheckVerifEemail() {
+  if (!token.value) {
+    return false;
+  }
+
   showLoader();
   await axios
-    .post(
-      pathApi.value,
-      { token: token.value },
-      {
-        headers: {
-          "Content-Type": "application/json; charset=utf-8",
-        },
-      }
-    )
-    .then(() => {})
+    .post(pathApi.value, { token: token.value })
+    .then(() => {
+      isCheckEmail.value = true;
+    })
     .catch((err) => {
       // messageError($q, err);
+      isCheckEmail.value = false;
     })
     .finally(() => {
       hideLoader();
@@ -48,13 +48,27 @@ onMounted(() => {
       background: linear-gradient(to bottom, #e0f7fa, #ffffff);
     "
   >
-    <div class="card">
+    <div>
       <!-- <div class="header"> -->
-      <q-icon name="mdi-check-decagram" color="blue" size="64px" />
-      <div class="text-h4 text-primary q-mt-md">Verify Your Email</div>
-      <!-- <div class="text-subtitle2 text-grey-7 q-mt-xs">
-          Please check your inbox to confirm your email address.
-        </div> -->
+      <q-icon
+        :name="isCheckEmail ? 'mdi-check-decagram' : 'mdi-alert-decagram'"
+        :color="isCheckEmail ? 'blue' : 'warning'"
+        size="64px"
+      />
+      <div v-if="isCheckEmail">
+        <div class="text-h4 text-primary q-mt-md">Verify Your Email</div>
+        <div class="text-subtitle2 text-grey-7 q-mt-xs">
+          Your email address has been successfully verified. Thank you!
+        </div>
+      </div>
+      <div v-else>
+        <div class="text-h4 text-negative q-mt-md">
+          Email Verification Failed
+        </div>
+        <div class="text-subtitle2 text-grey-7 q-mt-xs">
+          Something went wrong. Please try again or contact support.
+        </div>
+      </div>
       <!-- </div> -->
 
       <q-btn