From fd14b1b3643cb39a84e1dacb3c6a882c559ffbfe Mon Sep 17 00:00:00 2001
From: "DESKTOP-1R2VSQH\\Lenovo ThinkPad E490" <nicey2t1096@gmail.com>
Date: Tue, 13 Feb 2024 11:01:11 +0700
Subject: [PATCH] =?UTF-8?q?=E0=B8=82=E0=B9=89=E0=B8=AD=E0=B8=A1=E0=B8=B9?=
 =?UTF-8?q?=E0=B8=A5=E0=B8=97=E0=B8=B0=E0=B9=80=E0=B8=9A=E0=B8=B5=E0=B8=A2?=
 =?UTF-8?q?=E0=B8=99=E0=B8=9B=E0=B8=A3=E0=B8=B0=E0=B8=A7=E0=B8=B1=E0=B8=95?=
 =?UTF-8?q?=E0=B8=B4=20=3D>=20=E0=B9=80=E0=B8=8A=E0=B9=87=E0=B8=84?=
 =?UTF-8?q?=E0=B9=80=E0=B8=A5=E0=B8=82=E0=B8=9B=E0=B8=A3=E0=B8=B0=E0=B8=8A?=
 =?UTF-8?q?=E0=B8=B2=E0=B8=8A=E0=B8=99?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/registry/registry.vue          | 289 +++++++++++-------
 1 file changed, 173 insertions(+), 116 deletions(-)

diff --git a/src/modules/04_registryNew/components/registry/registry.vue b/src/modules/04_registryNew/components/registry/registry.vue
index e6f99dd76..43e689406 100644
--- a/src/modules/04_registryNew/components/registry/registry.vue
+++ b/src/modules/04_registryNew/components/registry/registry.vue
@@ -18,6 +18,7 @@ const {
   messageError,
   showLoader,
   hideLoader,
+  dialogMessageNotify,
 } = mixin;
 const columns = ref<QTableProps["columns"]>([
   {
@@ -170,34 +171,66 @@ async function fetchPrefix() {
 }
 
 async function addData() {
-  await http.post(config.API.registryNew, {
-    prefix: prefix.value,
-    firstName: firstName.value,
-    lastName: lastName.value,
-    citizenId: citizenId.value,
-    position: position.value,
-    posTypeId: posTypeId.value,
-    posLevelId: posLevelId.value,
-  });
-  fetchData();
+  showLoader();
+  await http
+    .post(config.API.registryNew, {
+      prefix: prefix.value,
+      firstName: firstName.value,
+      lastName: lastName.value,
+      citizenId: citizenId.value,
+      position: position.value,
+      posTypeId: posTypeId.value,
+      posLevelId: posLevelId.value,
+    })
+    .then(() => {
+      success($q, "บันทึกข้อมูลสำเร็จ");
+    })
+    .catch((err) => {
+      messageError($q, err);
+    })
+    .finally(() => {
+      fetchData();
+      hideLoader();
+    });
 }
 
 async function editData(id: string) {
-  await http.put(config.API.registryNewId(id), {
-    prefix: prefix.value,
-    firstName: firstName.value,
-    lastName: lastName.value,
-    citizenId: citizenId.value,
-    position: position.value,
-    posTypeId: posTypeId.value,
-    posLevelId: posLevelId.value,
-  });
-  fetchData();
+  showLoader();
+  await http
+    .put(config.API.registryNewId(id), {
+      prefix: prefix.value,
+      firstName: firstName.value,
+      lastName: lastName.value,
+      citizenId: citizenId.value,
+      position: position.value,
+      posTypeId: posTypeId.value,
+      posLevelId: posLevelId.value,
+    })
+    .then(() => {
+      success($q, "บันทึกข้อมูลสำเร็จ");
+    })
+    .catch((err) => {
+      messageError($q, err);
+    })
+    .finally(() => {
+      fetchData();
+      hideLoader();
+    });
 }
 
 async function deleteData(id: string) {
-  await http.delete(config.API.registryNewId(id));
-  fetchData();
+  await http
+    .delete(config.API.registryNewId(id))
+    .then(() => {
+      success($q, "ลบข้อมูลสำเร็จ");
+    })
+    .catch((err) => {
+      messageError($q, err);
+    })
+    .finally(() => {
+      fetchData();
+      hideLoader();
+    });
 }
 
 function updateSelectType(val: string) {
@@ -250,6 +283,28 @@ watch(posTypeId, () => {
     updateSelectType(posTypeId.value);
   }, 200);
 });
+
+/**
+ * function ตรวจสอบเลขประจำตัวประชาชน
+ * @param citizenId เลขประจำตัวประชาชน
+ */
+async function changeCardID(citizenId: string | number | null) {
+  if (citizenId != null && typeof citizenId == "string") {
+    if (citizenId.length == 13 && citizenId) {
+      await http
+        .get(config.API.profileCitizenId(citizenId))
+        .then((res) => {
+          console.log(res);
+          const statusId = res.data.result.citizen;
+          !statusId &&
+            dialogMessageNotify($q, "เลขประจำตัวประชาชนนี้มีการใช้งานแล้ว");
+        })
+        .catch((err) => {
+          messageError($q, err);
+        });
+    }
+  }
+}
 </script>
 
 <template>
@@ -294,103 +349,104 @@ watch(posTypeId, () => {
       />
     </div>
   </q-toolbar>
+  <div class="col-12">
+    <d-table
+      ref="table"
+      :columns="columns"
+      :rows="store.row"
+      :filter="filterKeyword"
+      row-key="name"
+      flat
+      bordered
+      :paging="true"
+      dense
+      class="custom-header-table"
+      :visible-columns="visibleColumns"
+    >
+      <template v-slot:header="props">
+        <q-tr :props="props">
+          <q-th v-for="col in props.cols" :key="col.name" :props="props">
+            <span class="text-weight-medium">{{ col.label }}</span>
+          </q-th>
+          <q-th auto-width />
+        </q-tr>
+      </template>
+      <template v-slot:body="props">
+        <q-tr :props="props" class="cursor-pointer">
+          <q-td v-for="col in props.cols" :key="col.id">
+            <div v-if="col.name == 'no'">
+              {{ props.rowIndex + 1 }}
+            </div>
+            <div v-else-if="col.name == 'fullName'">
+              {{ props.row.prefix }}{{ props.row.firstName }}
+              {{ props.row.lastName }}
+            </div>
 
-  <d-table
-    ref="table"
-    :columns="columns"
-    :rows="store.row"
-    :filter="filterKeyword"
-    row-key="name"
-    flat
-    bordered
-    :paging="true"
-    dense
-    class="custom-header-table"
-    :visible-columns="visibleColumns"
-  >
-    <template v-slot:header="props">
-      <q-tr :props="props">
-        <q-th v-for="col in props.cols" :key="col.name" :props="props">
-          <span class="text-weight-medium">{{ col.label }}</span>
-        </q-th>
-        <q-th auto-width />
-      </q-tr>
-    </template>
-    <template v-slot:body="props">
-      <q-tr :props="props" class="cursor-pointer">
-        <q-td v-for="col in props.cols" :key="col.id">
-          <div v-if="col.name == 'no'">
-            {{ props.rowIndex + 1 }}
-          </div>
-          <div v-else-if="col.name == 'fullName'">
-            {{ props.row.prefix }}{{ props.row.firstName }}
-            {{ props.row.lastName }}
-          </div>
-
-          <div v-else>
-            {{ col.value }}
-          </div>
-        </q-td>
-        <q-td auto-width>
-          <q-btn
-            color="grey"
-            flat
-            dense
-            round
-            size="14px"
-            icon="more_vert"
-            @click.stop
-          >
-            <q-menu>
-              <q-list dense>
-                <q-item
-                  v-close-popup
-                  clickable
-                  @click.stop="
-                    () => {
-                      dialogStatus = 'edit';
-                      dialog = true;
-                      editId = props.row.id;
-                      prefix = props.row.prefix;
-                      firstName = props.row.firstName;
-                      lastName = props.row.lastName;
-                      citizenId = props.row.citizenId;
-                      position = props.row.position;
-                      posTypeId = props.row.posTypeId;
-                      posLevelId = props.row.posLevelId;
-                    }
-                  "
-                >
-                  <q-item-section>
-                    <div class="row items-center white">
-                      <q-icon name="o_edit" color="positive" />
-                      <span class="q-ml-sm">แก้ไข</span>
-                    </div>
-                  </q-item-section>
-                </q-item>
-                <q-item clickable>
-                  <q-item-section
-                    @click="
-                      dialogRemove(
-                        $q,
-                        async () => await deleteData(props.row.id)
-                      )
-                    "
+            <div v-else>
+              {{ col.value }}
+            </div>
+          </q-td>
+          <q-td auto-width>
+            <q-btn
+              color="grey"
+              flat
+              dense
+              round
+              size="14px"
+              icon="more_vert"
+              @click.stop
+            >
+              <q-menu>
+                <q-list dense>
+                  <q-item
                     v-close-popup
+                    clickable
+                    @click.stop="
+                      () => {
+                        dialogStatus = 'edit';
+                        dialog = true;
+                        editId = props.row.id;
+                        prefix = props.row.prefix;
+                        firstName = props.row.firstName;
+                        lastName = props.row.lastName;
+                        citizenId = props.row.citizenId;
+                        position = props.row.position;
+                        posTypeId = props.row.posTypeId;
+                        posLevelId = props.row.posLevelId;
+                      }
+                    "
                   >
-                    <div class="row items-center white">
-                      <q-icon name="mdi-trash-can-outline" color="negative" />
-                      <span class="q-ml-sm">ลบ</span>
-                    </div>
-                  </q-item-section>
-                </q-item>
-              </q-list>
-            </q-menu>
-          </q-btn>
-        </q-td>
-      </q-tr>
-    </template>
-  </d-table>
+                    <q-item-section>
+                      <div class="row items-center white">
+                        <q-icon name="o_edit" color="positive" />
+                        <span class="q-ml-sm">แก้ไข</span>
+                      </div>
+                    </q-item-section>
+                  </q-item>
+                  <q-item clickable>
+                    <q-item-section
+                      @click="
+                        dialogRemove(
+                          $q,
+                          async () => await deleteData(props.row.id)
+                        )
+                      "
+                      v-close-popup
+                    >
+                      <div class="row items-center white">
+                        <q-icon name="mdi-trash-can-outline" color="negative" />
+                        <span class="q-ml-sm">ลบ</span>
+                      </div>
+                    </q-item-section>
+                  </q-item>
+                </q-list>
+              </q-menu>
+            </q-btn>
+          </q-td>
+        </q-tr>
+      </template>
+    </d-table>
+  </div>
 
   <q-dialog v-model="dialog" class="dialog" persistent>
     <q-card style="min-width: 350px" class="bg-grey-11">
@@ -461,6 +517,7 @@ watch(posTypeId, () => {
             maxlength="13"
             hide-bottom-space
             mask="#############"
+            @update:model-value="changeCardID"
           />
           <q-input
             ref="positionRef"