From 5593d0a8dc4dff008105953fdbda584dd6786c39 Mon Sep 17 00:00:00 2001
From: setthawutttty <stw.ttty@gmail.com>
Date: Thu, 11 Jan 2024 17:21:51 +0700
Subject: [PATCH] =?UTF-8?q?=E0=B8=9B=E0=B8=A3=E0=B8=B1=E0=B8=9A=20?=
 =?UTF-8?q?=E0=B9=80=E0=B9=80=E0=B8=AA=E0=B8=94=E0=B8=87=E0=B8=A3=E0=B8=B2?=
 =?UTF-8?q?=E0=B8=A2=E0=B8=A5=E0=B8=B0=E0=B9=80=E0=B8=AD=E0=B8=B5=E0=B8=A2?=
 =?UTF-8?q?=E0=B8=94=20=E0=B8=A3=E0=B8=B2=E0=B8=A2=E0=B8=9A=E0=B8=B8?=
 =?UTF-8?q?=E0=B8=84=E0=B8=84=E0=B8=A5=E0=B8=A3=E0=B8=B0=E0=B8=9A=E0=B8=9A?=
 =?UTF-8?q?=20=E0=B8=9A=E0=B8=A3=E0=B8=A3=E0=B8=88=E0=B8=B8/=E0=B8=9E?=
 =?UTF-8?q?=E0=B9=89=E0=B8=99=E0=B8=A3=E0=B8=B2=E0=B8=8A=E0=B8=81=E0=B8=B2?=
 =?UTF-8?q?=E0=B8=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/AppointEmployee/Detail.vue     | 22 +++++++++++--
 .../components/AppointMent/Detail.vue         | 22 +++++++++++--
 .../05_placement/components/Other/Detail.vue  | 23 ++++++++++++--
 .../components/Relocation/RelocationbyId.vue  | 26 ++++++++++++----
 .../components/Repatriate/RepatriatebyId.vue  | 21 ++++++++++++-
 .../components/Transfer/transferRegistry.vue  | 23 ++++++++++++--
 .../helpgovernment/governmentDetail.vue       | 22 +++++++++++--
 .../components/probation/ProbationDetail.vue  | 23 ++++++++++++--
 .../Discharged/dischargedRegistry.vue         | 23 ++++++++++++--
 .../components/DismissOrder/outRegistry.vue   | 22 +++++++++++--
 .../Expulsion/expulsionRegistry.vue           | 22 +++++++++++--
 .../components/ListRetirement/TableList.vue   | 20 +++++++++++-
 .../components/resign/DetailDeceased.vue      | 26 ++++++++++++----
 .../components/resign/ResignByid.vue          | 31 +++++++++++++------
 .../components/7_ListSuspend/DetailPage.vue   | 21 +++++++++++--
 15 files changed, 303 insertions(+), 44 deletions(-)

diff --git a/src/modules/05_placement/components/AppointEmployee/Detail.vue b/src/modules/05_placement/components/AppointEmployee/Detail.vue
index 80b878a66..f3c5954e3 100644
--- a/src/modules/05_placement/components/AppointEmployee/Detail.vue
+++ b/src/modules/05_placement/components/AppointEmployee/Detail.vue
@@ -13,7 +13,10 @@ import type {
 import type { QForm } from "quasar";
 import http from "@/plugins/http";
 import config from "@/app.config";
-
+import PopupPersonal from "@/components/Dialogs/PopupPersonal.vue";
+  
+const modalPersonal = ref<boolean>(false);
+const personId = ref<string>("");
 const $q = useQuasar();
 const route = useRoute();
 const router = useRouter();
@@ -146,6 +149,15 @@ const getClass = (val: boolean) => {
   };
 };
 
+function onclickViewinfo(id: string) {
+  modalPersonal.value = true;
+  personId.value = id;
+}
+
+function updatemodalPersonal(modal: boolean) {
+  modalPersonal.value = modal;
+}
+
 onMounted(async () => {
   await fecthappointmentByid();
 });
@@ -163,7 +175,7 @@ onMounted(async () => {
       </div>
       <q-space />
       <q-btn outline color="blue" dense icon-right="mdi-open-in-new" class="q-px-sm" label="ดูข้อมูลทะเบียนประวัติ"
-        @click="router.push(`/registry/${profileId}`)" />
+        @click="onclickViewinfo(profileId)" />
     </div>
     <div class="col-12"><q-separator /></div>
     <div class="row col-12 q-pa-md">
@@ -304,6 +316,12 @@ onMounted(async () => {
       </div>
     </q-form>
   </q-card>
+
+  <PopupPersonal
+    :modal="modalPersonal"
+    :id="personId"
+    @update:modal="updatemodalPersonal"
+  />
 </template>
 <style lang="scss" scope>
 .q-img {
diff --git a/src/modules/05_placement/components/AppointMent/Detail.vue b/src/modules/05_placement/components/AppointMent/Detail.vue
index a8140765d..fbfd54ba2 100644
--- a/src/modules/05_placement/components/AppointMent/Detail.vue
+++ b/src/modules/05_placement/components/AppointMent/Detail.vue
@@ -13,7 +13,10 @@ import type {
 import type { QForm } from "quasar";
 import http from "@/plugins/http";
 import config from "@/app.config";
-
+import PopupPersonal from "@/components/Dialogs/PopupPersonal.vue";
+  
+const modalPersonal = ref<boolean>(false);
+const personId = ref<string>("");
 const $q = useQuasar();
 const route = useRoute();
 const router = useRouter();
@@ -147,6 +150,15 @@ const getClass = (val: boolean) => {
   };
 };
 
+function onclickViewinfo(id: string) {
+  modalPersonal.value = true;
+  personId.value = id;
+}
+
+function updatemodalPersonal(modal: boolean) {
+  modalPersonal.value = modal;
+}
+
 onMounted(async () => {
   await fecthappointmentByid();
 });
@@ -178,7 +190,7 @@ onMounted(async () => {
         icon-right="mdi-open-in-new"
         class="q-px-sm"
         label="ดูข้อมูลทะเบียนประวัติ"
-        @click="router.push(`/registry/${profileId}`)"
+        @click="onclickViewinfo(profileId)"
       />
     </div>
     <div class="col-12"><q-separator /></div>
@@ -427,6 +439,12 @@ onMounted(async () => {
       </div>
     </q-form>
   </q-card>
+
+  <PopupPersonal
+    :modal="modalPersonal"
+    :id="personId"
+    @update:modal="updatemodalPersonal"
+  />
 </template>
 <style lang="scss" scope>
 .q-img {
diff --git a/src/modules/05_placement/components/Other/Detail.vue b/src/modules/05_placement/components/Other/Detail.vue
index fee982453..714390ecb 100644
--- a/src/modules/05_placement/components/Other/Detail.vue
+++ b/src/modules/05_placement/components/Other/Detail.vue
@@ -17,7 +17,10 @@ import config from "@/app.config";
 import keycloak from "@/plugins/keycloak";
 
 import CurruncyInput from "@/components/CurruncyInput.vue";
-
+import PopupPersonal from "@/components/Dialogs/PopupPersonal.vue";
+  
+const modalPersonal = ref<boolean>(false);
+const personId = ref<string>("");
 const $q = useQuasar();
 const route = useRoute();
 const router = useRouter();
@@ -179,6 +182,16 @@ const getClass = (val: boolean) => {
     "full-width cursor-pointer": !val,
   };
 };
+
+function onclickViewinfo(id: string) {
+  modalPersonal.value = true;
+  personId.value = id;
+}
+
+function updatemodalPersonal(modal: boolean) {
+  modalPersonal.value = modal;
+}
+
 onMounted(async () => {
   if (keycloak.tokenParsed != null) {
     roleAdmin.value = await keycloak.tokenParsed.role.includes("placement1");
@@ -213,7 +226,7 @@ onMounted(async () => {
         icon-right="mdi-open-in-new"
         class="q-px-sm"
         label="ดูข้อมูลทะเบียนประวัติ"
-        @click="router.push(`/registry/${responseData.profileId}`)"
+        @click="onclickViewinfo(responseData.profileId)"
       />
     </div>
     <div class="col-12"><q-separator /></div>
@@ -559,6 +572,12 @@ onMounted(async () => {
       </div>
     </q-form>
   </q-card>
+
+  <PopupPersonal
+    :modal="modalPersonal"
+    :id="personId"
+    @update:modal="updatemodalPersonal"
+  />
 </template>
 
 <style lang="scss" scope>
diff --git a/src/modules/05_placement/components/Relocation/RelocationbyId.vue b/src/modules/05_placement/components/Relocation/RelocationbyId.vue
index adbade974..964b99a7a 100644
--- a/src/modules/05_placement/components/Relocation/RelocationbyId.vue
+++ b/src/modules/05_placement/components/Relocation/RelocationbyId.vue
@@ -9,11 +9,10 @@ import config from "@/app.config";
 import keycloak from "@/plugins/keycloak";
 import CurrencyInput from "@/components/CurruncyInput.vue";
 import type { QTableProps, QForm } from "quasar";
-// import type {
-//   TypeFile,
-//   ResponseDataDetail,
-// } from "@/modules/05_placement/interface/response/Transfer";
-
+import PopupPersonal from "@/components/Dialogs/PopupPersonal.vue";
+  
+const modalPersonal = ref<boolean>(false);
+const personId = ref<string>("");
 const $q = useQuasar();
 const route = useRoute();
 const router = useRouter();
@@ -220,6 +219,15 @@ const saveData = async () => {
     });
 };
 
+function onclickViewinfo(id: string) {
+  modalPersonal.value = true;
+  personId.value = id;
+}
+
+function updatemodalPersonal(modal: boolean) {
+  modalPersonal.value = modal;
+}
+
 onMounted(async () => {
   await getData();
 });
@@ -249,7 +257,7 @@ onMounted(async () => {
         icon-right="mdi-open-in-new"
         class="q-px-sm"
         label="ดูข้อมูลทะเบียนประวัติ"
-        @click="router.push(`/registry/${profileId}`)"
+        @click="onclickViewinfo(profileId)"
       />
     </div>
     <div class="col-12"><q-separator /></div>
@@ -496,6 +504,12 @@ onMounted(async () => {
       </div>
     </q-form>
   </q-card>
+
+  <PopupPersonal
+    :modal="modalPersonal"
+    :id="personId"
+    @update:modal="updatemodalPersonal"
+  />
 </template>
 
 <style lang="scss" scope>
diff --git a/src/modules/05_placement/components/Repatriate/RepatriatebyId.vue b/src/modules/05_placement/components/Repatriate/RepatriatebyId.vue
index bcc6e965a..8f63424cd 100644
--- a/src/modules/05_placement/components/Repatriate/RepatriatebyId.vue
+++ b/src/modules/05_placement/components/Repatriate/RepatriatebyId.vue
@@ -12,6 +12,10 @@ import config from "@/app.config";
 
 import type { QForm } from "quasar";
 import type { ResponseData } from "@/modules/05_placement/interface/response/officer";
+import PopupPersonal from "@/components/Dialogs/PopupPersonal.vue";
+  
+const modalPersonal = ref<boolean>(false);
+const personalId = ref<string>("");
 const $q = useQuasar();
 const route = useRoute();
 const router = useRouter();
@@ -141,6 +145,15 @@ const saveData = async () => {
     });
 };
 
+function onclickViewinfo(id: string) {
+  modalPersonal.value = true;
+  personalId.value = id;
+}
+
+function updatemodalPersonal(modal: boolean) {
+  modalPersonal.value = modal;
+}
+
 onMounted(async () => {
   await getData();
 });
@@ -173,7 +186,7 @@ onMounted(async () => {
         icon-right="mdi-open-in-new"
         class="q-px-sm"
         label="ดูข้อมูลทะเบียนประวัติ"
-        @click="router.push(`/registry/${personId}`)"
+        @click="onclickViewinfo(personId)"
       />
     </div>
     <div class="col-12"><q-separator /></div>
@@ -467,6 +480,12 @@ onMounted(async () => {
       </div>
     </q-form>
   </q-card>
+
+  <PopupPersonal
+    :modal="modalPersonal"
+    :id="personalId"
+    @update:modal="updatemodalPersonal"
+  />
 </template>
 
 <style lang="scss" scope>
diff --git a/src/modules/05_placement/components/Transfer/transferRegistry.vue b/src/modules/05_placement/components/Transfer/transferRegistry.vue
index 3487828bd..957985933 100644
--- a/src/modules/05_placement/components/Transfer/transferRegistry.vue
+++ b/src/modules/05_placement/components/Transfer/transferRegistry.vue
@@ -15,7 +15,10 @@ import type {
   ResponseDataDetail,
   rowFile,
 } from "@/modules/05_placement/interface/response/Transfer";
-
+import PopupPersonal from "@/components/Dialogs/PopupPersonal.vue";
+  
+const modalPersonal = ref<boolean>(false);
+const personId = ref<string>("");
 const $q = useQuasar();
 const route = useRoute();
 const router = useRouter();
@@ -285,6 +288,16 @@ const getClass = (val: boolean) => {
     "full-width cursor-pointer": !val,
   };
 };
+
+function onclickViewinfo(id: string) {
+  modalPersonal.value = true;
+  personId.value = id;
+}
+
+function updatemodalPersonal(modal: boolean) {
+  modalPersonal.value = modal;
+}
+
 onMounted(async () => {
   if (keycloak.tokenParsed != null) {
     roleAdmin.value = await keycloak.tokenParsed.role.includes("placement1");
@@ -319,7 +332,7 @@ onMounted(async () => {
         icon-right="mdi-open-in-new"
         class="q-px-sm"
         label="ดูข้อมูลทะเบียนประวัติ"
-        @click="router.push(`/registry/${responseData.profileId}`)"
+        @click="onclickViewinfo(responseData.profileId)"
       />
     </div>
     <div class="col-12"><q-separator /></div>
@@ -697,6 +710,12 @@ onMounted(async () => {
       </div>
     </q-form>
   </q-card>
+
+  <PopupPersonal
+    :modal="modalPersonal"
+    :id="personId"
+    @update:modal="updatemodalPersonal"
+  />
 </template>
 
 <style lang="scss" scope>
diff --git a/src/modules/05_placement/components/helpgovernment/governmentDetail.vue b/src/modules/05_placement/components/helpgovernment/governmentDetail.vue
index b58e63ee5..63a13f632 100644
--- a/src/modules/05_placement/components/helpgovernment/governmentDetail.vue
+++ b/src/modules/05_placement/components/helpgovernment/governmentDetail.vue
@@ -7,7 +7,10 @@ import http from "@/plugins/http";
 import config from "@/app.config";
 import type { QForm } from "quasar";
 import type { resHelpDetail } from "@/modules/05_placement/interface/response/officer";
-
+import PopupPersonal from "@/components/Dialogs/PopupPersonal.vue";
+  
+const modalPersonal = ref<boolean>(false);
+const personId = ref<string>("");
 const $q = useQuasar();
 const route = useRoute();
 const router = useRouter();
@@ -134,6 +137,15 @@ const saveData = async () => {
     });
 };
 
+function onclickViewinfo(id: string) {
+  modalPersonal.value = true;
+  personId.value = id;
+}
+
+function updatemodalPersonal(modal: boolean) {
+  modalPersonal.value = modal;
+}
+
 onMounted(async () => {
   await getData();
 });
@@ -164,7 +176,7 @@ onMounted(async () => {
         icon-right="mdi-open-in-new"
         class="q-px-sm"
         label="ดูข้อมูลทะเบียนประวัติ"
-        @click="router.push(`/registry/${profileId}`)"
+        @click="onclickViewinfo(profileId)"
       />
     </div>
     <div class="col-12"><q-separator /></div>
@@ -393,6 +405,12 @@ onMounted(async () => {
       </div>
     </q-form>
   </q-card>
+
+  <PopupPersonal
+    :modal="modalPersonal"
+    :id="personId"
+    @update:modal="updatemodalPersonal"
+  />
 </template>
 
 <style lang="scss" scope>
diff --git a/src/modules/05_placement/components/probation/ProbationDetail.vue b/src/modules/05_placement/components/probation/ProbationDetail.vue
index 09434854d..f136d8f91 100644
--- a/src/modules/05_placement/components/probation/ProbationDetail.vue
+++ b/src/modules/05_placement/components/probation/ProbationDetail.vue
@@ -7,7 +7,10 @@ import { useCounterMixin } from "@/stores/mixin";
 import { useQuasar } from "quasar";
 import http from "@/plugins/http";
 import config from "@/app.config";
-
+import PopupPersonal from "@/components/Dialogs/PopupPersonal.vue";
+  
+const modalPersonal = ref<boolean>(false);
+const personId = ref<string>("");
 const router = useRouter();
 const route = useRoute();
 const personalId = ref<string>(route.params.id as string);
@@ -232,6 +235,15 @@ function paginationLabel(start: string, end: string, total: string){
   else return start + "-" + end + " ใน " + total;
 };
 
+function onclickViewinfo(id: string) {
+  modalPersonal.value = true;
+  personId.value = id;
+}
+
+function updatemodalPersonal(modal: boolean) {
+  modalPersonal.value = modal;
+}
+
 /** get ค่า เมื่อโหลดหน้า */
 onMounted(async () => {
   await getpersonalList();
@@ -264,7 +276,7 @@ onMounted(async () => {
         icon-right="mdi-open-in-new"
         class="q-px-sm"
         label="ดูข้อมูลทะเบียนประวัติ"
-        @click="router.push(`/registry/${personalId}`)"
+        @click="onclickViewinfo(personalId)"
       />
     </div>
     <div class="col-12"><q-separator /></div>
@@ -435,6 +447,13 @@ onMounted(async () => {
       </div>
     </div>
   </q-card>
+
+
+  <PopupPersonal
+    :modal="modalPersonal"
+    :id="personId"
+    @update:modal="updatemodalPersonal"
+  />
 </template>
 
 <style lang="scss" scope>
diff --git a/src/modules/06_retirement/components/Discharged/dischargedRegistry.vue b/src/modules/06_retirement/components/Discharged/dischargedRegistry.vue
index fc4db639a..46b1805c7 100644
--- a/src/modules/06_retirement/components/Discharged/dischargedRegistry.vue
+++ b/src/modules/06_retirement/components/Discharged/dischargedRegistry.vue
@@ -11,7 +11,10 @@ import keycloak from "@/plugins/keycloak";
 /**Import type */
 import type { QForm } from "quasar";
 import type { ResponseDataDetail } from "@/modules/06_retirement/interface/response/discharged";
-
+import PopupPersonal from "@/components/Dialogs/PopupPersonal.vue";
+  
+const modalPersonal = ref<boolean>(false);
+const personId = ref<string>("");
 /** use */
 const $q = useQuasar();
 const route = useRoute();
@@ -175,6 +178,16 @@ const getClass = (val: boolean) => {
     "full-width cursor-pointer": !val,
   };
 };
+
+function onclickViewinfo(id: string) {
+  modalPersonal.value = true;
+  personId.value = id;
+}
+
+function updatemodalPersonal(modal: boolean) {
+  modalPersonal.value = modal;
+}
+
 </script>
 <template>
   <div class="toptitle text-dark col-12 row items-center">
@@ -203,7 +216,7 @@ const getClass = (val: boolean) => {
         icon-right="mdi-open-in-new"
         class="q-px-sm"
         label="ดูข้อมูลทะเบียนประวัติ"
-        @click="router.push(`/registry/${responseData.personId}`)"
+        @click="onclickViewinfo(responseData.personId)"
       />
     </div>
     <div class="col-12"><q-separator /></div>
@@ -453,6 +466,12 @@ const getClass = (val: boolean) => {
       </div>
     </q-form>
   </q-card>
+
+  <PopupPersonal
+    :modal="modalPersonal"
+    :id="personId"
+    @update:modal="updatemodalPersonal"
+  />
 </template>
 <style lang="scss" scope>
 .q-img {
diff --git a/src/modules/06_retirement/components/DismissOrder/outRegistry.vue b/src/modules/06_retirement/components/DismissOrder/outRegistry.vue
index b582b0a4b..4b632fa7d 100644
--- a/src/modules/06_retirement/components/DismissOrder/outRegistry.vue
+++ b/src/modules/06_retirement/components/DismissOrder/outRegistry.vue
@@ -11,7 +11,10 @@ import keycloak from "@/plugins/keycloak";
 /**Import type */
 import type { QForm } from "quasar";
 import type { ResponseDataDetail } from "@/modules/06_retirement/interface/response/expulsion";
-
+import PopupPersonal from "@/components/Dialogs/PopupPersonal.vue";
+  
+const modalPersonal = ref<boolean>(false);
+const personId = ref<string>("");
 /** use */
 const $q = useQuasar();
 const route = useRoute();
@@ -179,6 +182,15 @@ const getClass = (val: boolean) => {
     "full-width cursor-pointer": !val,
   };
 };
+
+function onclickViewinfo(id: string) {
+  modalPersonal.value = true;
+  personId.value = id;
+}
+
+function updatemodalPersonal(modal: boolean) {
+  modalPersonal.value = modal;
+}
 </script>
 <template>
   <div class="toptitle text-dark col-12 row items-center">
@@ -207,7 +219,7 @@ const getClass = (val: boolean) => {
         icon-right="mdi-open-in-new"
         class="q-px-sm"
         label="ดูข้อมูลทะเบียนประวัติ"
-        @click="router.push(`/registry/${responseData.personId}`)"
+        @click="onclickViewinfo(responseData.personId)"
       />
     </div>
     <div class="col-12"><q-separator /></div>
@@ -457,6 +469,12 @@ const getClass = (val: boolean) => {
       </div>
     </q-form>
   </q-card>
+
+  <PopupPersonal
+    :modal="modalPersonal"
+    :id="personId"
+    @update:modal="updatemodalPersonal"
+  />
 </template>
 <style lang="scss" scope>
 .q-img {
diff --git a/src/modules/06_retirement/components/Expulsion/expulsionRegistry.vue b/src/modules/06_retirement/components/Expulsion/expulsionRegistry.vue
index c440012e3..fa9bc6187 100644
--- a/src/modules/06_retirement/components/Expulsion/expulsionRegistry.vue
+++ b/src/modules/06_retirement/components/Expulsion/expulsionRegistry.vue
@@ -10,7 +10,10 @@ import keycloak from "@/plugins/keycloak";
 /**Import Type */
 import type { QForm } from "quasar";
 import type { ResponseDataDetail } from "@/modules/06_retirement/interface/response/expulsion";
-
+import PopupPersonal from "@/components/Dialogs/PopupPersonal.vue";
+  
+const modalPersonal = ref<boolean>(false);
+const personId = ref<string>("");
 /** Use */
 const $q = useQuasar();
 const route = useRoute();
@@ -175,6 +178,15 @@ const getClass = (val: boolean) => {
     "full-width cursor-pointer": !val,
   };
 };
+
+function onclickViewinfo(id: string) {
+  modalPersonal.value = true;
+  personId.value = id;
+}
+
+function updatemodalPersonal(modal: boolean) {
+  modalPersonal.value = modal;
+}
 </script>
 <template>
   <div class="toptitle text-dark col-12 row items-center">
@@ -203,7 +215,7 @@ const getClass = (val: boolean) => {
         icon-right="mdi-open-in-new"
         class="q-px-sm"
         label="ดูข้อมูลทะเบียนประวัติ"
-        @click="router.push(`/registry/${responseData.personId}`)"
+        @click="onclickViewinfo(responseData.personId)"
       />
     </div>
     <div class="col-12"><q-separator /></div>
@@ -467,6 +479,12 @@ const getClass = (val: boolean) => {
       </div>
     </q-form>
   </q-card>
+
+  <PopupPersonal
+    :modal="modalPersonal"
+    :id="personId"
+    @update:modal="updatemodalPersonal"
+  />
 </template>
 <style lang="scss" scope>
 .q-img {
diff --git a/src/modules/06_retirement/components/ListRetirement/TableList.vue b/src/modules/06_retirement/components/ListRetirement/TableList.vue
index 08618d96d..f4dc09335 100644
--- a/src/modules/06_retirement/components/ListRetirement/TableList.vue
+++ b/src/modules/06_retirement/components/ListRetirement/TableList.vue
@@ -9,7 +9,10 @@ import http from "@/plugins/http";
 import config from "@/app.config";
 import DialogHeader from "@/components/DialogHeader.vue";
 import DialogPopupReason from "@/components/Dialogs/PopupReason.vue";
+import PopupPersonal from "@/components/Dialogs/PopupPersonal.vue";
 
+const modalPersonal = ref<boolean>(false);
+const personId = ref<string>("");
 /** Use */
 const route = useRoute();
 const router = useRouter();
@@ -443,6 +446,15 @@ const paginationLabel = (start: number, end: number, total: number) => {
   if (paging.value == true) return " " + start + "-" + end + " ใน " + total;
   else return start + "-" + end + " ใน " + total;
 };
+
+function onclickViewinfo(id: string) {
+  modalPersonal.value = true;
+  personId.value = id;
+}
+
+function updatemodalPersonal(modal: boolean) {
+  modalPersonal.value = modal;
+}
 </script>
 
 <template>
@@ -642,7 +654,7 @@ const paginationLabel = (start: number, end: number, total: number) => {
               :props="props"
               class="cursor-pointer"
               :style="props.row.profileId === profileId && 'color: #26a69a;'"
-              @click.stop="router.push(`/registry/${props.row.profileId}`)"
+              @click.stop="onclickViewinfo(props.row.profileId)"
             >
               <q-td key="order" :props="props">{{ props.row.order }} </q-td>
               <q-td key="name" :props="props">{{ props.row.name }}</q-td>
@@ -871,6 +883,12 @@ const paginationLabel = (start: number, end: number, total: number) => {
     :savaForm="saveEdiitReport"
     :textReport="textReport"
   />
+
+  <PopupPersonal
+    :modal="modalPersonal"
+    :id="personId"
+    @update:modal="updatemodalPersonal"
+  />
 </template>
 
 <style lang="scss" scope>
diff --git a/src/modules/06_retirement/components/resign/DetailDeceased.vue b/src/modules/06_retirement/components/resign/DetailDeceased.vue
index c8da5a8fd..b0f87f7ee 100644
--- a/src/modules/06_retirement/components/resign/DetailDeceased.vue
+++ b/src/modules/06_retirement/components/resign/DetailDeceased.vue
@@ -5,7 +5,10 @@ import { ref, onMounted } from "vue";
 import { useCounterMixin } from "@/stores/mixin";
 import http from "@/plugins/http";
 import config from "@/app.config";
-
+import PopupPersonal from "@/components/Dialogs/PopupPersonal.vue";
+  
+const modalPersonal = ref<boolean>(false);
+const personId = ref<string>("");
 /**use*/
 const $q = useQuasar();
 const router = useRouter();
@@ -39,10 +42,6 @@ const fectdata = async () => {
     });
 };
 
-//กลับไปหน้า registry
-const redirectToRegistry = (id: string) => {
-  router.push(`/registry/${id}`);
-};
 
 //เปิดdetail ของ deceased
 const openDeceased = (id: string) => {
@@ -88,6 +87,15 @@ const fileDownload = async (type: string) => {
       hideLoader();
     });
 };
+
+function onclickViewinfo(id: string) {
+  modalPersonal.value = true;
+  personId.value = id;
+}
+
+function updatemodalPersonal(modal: boolean) {
+  modalPersonal.value = modal;
+}
 </script>
 
 <template>
@@ -117,7 +125,7 @@ const fileDownload = async (type: string) => {
         icon-right="mdi-open-in-new"
         class="q-px-sm"
         label="ดูข้อมูลทะเบียนประวัติ"
-        @click="redirectToRegistry(detail.profileId)"
+        @click="onclickViewinfo(detail.profileId)"
       />
     </div>
     <div class="col-12"><q-separator /></div>
@@ -236,6 +244,12 @@ const fileDownload = async (type: string) => {
       </div>
     </div>
   </q-card>
+
+  <PopupPersonal
+    :modal="modalPersonal"
+    :id="personId"
+    @update:modal="updatemodalPersonal"
+  />
 </template>
 
 <style lang="scss" scope>
diff --git a/src/modules/06_retirement/components/resign/ResignByid.vue b/src/modules/06_retirement/components/resign/ResignByid.vue
index ef2a8a06d..5542de9b3 100644
--- a/src/modules/06_retirement/components/resign/ResignByid.vue
+++ b/src/modules/06_retirement/components/resign/ResignByid.vue
@@ -15,7 +15,10 @@ import type {
   rowFile,
 } from "@/modules/06_retirement/interface/response/Main";
 import type { QTableProps } from "quasar";
-
+import PopupPersonal from "@/components/Dialogs/PopupPersonal.vue";
+  
+const modalPersonal = ref<boolean>(false);
+const personId = ref<string>("");
 /** Use */
 const $q = useQuasar();
 const route = useRoute();
@@ -269,14 +272,6 @@ const rejectpopUp = async () => {
   );
 };
 
-/**
- * ไปยังข้อมูล
- * @param id ไอดีข้อมูล
- */
-const redirectToRegistry = (id: string) => {
-  router.push(`/registry/${id}`);
-};
-
 /**
  * กดยกเลิก
  */
@@ -395,6 +390,15 @@ const downloadFile = (response: any, filename: string) => {
   link.click();
   document.body.removeChild(link);
 };
+
+function onclickViewinfo(id: string) {
+  modalPersonal.value = true;
+  personId.value = id;
+}
+
+function updatemodalPersonal(modal: boolean) {
+  modalPersonal.value = modal;
+}
 </script>
 <template>
   <div class="toptitle text-dark col-12 row items-center">
@@ -424,7 +428,7 @@ const downloadFile = (response: any, filename: string) => {
         icon-right="mdi-open-in-new"
         class="q-px-sm"
         label="ดูข้อมูลทะเบียนประวัติ"
-        @click="redirectToRegistry(dataDetail.profileId)"
+        @click="onclickViewinfo(dataDetail.profileId)"
       />
     </div>
     <div class="col-12"><q-separator /></div>
@@ -1091,6 +1095,13 @@ const downloadFile = (response: any, filename: string) => {
       </q-form>
     </q-card>
   </q-dialog>
+
+  <PopupPersonal
+    :modal="modalPersonal"
+    :id="personId"
+    @update:modal="updatemodalPersonal"
+  />
+
 </template>
 
 <style lang="scss" scope>
diff --git a/src/modules/11_discipline/components/7_ListSuspend/DetailPage.vue b/src/modules/11_discipline/components/7_ListSuspend/DetailPage.vue
index 2b9c980da..436d88802 100644
--- a/src/modules/11_discipline/components/7_ListSuspend/DetailPage.vue
+++ b/src/modules/11_discipline/components/7_ListSuspend/DetailPage.vue
@@ -12,7 +12,10 @@ import { useDisciplineSuspendStore } from "@/modules/11_discipline/store/Suspend
 /**Import type */
 import type { QForm } from "quasar";
 import type { dataDetail } from "@/modules/11_discipline/interface/response/suspend";
-
+import PopupPersonal from "@/components/Dialogs/PopupPersonal.vue";
+  
+const modalPersonal = ref<boolean>(false);
+const personId = ref<string>("");
 /** use */
 const dataStore = useDisciplineSuspendStore();
 const $q = useQuasar();
@@ -170,6 +173,14 @@ function getClass(val: boolean){
   };
 };
 
+function onclickViewinfo(id: string) {
+  modalPersonal.value = true;
+  personId.value = id;
+}
+
+function updatemodalPersonal(modal: boolean) {
+  modalPersonal.value = modal;
+}
 
 /** Hook */
 onMounted(async () => {
@@ -206,7 +217,7 @@ onMounted(async () => {
         icon-right="mdi-open-in-new"
         class="q-px-sm"
         label="ดูข้อมูลทะเบียนประวัติ"
-        @click="router.push(`/registry/${data.personId}`)"
+        @click="onclickViewinfo(data.personId)"
       />
     </div>
     <div class="col-12"><q-separator /></div>
@@ -541,6 +552,12 @@ onMounted(async () => {
       </div>
     </q-form>
   </q-card>
+
+  <PopupPersonal
+    :modal="modalPersonal"
+    :id="personId"
+    @update:modal="updatemodalPersonal"
+  />
 </template>
 <style lang="scss" scope>
 .q-img {