diff --git a/src/modules/07_insignia/components/2_Manage/Tab1.vue b/src/modules/07_insignia/components/2_Manage/Tab1.vue
index 8fc36d955..72fbeb429 100644
--- a/src/modules/07_insignia/components/2_Manage/Tab1.vue
+++ b/src/modules/07_insignia/components/2_Manage/Tab1.vue
@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { onMounted, ref, computed, reactive, watch } from "vue";
-
+import { checkPermission } from "@/utils/permissions";
 import { useQuasar, QForm } from "quasar";
 import http from "@/plugins/http";
 import config from "@/app.config";
@@ -14,6 +14,7 @@ import DialogPopupReason from "@/components/Dialogs/PopupReason.vue";
 import DialogInformation from "@/components/Dialogs/Information.vue";
 import DialogHeader from "@/components/DialogHeader.vue";
 import btnDownloadFile from "@/modules/07_insignia/components/2_Manage/downloadFile.vue";
+import PopupPersonal from "@/components/Dialogs/PopupPersonalNew.vue";
 
 /** import Stores*/
 import { useInsigniaDataStore } from "@/modules/07_insignia/store";
@@ -49,6 +50,7 @@ const dialogTitle = ref<string>("");
 const dialogDesc = ref<string>("");
 const typeinsigniaOptions = ref<any>(DataStore.typeinsigniaOptions);
 const employeeClassOps = ref<any>(DataStore.employeeClassOps);
+const modalPersonal = ref<boolean>(false);
 
 /**แจ้งเตือน*/
 const dialogWarn = ref<boolean>(false);
@@ -334,40 +336,6 @@ async function fecthlistperson(id: string = "") {
     .finally(() => {
       hideLoader();
     });
-
-  // let data = [{}];
-  // data = [
-  //   {
-  //     criteriaType: "is_retire",
-  //     criteriaValue: "false",
-  //   },
-  //   {
-  //     criteriaType: "is_probation",
-  //     criteriaValue: "false",
-  //   },
-  // ];
-  // await http
-  //   .post(config.API.profileSearchNewOcIdType(id, "officer"), {
-  //     criterias: data,
-  //   })
-  //   .then((res) => {
-  //     let data = res.data.result.map((e: any) => ({
-  //       id: e.id,
-  //       citizenId: e.citizenId,
-  //       fullname: e.fullname == null ? "-" : e.fullname,
-  //       position: e.position == null ? "-" : e.position,
-  //       level: e.positionEmployeeLevel == null ? "-" : e.positionEmployeeLevel,
-  //       organizationOrganization: e.oc == null ? "-" : e.oc,
-  //     }));
-  //     modalAdd.value = true;
-  //     rows2.value = data;
-  //   })
-  //   .catch((e) => {
-  //     messageError($q, e);
-  //   })
-  //   .finally(() => {
-  //     hideLoader();
-  //   });
 }
 
 /** update ค่า เเถวข้อมูล */
@@ -692,12 +660,21 @@ async function fecthInsignia() {
     });
 }
 
+function onclickViewinfo(id: string) {}
+
+const personId = ref<string>("");
 /**
  *  function redirect to ทะเบียนประวัติ
  * @param id profileId
  */
 function nextPage(id: string) {
-  router.push(`/registry-officer/${id}`);
+  modalPersonal.value = true;
+  personId.value = id;
+  // router.push(`/registry-officer/${id}`);
+}
+
+function updatemodalPersonal(modal: boolean) {
+  modalPersonal.value = modal;
 }
 
 /** ค้นหาข้อมุล table*/
@@ -994,11 +971,11 @@ onMounted(async () => {
           <q-space />
           <div>
             <q-btn
+              v-if="checkPermission($route)?.attrIsGet"
               :disable="
                 DataStore.employeeClass === 'all' ||
                 DataStore.typeinsignia === 'all'
               "
-              size="md"
               icon="mdi-download"
               flat
               round
@@ -1008,7 +985,6 @@ onMounted(async () => {
               <q-tooltip>ดาวน์โหลด</q-tooltip>
             </q-btn>
             <q-btn
-              size="12px"
               flat
               round
               color="add"
@@ -1018,7 +994,7 @@ onMounted(async () => {
                 (DataStore.isLock == false &&
                   DataStore.requestStatus == 'st5' &&
                   roleDataStore.adminRole) ||
-                checkStatus == true
+                (checkStatus == true && checkPermission($route)?.attrIsCreate)
               "
             >
               <q-tooltip>เพิ่ม</q-tooltip>
@@ -1051,6 +1027,7 @@ onMounted(async () => {
                   checkStatus == true
                 "
               />
+              <q-th v-else auto-width></q-th>
               <q-th auto-width></q-th>
               <q-th v-for="col in props.cols" :key="col.name" :props="props">
                 <span class="text-weight-medium">{{ col.label }}</span>
@@ -1058,13 +1035,8 @@ onMounted(async () => {
             </q-tr>
           </template>
           <template v-slot:body="props">
-            <q-tr
-              :props="props"
-              class="cursor-pointer"
-              @click.stop="nextPage(props.row.profileId)"
-            >
+            <q-tr :props="props">
               <q-td
-                v-close-popup
                 auto-width
                 v-if="
                   (DataStore.isLock == false &&
@@ -1077,46 +1049,57 @@ onMounted(async () => {
                   v-if="
                     roleDataStore.adminRole ||
                     (roleDataStore.insignia1Role &&
-                      (requestStatus == 'st1' || requestStatus == 'st4'))
+                      (requestStatus == 'st1' || requestStatus == 'st4') &&
+                      (checkPermission($route)?.attrIsGet ||
+                        checkPermission($route)?.attrIsUpdate))
                   "
-                  icon="mdi-dots-vertical"
-                  size="12px"
-                  color="grey-7"
                   flat
-                  round
                   dense
-                  @click.stop
+                  color="secondary"
+                  icon="mdi-dots-horizontal-circle-outline"
+                  round
                 >
                   <q-menu transition-show="jump-down" transition-hide="jump-up">
-                    <q-list dense style="min-width: 250px">
+                    <q-list dense>
+                      <!-- ดูข้อมูลทะเบียนประวัติ -->
                       <q-item
+                        v-if="checkPermission($route)?.attrIsGet"
+                        clickable
+                        @click.stop="nextPage(props.row.profileId)"
+                        v-close-popup
+                      >
+                        <q-item-section style="min-width: 0px" avatar>
+                          <q-icon color="info" size="xs" name="mdi-eye" />
+                        </q-item-section>
+                        <q-item-section>ดูข้อมูลทะเบียนประวัติ</q-item-section>
+                      </q-item>
+
+                      <!-- แก้ไขเครื่องราชฯ ที่ยื่นขอ -->
+                      <q-item
+                        v-if="
+                          checkPermission($route)?.attrIsGet &&
+                          checkPermission($route)?.attrIsUpdate
+                        "
                         clickable
                         @click.stop="clickmodalEdit(props.row)"
                         v-close-popup
                       >
-                        <q-item-section
-                          style="min-width: 0px"
-                          avatar
-                          class="q-py-sm"
-                        >
-                          <q-tooltip>แก้ไขเครื่องราชฯ ที่ยื่นขอ</q-tooltip>
-                          <q-icon color="primary" size="xs" name="mdi-pencil" />
+                        <q-item-section style="min-width: 0px" avatar>
+                          <q-icon color="edit" size="xs" name="edit" />
                         </q-item-section>
                         <q-item-section
                           >แก้ไขเครื่องราชฯ ที่ยื่นขอ</q-item-section
                         >
                       </q-item>
+
+                      <!-- ไม่ยื่นขอ -->
                       <q-item
+                        v-if="checkPermission($route)?.attrIsUpdate"
                         clickable
                         @click.stop="clickReject(props.row.id)"
                         v-close-popup
                       >
-                        <q-item-section
-                          style="min-width: 0px"
-                          avatar
-                          class="q-py-sm"
-                        >
-                          <q-tooltip>ไม่ยื่นขอ</q-tooltip>
+                        <q-item-section style="min-width: 0px" avatar>
                           <q-icon
                             color="blue"
                             size="xs"
@@ -1125,18 +1108,16 @@ onMounted(async () => {
                         </q-item-section>
                         <q-item-section>ไม่ยื่นขอ</q-item-section>
                       </q-item>
+
+                      <!-- ลบออก -->
                       <q-item
+                        v-if="checkPermission($route)?.attrIsUpdate"
                         clickable
                         @click.stop="clickDelete(props.row.id)"
                         v-close-popup
                       >
-                        <q-item-section
-                          style="min-width: 0px"
-                          avatar
-                          class="q-py-sm"
-                        >
-                          <q-tooltip>ลบออก</q-tooltip>
-                          <q-icon color="red" size="xs" name="mdi-delete" />
+                        <q-item-section style="min-width: 0px" avatar>
+                          <q-icon color="red" size="xs" name="delete" />
                         </q-item-section>
                         <q-item-section>ลบออก</q-item-section>
                       </q-item>
@@ -1145,9 +1126,26 @@ onMounted(async () => {
                 </q-btn>
               </q-td>
 
+              <q-td v-else auto-width>
+                <q-btn
+                  v-if="checkPermission($route)?.attrIsGet"
+                  icon="mdi-eye"
+                  color="info"
+                  flat
+                  round
+                  dense
+                  @click.stop="nextPage(props.row.profileId)"
+                >
+                  <q-tooltip>ดูข้อมูลทะเบียนประวัติ</q-tooltip>
+                </q-btn>
+              </q-td>
+
               <q-td auto-width>
                 <btnDownloadFile
-                  v-if="props.row.insigniaSend == 'เหรียญจักรพรรดิมาลา'"
+                  v-if="
+                    props.row.insigniaSend == 'เหรียญจักรพรรดิมาลา' &&
+                    checkPermission($route)?.attrIsGet
+                  "
                   :profileId="props.row.profileId"
                   :round="DataStore.roundId"
                   :optionRound="DataStore.optionRound"
@@ -1189,9 +1187,8 @@ onMounted(async () => {
               </q-td>
               <q-td key="note" class="text-center">
                 <q-btn
-                  v-if="props.row.reason"
+                  v-if="props.row.reason && checkPermission($route)?.attrIsGet"
                   icon="mdi-information-outline"
-                  size="12px"
                   color="blue"
                   flat
                   round
@@ -1203,9 +1200,10 @@ onMounted(async () => {
               </q-td>
               <q-td key="warn" class="text-center">
                 <q-btn
-                  v-if="props.row.statusMark"
+                  v-if="
+                    props.row.statusMark && checkPermission($route)?.attrIsGet
+                  "
                   icon="mdi-information-outline"
-                  size="12px"
                   color="red"
                   flat
                   round
@@ -1231,25 +1229,9 @@ onMounted(async () => {
   <q-dialog v-model="modalAdd" persistent>
     <q-card style="width: 900px; max-width: 80vw">
       <DialogHeader tittle="เพิ่มรายชื่อ" :close="onCloseModalAdd" />
-      <!-- <q-toolbar class="q-py-md">
-        <q-toolbar-title class="text-h6"> </q-toolbar-title>
 
-        <q-btn
-          icon="close"
-          unelevated
-          round
-          dense
-          @click="
-            (modalAdd = false),
-              (formFilter.page = 1),
-              (formFilter.pageSize = 10),
-              (formFilter.searchField = 'citizenId'),
-              (formFilter.searchKeyword = '')
-          "
-          style="color: #ff8080; background-color: #ffdede"
-        />
-      </q-toolbar> -->
       <q-separator />
+
       <q-card-section class="q-pa-sm bg-grey-1">
         <div class="row col-12 q-col-gutter-sm">
           <div class="col-xs-12 col-sm-7">
@@ -1425,6 +1407,7 @@ onMounted(async () => {
           </div>
         </div>
       </q-card-section>
+
       <q-separator />
       <q-card-actions align="right">
         <q-btn unelevated label="บันทึก" color="public" @click="clickAdd">
@@ -1544,4 +1527,10 @@ onMounted(async () => {
       </div>
     </q-card>
   </q-dialog>
+
+  <PopupPersonal
+    :modal="modalPersonal"
+    :id="personId"
+    @update:modal="updatemodalPersonal"
+  />
 </template>
diff --git a/src/modules/07_insignia/components/2_Manage/Tab2.vue b/src/modules/07_insignia/components/2_Manage/Tab2.vue
index 23ebf945a..a7b5b122d 100644
--- a/src/modules/07_insignia/components/2_Manage/Tab2.vue
+++ b/src/modules/07_insignia/components/2_Manage/Tab2.vue
@@ -1,12 +1,14 @@
 <script setup lang="ts">
-import { onMounted, ref, watch, reactive } from "vue";
+import { onMounted, ref } from "vue";
 import { useRouter } from "vue-router";
+import { checkPermission } from "@/utils/permissions";
 
 /** import Type*/
 import type { QTableProps } from "quasar";
 
 /** import components*/
 import DialogInformation from "@/components/Dialogs/Information.vue";
+import PopupPersonal from "@/components/Dialogs/PopupPersonalNew.vue";
 
 /** import Stores */
 import { useInsigniaDataStore } from "@/modules/07_insignia/store";
@@ -167,12 +169,21 @@ function changtypeOc() {
   DataStore.typeOc = organization.value;
 }
 
+const modalPersonal = ref<boolean>(false);
+const personId = ref<string>("");
+
 /**
  *  function redirect ทะเบียนประวัติิ
  * @param id profileId
  */
 function nextPage(id: string) {
-  router.push(`/registry-officer/${id}`);
+  modalPersonal.value = true;
+  personId.value = id;
+  // router.push(`/registry-officer/${id}`);
+}
+
+function updatemodalPersonal(modal: boolean) {
+  modalPersonal.value = modal;
 }
 
 /** filter table*/
@@ -450,26 +461,22 @@ onMounted(async () => {
               <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"
-              @click="nextPage(props.row.profileId)"
-            >
-              <q-td v-if="props.row.requestNote != null" auto-width>
+            <q-tr :props="props">
+              <q-td auto-width>
                 <q-btn
+                  v-if="checkPermission($route)?.attrIsGet"
                   dense
-                  size="12px"
                   flat
                   round
-                  color="blue"
-                  @click.stop
-                  @click="showReson(props.row.name, props.row.requestNote)"
-                  icon="mdi-information-outline"
+                  color="info"
+                  @click="nextPage(props.row.profileId)"
+                  icon="mdi-eye"
                 >
-                  <q-tooltip>เหตุผลการไม่ยื่นขอ</q-tooltip>
+                  <q-tooltip>ดูข้อมูลทะเบียนประวัติ</q-tooltip>
                 </q-btn>
               </q-td>
               <q-td key="no" :props="props">
@@ -502,6 +509,21 @@ onMounted(async () => {
               <q-td key="insigniaLevel" :props="props">
                 {{ props.row.insigniaLevel }}
               </q-td>
+              <q-td auto-width>
+                <q-btn
+                  v-if="props.row.requestNote != null && checkPermission($route)?.attrIsGet"
+                  dense
+                  flat
+                  round
+                  color="blue"
+                  @click.pervent="
+                    showReson(props.row.name, props.row.requestNote)
+                  "
+                  icon="mdi-information-outline"
+                >
+                  <q-tooltip>เหตุผลการไม่ยื่นขอ</q-tooltip>
+                </q-btn>
+              </q-td>
             </q-tr>
           </template>
         </d-table>
@@ -515,4 +537,10 @@ onMounted(async () => {
       </div>
     </div>
   </div>
+
+  <PopupPersonal
+    :modal="modalPersonal"
+    :id="personId"
+    @update:modal="updatemodalPersonal"
+  />
 </template>
diff --git a/src/modules/07_insignia/components/2_Manage/Tab3.vue b/src/modules/07_insignia/components/2_Manage/Tab3.vue
index d219cf648..78e56e187 100644
--- a/src/modules/07_insignia/components/2_Manage/Tab3.vue
+++ b/src/modules/07_insignia/components/2_Manage/Tab3.vue
@@ -2,12 +2,14 @@
 import { onMounted, ref, watch, reactive } from "vue";
 import { useQuasar } from "quasar";
 import { useRouter } from "vue-router";
+import { checkPermission } from "@/utils/permissions";
 
 /** import Type*/
 import type { QTableProps } from "quasar";
 
 /** import components*/
 import DialogInformation from "@/components/Dialogs/Information.vue";
+import PopupPersonal from "@/components/Dialogs/PopupPersonalNew.vue";
 
 /** import Stores */
 import { useInsigniaDataStore } from "@/modules/07_insignia/store";
@@ -167,12 +169,21 @@ async function changtypeOc() {
   DataStore.typeOc = organization.value;
 }
 
+const modalPersonal = ref<boolean>(false);
+const personId = ref<string>("");
+
 /**
  *  function redirect ทะเบียนประวัติิ
  * @param id profileId
  */
 function nextPage(id: string) {
-  router.push(`/registry-officer/${id}`);
+  modalPersonal.value = true;
+  personId.value = id;
+  // router.push(`/registry-officer/${id}`);
+}
+
+function updatemodalPersonal(modal: boolean) {
+  modalPersonal.value = modal;
 }
 
 /** ข้อมูล Table*/
@@ -449,25 +460,22 @@ onMounted(async () => {
               <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"
-              @click="nextPage(props.row.profileId)"
-            >
-              <q-td v-if="props.row.requestNote != null" auto-width>
+            <q-tr :props="props">
+              <q-td auto-width>
                 <q-btn
+                  v-if="checkPermission($route)?.attrIsGet"
                   dense
-                  size="12px"
                   flat
                   round
-                  color="blue"
-                  @click.stop="showNote(props.row)"
-                  icon="mdi-information-outline"
+                  color="info"
+                  @click="nextPage(props.row.profileId)"
+                  icon="mdi-eye"
                 >
-                  <q-tooltip>เหตุผลการลบออก</q-tooltip>
+                  <q-tooltip>ดูข้อมูลทะเบียนประวัติ</q-tooltip>
                 </q-btn>
               </q-td>
               <q-td key="no" :props="props">
@@ -501,6 +509,22 @@ onMounted(async () => {
               <q-td key="insigniaLevel" :props="props">
                 {{ props.row.insigniaLevel }}
               </q-td>
+              <q-td auto-width>
+                <q-btn
+                  v-if="
+                    props.row.requestNote != null &&
+                    checkPermission($route)?.attrIsGet
+                  "
+                  dense
+                  flat
+                  round
+                  color="blue"
+                  @click.stop="showNote(props.row)"
+                  icon="mdi-information-outline"
+                >
+                  <q-tooltip>เหตุผลการลบออก</q-tooltip>
+                </q-btn>
+              </q-td>
             </q-tr>
           </template>
         </d-table>
@@ -513,4 +537,10 @@ onMounted(async () => {
     :desc="note"
     :click-close="closeReson"
   />
+
+  <PopupPersonal
+    :modal="modalPersonal"
+    :id="personId"
+    @update:modal="updatemodalPersonal"
+  />
 </template>
diff --git a/src/modules/07_insignia/components/2_Manage/Tab4.vue b/src/modules/07_insignia/components/2_Manage/Tab4.vue
index a9df90e90..8f8017151 100644
--- a/src/modules/07_insignia/components/2_Manage/Tab4.vue
+++ b/src/modules/07_insignia/components/2_Manage/Tab4.vue
@@ -107,7 +107,7 @@ onMounted(async () => {
             </q-tr>
           </template>
           <template v-slot:body="props">
-            <q-tr :props="props" class="cursor-pointer">
+            <q-tr :props="props">
               <q-td key="no" style="width: 50px" :props="props">
                 {{ props.rowIndex + 1 }}
               </q-td>
diff --git a/src/modules/07_insignia/components/2_Manage/listManage.vue b/src/modules/07_insignia/components/2_Manage/listManage.vue
index 420281a7b..5b98de4e1 100644
--- a/src/modules/07_insignia/components/2_Manage/listManage.vue
+++ b/src/modules/07_insignia/components/2_Manage/listManage.vue
@@ -1,6 +1,7 @@
 <script setup lang="ts">
 import { onMounted, ref } from "vue";
 import { useQuasar } from "quasar";
+import { checkPermission } from "@/utils/permissions";
 import http from "@/plugins/http";
 import config from "@/app.config";
 
@@ -449,7 +450,10 @@ onMounted(async () => {
 
       <q-btn
         v-if="
-          roleDataStore.adminRole && DataStore.isLock !== true && hideBottom
+          roleDataStore.adminRole &&
+          DataStore.isLock !== true &&
+          hideBottom &&
+          checkPermission($route)?.attrIsUpdate
         "
         dense
         unelevated
@@ -576,9 +580,12 @@ onMounted(async () => {
         <tab4 :tab="tab" :roundId="round" />
       </q-tab-panel>
     </q-tab-panels>
+
     <q-toolbar class="q-py-md text-right">
       <q-file
-        v-if="roleDataStore.insignia1Role"
+        v-if="
+          roleDataStore.insignia1Role && checkPermission($route)?.attrIsUpdate
+        "
         bg-color="white"
         clearable
         outlined
@@ -609,14 +616,16 @@ onMounted(async () => {
           flat
           round
           color="primary"
-          v-if="roleDataStore.insignia1Role"
+          v-if="
+            roleDataStore.insignia1Role && checkPermission($route)?.attrIsGet
+          "
           :href="document"
           target="_blank"
         >
           <q-tooltip>ดาวน์โหลด</q-tooltip>
         </q-btn>
         <q-btn
-          v-else
+          v-else-if="checkPermission($route)?.attrIsGet"
           color="primary"
           icon-right="mdi-download"
           label="ดาวน์โหลดไฟล์"
@@ -631,7 +640,8 @@ onMounted(async () => {
       <q-btn
         v-if="
           roleDataStore.insignia1Role &&
-          (requestStatus == 'st1' || requestStatus == 'st4')
+          (requestStatus == 'st1' || requestStatus == 'st4') &&
+          checkPermission($route)?.attrIsUpdate
         "
         dense
         unelevated
@@ -643,7 +653,8 @@ onMounted(async () => {
       <q-btn
         v-if="
           roleDataStore.insignia2Role &&
-          (requestStatus == 'st3' || requestStatus == 'st5')
+          (requestStatus == 'st3' || requestStatus == 'st5') &&
+          checkPermission($route)?.attrIsUpdate
         "
         dense
         unelevated
@@ -653,7 +664,11 @@ onMounted(async () => {
         @click="popupBackToEdit"
       />
       <q-btn
-        v-if="roleDataStore.insignia2Role && requestStatus == 'st3'"
+        v-if="
+          roleDataStore.insignia2Role &&
+          requestStatus == 'st3' &&
+          checkPermission($route)?.attrIsUpdate
+        "
         dense
         unelevated
         label="อนุมัติ"
@@ -663,7 +678,10 @@ onMounted(async () => {
       />
       <q-btn
         v-if="
-          requestStatus == 'st6' && roleDataStore.adminRole && !DataStore.isLock
+          requestStatus == 'st6' &&
+          roleDataStore.adminRole &&
+          !DataStore.isLock &&
+          checkPermission($route)?.attrIsUpdate
         "
         dense
         unelevated
diff --git a/src/modules/07_insignia/store.ts b/src/modules/07_insignia/store.ts
index f355c3a26..3bd7f32e5 100644
--- a/src/modules/07_insignia/store.ts
+++ b/src/modules/07_insignia/store.ts
@@ -64,7 +64,7 @@ export const useInsigniaDataStore = defineStore("insignia", () => {
                 (item: any) => item.name === e.lastInsignia
               )?.shortName || ""
             })`
-          : "",
+          : "-",
         insigniaCheck: e.requestInsignia,
         insigniaSend: e.requestInsignia
           ? `${e.requestInsignia} (${