From f61d1e906082b7e284dac6c0140c686cb18809c1 Mon Sep 17 00:00:00 2001
From: setthawutttty <trx.setthawut@gmail.com>
Date: Tue, 22 Oct 2024 13:09:12 +0700
Subject: [PATCH] update phone /email

---
 src/api/org/api.org.ts                        |  2 +
 .../01_Information/01_Information.vue         | 78 +++++++++++++------
 2 files changed, 56 insertions(+), 24 deletions(-)

diff --git a/src/api/org/api.org.ts b/src/api/org/api.org.ts
index af57985..b48affe 100644
--- a/src/api/org/api.org.ts
+++ b/src/api/org/api.org.ts
@@ -84,6 +84,8 @@ export default {
   requestEdit: `${profileOrg}/edit/`,
   developmentUser: `${profileOrg}/development/user`,
 
+  upDateNumber:`${profileOrg}/updatePhoneNumber/user`,
+  updateEmail:`${profileOrg}/updateEmail/user`,
   /**
    * workflow
    */
diff --git a/src/modules/10_registry/01_Information/01_Information.vue b/src/modules/10_registry/01_Information/01_Information.vue
index 85bd129..9792d4f 100644
--- a/src/modules/10_registry/01_Information/01_Information.vue
+++ b/src/modules/10_registry/01_Information/01_Information.vue
@@ -12,8 +12,14 @@ import DialogHistory from "@/modules/10_registry/Dialog/DialogHistory.vue";
 const $q = useQuasar();
 const store = useRegistryInFormationStore();
 const mixin = useCounterMixin();
-const { showLoader, hideLoader, messageError, date2Thai, dialogConfirm } =
-  mixin;
+const {
+  showLoader,
+  hideLoader,
+  messageError,
+  date2Thai,
+  dialogConfirm,
+  success,
+} = mixin;
 
 const editPhone = ref<boolean>(false);
 const editEmail = ref<boolean>(false);
@@ -37,7 +43,7 @@ const formDataInformation = reactive<any>({
   email: "",
 });
 
-const emailVerify = ref<boolean | null>(null);
+const emailVerify = ref<string>("");
 const visibleColumnsHistory = ref<string[]>([
   "citizenId",
   "prefix",
@@ -231,12 +237,12 @@ function onHistory() {
 }
 
 /** get data */
-function getData() {
+async function getData() {
   showLoader();
-  http
+  await http
     .get(config.API.dataUserInformation)
-    .then((res) => {
-      const data = res.data.result;
+    .then(async (res) => {
+      const data = await res.data.result;
       formDataInformation.citizenId = data.citizenId;
       formDataInformation.prefix = data.prefix;
       formDataInformation.firstName = data.firstName;
@@ -251,15 +257,16 @@ function getData() {
       formDataInformation.bloodGroup = data.bloodGroup;
       formDataInformation.phone = data.phone;
       formDataInformation.email = data.email.split("@")[0];
+
+      emailVerify.value = data.statusEmail;
+      hideLoader();
     })
+
     .catch((e) => {
       messageError($q, e);
+      hideLoader();
     })
-    .finally(() => {
-      setTimeout(() => {
-        hideLoader();
-      }, 2000);
-    });
+    .finally(() => {});
 }
 
 /** get history */
@@ -306,18 +313,41 @@ function onSubmitEdit(type: string) {
 }
 
 /** บันทึกเบอร์โทร */
-function onSavePhone() {
-  editPhone.value = false;
+async function onSavePhone() {
+  await http
+    .put(config.API.upDateNumber, {
+      phone: formDataInformation.phone,
+    })
+    .then(async (res) => {
+      await getData();
+      editPhone.value = false;
+      success($q, "บันทึกข้อมูลสำเร็จ");
+    })
+    .catch((e) => {
+      messageError($q, e);
+    })
+    .finally(() => {});
 }
 
 /** บันทึก email */
-function onSaveEmail() {
-  emailVerify.value = false;
-  editEmail.value = false;
+async function onSaveEmail() {
+  await http
+    .put(config.API.updateEmail, {
+      email: formDataInformation.email + `@bangkok.go.th`,
+    })
+    .then(async (res) => {
+      await getData();
+      editEmail.value = false;
+      success($q, "บันทึกข้อมูลสำเร็จ");
+    })
+    .catch((e) => {
+      messageError($q, e);
+    })
+    .finally(() => {});
 }
 
-onMounted(() => {
-  getData();
+onMounted(async () => {
+  await getData();
 });
 </script>
 <template>
@@ -510,10 +540,7 @@ onMounted(() => {
                   >
                   </q-input>
                 </div>
-                <div
-                  v-if="emailVerify == null || emailVerify == true"
-                  class="self-center col-3"
-                >
+                <div v-if="emailVerify == ''" class="self-center col-3">
                   <div v-if="editEmail == false">
                     <q-btn
                       dense
@@ -549,7 +576,10 @@ onMounted(() => {
                     </q-btn>
                   </div>
                 </div>
-                <div v-else class="self-center col-3">
+                <div
+                  v-else-if="emailVerify == 'NOT_VERIFIED'"
+                  class="self-center col-3"
+                >
                   <q-icon
                     name="mdi-alert-box"
                     color="warning"