ดูข้อมูลในทะเบียนประวัติ ปรับ UI

src/modules/11_discipline/components/3_InvestigateDisciplinary/Form.vue

@@ -35,6 +35,10 @@ import { useComplainstDataStore } from "@/modules/11_discipline/store/Complaints
 import { useInvestigateDisStore } from "@/modules/11_discipline/store/InvestigateDisStore";
 import { useDisciplineMainStore } from "@/modules/11_discipline/store/main";
 import DialogDuty from "@/modules/11_discipline/components/DialogDuty.vue";
+import PopupPersonal from "@/components/Dialogs/PopupPersonal.vue";
+
+const modalPersonal = ref<boolean>(false);
+const personId = ref<string>("");
 
 const calendarModal = ref<boolean>(false);
 const calendarModalclose = () => (calendarModal.value = !calendarModal.value);
@@ -613,6 +617,15 @@ async function saveDuty(id: string, duty: string, resolution: string) {
     });
 }
 
+function onclickViewinfo(id: string) {
+  modalPersonal.value = true;
+  personId.value = id;
+}
+
+function updatemodalPersonal(modal: boolean) {
+  modalPersonal.value = modal;
+}
+
 /** Hook */
 onMounted(async () => {
   mainStore.rowsAdd = [];
@@ -808,15 +821,16 @@ onMounted(async () => {
                         <template v-slot:body="props">
                           <q-tr :props="props" class="cursor-pointer">
                             <td>
-                              <router-link
-                                target="_blank"
-                                :to="`/registry/${props.row.personId}`"
-                                ><q-icon name="info" color="info" size="sm"
-                                  ><q-tooltip
-                                    >ดูข้อมูลในทะเบียนประวัติ</q-tooltip
-                                  >
-                                </q-icon></router-link
-                              >
+                              <q-btn
+                          dense
+                          flat
+                          round
+                          color="info"
+                          icon="info"
+                          @click="onclickViewinfo(props.row.personId)"
+                        >
+                          <q-tooltip>ดูข้อมูลในทะเบียนประวัติ</q-tooltip>
+                        </q-btn>
                             </td>
                             <q-td
                               v-for="col in props.cols"
@@ -1811,6 +1825,12 @@ onMounted(async () => {
     :checked-val="false"
     :fetch-data="fetchDataList"
   />
+
+  <PopupPersonal
+    :modal="modalPersonal"
+    :id="personId"
+    @update:modal="updatemodalPersonal"
+  />
 </template>
 
 <style scoped>