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

src/modules/11_discipline/components/4_Result/Form.vue

@@ -9,6 +9,7 @@ import { useInvestigateDisStore } from "@/modules/11_discipline/store/Investigat
 import { useDisciplineResultStore } from "@/modules/11_discipline/store/ResultStore";
 import { useDisciplineMainStore } from "@/modules/11_discipline/store/main";
 import DialogHistory from "@/modules/11_discipline/components/4_Result/DialogHistory.vue";
+import PopupPersonal from "@/components/Dialogs/PopupPersonal.vue";
 
 import type {
   FormData,
@@ -19,6 +20,9 @@ import type {
 } from "@/modules/11_discipline/interface/request/result";
 import DialogHeader from "@/components/DialogHeader.vue";
 
+const modalPersonal = ref<boolean>(false);
+const personId = ref<string>("");
+
 const countNum = ref<number>(1);
 const mainStore = useDisciplineMainStore();
 const modalPerson = ref<boolean>(false);
@@ -250,6 +254,16 @@ function closeDetail() {
   modalHistory.value = false;
   personalId.value = "";
 }
+
+function onclickViewinfo(id: string) {
+  modalPersonal.value = true;
+  personId.value = id;
+}
+
+function updatemodalPersonal(modal: boolean) {
+  modalPersonal.value = modal;
+}
+
 </script>
 <template>
   <div class="row q-col-gutter-sm">
@@ -363,13 +377,16 @@ function closeDetail() {
                       <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"
@@ -586,6 +603,12 @@ function closeDetail() {
     </div>
   </div>
 
+  <PopupPersonal
+    :modal="modalPersonal"
+    :id="personId"
+    @update:modal="updatemodalPersonal"
+  />
+
   <DialogHistory
     :modal="modalHistory"
     :close="closeDetail"