diff --git a/src/api/02_organizational/api.organization.ts b/src/api/02_organizational/api.organization.ts
index 15007200c..a8d2a289a 100644
--- a/src/api/02_organizational/api.organization.ts
+++ b/src/api/02_organizational/api.organization.ts
@@ -181,11 +181,11 @@ export default {
 
   //EditPage
   salaryTemp: `${orgProfile}/salaryTemp`,
-  profilePermission: `${orgProfile}/keycloak/permissionProfile`,
+  profilePermission: (rootId: string) =>
+    `${orgProfile}/keycloak/permissionProfile/${rootId}`,
   profileidPosition: (type: string) =>
     `${orgProfile}${type}/profileid/position`,
 
-  workflowCommanderOperate:`${workflow}/commander/operate`,
-  workflowCommanderSign:`${workflow}/commander/sign`,
-  
+  workflowCommanderOperate: `${workflow}/commander/operate`,
+  workflowCommanderSign: `${workflow}/commander/sign`,
 };
diff --git a/src/api/06_retirement/api.retirement.ts b/src/api/06_retirement/api.retirement.ts
index e901aaa7e..9138047f1 100644
--- a/src/api/06_retirement/api.retirement.ts
+++ b/src/api/06_retirement/api.retirement.ts
@@ -77,9 +77,31 @@ export default {
   //รายงาน
   retirementReport: `${report}`,
 
-  addResign: (profileType:string,type: string, id: string) =>
+  addResign: (profileType: string, type: string, id: string) =>
     `${retirement}/resign${profileType}/officer/add-resign/${type}/${id}`,
 
-  sendApproveRetirement:(type:string,id:string)=>`${retirement}/resign${type}/admin/approve/officer/${id}`,
-  commanderApproveRetirement:(type:string,id:string,typeApprove:string,path:string)=>`${retirement}/resign${type}/admin/${typeApprove}${path}/${id}`
+  addResignCancel: (profileType: string, type: string, id: string) =>
+    `${retirement}/resign${profileType}/officer-cancel/add-resign/${type}/${id}`,
+
+  sendApproveRetirement: (type: string, id: string) =>
+    `${retirement}/resign${type}/admin/approve/officer/${id}`,
+  commanderApproveRetirement: (
+    type: string,
+    id: string,
+    typeApprove: string,
+    path: string = ""
+  ) => `${retirement}/resign${type}/admin/${typeApprove}${path}/${id}`,
+
+  // รายการยกเลิกการลาออก
+  // สำหรับเจ้าหน้าที่
+  officerCancelResign: (typeEmp: string, id: string) =>
+    `${retirement}/resign${typeEmp}/admin-cancel/approve/officer/${id}`,
+
+  // สำหรับผู้บังคับบัญชา
+  comanderCancelResign: (typeEmp: string, action: string, id: string) =>
+    `${retirement}/resign${typeEmp}/admin-cancel/${action}/comander/${id}`,
+
+  // สำหรับผู้มีอำนาจ
+  approverCancelResign: (typeEmp: string, action: string, id: string) =>
+    `${retirement}/resign${typeEmp}/admin-cancel/${action}/${id}`,
 };
diff --git a/src/api/07_insignia/api.insignia.ts b/src/api/07_insignia/api.insignia.ts
index 551ade307..4351ce912 100644
--- a/src/api/07_insignia/api.insignia.ts
+++ b/src/api/07_insignia/api.insignia.ts
@@ -23,33 +23,44 @@ export default {
     ocId: string,
     role: string,
     status: any,
-    isDeputy: boolean = false
+    isDeputy: boolean = false,
+    type: string = "officer"
   ) =>
-    `${insignia}/request/${insigniaPeriodId}/${ocId}/${role}/${status}/${isDeputy}`,
+    `${insignia}/request/${insigniaPeriodId}/${ocId}/${role}/${status}/${isDeputy}/${type}`,
   insigniaReject: (profileId: string) =>
     `${insignia}/request/status/reject/${profileId}`,
   insigniaDelete: (profileId: string) =>
     `${insignia}/request/status/delete/${profileId}`,
   insigniaEdit: (profileId: string) => `${insignia}/request/${profileId}`,
-  insigniaNosend: (insigniaPeriodId: any) =>
-    `${insignia}/request/org/no-send/${insigniaPeriodId}`,
+  insigniaNosend: (insigniaPeriodId: any, type: string = "officer") =>
+    `${insignia}/request/org/no-send/${type}/${insigniaPeriodId}`,
   insigniaAgency: () => `${insignia}/request/agency`,
-  insigniaDashboard: (insigniaPeriodId: string) =>
-    `${insignia}/request/dashboard/${insigniaPeriodId}`,
+  insigniaDashboard: (insigniaPeriodId: string, type: string = "officer") =>
+    `${insignia}/request/dashboard/${type}/${insigniaPeriodId}`,
   // record
   noteround: () => `${insignia}/request/note`,
   requestDocNote: (id: string) => `${insignia}/request/note/doc/${id}`,
-  noteSearch: () => `${insignia}/request/note/search`,
+  noteSearch: (type: string = "officer") =>
+    `${insignia}/request/note/search/${type}`,
   noteSearchList: () => `${insignia}/request/note-list/search`,
   noteAdd: (insigniaId: string) => `${insignia}/request/note/${insigniaId}`,
   noteByid: (id: string) => `${insignia}/request/note/${id}`,
 
-  insigniaSendToDirector: (roundId: string, ocId: string) =>
-    `${insignia}/request/officer/approve/${roundId}/${ocId}`,
-  insigniaDirectorBackToEdit: (roundId: string, ocId: string) =>
-    `${insignia}/request/director/reject/${roundId}/${ocId}`,
-  insigniaDirectorApproved: (roundId: string, ocId: string) =>
-    `${insignia}/request/director/approve/${roundId}/${ocId}`,
+  insigniaSendToDirector: (
+    roundId: string,
+    ocId: string,
+    type: string = "officer"
+  ) => `${insignia}/request/officer/approve/${type}/${roundId}/${ocId}`,
+  insigniaDirectorBackToEdit: (
+    roundId: string,
+    ocId: string,
+    type: string = "officer"
+  ) => `${insignia}/request/director/reject/${type}/${roundId}/${ocId}`,
+  insigniaDirectorApproved: (
+    roundId: string,
+    ocId: string,
+    type: string = "officer"
+  ) => `${insignia}/request/director/approve/${type}/${roundId}/${ocId}`,
   insigniaRequestSendNote: (insigniaPeriodId: string) =>
     `${insignia}/request/send/note/${insigniaPeriodId}`,
 
@@ -105,8 +116,8 @@ export default {
   uploadfileOnlyInsignia: (requestId: string) =>
     `${insignia}/request/upload/${requestId}`,
   // สกจ. ตีกลับให้หัวหน้าเขต
-  rejectRequest: (id: string, ocId: string) =>
-    `${insignia}/request/head/reject/${id}/${ocId}`,
+  rejectRequest: (id: string, ocId: string, type: string = "officer") =>
+    `${insignia}/request/head/reject/${type}/${id}/${ocId}`,
 
   reportInsigniaNew: `${insignia}/report`,
 };
diff --git a/src/api/manage/api.insignia.ts b/src/api/manage/api.insignia.ts
index 44342123e..089e204fc 100644
--- a/src/api/manage/api.insignia.ts
+++ b/src/api/manage/api.insignia.ts
@@ -49,4 +49,7 @@ export default {
 
   checkIsofficer: `${env.API_URI}/org/workflow/keycloak/isofficer/`,
   insigniaReclaim,
+
+  // update คุณสมบัติการจัดการเครื่องราชฯ
+  insigniaUpdateProperty: `${env.API_URI}/insignia/request/update`,
 };
diff --git a/src/api/recruiting/api.recruit.ts b/src/api/recruiting/api.recruit.ts
index 5c9cc69e1..38d004a97 100644
--- a/src/api/recruiting/api.recruit.ts
+++ b/src/api/recruiting/api.recruit.ts
@@ -42,5 +42,9 @@ export default {
   exportPassExamList: (id: string) => `${recruit_report}pass/${id}`,
   periodRecruitToPlacement: (examId: string) => `${recruit}placement/${examId}`,
 
-  reportRecruit:(type:string)=>`${recruit}${type}`
+  reportRecruit:(type:string)=>`${recruit}${type}`,
+
+
+  exportCandidateListNew: (id: string) => `${recruit_report}candidate-new/${id}`,
+
 };
diff --git a/src/components/information/interface/response/Government.ts b/src/components/information/interface/response/Government.ts
index 08acf998d..34101611f 100644
--- a/src/components/information/interface/response/Government.ts
+++ b/src/components/information/interface/response/Government.ts
@@ -30,8 +30,8 @@ interface Goverment {
   positionLevel: string;
   positionExecutive: string;
   positionExecutiveSide: string;
-  dateLeave: string;
-  dateRetireLaw: string;
+  dateLeave?: string;
+  dateRetireLaw?: string;
 }
 
 interface GovermentEmpTemp {
diff --git a/src/interface/response/main.ts b/src/interface/response/main.ts
index 561af060e..2267c36b3 100644
--- a/src/interface/response/main.ts
+++ b/src/interface/response/main.ts
@@ -43,4 +43,18 @@ interface DataRoles {
   parentNode: string;
 }
 
-export type { ListMenu, ChildLevelTree, ChildConfig, DataPermissions,DataRoles };
+interface DataRoleWorkflow {
+  isDeputy: boolean;
+  isDirector: boolean;
+  isOfficer: boolean;
+  isStaff: boolean;
+}
+
+export type {
+  ListMenu,
+  ChildLevelTree,
+  ChildConfig,
+  DataPermissions,
+  DataRoles,
+  DataRoleWorkflow,
+};
diff --git a/src/modules/01_masterdata/views/Assignment.vue b/src/modules/01_masterdata/views/Assignment.vue
index 853ca7bf0..ee4f43807 100644
--- a/src/modules/01_masterdata/views/Assignment.vue
+++ b/src/modules/01_masterdata/views/Assignment.vue
@@ -258,7 +258,7 @@ onMounted(() => {
             outlined
             v-model="formFilter.keyword"
             label="ค้นหา"
-            @keydown.enter="fetchNewList"
+            @keydown.enter.prevent="fetchNewList"
           >
             <template v-slot:append>
               <q-icon name="search" />
diff --git a/src/modules/02_organization/components/DialogMovePos.vue b/src/modules/02_organization/components/DialogMovePos.vue
index bf625580c..2e4b4345b 100644
--- a/src/modules/02_organization/components/DialogMovePos.vue
+++ b/src/modules/02_organization/components/DialogMovePos.vue
@@ -207,7 +207,7 @@ watch(
                     dense
                     v-model="filterTable"
                     label="ค้นหา"
-                    @keydown.enter="onSearchData"
+                    @keydown.enter.prevent="onSearchData"
                   >
                     <template v-slot:append>
                       <q-icon name="search" />
diff --git a/src/modules/02_organization/views/main.vue b/src/modules/02_organization/views/main.vue
index be9eb7fcb..20eee64d8 100644
--- a/src/modules/02_organization/views/main.vue
+++ b/src/modules/02_organization/views/main.vue
@@ -4,7 +4,11 @@ import { useQuasar } from "quasar";
 
 import http from "@/plugins/http";
 import config from "@/app.config";
-import { checkPermission } from "@/utils/permissions";
+import {
+  checkPermission,
+  checkPermissionList,
+  checkPermissionCreate,
+} from "@/utils/permissions";
 import { useOrganizational } from "@/modules/02_organization/store/organizational";
 import { useCounterMixin } from "@/stores/mixin";
 
@@ -338,7 +342,9 @@ onMounted(async () => {
             <q-btn
               v-if="
                 store.typeOrganizational === 'draft' &&
-                (store.isOfficer === true || store.isStaff === true)
+                (store.isOfficer === true || store.isStaff === true) &&
+                checkPermissionList(['COMMAND']) &&
+                checkPermissionCreate('COMMAND')
               "
               flat
               round
diff --git a/src/modules/03_recruiting/components/Table.vue b/src/modules/03_recruiting/components/Table.vue
index 440a9b053..9f5b10543 100644
--- a/src/modules/03_recruiting/components/Table.vue
+++ b/src/modules/03_recruiting/components/Table.vue
@@ -139,7 +139,7 @@ function resetFilter() {
         outlined
         placeholder="ค้นหา"
         style="max-width: 200px"
-        @keydown.enter="props.onSearch?.()"
+        @keydown.enter.prevent="props.onSearch?.()"
       >
         <template v-slot:append>
           <q-icon name="search" />
diff --git a/src/modules/03_recruiting/components/Table1.vue b/src/modules/03_recruiting/components/Table1.vue
index 042beba5f..1f65715c8 100644
--- a/src/modules/03_recruiting/components/Table1.vue
+++ b/src/modules/03_recruiting/components/Table1.vue
@@ -110,7 +110,7 @@ const resetFilter = () => {
         placeholder="ค้นหา"
         style="max-width: 200px"
         class="q-ml-sm"
-        @keydown.enter="props.onSearch?.(name)"
+        @keydown.enter.prevent="props.onSearch?.(name)"
       >
         <template v-slot:append>
           <q-icon name="search" />
diff --git a/src/modules/03_recruiting/components/TableCan.vue b/src/modules/03_recruiting/components/TableCan.vue
index d6c7067b4..43b254730 100644
--- a/src/modules/03_recruiting/components/TableCan.vue
+++ b/src/modules/03_recruiting/components/TableCan.vue
@@ -115,7 +115,7 @@ function resetFilter() {
         dense
         v-model="filter"
         ref="filterRef"
-        @keydown.enter="onSearch"
+        @keydown.enter.prevent="onSearch"
         outlined
         placeholder="ค้นหา"
         style="max-width: 200px"
diff --git a/src/modules/03_recruiting/interface/index/Main.ts b/src/modules/03_recruiting/interface/index/Main.ts
index 3823f05db..5fb358548 100644
--- a/src/modules/03_recruiting/interface/index/Main.ts
+++ b/src/modules/03_recruiting/interface/index/Main.ts
@@ -1,7 +1,7 @@
 import { ref } from "vue";
 interface Pagination {
   rowsPerPage: number;
-  sortBy: string;
+  sortBy?: string;
 }
 
 interface DataDateMonthObject {
diff --git a/src/modules/03_recruiting/views/01_compete/Period.vue b/src/modules/03_recruiting/views/01_compete/Period.vue
index c057526ed..4d6a37981 100644
--- a/src/modules/03_recruiting/views/01_compete/Period.vue
+++ b/src/modules/03_recruiting/views/01_compete/Period.vue
@@ -206,40 +206,42 @@ async function fetchData() {
  * ดาวน์โหลดรายชื่อผู้สอบแข่งขันได้
  * @param id รอบสอบเเข่งขัน
  */
-function clickPassExam(id: string) {
+async function clickPassExam(id: string) {
   showLoader();
-  http
+  await http
     .get(config.API.exportPassExamList(id))
-    .then((res) => {
+    .then(async (res) => {
       const data = res.data.result;
       data.reportName = `CandidateList`;
-      genReport(data, data.reportName, "pdf");
+      await genReport(data, data.reportName, "pdf");
     })
     .catch(async (e) => {
       messageError($q, JSON.parse(await e.response.data.text()));
-      hideLoader();
     })
-    .finally(() => {});
+    .finally(() => {
+      hideLoader();
+    });
 }
 
 /**
  * ดาวน์โหลดรายชื่อผู้มีสิทธิ์สอบ
  * @param id รอบสอบเเข่งขัน
  */
-function clickCandidateList(id: string) {
+async function clickCandidateList(id: string) {
   showLoader();
-  http
-    .get(config.API.exportCandidateList(id))
-    .then((res) => {
+  await http
+    .get(config.API.exportCandidateListNew(id))
+    .then(async (res) => {
       const data = res.data.result;
       data.reportName = `CandidateList`;
-      genReport(data, data.reportName, "pdf");
+      await genReport(data, data.reportName, "pdf");
     })
     .catch(async (e) => {
       messageError($q, JSON.parse(await e.response.data.text()));
-      hideLoader();
     })
-    .finally(() => {});
+    .finally(() => {
+      hideLoader();
+    });
 }
 
 /**
diff --git a/src/modules/03_recruiting/views/02_qualify/DisablePeriod.vue b/src/modules/03_recruiting/views/02_qualify/DisablePeriod.vue
index fbda1be2c..3a987724b 100644
--- a/src/modules/03_recruiting/views/02_qualify/DisablePeriod.vue
+++ b/src/modules/03_recruiting/views/02_qualify/DisablePeriod.vue
@@ -168,37 +168,39 @@ const visibleColumnsHistory = ref<String[]>([
 ]);
 
 /**  ดาวน์โหลดรายชื่อผู้สอบคัดเลือกคนพิการได้ */
-function clickPassExam(id: string) {
+async function clickPassExam(id: string) {
   showLoader();
-  http
+  await http
     .get(config.API.exportDisablePassExamList(id))
-    .then((res) => {
+    .then(async (res) => {
       const data = res.data.result;
       data.reportName = `CandidateList`;
-      genReport(data, data.reportName, "pdf");
+      await genReport(data, data.reportName, "pdf");
     })
     .catch(async (e) => {
-      hideLoader();
       messageError($q, e);
     })
-    .finally(() => {});
+    .finally(() => {
+      hideLoader();
+    });
 }
 
 /** ดาวน์โหลดรายชื่อผู้มีสิทธิ์สอบ */
-function clickCandidateList(id: string) {
+async function clickCandidateList(id: string) {
   showLoader();
-  http
+  await http
     .get(config.API.exportDisableCandidateList(id))
-    .then((res) => {
+    .then(async (res) => {
       const data = res.data.result;
       data.reportName = `CandidateList`;
-      genReport(data, data.reportName, "pdf");
+      await genReport(data, data.reportName, "pdf");
     })
     .catch(async (e) => {
-      hideLoader();
       messageError($q, e);
     })
-    .finally(() => {});
+    .finally(() => {
+      hideLoader();
+    });
 }
 
 /**
diff --git a/src/modules/04_registryPerson/components/detail/PersonalInformation/DialogSortEducation.vue b/src/modules/04_registryPerson/components/detail/PersonalInformation/DialogSortEducation.vue
index dd9a1ae14..e84953544 100644
--- a/src/modules/04_registryPerson/components/detail/PersonalInformation/DialogSortEducation.vue
+++ b/src/modules/04_registryPerson/components/detail/PersonalInformation/DialogSortEducation.vue
@@ -262,7 +262,7 @@ function onSubmit() {
 watch(modal, async () => {
   if (modal.value && props.dataSort) {
     const dataList = props.dataSort;
-    rows.value = dataList;
+    rows.value.push(...dataList);
     selected.value = dataList.filter((item: any) => item.isUse == true);
   } else {
     selected.value = [];
@@ -294,7 +294,7 @@ watch(modal, async () => {
             bordered
             :rows="rows"
             :columns="columns"
-            :rows-per-page-options="[100]"
+            :rows-per-page-options="[0]"
             row-key="id"
             hide-bottom
             hide-pagination
diff --git a/src/modules/04_registryPerson/components/requestEdit/01_TabInformation.vue b/src/modules/04_registryPerson/components/requestEdit/01_TabInformation.vue
index e2012b4ba..31db49187 100644
--- a/src/modules/04_registryPerson/components/requestEdit/01_TabInformation.vue
+++ b/src/modules/04_registryPerson/components/requestEdit/01_TabInformation.vue
@@ -242,7 +242,7 @@ onMounted(() => {
         dense
         label="ค้นหา"
         style="min-width: 250px"
-        @keydown.enter="updateStatusValue()"
+        @keydown.enter.prevent="updateStatusValue()"
       >
         <template v-slot:append>
           <q-icon name="search" />
diff --git a/src/modules/04_registryPerson/components/requestEdit/02_TabIDP.vue b/src/modules/04_registryPerson/components/requestEdit/02_TabIDP.vue
index d69d4d60d..e29279039 100644
--- a/src/modules/04_registryPerson/components/requestEdit/02_TabIDP.vue
+++ b/src/modules/04_registryPerson/components/requestEdit/02_TabIDP.vue
@@ -327,7 +327,7 @@ onMounted(() => {
         outlined
         dense
         label="ค้นหา"
-        @keydown.enter="updateStatusValue()"
+        @keydown.enter.prevent="updateStatusValue()"
       >
         <template v-slot:append>
           <q-icon name="search" />
diff --git a/src/modules/04_registryPerson/interface/index/Edit.ts b/src/modules/04_registryPerson/interface/index/Edit.ts
index c30fdac09..a128377f9 100644
--- a/src/modules/04_registryPerson/interface/index/Edit.ts
+++ b/src/modules/04_registryPerson/interface/index/Edit.ts
@@ -8,4 +8,23 @@ interface DataProfile {
   org: string;
 }
 
-export type { DataProfile };
+interface FormDataSalary {
+  positionLevel: string;
+  positionCee: string;
+  amount: number;
+  amountSpecial: number;
+  posNoAbb: string;
+  posNo: string;
+  orgRoot: string;
+  orgChild1: string;
+  orgChild2: string;
+  orgChild3: string;
+  orgChild4: string;
+  commandCode: string;
+  posNumCodeSit: string;
+  posNumCodeSitAbb: string;
+  commandNo: string;
+  commandYear: null | number;
+}
+
+export type { DataProfile, FormDataSalary };
diff --git a/src/modules/04_registryPerson/interface/response/Edit.ts b/src/modules/04_registryPerson/interface/response/Edit.ts
index f27f8e890..8af17bae8 100644
--- a/src/modules/04_registryPerson/interface/response/Edit.ts
+++ b/src/modules/04_registryPerson/interface/response/Edit.ts
@@ -27,8 +27,8 @@ interface DataPosition {
   amount: number;
   amountSpecial: number;
   commandCode: string;
-  commandDateAffect: string;
-  commandDateSign: string;
+  commandDateAffect: Date;
+  commandDateSign: Date;
   commandId: string;
   commandName: string;
   commandNo: string;
@@ -68,6 +68,8 @@ interface DataPosition {
   remark: string;
   salaryId: string;
   status: string;
+  posNumCodeSitAbb: string;
+  posNumCodeSit: string;
 }
 
 export type { DataSalaryPos, DataPosition };
diff --git a/src/modules/04_registryPerson/store.ts b/src/modules/04_registryPerson/store.ts
index 023879952..813f22828 100644
--- a/src/modules/04_registryPerson/store.ts
+++ b/src/modules/04_registryPerson/store.ts
@@ -1,11 +1,9 @@
 import { defineStore } from "pinia";
 import { ref, reactive, computed } from "vue";
-import { useQuasar } from "quasar";
 import axios from "axios";
 
 import http from "@/plugins/http";
 import config from "@/app.config";
-import { useCounterMixin } from "@/stores/mixin";
 import { useRoute } from "vue-router";
 
 import type { DataOption } from "@/modules/04_registryPerson/interface/index/Main";
@@ -15,9 +13,6 @@ import type {
 } from "@/modules/04_registryPerson/interface/response/Main";
 import type { FormFilter } from "@/modules/04_registryPerson/interface/request/Main";
 
-const $q = useQuasar();
-const { messageError } = useCounterMixin();
-
 export const useRegistryNewDataStore = defineStore("registryNew", () => {
   const route = useRoute();
   const tab = ref<string>("1");
@@ -188,7 +183,7 @@ export const useRegistryNewDataStore = defineStore("registryNew", () => {
 
       return res.data["เอกสารหลักฐาน"].uploadUrl;
     } catch (err) {
-      messageError($q, err);
+      console.log(err);
     }
   }
 
@@ -216,7 +211,7 @@ export const useRegistryNewDataStore = defineStore("registryNew", () => {
       );
       return res.data;
     } catch (err) {
-      messageError($q, err);
+      console.log(err);
     }
   }
 
@@ -233,7 +228,7 @@ export const useRegistryNewDataStore = defineStore("registryNew", () => {
         },
       });
     } catch (err) {
-      messageError($q, err);
+      console.log(err);
     }
   }
 
@@ -261,6 +256,6 @@ export const useRegistryNewDataStore = defineStore("registryNew", () => {
     createPathUploadFlie,
     getPathUploadFlie,
     uploadFile,
-    tab
+    tab,
   };
 });
diff --git a/src/modules/04_registryPerson/views/edit/components/DialogForm.vue b/src/modules/04_registryPerson/views/edit/components/DialogForm.vue
index 57fb2f934..6e352bc59 100644
--- a/src/modules/04_registryPerson/views/edit/components/DialogForm.vue
+++ b/src/modules/04_registryPerson/views/edit/components/DialogForm.vue
@@ -249,10 +249,15 @@ async function fetchDataOptionExecutive() {
  * @param status แก่ไข , เพิ่ม
  */
 async function updateSelectType(val: string, status: boolean = false) {
+  console.log(val);
+  console.log(dataLevel.value);
+
   const listLevel = val
     ? dataLevel.value.find((e: DataPosType) => e.posTypeName === val)
     : null;
 
+  console.log("เช็คประเภทตำแหน่งงาน", listLevel);
+  // เช็คประเภทตำแหน่งงาน
   if (listLevel) {
     store.posLevelData = listLevel.posLevels.map((e: DataPosLevel) => ({
       id: e.id,
@@ -263,10 +268,11 @@ async function updateSelectType(val: string, status: boolean = false) {
     }));
 
     formData.positionLevel = !status ? "" : formData.positionLevel;
-  } else {
-    store.posLevelData = [];
-    formData.positionLevel = "";
   }
+  // else {
+  //   store.posLevelData = [];
+  //   // formData.positionLevel = "";
+  // }
 }
 
 /**
@@ -363,16 +369,18 @@ function onSubmit() {
         type: empType.value?.toLocaleUpperCase(),
         commandDateAffect: convertDateToAPI(formData.commandDateAffect),
         commandDateSign: convertDateToAPI(formData.commandDateSign),
-        amount: Number(String(formData.amount)?.replace(/,/g, "")),
-        amountSpecial: Number(
-          String(formData.amountSpecial)?.replace(/,/g, "")
-        ),
-        positionSalaryAmount: Number(
-          String(formData.positionSalaryAmount)?.replace(/,/g, "")
-        ),
-        mouthSalaryAmount: Number(
-          String(formData.mouthSalaryAmount)?.replace(/,/g, "")
-        ),
+        amount: formData.amount
+          ? Number(String(formData.amount)?.replace(/,/g, ""))
+          : null,
+        amountSpecial: formData.amountSpecial
+          ? Number(String(formData.amountSpecial)?.replace(/,/g, ""))
+          : null,
+        positionSalaryAmount: formData.positionSalaryAmount
+          ? Number(String(formData.positionSalaryAmount)?.replace(/,/g, ""))
+          : null,
+        mouthSalaryAmount: formData.mouthSalaryAmount
+          ? Number(String(formData.mouthSalaryAmount)?.replace(/,/g, ""))
+          : null,
       })
       .then(async () => {
         await props.fetchData?.();
@@ -394,8 +402,8 @@ watch(modal, async (val) => {
     if (empType.value === "officer") {
       await Promise.all([
         fetchType(),
-        fetchDataOption(),
-        fetchDataOptionExecutive(),
+        // fetchDataOption(),
+        // fetchDataOptionExecutive(),
       ]);
     } else {
       await fetchOptionGroup();
diff --git a/src/modules/04_registryPerson/views/edit/components/DialogSort.vue b/src/modules/04_registryPerson/views/edit/components/DialogSort.vue
new file mode 100644
index 000000000..6cae824e4
--- /dev/null
+++ b/src/modules/04_registryPerson/views/edit/components/DialogSort.vue
@@ -0,0 +1,214 @@
+<script setup lang="ts">
+import { ref, watch } from "vue";
+import { useQuasar } from "quasar";
+
+import http from "@/plugins/http";
+import config from "@/app.config";
+import { useCounterMixin } from "@/stores/mixin";
+import { useRoute } from "vue-router";
+
+/** importType*/
+import type { QTableProps } from "quasar";
+import type { PropType } from "vue";
+import type { DataPosition } from "@/modules/04_registryPerson/interface/response/Edit";
+
+/** importComponents*/
+import DialogHeader from "@/components/DialogHeader.vue";
+
+/** use*/
+const $q = useQuasar();
+const route = useRoute();
+const {
+  dialogConfirm,
+  showLoader,
+  success,
+  hideLoader,
+  messageError,
+  findOrgNameHtml,
+} = useCounterMixin();
+
+/** props*/
+const modal = defineModel<boolean>("modal", { required: true });
+
+const props = defineProps({
+  dataSort: Array as PropType<DataPosition[]>,
+  columns: Array as PropType<QTableProps["columns"]>,
+  fetchData: Function,
+});
+const profileId = ref<string>(route.params.id.toString()); //id profile
+
+/** ข้อมูล Table*/
+const rowsData = ref<DataPosition[]>([]);
+
+// /**
+//  * fiunction จัดลำดับ
+//  * @param from ตำแหน่งปัจุบัน
+//  * @param to ตำแหน่งที่จะย้ายไป
+//  */
+// function onDrop(from: number, to: number) {
+//   rowsData.value.splice(to - 1, 0, rowsData.value.splice(from - 1, 1)[0]);
+// }
+
+/** function บันทึกการจัดลำดับ*/
+function onSubmit() {
+  dialogConfirm($q, async () => {
+    showLoader();
+    const body = rowsData.value.map((e: any) => e.id);
+    await http
+      .put(config.API.salaryTemp + `/change/sort/${profileId.value}`, {
+        id: body,
+      })
+      .then(async () => {
+        await success($q, "บันทึกข้อมูลสำเร็จ");
+        props.fetchData?.();
+        modal.value = false;
+      })
+      .catch((err) => {
+        messageError($q, err);
+      })
+      .finally(() => {
+        hideLoader();
+      });
+  });
+}
+
+let draggedIndex = -1; // index ของ item ที่ถูก drag
+const cardSectionRef = ref<HTMLElement | null>(null); // ref สำหรับ container ที่จะ scroll
+
+/**
+ *  ฟังก์ชันนี้ใช้สำหรับการ drag item
+ * @param index index ของ item ที่ถูก drag
+ */
+function onDragStart(index: number) {
+  //จะทำการ set draggedIndex เป็น index ที่ถูก drag
+  draggedIndex = index;
+}
+
+/**
+ * ฟังก์ชันนี้ใช้สำหรับการ drop item
+ * @param targetIndex index ที่จะ drop
+ */
+function onDrop(targetIndex: number) {
+  // ถ้า draggedIndex เป็น -1 หรือ draggedIndex เท่ากับ targetIndex จะไม่ทำอะไร
+  if (draggedIndex === -1 || draggedIndex === targetIndex) return;
+  // ถ้า draggedIndex ไม่เท่ากับ targetIndex จะทำการย้าย item
+  const item = rowsData.value.splice(draggedIndex, 1)[0];
+  rowsData.value.splice(targetIndex, 0, item);
+  draggedIndex = -1;
+}
+
+/**
+ *  ฟังก์ชันนี้ใช้สำหรับการเลื่อน scroll ของ container
+ * @param e DragEvent
+ * @description ทำให้ scroll container ได้เวลา drag อยู่ใกล้ขอบ
+ */
+function onDragOver(e: DragEvent) {
+  let container = cardSectionRef.value;
+  // ถ้าเป็น vue proxy ให้ใช้ container.$el
+  if (container && (container as any).$el) {
+    container = (container as any).$el;
+  }
+  // ถ้า container ไม่ใช่ HTMLElement ให้แสดง warning
+  if (
+    !container ||
+    typeof (container as HTMLElement).getBoundingClientRect !== "function"
+  ) {
+    console.warn("container is not HTMLElement:", container);
+    return;
+  }
+  const rect = (container as HTMLElement).getBoundingClientRect();
+  const offset = 40; // ระยะห่างจากขอบที่ต้องการให้ scroll
+  const scrollSpeed = 30; // ความเร็วในการ scroll
+
+  // ถ้า mouse อยู่ใกล้ขอบบนหรือขอบล่างของ container ให้ scroll
+  if (e.clientY < rect.top + offset) {
+    (container as HTMLElement).scrollTop -= scrollSpeed;
+  } else if (e.clientY > rect.bottom - offset) {
+    (container as HTMLElement).scrollTop += scrollSpeed;
+  }
+}
+
+watch(modal, async () => {
+  if (modal.value && props.dataSort) {
+    const dataList = props.dataSort;
+    rowsData.value.push(...dataList);
+  } else {
+    rowsData.value = [];
+  }
+});
+</script>
+<template>
+  <q-dialog v-model="modal" persistent full-width>
+    <q-card style="min-width: 80vw">
+      <DialogHeader :tittle="`จัดลำดับการ`" :close="() => (modal = false)" />
+      <q-separator />
+      <q-card-section
+        ref="cardSectionRef"
+        style="max-height: 70vh; overflow-y: auto"
+        @dragover.prevent="onDragOver"
+      >
+        <q-table
+          class="custom-header-table"
+          v-if="rowsData.length > 0"
+          flat
+          bordered
+          :rows="rowsData"
+          :columns="columns"
+          :rows-per-page-options="[0]"
+          row-key="id"
+          hide-bottom
+          hide-pagination
+        >
+          <template v-slot:body="props">
+            <q-tr
+              :props="props"
+              draggable="true"
+              @dragstart="onDragStart(props.rowIndex)"
+              @drop="onDrop(props.rowIndex)"
+              @dragover.prevent.stop="onDragOver"
+              style="cursor: move"
+            >
+              <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 === 'organization'" class="text-html">
+                  {{
+                    findOrgNameHtml({
+                      root: props.row.orgRoot,
+                      child1: props.row.orgChild1,
+                      child2: props.row.orgChild2,
+                      child3: props.row.orgChild3,
+                      child4: props.row.orgChild4,
+                    })
+                  }}
+                </div>
+                <div v-else-if="col.name === 'commandCode'">
+                  {{ col.value ? col.value : "-" }}
+                </div>
+                <div v-else>
+                  {{ col.value ? col.value : "-" }}
+                </div>
+              </q-td>
+            </q-tr>
+          </template>
+        </q-table>
+        <div v-else class="bg-grey-1 text-center q-pa-md">ไม่มีข้อมูล</div>
+      </q-card-section>
+      <q-separator />
+      <q-card-actions align="right">
+        <q-btn
+          :disable="rowsData.length === 0"
+          type="submit"
+          :label="`บันทึก`"
+          color="public"
+          @click="onSubmit"
+        >
+          <q-tooltip>บันทึก</q-tooltip>
+        </q-btn>
+      </q-card-actions>
+    </q-card>
+  </q-dialog>
+</template>
+
+<style lang="scss"></style>
diff --git a/src/modules/04_registryPerson/views/edit/components/FormPosition.vue b/src/modules/04_registryPerson/views/edit/components/FormPosition.vue
index 9d73f5cca..8e6df441c 100644
--- a/src/modules/04_registryPerson/views/edit/components/FormPosition.vue
+++ b/src/modules/04_registryPerson/views/edit/components/FormPosition.vue
@@ -149,7 +149,6 @@ function classInput(val: boolean) {
         :enableTimePicker="false"
         week-start="0"
         :class="classInput(isReadonly)"
-        teleport-center
       >
         <template #year="{ year }">{{ year + 543 }}</template>
         <template #year-overlay-value="{ value }">{{
@@ -161,9 +160,15 @@ function classInput(val: boolean) {
             outlined
             dense
             borderless
-            :model-value="date2Thai(formData.commandDateAffect)"
+            :model-value="
+              formData.commandDateAffect
+                ? date2Thai(formData.commandDateAffect)
+                : null
+            "
             :label="`${'วันที่คำสั่งมีผล'}`"
             hide-bottom-space
+            clearable
+            @clear="formData.commandDateAffect = null"
           >
             <template v-slot:prepend>
               <q-icon name="event" color="primary" class="cursor-pointer">
@@ -230,7 +235,6 @@ function classInput(val: boolean) {
             :enableTimePicker="false"
             :class="classInput(isReadonly)"
             :readonly="isReadonly"
-            teleport-center
           >
             <template #year="{ year }">{{ year + 543 }}</template>
             <template #year-overlay-value="{ value }">{{
@@ -248,6 +252,8 @@ function classInput(val: boolean) {
                     : formData.commandYear + 543
                 "
                 :label="`${'พ.ศ.'}`"
+                clearable
+                @clear="formData.commandYear = null"
               >
                 <template v-slot:prepend>
                   <q-icon
@@ -274,7 +280,6 @@ function classInput(val: boolean) {
         week-start="0"
         :class="classInput(isReadonly)"
         :readonly="isReadonly"
-        teleport-center
       >
         <template #year="{ year }">{{ year + 543 }}</template>
         <template #year-overlay-value="{ value }">{{
@@ -286,9 +291,15 @@ function classInput(val: boolean) {
             outlined
             dense
             borderless
-            :model-value="date2Thai(formData.commandDateSign)"
+            :model-value="
+              formData.commandDateSign
+                ? date2Thai(formData.commandDateSign)
+                : null
+            "
             :label="`${'วันที่ลงนาม'}`"
             hide-bottom-space
+            clearable
+            @clear="formData.commandDateSign = null"
           >
             <template v-slot:prepend>
               <q-icon name="event" color="primary" class="cursor-pointer">
@@ -359,7 +370,7 @@ function classInput(val: boolean) {
         lazy-rules
         borderless
         v-model="formData.positionType"
-        :label="empType === 'officer' ? 'ประเภทตำแหน่ง' : 'กลุ่มงาน'"
+        :label="empType === 'officer' ? 'ตำแหน่งประเภท' : 'กลุ่มงาน'"
         emit-value
         map-options
         option-label="name"
@@ -433,7 +444,18 @@ function classInput(val: boolean) {
     </div>
 
     <div class="col-xs-6 col-sm-6 col-md-4" v-if="empType === 'officer'">
-      <q-select
+      <q-input
+        :class="classInput(isReadonly)"
+        :readonly="isReadonly"
+        outlined
+        dense
+        lazy-rules
+        borderless
+        v-model="formData.positionLine"
+        hide-bottom-space
+        :label="`${'สายงาน'}`"
+      />
+      <!-- <q-select
         outlined
         :class="classInput(isReadonly)"
         :readonly="isReadonly"
@@ -462,11 +484,22 @@ function classInput(val: boolean) {
             <q-item-section class="text-grey"> ไม่มีข้อมูล </q-item-section>
           </q-item>
         </template></q-select
-      >
+      > -->
     </div>
 
     <div class="col-xs-6 col-sm-6 col-md-4" v-if="empType === 'officer'">
-      <q-select
+      <q-input
+        :class="classInput(isReadonly)"
+        :readonly="isReadonly"
+        outlined
+        dense
+        lazy-rules
+        borderless
+        v-model="formData.positionPathSide"
+        hide-bottom-space
+        :label="`${'ด้าน/สาขา'}`"
+      />
+      <!-- <q-select
         :class="classInput(isReadonly)"
         :readonly="isReadonly"
         outlined
@@ -495,11 +528,22 @@ function classInput(val: boolean) {
             <q-item-section class="text-grey"> ไม่มีข้อมูล </q-item-section>
           </q-item>
         </template>
-      </q-select>
+      </q-select> -->
     </div>
 
     <div class="col-xs-6 col-sm-6 col-md-4" v-if="empType === 'officer'">
-      <q-select
+      <q-input
+        :class="classInput(isReadonly)"
+        :readonly="isReadonly"
+        outlined
+        dense
+        lazy-rules
+        borderless
+        v-model="formData.positionExecutive"
+        hide-bottom-space
+        :label="`${'ตำแหน่งทางการบริหาร'}`"
+      />
+      <!-- <q-select
         :class="classInput(isReadonly)"
         :readonly="isReadonly"
         outlined
@@ -528,7 +572,7 @@ function classInput(val: boolean) {
             <q-item-section class="text-grey"> ไม่มีข้อมูล </q-item-section>
           </q-item>
         </template>
-      </q-select>
+      </q-select> -->
     </div>
 
     <div class="col-12">
@@ -544,7 +588,6 @@ function classInput(val: boolean) {
             label="เงินเดือน"
             mask="###,###,###,###"
             reverse-fill-mask
-            :rules="!isReadonly ? [(val:string) => !!val || `${'กรุณากรอกเงินเดือน'}`] :[]"
             lazy-rules
             hide-bottom-space
           />
diff --git a/src/modules/04_registryPerson/views/edit/components/Table.vue b/src/modules/04_registryPerson/views/edit/components/Table.vue
index eb018b3ad..cd6a8237a 100644
--- a/src/modules/04_registryPerson/views/edit/components/Table.vue
+++ b/src/modules/04_registryPerson/views/edit/components/Table.vue
@@ -1,6 +1,7 @@
 <script setup lang="ts">
-import { ref, onMounted, computed } from "vue";
+import { ref, onMounted, computed, reactive } from "vue";
 import { useQuasar } from "quasar";
+import * as XLSX from "xlsx";
 
 import http from "@/plugins/http";
 import config from "@/app.config";
@@ -9,9 +10,16 @@ import { useCounterMixin } from "@/stores/mixin";
 import { useEditPosDataStore } from "@/modules/04_registryPerson/stores/Edit";
 
 import type { QTableColumn } from "quasar";
+import type { FormDataSalary } from "@/modules/04_registryPerson/interface/index/Edit";
+import type { DataOption } from "@/modules/04_registryPerson/interface/index/Main";
 import type { DataPosition } from "@/modules/04_registryPerson/interface/response/Edit";
+import type {
+  DataPosType,
+  DataPosLevel,
+} from "@/modules/04_registryPerson/interface/response/Position";
 
 import DialogForm from "@/modules/04_registryPerson/views/edit/components/DialogForm.vue";
+import DialogSort from "@/modules/04_registryPerson/views/edit/components/DialogSort.vue";
 
 const $q = useQuasar();
 const route = useRoute();
@@ -27,6 +35,7 @@ const {
   success,
   findOrgNameHtml,
   dialogConfirm,
+  convertDateToAPI,
 } = useCounterMixin();
 
 const empType = ref<string>(route.params.type.toString());
@@ -64,48 +73,6 @@ const baseColumns = ref<QTableColumn[]>([
     style: "font-size: 14px",
     format: (v) => date2Thai(v),
   },
-  {
-    name: "commandDateSign",
-    align: "left",
-    label: "วันที่ลงนาม",
-    sortable: false,
-    field: "commandDateSign",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-    format: (v) => date2Thai(v),
-  },
-  {
-    name: "posNumCodeSit",
-    align: "left",
-    label: "หน่วยงานที่ออกคำสั่ง",
-    sortable: false,
-    field: "posNumCodeSit",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-    format(val, row) {
-      return row.posNumCodeSitAbb && row.posNumCodeSit
-        ? `${row.posNumCodeSit} (${row.posNumCodeSitAbb})`
-        : row.posNumCodeSit
-        ? row.posNumCodeSit
-        : "-";
-    },
-  },
-  {
-    name: "posNo",
-    align: "left",
-    label: empType.value === "employee" ? "ตำแหน่งเลขที่" : "เลขที่ตำแหน่ง",
-    sortable: false,
-    field: "posNo",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-    format(val, row) {
-      return row.posNoAbb && row.posNo
-        ? `${row.posNoAbb} ${row.posNo}`
-        : row.posNo
-        ? row.posNo
-        : "-";
-    },
-  },
   {
     name: "positionName",
     align: "left",
@@ -152,30 +119,42 @@ const baseColumns = ref<QTableColumn[]>([
     style: "font-size: 14px",
   },
   {
-    name: "commandNo",
+    name: "amount",
     align: "left",
-    label: "เลขที่คำสั่ง",
+    label: empType.value === "employee" ? "ค่าจ้าง" : "เงินเดือน",
     sortable: false,
-    field: "commandNo",
-    format(val, row) {
-      return row.commandNo && row.commandYear
-        ? `${row.commandNo}/${Number(row.commandYear) + 543}`
-        : "";
-    },
+    field: "amount",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
+    format(v, row) {
+      return row.amount
+        ? `${Number(row.amount).toLocaleString()}${
+            row.amountSpecial !== 0 && row.amountSpecial
+              ? ` (${Number(row.amountSpecial).toLocaleString()})`
+              : ""
+          }`
+        : "-";
+    },
   },
   {
-    name: "commandCode",
+    name: "mouthSalaryAmount",
     align: "left",
-    label: "ประเภทคำสั่ง",
+    label: "เงินค่าตอบแทนรายเดือน",
     sortable: false,
-    field: "commandCode",
-    format(val, row) {
-      return store.convertCommandCodeName(val);
-    },
+    field: "mouthSalaryAmount",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
+    format: (v) => (v ? Number(v).toLocaleString() : "-"),
+  },
+  {
+    name: "positionSalaryAmount",
+    align: "left",
+    label: "เงินประจำตำแหน่ง",
+    sortable: false,
+    field: "positionSalaryAmount",
+    headerStyle: "font-size: 14px",
+    style: "font-size: 14px",
+    format: (v) => (v ? Number(v).toLocaleString() : "-"),
   },
   {
     name: "organization",
@@ -196,44 +175,73 @@ const baseColumns = ref<QTableColumn[]>([
     },
   },
   {
-    name: "amount",
+    name: "posNo",
     align: "left",
-    label: empType.value === "employee" ? "ค่าจ้าง" : "เงินเดือน",
+    label: empType.value === "employee" ? "ตำแหน่งเลขที่" : "เลขที่ตำแหน่ง",
     sortable: false,
-    field: "amount",
+    field: "posNo",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
-    format(v, row) {
-      return row.amount
-        ? `${row.amount.toLocaleString()}${
-            row.amountSpecial !== 0 && row.amountSpecial
-              ? ` (${row.amountSpecial.toLocaleString()})`
-              : ""
-          }`
+    format(val, row) {
+      return row.posNoAbb && row.posNo
+        ? `${row.posNoAbb} ${row.posNo}`
+        : row.posNo
+        ? row.posNo
         : "-";
     },
   },
   {
-    name: "mouthSalaryAmount",
+    name: "posNumCodeSit",
     align: "left",
-    label: "เงินค่าตอบแทนรายเดือน",
+    label: "หน่วยงานที่ออกคำสั่ง",
     sortable: false,
-    field: "mouthSalaryAmount",
+    field: "posNumCodeSit",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
-    format: (v) => Number(v).toLocaleString(),
+    format(val, row) {
+      return row.posNumCodeSitAbb && row.posNumCodeSit
+        ? `${row.posNumCodeSit} (${row.posNumCodeSitAbb})`
+        : row.posNumCodeSit
+        ? row.posNumCodeSit
+        : "-";
+    },
   },
   {
-    name: "positionSalaryAmount",
+    name: "commandNo",
     align: "left",
-    label: "เงินประจำตำแหน่ง",
+    label: "เลขที่คำสั่ง",
     sortable: false,
-    field: "positionSalaryAmount",
+    field: "commandNo",
+    format(val, row) {
+      return row.commandNo && row.commandYear
+        ? `${row.commandNo}/${Number(row.commandYear) + 543}`
+        : "-";
+    },
+    headerStyle: "font-size: 14px",
+    style: "font-size: 14px",
+  },
+  {
+    name: "commandDateSign",
+    align: "left",
+    label: "วันที่ลงนาม",
+    sortable: false,
+    field: "commandDateSign",
+    headerStyle: "font-size: 14px",
+    style: "font-size: 14px",
+    format: (v) => date2Thai(v),
+  },
+  {
+    name: "commandCode",
+    align: "left",
+    label: "ประเภทคำสั่ง",
+    sortable: false,
+    field: "commandCode",
+    format(val, row) {
+      return store.convertCommandCodeName(val);
+    },
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
-    format: (v) => Number(v).toLocaleString(),
   },
-
   {
     name: "remark",
     align: "left",
@@ -247,19 +255,19 @@ const baseColumns = ref<QTableColumn[]>([
 const visibleColumns = ref<string[]>([
   "no",
   "commandDateAffect",
-  "posNumCodeSit",
-  "posNo",
   "positionName",
   "positionType",
   "positionLevel",
   "positionExecutive",
   "amount",
-  "positionSalaryAmount",
   "mouthSalaryAmount",
-  "commandNo",
-  "commandCode",
-  "commandDateSign",
+  "positionSalaryAmount",
   "organization",
+  "posNo",
+  "posNumCodeSit",
+  "commandNo",
+  "commandDateSign",
+  "commandCode",
   "remark",
 ]);
 const columns = computed<QTableColumn[]>(() => {
@@ -276,6 +284,7 @@ const columns = computed<QTableColumn[]>(() => {
 });
 
 const modal = ref<boolean>(false);
+const modalSort = ref<boolean>(false);
 
 /** function fetch ข้อมูลรายการตำแหน่งเงินเดือน*/
 async function fetchData() {
@@ -402,16 +411,362 @@ function classColorRow(isDelete: boolean, isEdit: boolean, isEntry: boolean) {
     : "";
 }
 
-onMounted(() => {
-  fetchData();
+/** ฟังก์ชันดาวน์โหลดไฟล Excel */
+function exportToExcel() {
+  const newData = rows.value.map((e: DataPosition) => {
+    return {
+      commandDateAffect: date2Thai(e.commandDateAffect),
+      positionName: e.positionName,
+      positionType: e.positionType,
+      positionLevel: e.positionLevel
+        ? e.positionLevel
+        : e.positionCee
+        ? e.positionCee
+        : "",
+      positionExecutive: e.positionExecutive,
+      amount: e.amount,
+      mouthSalaryAmount: e.mouthSalaryAmount,
+      positionSalaryAmount: e.positionSalaryAmount,
+      organization: findOrgName({
+        root: e.orgRoot,
+        child1: e.orgChild1,
+        child2: e.orgChild2,
+        child3: e.orgChild3,
+        child4: e.orgChild4,
+      }),
+      posNo:
+        e.posNoAbb && e.posNo
+          ? `${e.posNoAbb} ${e.posNo}`
+          : e.posNo
+          ? e.posNo
+          : "",
+      posNumCodeSit:
+        e.posNumCodeSitAbb && e.posNumCodeSit
+          ? `${e.posNumCodeSit} (${e.posNumCodeSitAbb})`
+          : e.posNumCodeSit
+          ? e.posNumCodeSit
+          : "",
+      commandNo:
+        e.posNumCodeSitAbb && e.posNumCodeSit
+          ? `${e.posNumCodeSit} (${e.posNumCodeSitAbb})`
+          : e.posNumCodeSit
+          ? e.posNumCodeSit
+          : "",
+      commandDateSign: date2Thai(e.commandDateSign),
+      commandCode: store.convertCommandCodeName(e.commandCode),
+      remark: e.remark,
+    };
+  });
+
+  const headers = columns.value.map((item: any) => item.label) || []; // หัวคอลัมน์ภาษาไทย
+  const worksheet = XLSX.utils.json_to_sheet(newData, {
+    header: visibleColumns.value,
+  });
+
+  //แทรกหัวคอลัมน์ภาษาไทย (ใช้ A1, B1, C1 แทน)
+  XLSX.utils.sheet_add_aoa(worksheet, [headers], { origin: "A1" });
+
+  // Create a new workbook and append the worksheet
+  const workbook = XLSX.utils.book_new();
+
+  XLSX.utils.book_append_sheet(
+    workbook,
+    worksheet,
+    `รายการประวัติตำแหน่งเงินเดือน`
+  );
+  XLSX.writeFile(workbook, "รายการประวัติตำแหน่งเงินเดือน.xlsx");
+}
+
+const commandCodeOptions = ref<DataOption[]>(store.commandCodeData); //รายการปรเภทคำสั่ง
+const posTypeOptions = ref<DataOption[]>(store.posTypeData); //รายการประเภทตำแหน่ง | กลุ่มงาน
+const posLevelOptions = ref<DataOption[]>(store.posLevelData); //รายการระดับตำแหน่ง | ระดับชั้นงาน
+const dataLevel = ref<DataPosType[]>([]); //รายการ ตำแหน่งเงินเดือน
+
+const formData = reactive<FormDataSalary>({
+  positionLevel: "",
+  positionCee: "",
+  amount: 0,
+  amountSpecial: 0,
+  posNoAbb: "",
+  posNo: "",
+  orgRoot: "",
+  orgChild1: "",
+  orgChild2: "",
+  orgChild3: "",
+  orgChild4: "",
+  commandCode: "",
+  posNumCodeSit: "",
+  posNumCodeSitAbb: "",
+  commandNo: "",
+  commandYear: null,
+});
+
+const isPositionName = ref<boolean>(false); //เช็คว่ามี ตำแหน่งประเภท
+const isUpdateData = ref<boolean>(false); // สถานะการแก้ไข
+const colNameMain = ref<string>(""); //ชื่อ Coolumn ที่ต้องการแก้ไข
+const salaryId = ref<string>(""); // id ที่ต้องการแก้ไข
+
+/**
+ * ฟังก์ชันกำหนดค่าที่ต้องการแก้ไข
+ * @param data ข้อมูลที่ต้องการแก้ไข
+ * @param colName ชื่อ Columns ที่ต้เองการแก้ไข
+ */
+function onShow(data: DataPosition, colName: string) {
+  salaryId.value = data.id;
+  isUpdateData.value = false;
+  commandCodeOptions.value = store.commandCodeData;
+  posTypeOptions.value = store.posTypeData;
+  if (colName === "positionLevel" && data.positionType) {
+    updateSelectType(data.positionType);
+  }
+  colNameMain.value = colName;
+  isPositionName.value = data.positionType ? true : false;
+  formData.positionLevel = data.positionLevel;
+  formData.positionCee = data.positionCee;
+  formData.amount = data.amount;
+  formData.amountSpecial = data.amountSpecial;
+  formData.orgRoot = data.orgRoot;
+  formData.orgChild1 = data.orgChild1;
+  formData.orgChild2 = data.orgChild2;
+  formData.orgChild3 = data.orgChild3;
+  formData.orgChild4 = data.orgChild4;
+  formData.posNoAbb = data.posNoAbb;
+  formData.posNo = data.posNo;
+  formData.commandCode = data.commandCode;
+  formData.posNumCodeSit = data.posNumCodeSit;
+  formData.posNumCodeSitAbb = data.posNumCodeSitAbb;
+  formData.commandNo = data.commandNo;
+  formData.commandYear = data.commandYear;
+}
+
+/**
+ * ฟังก์ชันบันทึกข้อมูลการแก้ไข
+ * @param val
+ * @param id
+ * @param close
+ */
+async function onSave(val: any, id: string, close?: () => void) {
+  if (isUpdateData.value) {
+    showLoader();
+    const isCol = (key: string) => colNameMain.value === key;
+    const toNumber = (v: any) =>
+      v ? Number(String(v).replace(/,/g, "")) : null;
+    const body: Record<string, any> = {};
+    if (isCol("commandDateAffect")) {
+      body.commandDateAffect = convertDateToAPI(val);
+    }
+    if (isCol("positionName")) {
+      body.positionName = val;
+    }
+    if (isCol("positionType")) {
+      body.positionType = val;
+    }
+    if (isCol("positionLevel")) {
+      body.positionLevel = formData.positionLevel;
+      body.positionCee = formData.positionCee;
+    }
+    if (isCol("positionExecutive")) {
+      body.positionExecutive = val;
+    }
+    if (isCol("amount")) {
+      body.amount = toNumber(formData.amount);
+      body.amountSpecial = toNumber(formData.amountSpecial);
+    }
+    if (isCol("positionSalaryAmount")) {
+      body.positionSalaryAmount = toNumber(val);
+    }
+    if (isCol("mouthSalaryAmount")) {
+      body.mouthSalaryAmount = toNumber(val);
+    }
+    if (isCol("organization")) {
+      body.orgRoot = formData.orgRoot;
+      body.orgChild1 = formData.orgChild1;
+      body.orgChild2 = formData.orgChild2;
+      body.orgChild3 = formData.orgChild3;
+      body.orgChild4 = formData.orgChild4;
+    }
+    if (isCol("posNo")) {
+      body.posNo = formData.posNo;
+      body.posNoAbb = formData.posNoAbb;
+    }
+    if (isCol("posNumCodeSit")) {
+      body.posNumCodeSit = formData.posNumCodeSit;
+      body.posNumCodeSitAbb = formData.posNumCodeSitAbb;
+    }
+    if (isCol("commandDateSign")) {
+      body.commandDateSign = convertDateToAPI(val);
+    }
+    if (isCol("commandNo")) {
+      body.commandNo = formData.commandNo;
+      body.commandYear = formData.commandYear;
+    }
+    if (isCol("commandCode")) {
+      body.commandCode = formData.commandCode;
+    }
+    if (isCol("remark")) {
+      body.remark = val;
+    }
+
+    await http
+      .patch(config.API.salaryTemp + `/${salaryId.value}`, body)
+      .then(async () => {
+        success($q, "บันทึกข้อมูลสำเร็จ");
+        const idx = rows.value.findIndex((item) => item.id === salaryId.value);
+        // อัปเดทข้อมูลในตาราง
+        if (idx !== -1) {
+          rows.value[idx] = {
+            ...rows.value[idx],
+            ...body,
+          };
+        }
+
+        // อัปเดทข้อมูลหลัก
+        const idxMain = rowsMain.value.findIndex(
+          (item) => item.id === salaryId.value
+        );
+        if (idxMain !== -1) {
+          rowsMain.value[idxMain] = {
+            ...rowsMain.value[idxMain],
+            ...body,
+          };
+        }
+      })
+      .catch(async (err) => {
+        await fetchData?.();
+        messageError($q, err);
+      })
+      .finally(() => {
+        hideLoader();
+        if (close) close();
+      });
+  } else {
+    if (close) {
+      close();
+    }
+  }
+}
+
+/**
+ * ฟิลเตอร์ข้อมูลจาก input
+ * @param val ค่าที่ป้อนให้ input
+ * @param update function จาก quasar
+ * @param filtername type ที่กำหนด ของ input นั้นๆ
+ */
+function filterSelector(val: string, update: Function, filtername: string) {
+  switch (filtername) {
+    case "commandCode":
+      update(() => {
+        commandCodeOptions.value = store.commandCodeData.filter(
+          (v: DataOption) => v.name.indexOf(val) > -1
+        );
+      });
+      break;
+
+    case "posType":
+      update(() => {
+        posTypeOptions.value = store.posTypeData.filter(
+          (v: DataOption) => v.name.indexOf(val) > -1
+        );
+      });
+      break;
+
+    case "posLevel":
+      update(() => {
+        posLevelOptions.value = store.posLevelData.filter(
+          (v: DataOption) => v.name.indexOf(val) > -1
+        );
+      });
+      break;
+
+    default:
+      break;
+  }
+}
+
+/** ฟังก์ชันเรียกข้อมูลปรเภทตำแหน่งข้าราชการ */
+async function fetchType() {
+  const entpont =
+    empType.value === "officer"
+      ? config.API.orgPosType
+      : config.API.orgEmployeeType;
+  await http
+    .get(entpont)
+    .then((res) => {
+      dataLevel.value = res.data.result;
+      store.posTypeData = res.data.result.map((e: DataPosType) => ({
+        id: e.id,
+        name: e.posTypeName,
+      }));
+      posTypeOptions.value = store.posTypeData;
+    })
+    .catch((err) => {
+      messageError($q, err);
+    });
+}
+
+/**
+ * ฟังก์ชันเลือกประเภทตำแหน่ง
+ * @param val id ประเภทตำแหน่ง
+ */
+async function updateSelectType(val: string) {
+  console.log(val);
+
+  const listLevel = val
+    ? dataLevel.value.find((e: DataPosType) => e.posTypeName === val)
+    : null;
+
+  // เช็คประเภทตำแหน่งงาน
+  if (listLevel) {
+    store.posLevelData = listLevel.posLevels.map((e: DataPosLevel) => ({
+      id: e.id,
+      name:
+        empType.value === "officer"
+          ? e.posLevelName
+          : `${listLevel.posTypeShortName} ${e.posLevelName}`,
+    }));
+  }
+}
+
+/** ฟังก์ชันอัปเดทการแก้ไข*/
+function onUpdateData() {
+  isUpdateData.value = true;
+}
+
+onMounted(async () => {
+  await Promise.all([fetchData(), fetchType()]);
 });
 </script>
 
 <template>
   <div class="row q-col-gutter-sm">
     <div class="col-12">
-      <div class="row q-col-gutter-sm">
+      <div class="row q-col-gutter-sm items-center">
+        <q-btn
+          v-if="
+            tabs === 'PENDING' && statusCheckEdit == 'PENDING' && isConfirmEdit
+          "
+          class="q-ml-sm"
+          round
+          flat
+          dense
+          color="blue"
+          icon="mdi-sort"
+          @click="modalSort = true"
+        >
+          <q-tooltip>จัดลำดับข้อมูล</q-tooltip></q-btn
+        >
         <q-space />
+        <div>
+          <q-btn
+            flat
+            round
+            color="primary"
+            icon="download"
+            :disable="rows.length == 0"
+            @click="exportToExcel()"
+          />
+        </div>
+
         <q-input
           dense
           outlined
@@ -450,7 +805,7 @@ onMounted(() => {
         :columns="columns"
         :rows="rows"
         :paging="true"
-        :rows-per-page-options="[20, 50, 100]"
+        :rows-per-page-options="[20, 50, 100, 150, 200, 0]"
         :visible-columns="visibleColumns"
         :loading="isLoad"
       >
@@ -523,6 +878,7 @@ onMounted(() => {
                 }}</q-tooltip>
               </q-btn>
             </q-td>
+
             <q-td
               v-for="col in props.cols"
               :key="col.id"
@@ -539,6 +895,268 @@ onMounted(() => {
               <div v-if="col.name === 'no'">
                 {{ props.rowIndex + 1 }}
               </div>
+
+              <div
+                v-else-if="
+                  col.name === 'positionLevel' ||
+                  col.name === 'amount' ||
+                  col.name === 'posNo' ||
+                  col.name === 'posNumCodeSit' ||
+                  col.name === 'commandNo' ||
+                  col.name === 'commandCode'
+                "
+              >
+                {{ col.value ?? "-" }}
+                <q-popup-edit
+                  v-if="
+                    tabs === 'PENDING' &&
+                    statusCheckEdit == 'PENDING' &&
+                    isConfirmEdit
+                  "
+                  v-model="props.row[col.name]"
+                  v-slot="scope"
+                  label-set="บันทึก"
+                  label-cancel="ยกเลิก"
+                  @before-show="onShow(props.row, col.name)"
+                  :persistent="col.name === 'commandNo'"
+                >
+                  <div class="q-mb-xs">
+                    {{ `แก้ไข${col.label}` }}
+                  </div>
+                  <div v-if="col.name === 'positionLevel'">
+                    <q-select
+                      v-if="isPositionName || props.row.positionLevel"
+                      outlined
+                      dense
+                      lazy-rules
+                      borderless
+                      v-model="formData.positionLevel"
+                      :label="
+                        empType === 'officer' ? 'ระดับตำแหน่ง' : 'ระดับชั้นงาน'
+                      "
+                      emit-value
+                      map-options
+                      option-label="name"
+                      :options="posLevelOptions"
+                      option-value="name"
+                      hide-bottom-space
+                      use-input
+                      hide-selected
+                      clearable
+                      fill-input
+                      input-debounce="0"
+                      @update:model-value="onUpdateData"
+                      @filter="(inputValue: string,
+                    doneFn: Function) => filterSelector(inputValue, doneFn, 'posLevel'
+                    )"
+                      ><template v-slot:no-option>
+                        <q-item>
+                          <q-item-section class="text-grey">
+                            ไม่มีข้อมูล
+                          </q-item-section>
+                        </q-item>
+                      </template>
+                    </q-select>
+
+                    <q-input
+                      v-else
+                      outlined
+                      dense
+                      lazy-rules
+                      borderless
+                      v-model="formData.positionCee"
+                      hide-bottom-space
+                      @update:model-value="onUpdateData"
+                    />
+                  </div>
+
+                  <div class="q-gutter-sm" v-if="col.name === 'amount'">
+                    <q-input
+                      dense
+                      outlined
+                      v-model="formData.amount"
+                      label="เงินเดือน"
+                      mask="###,###,###,###"
+                      reverse-fill-mask
+                      lazy-rules
+                      hide-bottom-space
+                      @update:model-value="onUpdateData"
+                    />
+                    <q-input
+                      dense
+                      outlined
+                      v-model="formData.amountSpecial"
+                      label="เงินค่าตอบแทนพิเศษ"
+                      mask="###,###,###,###"
+                      reverse-fill-mask
+                      hide-bottom-space
+                      @update:model-value="onUpdateData"
+                    />
+                  </div>
+
+                  <div class="q-gutter-sm" v-else-if="col.name === 'posNo'">
+                    <q-input
+                      outlined
+                      dense
+                      lazy-rules
+                      borderless
+                      v-model="formData.posNoAbb"
+                      hide-bottom-space
+                      :label="`${'ตัวย่อ'}`"
+                      @update:model-value="onUpdateData"
+                    />
+
+                    <q-input
+                      outlined
+                      dense
+                      lazy-rules
+                      borderless
+                      v-model="formData.posNo"
+                      hide-bottom-space
+                      :label="
+                        empType === 'officer'
+                          ? 'เลขที่ตำแหน่ง'
+                          : 'ตำแหน่งเลขที่'
+                      "
+                      @update:model-value="onUpdateData"
+                    >
+                    </q-input>
+                  </div>
+
+                  <div
+                    class="q-gutter-sm"
+                    v-else-if="col.name === 'posNumCodeSit'"
+                  >
+                    <q-input
+                      outlined
+                      dense
+                      lazy-rules
+                      borderless
+                      v-model="formData.posNumCodeSit"
+                      hide-bottom-space
+                      :label="`${'หน่วยงานที่ออกคำสั่ง'}`"
+                      @update:model-value="onUpdateData"
+                    />
+
+                    <q-input
+                      outlined
+                      dense
+                      lazy-rules
+                      borderless
+                      v-model="formData.posNumCodeSitAbb"
+                      hide-bottom-space
+                      :label="`${'ตัวย่อหน่วยงานที่ออกคำสั่ง'}`"
+                      @update:model-value="onUpdateData"
+                    />
+                  </div>
+
+                  <div class="q-gutter-sm" v-else-if="col.name === 'commandNo'">
+                    <q-input
+                      outlined
+                      dense
+                      lazy-rules
+                      borderless
+                      v-model="formData.commandNo"
+                      hide-bottom-space
+                      :label="`${'เลขที่คำสั่ง'}`"
+                      @update:model-value="onUpdateData"
+                    />
+
+                    <datepicker
+                      menu-class-name="modalfix"
+                      v-model="formData.commandYear"
+                      :locale="'th'"
+                      autoApply
+                      year-picker
+                      :enableTimePicker="false"
+                      teleport-center
+                      @update:model-value="onUpdateData"
+                    >
+                      <template #year="{ year }">{{ year + 543 }}</template>
+                      <template #year-overlay-value="{ value }">{{
+                        parseInt(value + 543)
+                      }}</template>
+                      <template #trigger>
+                        <q-input
+                          dense
+                          outlined
+                          hide-bottom-space
+                          :model-value="
+                            formData.commandYear == null
+                              ? null
+                              : formData.commandYear + 543
+                          "
+                          :label="`${'พ.ศ.'}`"
+                          clearable
+                          @clear="formData.commandYear = null"
+                          @update:model-value="onUpdateData"
+                        >
+                          <template v-slot:prepend>
+                            <q-icon
+                              name="event"
+                              class="cursor-pointer"
+                              style="color: var(--q-primary)"
+                            >
+                            </q-icon>
+                          </template>
+                        </q-input>
+                      </template>
+                    </datepicker>
+                  </div>
+
+                  <div
+                    class="q-gutter-sm"
+                    v-else-if="col.name === 'commandCode'"
+                  >
+                    <q-select
+                      outlined
+                      dense
+                      lazy-rules
+                      borderless
+                      v-model="formData.commandCode"
+                      emit-value
+                      map-options
+                      option-label="name"
+                      :options="commandCodeOptions"
+                      option-value="id"
+                      hide-bottom-space
+                      use-input
+                      hide-selected
+                      fill-input
+                      input-debounce="0"
+                      @update:model-value="onUpdateData"
+                      @filter="(inputValue: string,
+                doneFn: Function) => filterSelector(inputValue, doneFn, 'commandCode'
+                )"
+                    >
+                      <template v-slot:no-option>
+                        <q-item>
+                          <q-item-section class="text-grey">
+                            ไม่มีข้อมูล
+                          </q-item-section>
+                        </q-item>
+                      </template>
+                    </q-select>
+                  </div>
+
+                  <div class="row justify-around q-pt-sm">
+                    <q-btn
+                      flat
+                      color="primary"
+                      label="ยกเลิก"
+                      @click="scope.cancel"
+                    />
+
+                    <q-btn
+                      flat
+                      color="primary"
+                      label="บันทึก"
+                      @click="onSave(formData, props.row.id, scope.cancel)"
+                    />
+                  </div>
+                </q-popup-edit>
+              </div>
+
               <div v-else-if="col.name === 'organization'" class="text-html">
                 {{
                   findOrgNameHtml({
@@ -549,13 +1167,223 @@ onMounted(() => {
                     child4: props.row.orgChild4,
                   })
                 }}
+
+                <q-popup-edit
+                  v-if="
+                    tabs === 'PENDING' &&
+                    statusCheckEdit == 'PENDING' &&
+                    isConfirmEdit
+                  "
+                  v-model="props.row[col.name]"
+                  v-slot="scope"
+                  label-set="บันทึก"
+                  label-cancel="ยกเลิก"
+                  @before-show="onShow(props.row, col.name)"
+                >
+                  <div class="q-mb-xs">
+                    {{ `แก้ไข${col.label}` }}
+                  </div>
+
+                  <div class="q-gutter-sm">
+                    <q-input
+                      outlined
+                      dense
+                      lazy-rules
+                      borderless
+                      v-model="formData.orgRoot"
+                      hide-bottom-space
+                      :label="`${'หน่วยงาน'}`"
+                      @update:model-value="onUpdateData"
+                    />
+                    <q-input
+                      outlined
+                      dense
+                      lazy-rules
+                      borderless
+                      v-model="formData.orgChild1"
+                      hide-bottom-space
+                      :label="`${'ส่วนราชการระดับ 1'}`"
+                      @update:model-value="onUpdateData"
+                    />
+
+                    <q-input
+                      outlined
+                      dense
+                      lazy-rules
+                      borderless
+                      v-model="formData.orgChild2"
+                      hide-bottom-space
+                      :label="`${'ส่วนราชการระดับ 2'}`"
+                      @update:model-value="onUpdateData"
+                    />
+                    <q-input
+                      outlined
+                      dense
+                      lazy-rules
+                      borderless
+                      v-model="formData.orgChild3"
+                      hide-bottom-space
+                      :label="`${'ส่วนราชการระดับ 3'}`"
+                      @update:model-value="onUpdateData"
+                    />
+
+                    <q-input
+                      outlined
+                      dense
+                      lazy-rules
+                      borderless
+                      v-model="formData.orgChild4"
+                      hide-bottom-space
+                      :label="`${'ส่วนราชการระดับ 4'}`"
+                      @update:model-value="onUpdateData"
+                    />
+                  </div>
+                  <div class="row justify-around q-pt-sm">
+                    <q-btn
+                      flat
+                      color="primary"
+                      label="ยกเลิก"
+                      @click="scope.cancel"
+                    />
+
+                    <q-btn
+                      flat
+                      color="primary"
+                      label="บันทึก"
+                      @click="onSave(formData, props.row.id, scope.cancel)"
+                    />
+                  </div>
+                </q-popup-edit>
               </div>
 
-              <div v-else-if="col.name === 'commandCode'">
-                {{ col.value ? col.value : "-" }}
-              </div>
               <div v-else>
                 {{ col.value ? col.value : "-" }}
+                <q-popup-edit
+                  v-if="
+                    tabs === 'PENDING' &&
+                    statusCheckEdit == 'PENDING' &&
+                    isConfirmEdit
+                  "
+                  v-slot="scope"
+                  :persistent="
+                    col.name === 'commandDateAffect' ||
+                    col.name === 'commandDateSign'
+                  "
+                  v-model="props.row[col.name]"
+                  buttons
+                  label-set="บันทึก"
+                  label-cancel="ยกเลิก"
+                  @save="onSave"
+                  @before-show="onShow(props.row, col.name)"
+                >
+                  <div class="q-mb-xs">
+                    {{ `แก้ไข${col.label}` }}
+                  </div>
+
+                  <!-- แก้ไขวันที่คำสั่งมีผล -->
+                  <datepicker
+                    v-if="
+                      col.name === 'commandDateAffect' ||
+                      col.name === 'commandDateSign'
+                    "
+                    v-model="scope.value"
+                    :locale="'th'"
+                    :enableTimePicker="false"
+                    week-start="0"
+                    autoApply
+                    teleport-center
+                    @update:model-value="onUpdateData"
+                  >
+                    <template #year="{ year }">{{ year + 543 }}</template>
+                    <template #year-overlay-value="{ value }">{{
+                      parseInt(value + 543)
+                    }}</template>
+                    <template #trigger>
+                      <q-input
+                        outlined
+                        dense
+                        borderless
+                        :model-value="
+                          scope.value ? date2Thai(scope.value) : null
+                        "
+                        hide-bottom-space
+                      >
+                        <template v-slot:prepend>
+                          <q-icon
+                            name="event"
+                            color="primary"
+                            class="cursor-pointer"
+                          />
+                        </template>
+                      </q-input>
+                    </template>
+                  </datepicker>
+
+                  <q-input
+                    v-else-if="
+                      col.name === 'positionName' ||
+                      col.name === 'positionExecutive' ||
+                      col.name === 'remark'
+                    "
+                    outlined
+                    dense
+                    lazy-rules
+                    borderless
+                    v-model="scope.value"
+                    hide-bottom-space
+                    @update:model-value="onUpdateData"
+                  />
+
+                  <q-input
+                    v-else-if="
+                      col.name === 'mouthSalaryAmount' ||
+                      col.name === 'positionSalaryAmount'
+                    "
+                    dense
+                    outlined
+                    v-model="scope.value"
+                    mask="###,###,###,###"
+                    reverse-fill-mask
+                    lazy-rules
+                    hide-bottom-space
+                    @update:model-value="onUpdateData"
+                  />
+
+                  <q-select
+                    v-else-if="col.name === 'positionType'"
+                    outlined
+                    dense
+                    lazy-rules
+                    borderless
+                    v-model="scope.value"
+                    :label="
+                      empType === 'officer' ? 'ตำแหน่งประเภท' : 'กลุ่มงาน'
+                    "
+                    emit-value
+                    map-options
+                    option-label="name"
+                    :options="posTypeOptions"
+                    option-value="name"
+                    hide-bottom-space
+                    use-input
+                    hide-selected
+                    fill-input
+                    clearable
+                    input-debounce="0"
+                    @update:model-value="updateSelectType, onUpdateData()"
+                    @filter="(inputValue: string,
+                  doneFn: Function) => filterSelector(inputValue, doneFn, 'posType'
+                  )"
+                  >
+                    <template v-slot:no-option>
+                      <q-item>
+                        <q-item-section class="text-grey">
+                          ไม่มีข้อมูล
+                        </q-item-section>
+                      </q-item>
+                    </template>
+                  </q-select>
+                </q-popup-edit>
               </div>
             </q-td>
           </q-tr>
@@ -571,6 +1399,13 @@ onMounted(() => {
     :row-data="rows"
     :fetch-data="fetchData"
   />
+
+  <DialogSort
+    v-model:modal="modalSort"
+    :data-sort="rowsMain"
+    :fetch-data="fetchData"
+    :columns="columns"
+  />
 </template>
 
 <style scoped></style>
diff --git a/src/modules/04_registryPerson/views/edit/salary.vue b/src/modules/04_registryPerson/views/edit/salary.vue
index 14733902d..7c1cffc6d 100644
--- a/src/modules/04_registryPerson/views/edit/salary.vue
+++ b/src/modules/04_registryPerson/views/edit/salary.vue
@@ -47,6 +47,7 @@ async function fetchDataProfile() {
     .then(async (res) => {
       const data = res.data.result;
       statusCheckEdit.value = data.statusCheckEdit;
+      fetchPromission(data.rootId);
       dataProfile.value = {
         fullName: `${data.prefix}${data.firstName} ${data.lastName}`,
         position: data.position,
@@ -62,9 +63,9 @@ async function fetchDataProfile() {
     });
 }
 
-function fetchPromission() {
+function fetchPromission(rootId: string) {
   http
-    .get(config.API.profilePermission)
+    .get(config.API.profilePermission(rootId))
     .then((res) => {
       const data = res.data.result;
       isConfirmEdit.value = data.isEdit;
@@ -133,7 +134,7 @@ function onConfirmDone() {
 onMounted(async () => {
   try {
     showLoader();
-    await Promise.all([fetchDataProfile(), fetchPromission()]);
+    await fetchDataProfile();
   } catch (err) {
     messageError($q, err);
   } finally {
diff --git a/src/modules/05_placement/components/AppointEmployee/DialogOrders.vue b/src/modules/05_placement/components/AppointEmployee/DialogOrders.vue
index 5070be06d..1573d607c 100644
--- a/src/modules/05_placement/components/AppointEmployee/DialogOrders.vue
+++ b/src/modules/05_placement/components/AppointEmployee/DialogOrders.vue
@@ -348,7 +348,7 @@ watch(
                   dense
                   v-model="filterKeyword2"
                   placeholder="ค้นหา"
-                  @keydown.enter="onSearch"
+                  @keydown.enter.prevent="onSearch"
                 >
                   <template v-slot:append>
                     <q-icon name="search" />
diff --git a/src/modules/05_placement/components/AppointMent/DialogOrders.vue b/src/modules/05_placement/components/AppointMent/DialogOrders.vue
index 62a7bd15e..3c34966b2 100644
--- a/src/modules/05_placement/components/AppointMent/DialogOrders.vue
+++ b/src/modules/05_placement/components/AppointMent/DialogOrders.vue
@@ -358,7 +358,7 @@ watch(
                   dense
                   v-model="filterKeyword2"
                   placeholder="ค้นหา"
-                  @keydown.enter="onSearch"
+                  @keydown.enter.prevent="onSearch"
                 >
                   <template v-slot:append>
                     <q-icon name="search" />
diff --git a/src/modules/05_placement/components/Help-Government/DialogOrders.vue b/src/modules/05_placement/components/Help-Government/DialogOrders.vue
index d2216c21d..d74d93e9f 100644
--- a/src/modules/05_placement/components/Help-Government/DialogOrders.vue
+++ b/src/modules/05_placement/components/Help-Government/DialogOrders.vue
@@ -241,7 +241,7 @@ function onSearch() {
               dense
               v-model="filterKeyword2"
               placeholder="ค้นหา"
-              @keydown.enter="onSearch"
+              @keydown.enter.prevent="onSearch"
             >
               <template v-slot:append> <q-icon name="search" /> </template>
             </q-input>
diff --git a/src/modules/05_placement/components/Other/DialogOrders.vue b/src/modules/05_placement/components/Other/DialogOrders.vue
index 18aa8326a..12816b288 100644
--- a/src/modules/05_placement/components/Other/DialogOrders.vue
+++ b/src/modules/05_placement/components/Other/DialogOrders.vue
@@ -287,7 +287,7 @@ watch(
                   dense
                   v-model="filterKeyword2"
                   placeholder="ค้นหา"
-                  @keydown.enter="onSearch"
+                  @keydown.enter.prevent="onSearch"
                 >
                   <template v-slot:append>
                     <q-icon name="search" />
diff --git a/src/modules/05_placement/components/PersonalDetail/Information/TableEducation.vue b/src/modules/05_placement/components/PersonalDetail/Information/TableEducation.vue
index 25ad7f8b0..49bf4e463 100644
--- a/src/modules/05_placement/components/PersonalDetail/Information/TableEducation.vue
+++ b/src/modules/05_placement/components/PersonalDetail/Information/TableEducation.vue
@@ -106,7 +106,7 @@ const resetFilter = () => {
         placeholder="ค้นหา"
         style="max-width: 200px"
         class="q-ml-sm"
-        @keydown.enter="props.onSearch?.()"
+        @keydown.enter.prevent="props.onSearch?.()"
       >
         <template v-slot:append>
           <q-icon name="search" />
diff --git a/src/modules/05_placement/components/PersonalList/CardPosition.vue b/src/modules/05_placement/components/PersonalList/CardPosition.vue
index 378517a06..f26733d93 100644
--- a/src/modules/05_placement/components/PersonalList/CardPosition.vue
+++ b/src/modules/05_placement/components/PersonalList/CardPosition.vue
@@ -366,7 +366,7 @@ onMounted(async () => {
                   dense
                   v-model="filters"
                   label="ค้นหา"
-                  @keydown.enter="onSearch"
+                  @keydown.enter.prevent="onSearch"
                 >
                   <template v-slot:append>
                     <q-icon name="search" />
diff --git a/src/modules/05_placement/components/PersonalList/DialogOrders.vue b/src/modules/05_placement/components/PersonalList/DialogOrders.vue
index fbe8b4e8d..4367c6fe2 100644
--- a/src/modules/05_placement/components/PersonalList/DialogOrders.vue
+++ b/src/modules/05_placement/components/PersonalList/DialogOrders.vue
@@ -294,7 +294,7 @@ watch(
             v-model="filter"
             placeholder="ค้นหา"
             style="width: 200px; max-width: auto"
-            @keydown.enter="onSearch"
+            @keydown.enter.prevent="onSearch"
           >
             <template v-slot:append>
               <q-icon name="search" />
diff --git a/src/modules/05_placement/components/PersonalList/Table.vue b/src/modules/05_placement/components/PersonalList/Table.vue
index 6d5d2af9b..479e41a08 100644
--- a/src/modules/05_placement/components/PersonalList/Table.vue
+++ b/src/modules/05_placement/components/PersonalList/Table.vue
@@ -1459,7 +1459,7 @@ onMounted(async () => {
                 v-model="filterlistAdd"
                 placeholder="ค้นหา"
                 style="width: 850px; max-width: auto"
-                @keydown.enter="onSearchAdd"
+                @keydown.enter.prevent="onSearchAdd"
               >
                 <template v-slot:append>
                   <q-icon name="search" />
diff --git a/src/modules/05_placement/components/PersonalList/TableView.vue b/src/modules/05_placement/components/PersonalList/TableView.vue
index a9245d0ea..92f318067 100644
--- a/src/modules/05_placement/components/PersonalList/TableView.vue
+++ b/src/modules/05_placement/components/PersonalList/TableView.vue
@@ -1,7 +1,11 @@
 <script setup lang="ts">
 import { ref, useAttrs } from "vue";
 import { QTooltip, useQuasar } from "quasar";
-import { checkPermission } from "@/utils/permissions";
+import {
+  checkPermission,
+  checkPermissionList,
+  checkPermissionCreate,
+} from "@/utils/permissions";
 
 import type { PropType } from "vue";
 import type { optionData } from "@/modules/05_placement/interface/index/Main";
@@ -267,6 +271,11 @@ function filterSelector(val: string, update: Function) {
       </div>
 
       <q-btn
+        v-if="
+          checkPermission($route)?.attrIsUpdate &&
+          checkPermissionList(['COMMAND']) &&
+          checkPermissionCreate('COMMAND')
+        "
         flat
         round
         color="primary"
@@ -296,7 +305,7 @@ function filterSelector(val: string, update: Function) {
           placeholder="ค้นหา"
           style="max-width: 200px"
           class="q-ml-sm"
-          @keydown.enter="onUpdateNewRows"
+          @keydown.enter.prevent="onUpdateNewRows"
         >
           <template v-slot:append> </template>
         </q-input>
diff --git a/src/modules/05_placement/components/Receive/DialogOrders.vue b/src/modules/05_placement/components/Receive/DialogOrders.vue
index 41e1a749a..a5262cce7 100644
--- a/src/modules/05_placement/components/Receive/DialogOrders.vue
+++ b/src/modules/05_placement/components/Receive/DialogOrders.vue
@@ -257,7 +257,7 @@ watchEffect(() => {
               :model-value="filterKeyword2"
               @update:model-value="updateInput"
               placeholder="ค้นหา"
-              @keydown.enter="onSearch"
+              @keydown.enter.prevent="onSearch"
             >
               <template v-slot:append>
                 <q-icon name="search" />
diff --git a/src/modules/05_placement/components/Repatriate/DialogOrders.vue b/src/modules/05_placement/components/Repatriate/DialogOrders.vue
index 53f177dad..dbee9ad51 100644
--- a/src/modules/05_placement/components/Repatriate/DialogOrders.vue
+++ b/src/modules/05_placement/components/Repatriate/DialogOrders.vue
@@ -209,7 +209,7 @@ watch(
               dense
               v-model="filterKeyword2"
               placeholder="ค้นหา"
-              @keydown.enter="onSearch"
+              @keydown.enter.prevent="onSearch"
             >
               <template v-slot:append>
                 <q-icon name="search" />
diff --git a/src/modules/05_placement/components/Transfer/DialogOrders.vue b/src/modules/05_placement/components/Transfer/DialogOrders.vue
index a6c636cb9..562819344 100644
--- a/src/modules/05_placement/components/Transfer/DialogOrders.vue
+++ b/src/modules/05_placement/components/Transfer/DialogOrders.vue
@@ -197,7 +197,7 @@ watch(
               dense
               v-model="filter"
               placeholder="ค้นหา"
-              @keydown.enter="onSearch"
+              @keydown.enter.prevent="onSearch"
             >
               <template v-slot:append>
                 <q-icon name="search" />
diff --git a/src/modules/05_placement/components/probation/DialogOrder.vue b/src/modules/05_placement/components/probation/DialogOrder.vue
index f376b37e2..414ef0ba0 100644
--- a/src/modules/05_placement/components/probation/DialogOrder.vue
+++ b/src/modules/05_placement/components/probation/DialogOrder.vue
@@ -302,7 +302,7 @@ watch(
               v-model="filter"
               placeholder="ค้นหา"
               style="width: 200px; max-width: auto"
-              @keydown.enter="(pagination.page = 1), getList()"
+              @keydown.enter.prevent="(pagination.page = 1), getList()"
             >
               <template v-slot:append>
                 <q-icon name="search" />
diff --git a/src/modules/05_placement/components/probation/DialogOrder/DialogSendToCommand.vue b/src/modules/05_placement/components/probation/DialogOrder/DialogSendToCommand.vue
index 7f554d05a..021d6555c 100644
--- a/src/modules/05_placement/components/probation/DialogOrder/DialogSendToCommand.vue
+++ b/src/modules/05_placement/components/probation/DialogOrder/DialogSendToCommand.vue
@@ -172,7 +172,7 @@ watchEffect(() => {
               dense
               placeholder="ค้นหา"
               v-model="filterKeyword"
-              @keydown.enter="onSearch"
+              @keydown.enter.prevent="onSearch"
             >
               <template v-slot:append>
                 <q-icon name="search" />
diff --git a/src/modules/05_placement/components/probation/FormAssign.vue b/src/modules/05_placement/components/probation/FormAssign.vue
index d282229e2..2a4ade79f 100644
--- a/src/modules/05_placement/components/probation/FormAssign.vue
+++ b/src/modules/05_placement/components/probation/FormAssign.vue
@@ -875,13 +875,13 @@ async function clickdownloadFile(type: string) {
         `แบบมอบหมายงานการทดลองปฏิบัติหน้าที่ราชการ-${fullname.value}`,
         type
       );
-      hideLoader();
     })
     .catch(async (e) => {
       messageError($q, JSON.parse(await e.response.data.text()));
-      hideLoader();
     })
-    .finally(() => {});
+    .finally(() => {
+      hideLoader();
+    });
 }
 
 /** เช็ค จำนวนเดือน เเละ วันที่เริ่ม ไม่เท่ากับ undefined*/
diff --git a/src/modules/05_placement/components/probation/FormEvaluation/FormReport.vue b/src/modules/05_placement/components/probation/FormEvaluation/FormReport.vue
index 75241f9f0..b2b8d206b 100644
--- a/src/modules/05_placement/components/probation/FormEvaluation/FormReport.vue
+++ b/src/modules/05_placement/components/probation/FormEvaluation/FormReport.vue
@@ -6,7 +6,7 @@ import { useRoute, useRouter } from "vue-router";
 import http from "@/plugins/http";
 import config from "@/app.config";
 import { useProbationDataStore } from "@/modules/05_placement/storeProbation";
-import genReport from "@/plugins/genreport";
+
 
 import FormUploadFile from "@/modules/05_placement/components/probation/FormEvaluation/FormUploadFile.vue";
 import DialogSelectAuthority from "@/modules/05_placement/components/probation/FormEvaluation/DialogSelectAuthority.vue";
diff --git a/src/modules/05_placement/components/probation/FormEvaluation/Template1Commader.vue b/src/modules/05_placement/components/probation/FormEvaluation/Template1Commader.vue
index e0f0f4ec7..e76f4593b 100644
--- a/src/modules/05_placement/components/probation/FormEvaluation/Template1Commader.vue
+++ b/src/modules/05_placement/components/probation/FormEvaluation/Template1Commader.vue
@@ -97,13 +97,13 @@ async function FileDownload(type: string) {
           `แบบบันทึกผล(ผู้บังคับบัญชา)_${probationStore.person.name}_ครั้งที่${numTab.no}`,
           type
         );
-        hideLoader();
       })
       .catch(async (e) => {
         messageError($q, JSON.parse(await e.response.data.text()));
-        hideLoader();
       })
-      .finally(() => {});
+      .finally(() => {
+        hideLoader();
+      });
   } else {
     //ผุ้บังคับ
     showLoader();
@@ -116,13 +116,13 @@ async function FileDownload(type: string) {
           `แบบบันทึกผล(ผู้บังคับบัญชา)_${probationStore.person.name}_ครั้งที่${numTab.no}`,
           type
         );
-        hideLoader();
       })
       .catch(async (e) => {
         messageError($q, JSON.parse(await e.response.data.text()));
-        hideLoader();
       })
-      .finally(() => {});
+      .finally(() => {
+        hideLoader();
+      });
   }
 }
 
diff --git a/src/modules/05_placement/components/probation/MainAppoint.vue b/src/modules/05_placement/components/probation/MainAppoint.vue
index 1da0d98b6..6d9c6c229 100644
--- a/src/modules/05_placement/components/probation/MainAppoint.vue
+++ b/src/modules/05_placement/components/probation/MainAppoint.vue
@@ -6,7 +6,11 @@ import { useRouter } from "vue-router";
 import http from "@/plugins/http";
 import config from "@/app.config";
 import { useCounterMixin } from "@/stores/mixin";
-import { checkPermission } from "@/utils/permissions";
+import {
+  checkPermission,
+  checkPermissionList,
+  checkPermissionCreate,
+} from "@/utils/permissions";
 
 import type { AppointMainRows } from "@/modules/05_placement/interface/request/Main";
 import DialogOrder from "@/modules/05_placement/components/probation/DialogOrder/DialogSendToCommand.vue";
@@ -181,7 +185,11 @@ onMounted(async () => {
         <div class="row q-col-gutter-sm">
           <div class="q-px-sm">
             <q-btn
-              v-if="checkPermission($route)?.attrIsUpdate"
+              v-if="
+                checkPermission($route)?.attrIsUpdate &&
+                checkPermissionList(['COMMAND']) &&
+                checkPermissionCreate('COMMAND')
+              "
               flat
               round
               dense
@@ -200,7 +208,7 @@ onMounted(async () => {
             ref="filterRef"
             outlined
             placeholder="ค้นหา"
-            @keydown.enter="onSearch"
+            @keydown.enter.prevent="onSearch"
           >
             <template v-slot:append>
               <q-icon name="search" />
diff --git a/src/modules/05_placement/components/probation/MainProbation.vue b/src/modules/05_placement/components/probation/MainProbation.vue
index 6700554d7..1d37d72fe 100644
--- a/src/modules/05_placement/components/probation/MainProbation.vue
+++ b/src/modules/05_placement/components/probation/MainProbation.vue
@@ -5,7 +5,11 @@ import { useRouter } from "vue-router";
 
 import http from "@/plugins/http";
 import config from "@/app.config";
-import { checkPermission } from "@/utils/permissions";
+import {
+  checkPermission,
+  checkPermissionList,
+  checkPermissionCreate,
+} from "@/utils/permissions";
 import { useCounterMixin } from "@/stores/mixin";
 import { useTransferDataStore } from "@/modules/05_placement/store";
 
@@ -511,7 +515,9 @@ onMounted(() => {
             <q-btn
               v-if="
                 checkPermission($route)?.attrIsUpdate &&
-                checkPermission($route)?.attrIsGet
+                checkPermission($route)?.attrIsGet &&
+                checkPermissionList(['COMMAND']) &&
+                checkPermissionCreate('COMMAND')
               "
               @click="onCommand"
               flat
diff --git a/src/modules/05_placement/components/probation/ProbationDetail.vue b/src/modules/05_placement/components/probation/ProbationDetail.vue
index cf4ad1e31..3914fefc3 100644
--- a/src/modules/05_placement/components/probation/ProbationDetail.vue
+++ b/src/modules/05_placement/components/probation/ProbationDetail.vue
@@ -421,7 +421,7 @@ onMounted(async () => {
           ref="filterRef"
           outlined
           placeholder="ค้นหา"
-          @keydown.enter="onSearch"
+          @keydown.enter.prevent="onSearch"
         >
           <template v-slot:append>
             <q-icon name="search" />
diff --git a/src/modules/05_placement/views/01_Main.vue b/src/modules/05_placement/views/01_Main.vue
index b1ae062d8..b461d5fbb 100644
--- a/src/modules/05_placement/views/01_Main.vue
+++ b/src/modules/05_placement/views/01_Main.vue
@@ -423,7 +423,7 @@ onMounted(() => {
           ref="filterRef"
           outlined
           placeholder="ค้นหา"
-          @keydown.enter="onSearch"
+          @keydown.enter.prevent="onSearch"
         >
           <template v-slot:append>
             <q-icon name="search" />
diff --git a/src/modules/05_placement/views/02_transferMain.vue b/src/modules/05_placement/views/02_transferMain.vue
index 3347146af..463bde065 100644
--- a/src/modules/05_placement/views/02_transferMain.vue
+++ b/src/modules/05_placement/views/02_transferMain.vue
@@ -3,7 +3,11 @@ import { ref, onMounted, computed } from "vue";
 import { useQuasar } from "quasar";
 
 import { useRouter } from "vue-router";
-import { checkPermission } from "@/utils/permissions";
+import {
+  checkPermission,
+  checkPermissionList,
+  checkPermissionCreate,
+} from "@/utils/permissions";
 import { useCounterMixin } from "@/stores/mixin";
 import { useTransferDataStore } from "@/modules/05_placement/store";
 import http from "@/plugins/http";
@@ -240,7 +244,11 @@ onMounted(async () => {
             </q-select>
           </div>
           <q-btn
-            v-if="checkPermission($route)?.attrIsUpdate"
+            v-if="
+              checkPermission($route)?.attrIsUpdate &&
+              checkPermissionList(['COMMAND']) &&
+              checkPermissionCreate('COMMAND')
+            "
             @click="openModalOrder"
             flat
             round
diff --git a/src/modules/05_placement/views/03_receiveMain.vue b/src/modules/05_placement/views/03_receiveMain.vue
index aeeffb14b..8a7583d81 100644
--- a/src/modules/05_placement/views/03_receiveMain.vue
+++ b/src/modules/05_placement/views/03_receiveMain.vue
@@ -3,7 +3,11 @@ import { ref, onMounted } from "vue";
 import { useQuasar } from "quasar";
 
 import { useRouter } from "vue-router";
-import { checkPermission } from "@/utils/permissions";
+import {
+  checkPermission,
+  checkPermissionList,
+  checkPermissionCreate,
+} from "@/utils/permissions";
 import { useCounterMixin } from "@/stores/mixin";
 import { useTransferDataStore } from "@/modules/05_placement/store";
 import http from "@/plugins/http";
@@ -445,7 +449,11 @@ onMounted(async () => {
             <q-tooltip>เพิ่มข้อมูล</q-tooltip>
           </q-btn>
           <q-btn
-            v-if="checkPermission($route)?.attrIsUpdate"
+            v-if="
+              checkPermission($route)?.attrIsUpdate &&
+              checkPermissionList(['COMMAND']) &&
+              checkPermissionCreate('COMMAND')
+            "
             size="14px"
             flat
             round
@@ -463,7 +471,7 @@ onMounted(async () => {
             ref="filterRef"
             outlined
             placeholder="ค้นหา"
-            @keydown.enter="onSearch"
+            @keydown.enter.prevent="onSearch"
           >
             <template v-slot:append>
               <q-icon name="search" />
diff --git a/src/modules/05_placement/views/04_helpGovernmentMain.vue b/src/modules/05_placement/views/04_helpGovernmentMain.vue
index ddeb8a0e1..e59bd9e47 100644
--- a/src/modules/05_placement/views/04_helpGovernmentMain.vue
+++ b/src/modules/05_placement/views/04_helpGovernmentMain.vue
@@ -2,7 +2,11 @@
 import { ref, onMounted } from "vue";
 import { useQuasar } from "quasar";
 
-import { checkPermission } from "@/utils/permissions";
+import {
+  checkPermission,
+  checkPermissionList,
+  checkPermissionCreate,
+} from "@/utils/permissions";
 import { useRouter } from "vue-router";
 import { useTransferDataStore } from "@/modules/05_placement/store";
 import { useCounterMixin } from "@/stores/mixin";
@@ -301,7 +305,11 @@ onMounted(async () => {
             </q-select>
           </div>
           <q-btn
-            v-if="checkPermission($route)?.attrIsUpdate"
+            v-if="
+              checkPermission($route)?.attrIsUpdate &&
+              checkPermissionList(['COMMAND']) &&
+              checkPermissionCreate('COMMAND')
+            "
             @click="openModalOrder"
             size="14px"
             flat
@@ -319,7 +327,7 @@ onMounted(async () => {
             ref="filterRef"
             outlined
             placeholder="ค้นหา"
-            @keydown.enter="onSearch"
+            @keydown.enter.prevent="onSearch"
           >
             <template v-slot:append>
               <q-icon name="search" />
diff --git a/src/modules/05_placement/views/05_repatriateMain.vue b/src/modules/05_placement/views/05_repatriateMain.vue
index 5f0960242..d728066f3 100644
--- a/src/modules/05_placement/views/05_repatriateMain.vue
+++ b/src/modules/05_placement/views/05_repatriateMain.vue
@@ -3,7 +3,11 @@ import { ref, onMounted } from "vue";
 import { useQuasar } from "quasar";
 
 import { useRouter } from "vue-router";
-import { checkPermission } from "@/utils/permissions";
+import {
+  checkPermission,
+  checkPermissionList,
+  checkPermissionCreate,
+} from "@/utils/permissions";
 import { useCounterMixin } from "@/stores/mixin";
 import { useTransferDataStore } from "@/modules/05_placement/store";
 import http from "@/plugins/http";
@@ -273,7 +277,11 @@ onMounted(async () => {
             </q-select>
           </div>
           <q-btn
-            v-if="checkPermission($route)?.attrIsUpdate"
+            v-if="
+              checkPermission($route)?.attrIsUpdate &&
+              checkPermissionList(['COMMAND']) &&
+              checkPermissionCreate('COMMAND')
+            "
             flat
             round
             size="14px"
@@ -291,7 +299,7 @@ onMounted(async () => {
             ref="filterRef"
             outlined
             placeholder="ค้นหา"
-            @keydown.enter="onSearch"
+            @keydown.enter.prevent="onSearch"
           >
             <template v-slot:append>
               <q-icon name="search" />
diff --git a/src/modules/05_placement/views/06_appointPromoteMain.vue b/src/modules/05_placement/views/06_appointPromoteMain.vue
index c08539af5..be986ad4d 100644
--- a/src/modules/05_placement/views/06_appointPromoteMain.vue
+++ b/src/modules/05_placement/views/06_appointPromoteMain.vue
@@ -3,7 +3,11 @@ import { ref, onMounted } from "vue";
 import { useQuasar } from "quasar";
 
 import { useRouter } from "vue-router";
-import { checkPermission } from "@/utils/permissions";
+import {
+  checkPermission,
+  checkPermissionList,
+  checkPermissionCreate,
+} from "@/utils/permissions";
 import { useCounterMixin } from "@/stores/mixin";
 import { useTransferDataStore } from "@/modules/05_placement/store";
 import http from "@/plugins/http";
@@ -403,7 +407,11 @@ onMounted(async () => {
           </div>
           <div>
             <q-btn
-              v-if="checkPermission($route)?.attrIsUpdate"
+              v-if="
+                checkPermission($route)?.attrIsUpdate &&
+                checkPermissionList(['COMMAND']) &&
+                checkPermissionCreate('COMMAND')
+              "
               @click="sendToCommand()"
               size="14px"
               flat
@@ -423,7 +431,7 @@ onMounted(async () => {
             ref="filterRef"
             outlined
             placeholder="ค้นหา"
-            @keydown.enter="onSearch"
+            @keydown.enter.prevent="onSearch"
           >
             <template v-slot:append>
               <q-icon name="search" />
diff --git a/src/modules/05_placement/views/07_appointEmployeeMain.vue b/src/modules/05_placement/views/07_appointEmployeeMain.vue
index b649cf8d3..4a4bbff29 100644
--- a/src/modules/05_placement/views/07_appointEmployeeMain.vue
+++ b/src/modules/05_placement/views/07_appointEmployeeMain.vue
@@ -2,7 +2,11 @@
 import { ref, onMounted } from "vue";
 import { useQuasar } from "quasar";
 
-import { checkPermission } from "@/utils/permissions";
+import {
+  checkPermission,
+  checkPermissionList,
+  checkPermissionCreate,
+} from "@/utils/permissions";
 import { useRouter } from "vue-router";
 import { useCounterMixin } from "@/stores/mixin";
 import { useTransferDataStore } from "@/modules/05_placement/store";
@@ -400,7 +404,11 @@ onMounted(async () => {
             </q-select>
           </div>
           <q-btn
-            v-if="checkPermission($route)?.attrIsUpdate"
+            v-if="
+              checkPermission($route)?.attrIsUpdate &&
+              checkPermissionList(['COMMAND']) &&
+              checkPermissionCreate('COMMAND')
+            "
             @click="popup()"
             size="14px"
             flat
@@ -419,7 +427,7 @@ onMounted(async () => {
             ref="filterRef"
             outlined
             placeholder="ค้นหา"
-            @keydown.enter="onSearch"
+            @keydown.enter.prevent="onSearch"
           >
             <template v-slot:append>
               <q-icon name="search" />
@@ -586,7 +594,8 @@ onMounted(async () => {
                           props.row.posTypeName === "อำนวยการ"
                             ? `${props.row.posTypeName}`
                             : ""
-                        }} {{
+                        }}
+                        {{
                           props.row.posLevelName !== null
                             ? `(${props.row.posLevelName})`
                             : ""
diff --git a/src/modules/05_placement/views/08_otherMain.vue b/src/modules/05_placement/views/08_otherMain.vue
index 3dd11dfbe..9ab2ed2bc 100644
--- a/src/modules/05_placement/views/08_otherMain.vue
+++ b/src/modules/05_placement/views/08_otherMain.vue
@@ -3,7 +3,11 @@ import { ref, onMounted } from "vue";
 import { useQuasar } from "quasar";
 
 import { useRouter } from "vue-router";
-import { checkPermission } from "@/utils/permissions";
+import {
+  checkPermission,
+  checkPermissionList,
+  checkPermissionCreate,
+} from "@/utils/permissions";
 import { useTransferDataStore } from "@/modules/05_placement/store";
 import { useCounterMixin } from "@/stores/mixin";
 import http from "@/plugins/http";
@@ -353,7 +357,11 @@ onMounted(() => {
             </q-select>
           </div>
           <q-btn
-            v-if="checkPermission($route)?.attrIsUpdate"
+            v-if="
+              checkPermission($route)?.attrIsUpdate &&
+              checkPermissionList(['COMMAND']) &&
+              checkPermissionCreate('COMMAND')
+            "
             @click="popup()"
             size="14px"
             flat
@@ -371,7 +379,7 @@ onMounted(() => {
             ref="filterRef"
             outlined
             placeholder="ค้นหา"
-            @keydown.enter="onSearch"
+            @keydown.enter.prevent="onSearch"
           >
             <template v-slot:append>
               <q-icon name="search" />
diff --git a/src/modules/06_retirement/components/01_retirement/RetirementDetail.vue b/src/modules/06_retirement/components/01_retirement/RetirementDetail.vue
index 49334a200..594cf7720 100644
--- a/src/modules/06_retirement/components/01_retirement/RetirementDetail.vue
+++ b/src/modules/06_retirement/components/01_retirement/RetirementDetail.vue
@@ -566,7 +566,7 @@ onMounted(async () => {
               placeholder="ค้นหา"
               style="max-width: 200px"
               class="q-ml-sm"
-              @keydown.enter="onSearch"
+              @keydown.enter.prevent="onSearch"
             >
               <template v-slot:append>
                 <q-icon name="search" />
diff --git a/src/modules/06_retirement/components/02_resign/DialogSendToCommand.vue b/src/modules/06_retirement/components/02_resign/DialogSendToCommand.vue
index f23e80194..0854bc10e 100644
--- a/src/modules/06_retirement/components/02_resign/DialogSendToCommand.vue
+++ b/src/modules/06_retirement/components/02_resign/DialogSendToCommand.vue
@@ -4,6 +4,7 @@ import { useQuasar } from "quasar";
 
 import { useCounterMixin } from "@/stores/mixin";
 import { useRetirementDataStore } from "@/modules/06_retirement/store/Main";
+import { useRoleWorkflowDataStore } from "@/stores/roleWorkflow";
 
 import type { PropType } from "vue";
 import type { QTableProps } from "quasar";
@@ -15,6 +16,7 @@ import DialogCreateCommand from "@/modules/18_command/components/DialogCreateCom
 /** use */
 const $q = useQuasar();
 const stroe = useRetirementDataStore();
+const { fetchDataCheckIsoffice } = useRoleWorkflowDataStore();
 const { statusText } = stroe;
 const selected = ref<ResponseItems[]>([]);
 const dataMapToSend = computed(() => {
@@ -33,7 +35,7 @@ const dataMapToSend = computed(() => {
   }));
 });
 const mixin = useCounterMixin();
-const { dialogConfirm, date2Thai, onSearchDataTable } = mixin;
+const { dialogConfirm, date2Thai, onSearchDataTable, messageError } = mixin;
 
 /** props*/
 const props = defineProps({
@@ -54,7 +56,7 @@ const columns = ref<QTableProps["columns"]>([
     align: "left",
     label: "ลำดับ",
     sortable: false,
-    field: (row) => props?.rows!.indexOf(row) + 1,
+    field: (row) => rowsData.value!.indexOf(row) + 1,
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
     sort: (a: string, b: string) =>
@@ -144,8 +146,11 @@ const columns = ref<QTableProps["columns"]>([
     sortable: true,
     field: "status",
     format(val, row) {
-      return statusText(row.status);
+      return props.mainTabs === "1"
+        ? statusText(row.status)
+        : statusText(row.status, "อนุญาต");
     },
+
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
   },
@@ -190,13 +195,36 @@ async function onSearch() {
   );
 }
 
+const isOfficer = ref<boolean>(false);
+const isStaff = ref<boolean>(false);
+
+/** ฟังก์ดึงข้อมูลผู้บังคับบัญชา*/
+async function fetchCheckOfficer() {
+  try {
+    const data = await fetchDataCheckIsoffice("SYS_RESIGN");
+    isOfficer.value = data.isOfficer;
+    isStaff.value = data.isStaff;
+  } catch (err) {
+    messageError($q, err);
+  }
+}
+
 watch(
   () => props.modal,
-  (val) => {
+  async (val) => {
     if (val) {
       selected.value = [];
-      rowsData.value = props.rows ? props.rows : [];
-      rowsDataMain.value = props.rows ? props.rows : [];
+      await fetchCheckOfficer();
+      const data = props?.rows?.filter((e: any) => {
+        if (isStaff.value) {
+          return e.group === "1.1";
+        } else {
+          return e.group !== "1.1";
+        }
+      });
+
+      rowsData.value = data ? data : [];
+      rowsDataMain.value = data ? data : [];
     } else {
       rowsData.value = [];
       rowsDataMain.value = [];
@@ -218,7 +246,7 @@ watch(
               outlined
               dense
               v-model="filterKeyword"
-              @keydown.enter="onSearch"
+              @keydown.enter.prevent="onSearch"
               placeholder="ค้นหา"
             >
               <template v-slot:append>
diff --git a/src/modules/06_retirement/components/02_resign/ResignByid.vue b/src/modules/06_retirement/components/02_resign/ResignByid.vue
index 72c4606ae..3893d532b 100644
--- a/src/modules/06_retirement/components/02_resign/ResignByid.vue
+++ b/src/modules/06_retirement/components/02_resign/ResignByid.vue
@@ -8,7 +8,7 @@ import http from "@/plugins/http";
 import config from "@/app.config";
 import genReport from "@/plugins/genreport";
 import { useCounterMixin } from "@/stores/mixin";
-import { checkPermission } from "@/utils/permissions";
+import { useRoleWorkflowDataStore } from "@/stores/roleWorkflow";
 import { useRetirementDataStore } from "@/modules/06_retirement/store/Main";
 
 import DialogHeader from "@/components/DialogHeader.vue";
@@ -25,7 +25,6 @@ import type { DataProfile } from "@/modules/05_placement/interface/index/Main";
 
 import PopupPersonal from "@/components/Dialogs/PopupPersonal.vue";
 import CardProfile from "@/components/CardProfile.vue";
-import WorkFlow from "@/components/Workflow/Main.vue";
 import DialogAddCommander from "@/modules/06_retirement/components/DialogAddCommander.vue";
 
 /** Use */
@@ -34,6 +33,7 @@ const route = useRoute();
 const router = useRouter();
 
 const store = useRetirementDataStore();
+const { fetchDataCheckIsoffice } = useRoleWorkflowDataStore();
 const { convertStatusText } = store;
 const checkRoutePermisson = ref<boolean>(route.name == "resignDetailbyid");
 const mixin = useCounterMixin();
@@ -43,7 +43,6 @@ const {
   showLoader,
   hideLoader,
   success,
-
   dialogConfirm,
   dialogRemove,
 } = mixin;
@@ -54,16 +53,8 @@ const personId = ref<string>("");
 const roleUser = ref<string>("");
 const dataProfile = ref<DataProfile>();
 const approveStep = ref<string>("");
+const group = ref<string>("");
 
-// const approveCheck = computed(() => {
-//   return (
-//     rowsApprover.value?.commanders?.every(
-//       (commander) =>
-//         commander.approveStatus === "APPROVE" ||
-//         commander.approveStatus === "REJECT"
-//     ) ?? false
-//   );
-// });
 const idCheck = computed(() => {
   if (
     typeAdd.value == "COMMANDER" &&
@@ -84,31 +75,6 @@ const idCheck = computed(() => {
   }
 });
 
-// const approvePendingCheck = computed(() => {
-//   const commanders = rowsApprover.value?.commanders || [];
-//   const index = commanders.findIndex((c) => c.profileId === myProfileId.value);
-
-//   if (index === -1) {
-//     return false;
-//   }
-
-//   const currentCommander = commanders[index];
-
-//   if (currentCommander.approveStatus !== "PENDING") {
-//     return false;
-//   }
-
-//   if (index === 0) {
-//     return true;
-//   }
-
-//   const previousApproved = commanders
-//     .slice(0, index)
-//     .every(
-//       (c) => c.approveStatus === "APPROVE" || c.approveStatus === "REJECT"
-//     );
-//   return previousApproved;
-// });
 const isOfficer = ref<boolean>(false);
 const isStaff = ref<boolean>(false);
 const profileType = ref<string>("");
@@ -211,7 +177,6 @@ const dataDetail = ref<any>({
   reasonResign: "",
 });
 
-const workflowRef = ref<any>(null);
 const organizationPositionOld = ref<string>("");
 const positionTypeOld = ref<string>("");
 const positionLevelOld = ref<string>("");
@@ -228,20 +193,6 @@ const actionPass = ref<boolean>(false);
 const reasonReign = ref<string>("");
 const dateBreak = ref<Date | null>(null);
 
-const isCheckData = computed(() => {
-  if (
-    organizationPositionOld.value !== "" &&
-    positionTypeOld.value !== "" &&
-    positionLevelOld.value !== "" &&
-    posNo.value !== "" &&
-    date.value !== null &&
-    dataDetail.value.commanderReject !== null &&
-    dataDetail.value.oligarchReject !== null
-  ) {
-    return true;
-  } else return false;
-});
-
 /** คอลัมน์ */
 const rows = ref<TypeFile[]>([]);
 const columns = ref<QTableProps["columns"]>([
@@ -309,9 +260,11 @@ function diffDate() {
   return false;
 }
 
-/** นำข้อมูลมาจาก API*/
+/**
+ * ฟังก์ชันดึงข้อมูลรายละเอียดการลาออก
+ * @param id id ของผู้ใช้งาน
+ */
 async function fetchData(id: string) {
-  showLoader();
   await http
     .get(config.API.resingByid(id))
     .then(async (res) => {
@@ -346,6 +299,7 @@ async function fetchData(id: string) {
       isDiscipline.value = data.isDiscipline;
       statusCheck.value = data.status;
       approveStep.value = data.approveStep;
+      group.value = data.group;
       profileType.value = data.profileType;
       keycloakUserId.value = data.keycloakUserId;
       rowsApprover.value = {
@@ -355,13 +309,14 @@ async function fetchData(id: string) {
     })
     .catch((e) => {
       messageError($q, e);
-    })
-    .finally(() => {
-      hideLoader();
     });
 }
 
-/**Pop up */
+/**
+ * ฟังก์ชันเปิด pop up อนุญาตหรือยับยั้ง
+ * @param action action อนุญาตหรือยับยั้ง
+ * @param type ประเภทผู้ใช้งาน
+ */
 function popUp(action: "pass" | "passNot", type: string) {
   reasonReign.value = "";
   dateBreak.value = null;
@@ -370,7 +325,10 @@ function popUp(action: "pass" | "passNot", type: string) {
   openModal();
 }
 
-//เงื่อนไขpop up
+/**
+ * ฟังก์ชันยืนยันการอนุญาตหรือยับยั้ง
+ * @param type ประเภทผู้บัริหาร
+ */
 function onSubmit(type: string) {
   if (roleUser.value === "commander" && actionPass.value) {
     confirmpopUp("/comander");
@@ -381,22 +339,12 @@ function onSubmit(type: string) {
   } else if (roleUser.value === "oligarch" && !actionPass.value) {
     rejectpopUp("");
   }
-  // if (actionPass.value) {
-  //   if (type === "approver") {
-  //     confirmpopUp("/comander");
-  //   } else {
-  //     confirmpopUp("");
-  //   }
-  // } else {
-  //   if (type === "approver") {
-  //     rejectpopUp("/comander");
-  //   } else {
-  //     rejectpopUp("");
-  //   }
-  // }
 }
 
-//pop up ยืนยันการอนุญาต
+/**
+ * ฟังก์ชันยืนยันการอนุญาต
+ * @param path path สำหรับการอนุญาต
+ */
 async function confirmpopUp(path: string) {
   dialogConfirm(
     $q,
@@ -427,7 +375,10 @@ async function confirmpopUp(path: string) {
   );
 }
 
-//pop up การยับยั้งสำเร็จ
+/**
+ * ฟังก์ชันยืนยันการยับยั้ง
+ * @param path  path สำหรับการยับยั้ง
+ */
 async function rejectpopUp(path: string) {
   dialogConfirm(
     $q,
@@ -459,9 +410,7 @@ async function rejectpopUp(path: string) {
   );
 }
 
-/**
- * กดยกเลิก
- */
+/** ฟังก์ชันยกเลิกการแก้ไขข้อมูลเพื่อลงบัญชีแนบท้าย*/
 async function clickCancel() {
   edit.value = false;
   const data = dataDetail.value;
@@ -483,19 +432,23 @@ async function clickCancel() {
   }
   myForm.value?.resetValidation();
 }
-/**
- * กดยกเลิก
- */
+
+/** ฟังก์ชันยกเลิกการแก้ไขข้อมูลรายการตรวจสอบเงื่อนไขต่างๆ*/
 async function clickCancelConditions() {
-  await fetchData(id.value);
-  conditions.value = false;
+  const data = dataDetail.value;
+  if (data) {
+    isNoDebt.value = data.isNoDebt;
+    isNoBurden.value = data.isNoBurden;
+    isDiscipline.value = data.isDiscipline;
+    conditions.value = false;
+  }
 }
 
-/** Function บันทึก รายการตรวจสอบเงื่อนไขต่างๆ*/
+/** ฟังก์ชันบันทึกเงื่อนไขต่างๆ*/
 function onSubmitConditions() {
-  dialogConfirm($q, () => {
+  dialogConfirm($q, async () => {
     showLoader();
-    http
+    await http
       .put(config.API.resignConditions(id.value), {
         isNoDebt: isNoDebt.value,
         isNoBurden: isNoBurden.value,
@@ -515,9 +468,9 @@ function onSubmitConditions() {
   });
 }
 
-/** Function บันทึก ,แก้ไขข้อมูลเพื่อลงบัญชีแนบท้าย*/
+/** ฟังก์ชันบันทึกข้อมูลเพื่อลงบัญชีแนบท้าย*/
 function onSubmitAttached() {
-  dialogConfirm($q, () => {
+  dialogConfirm($q, async () => {
     const formData = new FormData();
     const send = date.value !== null ? new Date(date.value).toUTCString() : "";
     const activeDate =
@@ -533,7 +486,7 @@ function onSubmitAttached() {
     formData.append("AmountOld", salary.value.toString());
     formData.append("remarkHorizontal", remarkHorizontal.value);
     showLoader();
-    http
+    await http
       .put(config.API.resingByid(id.value), formData)
       .then(async () => {
         await fetchData(id.value);
@@ -550,7 +503,7 @@ function onSubmitAttached() {
 }
 
 /**
- * Function เพิ่ม Class เวลา Edit
+ * ฟังก์ชันเปลี่ยน Class
  * @param val เมื่อเป็นEdit จะเปลี่ยน Class
  */
 function getClass(val: boolean) {
@@ -560,16 +513,6 @@ function getClass(val: boolean) {
   };
 }
 
-/** แปลง StatusOrder */
-function statusOrder(val: boolean) {
-  switch (val) {
-    case true:
-      return "ยับยั้ง";
-    case false:
-      return "อนุญาต";
-  }
-}
-
 // ดาว์นโหลดไฟล์
 async function fileDownload(type: string, fileName: string) {
   showLoader();
@@ -592,7 +535,6 @@ function updatemodalPersonal(modal: boolean) {
 }
 
 async function fetchFile() {
-  showLoader();
   await http
     .get(config.API.file("พ้นจากราชการ", "หลักฐานลาออก", id.value))
     .then(async (res) => {
@@ -600,13 +542,12 @@ async function fetchFile() {
     })
     .catch((e) => {
       messageError($q, e);
-      hideLoader();
     });
 }
 
-function uploadFiles() {
+async function uploadFiles() {
   showLoader();
-  http
+  await http
     .post(config.API.file("พ้นจากราชการ", "หลักฐานลาออก", id.value), {
       replace: true,
       fileList: [
@@ -673,13 +614,13 @@ async function downloadFiles(fileName: string) {
 }
 
 /**
- * ลบไฟล์
+ * ฟังก์ชันลบไฟล์
  * @param id id file
  */
 function removeFile(fileName: string) {
-  dialogRemove($q, () => {
+  dialogRemove($q, async () => {
     showLoader();
-    http
+    await http
       .delete(
         config.API.fileByFile(
           "พ้นจากราชการ",
@@ -688,15 +629,16 @@ function removeFile(fileName: string) {
           fileName
         )
       )
-      .then(() => {
+      .then(async () => {
         setTimeout(async () => {
           await fetchFile();
           success($q, `ลบไฟล์สำเร็จ`);
-          hideLoader();
         }, 1000);
       })
       .catch((e) => {
         messageError($q, e);
+      })
+      .finally(() => {
         hideLoader();
       });
   });
@@ -719,47 +661,51 @@ function convertStatus(val: string) {
   } else return val;
 }
 
-/** เปิด POP UP  */
+/**
+ * ฟังก์ชันเปิด modal เพิ่มผู้บังคับบัญชา
+ * @param type  บังคับบัญชา,ผู้มีอำนาจ
+ */
 function onAddPerson(type: string) {
   modalAdd.value = true;
   typeAdd.value = type;
 }
 
+/** ฟังก์ดึงข้อมูลผู้บังคับบัญชา*/
 async function checkOfficer() {
-  http
-    .get(config.API.checkIsofficer + `SYS_RESIGN`)
-    .then(async (res) => {
-      isOfficer.value = await res.data.result.isOfficer;
-      isStaff.value = await res.data.result.isStaff;
-    })
-    .catch((e) => {
-      messageError($q, e);
-    })
-    .finally(() => {});
+  try {
+    const data = await fetchDataCheckIsoffice("SYS_RESIGN");
+    isOfficer.value = data.isOfficer;
+    isStaff.value = data.isStaff;
+  } catch (err) {
+    messageError($q, err);
+  }
 }
 
+/** ฟังก์ชันส่งไปพิจารณา*/
 function onSend() {
   dialogConfirm(
     $q,
-    () => {
+    async () => {
       showLoader();
-      http
+      await http
         .get(config.API.sendApproveRetirement("", id.value))
-        .then(async (res) => {
-          await fetchFile();
-          await fetchData(id.value);
+        .then(async () => {
+          await Promise.all([fetchFile(), fetchData(id.value)]);
           success($q, "ส่งไปพิจารณา");
         })
         .catch((e) => {
           messageError($q, e);
         })
-        .finally(() => {});
+        .finally(() => {
+          hideLoader();
+        });
     },
     "ยืนยันการส่งไปพิจารณา",
     "ต้องการส่งไปพิจารณาใช่หรือไม่"
   );
 }
 
+/** ฟังก์ชันดึงข้อมูลตำแหน่งจาก Keycloak*/
 async function fetchKeycloakPosition() {
   if (myProfileId.value == "") {
     await http
@@ -774,13 +720,13 @@ async function fetchKeycloakPosition() {
   }
 }
 
-/** Hook */
+/** hook ฟังก์ชันเมื่อโหลดคอมโพเนนต์*/
 onMounted(async () => {
   showLoader();
   await Promise.all([
-    await fetchData(id.value),
-    await fetchKeycloakPosition(),
-    await checkOfficer(),
+    fetchData(id.value),
+    fetchKeycloakPosition(),
+    checkOfficer(),
     fetchFile(),
   ]).finally(() => {
     hideLoader();
@@ -813,39 +759,6 @@ onMounted(async () => {
     <q-card bordered class="row col-12 text-dark q-mt-sm">
       <div class="bg-grey-1 q-pa-sm col-12 row items-center text-primary">
         <div class="q-pl-sm text-weight-bold text-dark">ข้อมูลการลาออก</div>
-        <!-- <q-space />
-        <div
-          class="q-gutter-x-sm"
-          v-if="
-            (roleUser === 'officer' && dataDetail.officerReject === null) ||
-            (roleUser === 'commander' &&
-              dataDetail.commanderReject === null &&
-              dataDetail.officerReject !== null) ||
-            (roleUser === 'oligarch' &&
-              dataDetail.oligarchReject === null &&
-              dataDetail.commanderReject !== null &&
-              dataDetail.officerReject !== null)
-          "
-        >
-          <q-btn
-            outline
-            color="primary"
-            dense
-            icon-right="check"
-            class="q-px-sm"
-            label="อนุญาต"
-            @click="popUp('pass')"
-          />
-          <q-btn
-            outline
-            color="red"
-            dense
-            icon-right="close"
-            class="q-px-sm"
-            label="ยับยั้ง"
-            @click="popUp('passNot')"
-          />
-        </div> -->
       </div>
       <div class="col-12"><q-separator /></div>
       <div class="row col-12 q-pa-md">
@@ -1025,11 +938,11 @@ onMounted(async () => {
                 เงื่อนไขต่างๆ
               </div>
               <q-space />
-              <!-- workflowRef?.permission.isUpdate && -->
-
               <div
                 v-if="
-                  !checkRoutePermisson && dataDetail.statusMain === 'WAITTING'
+                  !checkRoutePermisson &&
+                  ((isStaff && group === '1.1' && approveStep === 'st1') ||
+                    (isOfficer && group !== '1.1' && approveStep === 'st3'))
                 "
               >
                 <div v-if="!conditions">
@@ -1107,7 +1020,9 @@ onMounted(async () => {
 
                 <q-file
                   v-if="
-                    !checkRoutePermisson && dataDetail.statusMain === 'WAITTING'
+                    !checkRoutePermisson &&
+                    ((isStaff && group === '1.1' && approveStep === 'st1') ||
+                      (isOfficer && group !== '1.1' && approveStep === 'st3'))
                   "
                   class="col-12"
                   for="#evidenceFiles"
@@ -1164,7 +1079,12 @@ onMounted(async () => {
                           <q-btn
                             v-if="
                               !checkRoutePermisson &&
-                              dataDetail.statusMain === 'WAITTING'
+                              ((isStaff &&
+                                group === '1.1' &&
+                                approveStep === 'st1') ||
+                                (isOfficer &&
+                                  group !== '1.1' &&
+                                  approveStep === 'st3'))
                             "
                             dense
                             flat
@@ -1191,51 +1111,6 @@ onMounted(async () => {
       </div>
     </q-card>
 
-    <!-- ผลการพิจารณาของการเจ้าหน้าที่ของหน่วยงาน -->
-    <!-- <q-card bordered class="row col-12 text-dark q-mt-sm">
-      <div class="bg-grey-1 q-pa-sm col-12 row items-center text-primary">
-        <div class="q-pl-sm text-weight-bold text-dark">
-          ผลการพิจารณาของการเจ้าหน้าที่ของหน่วยงาน
-        </div>
-      </div>
-      <div class="col-12"><q-separator /></div>
-      <div class="row col-12 q-pa-md">
-        <div class="col-12 row bg-white q-col-gutter-md">
-          <div class="col-xs-6 row items-start">
-            <div class="col-12 text-top">สถานะ</div>
-            <div class="col-12 text-detail">
-              {{
-                dataDetail.officerReject !== null
-                  ? statusOrder(dataDetail.officerReject)
-                  : "-"
-              }}
-            </div>
-          </div>
-          <div class="col-xs-6 row items-start">
-            <div class="col-12 text-top">วันสุดท้ายที่ยับยั้ง</div>
-            <div class="col-12 text-detail">
-              {{
-                dataDetail.officerRejectDate !== null
-                  ? date2Thai(dataDetail.officerRejectDate)
-                  : "-"
-              }}
-            </div>
-          </div>
-          <div class="col-xs-12 row items-start">
-            <div class="col-12 text-top">ความคิดเห็นและเหตุผล</div>
-
-            <div class="col-12 text-detail">
-              {{
-                dataDetail.officerReject
-                  ? dataDetail.officerRejectReason
-                  : dataDetail.officerApproveReason
-              }}
-            </div>
-          </div>
-        </div>
-      </div>
-    </q-card> -->
-
     <!-- ผลการพิจารณาของผู้บังคับบัญชา -->
     <q-card bordered class="row col-12 text-dark q-mt-sm">
       <div class="bg-grey-1 q-pa-sm col-12 row items-center text-primary">
@@ -1243,8 +1118,13 @@ onMounted(async () => {
           ผลการพิจารณาของผู้บังคับบัญชา
         </div>
         <!-- ตัวอย่างเช็คของ การลา -->
+
         <q-btn
-          v-if="statusCheck == 'WAITTING' && (isOfficer || isStaff)"
+          v-if="
+            !checkRoutePermisson &&
+            ((isStaff && group === '1.1' && approveStep === 'st1') ||
+              (isStaff && group !== '1.1' && approveStep === 'st1'))
+          "
           flat
           round
           icon="add"
@@ -1256,34 +1136,6 @@ onMounted(async () => {
           <q-tooltip>เพิ่มรายชื่อผู้บังคับบัญชา</q-tooltip>
         </q-btn>
         <q-space />
-        <!-- workflowRef?.permission.isUpdate && -->
-
-        <!-- <div
-          class="q-gutter-x-sm"
-          v-if="
-            dataDetail.commanderReject === null &&
-            dataDetail.statusMain === 'WAITTING'
-          "
-        >
-          <q-btn
-            outline
-            color="primary"
-            dense
-            icon-right="check"
-            class="q-px-sm"
-            label="อนุญาต"
-            @click="popUp('pass', 'commander')"
-          />
-          <q-btn
-            outline
-            color="red"
-            dense
-            icon-right="close"
-            class="q-px-sm"
-            label="ยับยั้ง"
-            @click="popUp('passNot', 'commander')"
-          />
-        </div> -->
       </div>
 
       <div class="col-12"><q-separator /></div>
@@ -1316,12 +1168,16 @@ onMounted(async () => {
                   <div
                     v-if="
                       props.row.approveStatus == 'PENDING' &&
-                      props.row.comment == ''
+                      props.row.comment == '' &&
+                      approveStep === 'st2'
                     "
                     class="q-gutter-x-xs"
                   >
                     <q-btn
-                      v-if="props.row.profileId === myProfileId"
+                      v-if="
+                        props.row.profileId === myProfileId &&
+                        approveStep === 'st2'
+                      "
                       outline
                       dense
                       color="primary"
@@ -1331,7 +1187,10 @@ onMounted(async () => {
                       @click="popUp('pass', 'commander')"
                     />
                     <q-btn
-                      v-if="props.row.profileId === myProfileId"
+                      v-if="
+                        props.row.profileId === myProfileId &&
+                        approveStep === 'st2'
+                      "
                       outline
                       color="red"
                       dense
@@ -1376,8 +1235,13 @@ onMounted(async () => {
         <div class="q-pl-sm text-weight-bold text-dark">
           ผลการพิจารณาของผู้มีอำนาจ
         </div>
+
         <q-btn
-          v-if="statusCheck == 'WAITTING' && (isOfficer || isStaff)"
+          v-if="
+            !checkRoutePermisson &&
+            ((isStaff && group === '1.1' && approveStep === 'st1') ||
+              (isOfficer && group !== '1.1' && approveStep === 'st3'))
+          "
           flat
           round
           icon="add"
@@ -1394,11 +1258,12 @@ onMounted(async () => {
         <div
           class="q-gutter-x-sm"
           v-if="
-            approveStep == 'st3' &&
             rowsApprover &&
             rowsApprover.approvers &&
             rowsApprover.approvers[0]?.profileId == myProfileId &&
-            rowsApprover.approvers[0]?.approveStatus == 'PENDING'
+            rowsApprover.approvers[0]?.approveStatus == 'PENDING' &&
+            ((group === '1.1' && approveStep === 'st3') ||
+              (group !== '1.1' && approveStep === 'st4'))
           "
         >
           <q-btn
@@ -1479,20 +1344,33 @@ onMounted(async () => {
     <q-card
       bordered
       class="row col-12 text-dark q-mt-sm q-pa-sm"
-      v-if="statusCheck == 'WAITTING' && (isOfficer || isStaff)"
+      v-if="
+        !checkRoutePermisson &&
+        ((isStaff && group === '1.1' && approveStep === 'st1') ||
+          (isStaff && group !== '1.1' && approveStep === 'st1') ||
+          (isOfficer && group !== '1.1' && approveStep === 'st3'))
+      "
     >
       <q-btn
-        @click="onSend"
         :disable="
-          rowsApprover?.approvers.length == 0 ||
-          rowsApprover?.commanders.length == 0
+          (group === '1.1' &&
+            (rowsApprover?.approvers.length == 0 ||
+              rowsApprover?.commanders.length == 0)) ||
+          (group !== '1.1 ' &&
+            rowsApprover?.commanders.length == 0 &&
+            approveStep === 'st1') ||
+          (group !== '1.1 ' &&
+            rowsApprover?.approvers.length == 0 &&
+            approveStep === 'st3')
         "
+        @click="onSend"
         label="ส่งไปพิจารณา"
         color="secondary"
         class="q-ml-auto"
         ><q-tooltip>คลิกเพื่อส่งไปพิจารณา</q-tooltip></q-btn
       >
     </q-card>
+
     <!-- แก้ไขข้อมูลเพื่อลงบัญชีแนบท้าย -->
     <q-card bordered class="row col-12 text-dark q-mt-sm">
       <q-form
@@ -1510,7 +1388,12 @@ onMounted(async () => {
           <!-- workflowRef?.permission.isUpdate && -->
 
           <div
-            v-if="!checkRoutePermisson && dataDetail.statusMain === 'WAITTING'"
+            v-if="
+              !checkRoutePermisson &&
+              (dataDetail.statusMain === 'APPROVE' ||
+                dataDetail.statusMain === 'REJECT') &&
+              ((isStaff && group === '1.1') || (isOfficer && group !== '1.1'))
+            "
           >
             <div class="q-gutter-sm" v-if="!edit">
               <q-btn
@@ -1758,7 +1641,7 @@ onMounted(async () => {
               dense
               outlined
               lazy-rules
-              :rules="[(val:string) => !!val || 'กรุณากรอกความคิดเห็น/เหตุผล']"
+              :rules="  !actionPass ? [(val:string) => !!val || 'กรุณากรอกความคิดเห็น/เหตุผล'] :[]"
               v-model="reasonReign"
               :label="`${'กรอกความคิดเห็น/เหตุผล'}`"
               type="textarea"
@@ -1809,12 +1692,11 @@ onMounted(async () => {
           </div>
         </q-card-section>
         <q-separator />
-        <q-card-actions align="right" class="bg-white text-teal">
+        <q-card-actions align="right">
           <q-btn label="บันทึก" color="secondary" type="submit"
             ><q-tooltip>บันทึกข้อมูล</q-tooltip></q-btn
           >
         </q-card-actions>
-        <!-- <DialogFooter :editvisible="true" :save="conditionPopup" /> -->
       </q-form>
     </q-card>
   </q-dialog>
diff --git a/src/modules/06_retirement/components/02_resign/ResignReject.vue b/src/modules/06_retirement/components/02_resign/ResignReject.vue
index 943a6222d..aca65fb34 100644
--- a/src/modules/06_retirement/components/02_resign/ResignReject.vue
+++ b/src/modules/06_retirement/components/02_resign/ResignReject.vue
@@ -7,8 +7,8 @@ import { useQuasar, QForm, type QTableProps } from "quasar";
 import http from "@/plugins/http";
 import config from "@/app.config";
 import { useCounterMixin } from "@/stores/mixin";
-import { checkPermission } from "@/utils/permissions";
 import { useRetirementDataStore } from "@/modules/06_retirement/store/Main";
+import { useRoleWorkflowDataStore } from "@/stores/roleWorkflow";
 
 import type { DataProfile } from "@/modules/05_placement/interface/index/Main";
 import type {
@@ -18,7 +18,6 @@ import type {
 
 import DialogHeader from "@/components/DialogHeader.vue";
 import CardProfile from "@/components/CardProfile.vue";
-import WorkFlow from "@/components/Workflow/Main.vue";
 import DialogAddCommander from "@/modules/06_retirement/components/DialogAddCommander.vue";
 
 /** Use */
@@ -26,9 +25,8 @@ const $q = useQuasar();
 const route = useRoute();
 const router = useRouter();
 const store = useRetirementDataStore();
+const { fetchDataCheckIsoffice } = useRoleWorkflowDataStore();
 const { convertStatusText } = store;
-const checkRoutePermisson = ref<boolean>(route.name == "resignDetailReject");
-const mixin = useCounterMixin();
 const {
   messageError,
   date2Thai,
@@ -36,19 +34,16 @@ const {
   hideLoader,
   success,
   dialogConfirm,
-} = mixin;
+} = useCounterMixin();
+
+const checkRoutePermisson = ref<boolean>(route.name == "resignDetailReject");
 
 /** ตัวแปร */
 const roleUser = ref<string>("");
 const dataProfile = ref<DataProfile>();
+const group = ref<string>("");
+const approveStep = ref<string>("");
 
-const approveCheck = computed(() => {
-  return (
-    rowsApprover.value?.commanders?.every(
-      (commander) => commander.approveStatus === "APPROVE"
-    ) ?? false
-  );
-});
 const idCheck = computed(() => {
   if (
     typeAdd.value == "COMMANDER" &&
@@ -69,29 +64,6 @@ const idCheck = computed(() => {
   }
 });
 
-const approvePendingCheck = computed(() => {
-  const commanders = rowsApprover.value?.commanders || [];
-  const index = commanders.findIndex((c) => c.profileId === keycloakId.value);
-
-  if (index === -1) {
-    return false;
-  }
-
-  const currentCommander = commanders[index];
-
-  if (currentCommander.approveStatus !== "PENDING") {
-    return false;
-  }
-
-  if (index === 0) {
-    return true;
-  }
-
-  const previousApproved = commanders
-    .slice(0, index)
-    .every((c) => c.approveStatus === "APPROVE");
-  return previousApproved;
-});
 const isOfficer = ref<boolean>(false);
 const isStaff = ref<boolean>(false);
 const profileType = ref<string>("");
@@ -151,15 +123,6 @@ const columnsCommanders = ref<QTableProps["columns"]>([
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
   },
-  {
-    name: "rejectDate",
-    align: "left",
-    label: "วันสุดท้ายที่ยับยั้ง",
-    field: "rejectDate",
-    sortable: true,
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
 ]);
 
 const id = ref<string>(route.params.id.toString());
@@ -187,9 +150,11 @@ const dataDetail = ref<any>({
   statustext: "",
   fullname: "",
   statusMain: "",
+  cancelReason: "",
+  remark: "",
+  reasonResign: "",
 });
 
-const workflowRef = ref<any>(null);
 const organizationPositionOld = ref<string>("");
 const positionTypeOld = ref<string>("");
 const positionLevelOld = ref<string>("");
@@ -206,32 +171,21 @@ const actionPass = ref<boolean>(false);
 const reasonReign = ref<string>("");
 const dateBreak = ref<Date | null>(null);
 
-const isCheckData = computed(() => {
-  if (
-    organizationPositionOld.value !== "" &&
-    positionTypeOld.value !== "" &&
-    positionLevelOld.value !== "" &&
-    posNo.value !== "" &&
-    date.value !== null &&
-    dataDetail.value.commanderReject !== null &&
-    dataDetail.value.oligarchReject !== null
-  ) {
-    return true;
-  } else return false;
-});
-
-/**เปิด-ปิด modal */
-function closeModal() {
-  modal.value = false;
-}
-function openModal() {
-  modal.value = true;
-}
-
 const isNoDebt = ref<boolean>(false);
 const isNoBurden = ref<boolean>(false);
 const isDiscipline = ref<boolean>(false);
 
+/** ฟังก์ชันปิด popup อนุญาตหรือยับยั้ง*/
+function closeModal() {
+  modal.value = false;
+}
+
+/** ฟังก์ชันเปิด popup อนุญาตหรือยับยั้ง*/
+function openModal() {
+  modal.value = true;
+}
+
+/** ฟังก์ชันตรวจสอบวันที่ขอลาออกจากราชการน้อยกว่า 30 วัน*/
 function diffDate() {
   if (date.value !== null && dateLeave.value !== null) {
     const time = dateLeave.value.getTime() - date.value.getTime();
@@ -245,9 +199,11 @@ function diffDate() {
   return false;
 }
 
-/** นำข้อมูลมาจาก API*/
+/**
+ * ฟังก์ชันดึงข้อมูลรายละเอียดการยกเลิกการลาออก
+ * @param id id ของผู้ใช้งาน
+ */
 async function fetchData(id: string) {
-  showLoader();
   await http
     .get(config.API.listResign() + `/cancel/${id}`)
     .then(async (res) => {
@@ -269,6 +225,8 @@ async function fetchData(id: string) {
       isNoDebt.value = data.isNoDebt;
       isNoBurden.value = data.isNoBurden;
       isDiscipline.value = data.isDiscipline;
+      approveStep.value = data.approveStep;
+      group.value = data.group;
 
       statusCheck.value = data.status;
       profileType.value = data.profileType;
@@ -280,13 +238,14 @@ async function fetchData(id: string) {
     })
     .catch((e) => {
       messageError($q, e);
-    })
-    .finally(() => {
-      hideLoader();
     });
 }
 
-/**Pop up */
+/**
+ * ฟังก์ชันเปิด pop up อนุญาตหรือยับยั้ง
+ * @param action action อนุญาตหรือยับยั้ง
+ * @param type ประเภทผู้ใช้งาน
+ */
 function popUp(action: "pass" | "passNot", type: string) {
   reasonReign.value = "";
   dateBreak.value = null;
@@ -295,16 +254,24 @@ function popUp(action: "pass" | "passNot", type: string) {
   openModal();
 }
 
-//เงื่อนไขpop up
+/** ฟังก์ชันยืนยันการอนุญาตหรือไม่อนุญาตการยกเลิกการลาออก*/
 function onSubmit() {
   dialogConfirm($q, async () => {
     showLoader();
     const body = {
       reason: reasonReign.value,
-      reject: !actionPass.value,
+      // reject: !actionPass.value,
+      Date: new Date(),
     };
+
+    const action = actionPass.value ? "approve" : "reject";
+
+    const endpoint =
+      roleUser.value === "commander"
+        ? config.API.comanderCancelResign("", action, id.value)
+        : config.API.approverCancelResign("", action, id.value);
     await http
-      .put(config.API.resignReject(`${roleUser.value}-cancel`, id.value), body)
+      .put(endpoint, body)
       .then(async () => {
         await fetchData(id.value);
         closeModal();
@@ -319,9 +286,7 @@ function onSubmit() {
   });
 }
 
-/**
- * กดยกเลิก
- */
+/** ฟังก์ชันยกเลิกการแก้ไขข้อมูลแนบท้าย*/
 async function clickCancel() {
   edit.value = false;
   const data = dataDetail.value;
@@ -344,7 +309,7 @@ async function clickCancel() {
   myForm.value?.resetValidation();
 }
 
-/** Function บันทึก ,แก้ไขข้อมูลเพื่อลงบัญชีแนบท้าย*/
+/** ฟังก์ชันบันทึกข้อมูลเพื่อลงบัญชีแนบท้าย*/
 function onSubmitAttached() {
   dialogConfirm($q, () => {
     const formData = new FormData();
@@ -379,7 +344,7 @@ function onSubmitAttached() {
 }
 
 /**
- * Function เพิ่ม Class เวลา Edit
+ * ฟังก์ชันเปลี่ยน Class
  * @param val เมื่อเป็นEdit จะเปลี่ยน Class
  */
 function getClass(val: boolean) {
@@ -389,56 +354,51 @@ function getClass(val: boolean) {
   };
 }
 
-/** แปลง StatusOrder */
-function statusOrder(val: boolean) {
-  switch (val) {
-    case true:
-      return "ยับยั้ง";
-    case false:
-      return "อนุญาต";
-  }
-}
-
-/** เปิด POP UP  */
+/**
+ * ฟังก์ชันเปิด popup เพิ่มผู้บังคับบัญชา, ผู้มีอำนาจ
+ * @param type ผู้บังคับบัญชา, ผู้มีอำนาจ
+ */
 function onAddPerson(type: string) {
   modalAdd.value = true;
   typeAdd.value = type;
 }
 
+/** ฟังก์ดึงข้อมูลสิทธ์ สกจ,กจ*/
 async function checkOfficer() {
-  http
-    .get(config.API.checkIsofficer + `SYS_RESIGN`)
-    .then(async (res) => {
-      isOfficer.value = await res.data.result.isOfficer;
-      isStaff.value = await res.data.result.isStaff;
-    })
-    .catch((e) => {
-      messageError($q, e);
-    })
-    .finally(() => {});
+  try {
+    const data = await fetchDataCheckIsoffice("SYS_RESIGN");
+    isOfficer.value = data.isOfficer;
+    isStaff.value = data.isStaff;
+  } catch (err) {
+    messageError($q, err);
+  }
 }
 
+/** ฟังก์ชันส่งไปพิจารณา*/
 function onSend() {
   dialogConfirm(
     $q,
-    () => {
+    async () => {
       showLoader();
-      http
-        .get(config.API.sendApproveRetirement("", id.value))
-        .then(async (res) => {
+      await http
+        .get(config.API.officerCancelResign("", id.value))
+        .then(async () => {
           await fetchData(id.value);
           success($q, "ส่งไปพิจารณา");
         })
         .catch((e) => {
           messageError($q, e);
         })
-        .finally(() => {});
+        .finally(() => {
+          hideLoader();
+        });
     },
     "ยืนยันการส่งไปพิจารณา",
     "ต้องการส่งไปพิจารณาใช่หรือไม่"
   );
 }
 
+/** ฟังก์ชันดึงข้อมูลตำแหน่งจาก Keycloak*/
 async function fetchKeycloakPosition() {
   if (keycloakId.value == "") {
     await http
@@ -453,11 +413,16 @@ async function fetchKeycloakPosition() {
   }
 }
 
-/** Hook */
+/** hook ฟังก์ชันเมื่อโหลดคอมโพเนนต์*/
 onMounted(async () => {
-  await fetchData(id.value);
-  await fetchKeycloakPosition()
-  await checkOfficer();
+  showLoader();
+  await Promise.all([
+    fetchData(id.value),
+    fetchKeycloakPosition(),
+    checkOfficer(),
+  ]).finally(() => {
+    hideLoader();
+  });
 });
 </script>
 
@@ -486,39 +451,6 @@ onMounted(async () => {
     <q-card bordered class="row col-12 text-dark q-mt-sm">
       <div class="bg-grey-1 q-pa-sm col-12 row items-center text-primary">
         <div class="q-pl-sm text-weight-bold text-dark">ข้อมูลการลาออก</div>
-        <!-- <q-space />
-        <div
-          class="q-gutter-x-sm"
-          v-if="
-            (roleUser === 'officer' && dataDetail.officerReject === null) ||
-            (roleUser === 'commander' &&
-              dataDetail.commanderReject === null &&
-              dataDetail.officerReject !== null) ||
-            (roleUser === 'oligarch' &&
-              dataDetail.oligarchReject === null &&
-              dataDetail.commanderReject !== null &&
-              dataDetail.officerReject !== null)
-          "
-        >
-          <q-btn
-            outline
-            color="primary"
-            dense
-            icon-right="check"
-            class="q-px-sm"
-            label="อนุญาต"
-            @click="popUp('pass')"
-          />
-          <q-btn
-            outline
-            color="red"
-            dense
-            icon-right="close"
-            class="q-px-sm"
-            label="ยับยั้ง"
-            @click="popUp('passNot')"
-          />
-        </div> -->
       </div>
       <div class="col-12"><q-separator /></div>
       <div class="row col-12 q-pa-md">
@@ -566,6 +498,15 @@ onMounted(async () => {
               </div>
             </div>
           </div>
+
+          <div class="col-12 row items-start">
+            <div class="col-12">
+              <div class="col-12 text-top">เหตุผลการขอยกเลิก</div>
+              <div class="col-12 text-detail text-red">
+                {{ dataDetail.cancelReason }}
+              </div>
+            </div>
+          </div>
         </div>
       </div>
     </q-card>
@@ -577,7 +518,11 @@ onMounted(async () => {
           ผลการพิจารณาของผู้บังคับบัญชา
         </div>
         <q-btn
-          v-if="statusCheck == 'WAITTING' && (isOfficer || isStaff)"
+          v-if="
+            !checkRoutePermisson &&
+            ((isStaff && group === '1.1' && approveStep === 'st1') ||
+              (isStaff && group !== '1.1' && approveStep === 'st1'))
+          "
           flat
           round
           icon="add"
@@ -589,34 +534,6 @@ onMounted(async () => {
           <q-tooltip>เพิ่มรายชื่อผู้บังคับบัญชา</q-tooltip>
         </q-btn>
         <q-space />
-        <!-- workflowRef?.permission.isUpdate && -->
-
-        <!-- <div
-          class="q-gutter-x-sm"
-          v-if="
-            dataDetail.commanderReject === null &&
-            dataDetail.statusMain === 'WAITTING'
-          "
-        >
-          <q-btn
-            outline
-            color="primary"
-            dense
-            icon-right="check"
-            class="q-px-sm"
-            label="อนุญาต"
-            @click="popUp('pass', 'commander')"
-          />
-          <q-btn
-            outline
-            color="red"
-            dense
-            icon-right="close"
-            class="q-px-sm"
-            label="ยับยั้ง"
-            @click="popUp('passNot', 'commander')"
-          />
-        </div> -->
       </div>
 
       <div class="col-12"><q-separator /></div>
@@ -647,25 +564,19 @@ onMounted(async () => {
                 </div>
                 <div v-else-if="col.name == 'comment'">
                   <div
+                    class="q-gutter-x-xs"
                     v-if="
                       props.row.approveStatus == 'PENDING' &&
-                      props.row.comment == ''
+                      props.row.comment == '' &&
+                      approveStep === 'st2'
                     "
                   >
                     <q-btn
-                      :disable="
-                        statusCheck == 'NEW' ||
-                        !approvePendingCheck ||
-                        (props.row.profileId !== keycloakId &&
-                          checkPermission($route)?.attrIsUpdate)
-                      "
-                      :outline="
-                        props.row.profileId !== keycloakId ||
-                        statusCheck == 'NEW' ||
-                        !approvePendingCheck
-                          ? false
-                          : true
+                      v-if="
+                        props.row.profileId === keycloakId &&
+                        approveStep === 'st2'
                       "
+                      outline
                       dense
                       color="primary"
                       icon-right="check"
@@ -674,24 +585,16 @@ onMounted(async () => {
                       @click="popUp('pass', 'commander')"
                     />
                     <q-btn
-                      :disable="
-                        statusCheck == 'NEW' ||
-                        !approvePendingCheck ||
-                        (props.row.profileId !== keycloakId &&
-                          checkPermission($route)?.attrIsUpdate)
-                      "
-                      :outline="
-                        props.row.profileId !== keycloakId ||
-                        statusCheck == 'NEW' ||
-                        !approvePendingCheck
-                          ? false
-                          : true
+                      v-if="
+                        props.row.profileId === keycloakId &&
+                        approveStep === 'st2'
                       "
+                      outline
                       color="red"
                       dense
                       icon-right="close"
                       class="q-px-sm"
-                      label="ยับยั้ง"
+                      label="ไม่อนุญาต"
                       @click="popUp('passNot', 'commander')"
                     />
                   </div>
@@ -702,7 +605,7 @@ onMounted(async () => {
                 <div v-else-if="col.name == 'approveStatus'">
                   {{
                     props.row.approveStatus
-                      ? convertStatusText(props.row.approveStatus)
+                      ? convertStatusText(props.row.approveStatus, "ไม่อนุญาต")
                       : "-"
                   }}
                 </div>
@@ -723,7 +626,11 @@ onMounted(async () => {
           ผลการพิจารณาของผู้มีอำนาจ
         </div>
         <q-btn
-          v-if="statusCheck == 'WAITTING' && (isOfficer || isStaff)"
+          v-if="
+            !checkRoutePermisson &&
+            ((isStaff && group === '1.1' && approveStep === 'st1') ||
+              (isOfficer && group !== '1.1' && approveStep === 'st3'))
+          "
           flat
           round
           icon="add"
@@ -735,20 +642,17 @@ onMounted(async () => {
           <q-tooltip>เพิ่มรายชื่อผู้มีอำนาจ</q-tooltip>
         </q-btn>
         <q-space />
-        <!-- workflowRef?.permission.isUpdate && -->
 
         <div
-          class="q-gutter-x-sm"
           v-if="
-            checkPermission($route)?.attrIsUpdate &&
-            dataDetail.oligarchReject === null &&
-            dataDetail.statusMain === 'WAITTING' &&
             rowsApprover &&
             rowsApprover.approvers &&
             rowsApprover.approvers[0]?.profileId == keycloakId &&
             rowsApprover.approvers[0]?.approveStatus == 'PENDING' &&
-            approveCheck
+            ((group === '1.1' && approveStep === 'st3') ||
+              (group !== '1.1' && approveStep === 'st4'))
           "
+          class="q-gutter-x-sm"
         >
           <q-btn
             outline
@@ -765,7 +669,7 @@ onMounted(async () => {
             dense
             icon-right="close"
             class="q-px-sm"
-            label="ยับยั้ง"
+            label="ไม่อนุญาต"
             @click="popUp('passNot', 'oligarch')"
           />
         </div>
@@ -792,44 +696,55 @@ onMounted(async () => {
                 rowsApprover &&
                 rowsApprover.approvers &&
                 rowsApprover.approvers[0]?.approveStatus
-                  ? convertStatusText(rowsApprover?.approvers[0].approveStatus)
+                  ? convertStatusText(
+                      rowsApprover?.approvers[0].approveStatus,
+                      "ไม่อนุญาต"
+                    )
                   : "-"
               }}
             </div>
           </div>
-          <!-- <div class="col-xs-6 row items-start">
-            <div class="col-12 text-top">วันสุดท้ายที่ยับยั้ง</div>
-            <div class="col-12 text-detail">
-              {{
-                dataDetail.oligarchRejectDate !== null
-                  ? date2Thai(dataDetail.oligarchRejectDate)
-                  : "-"
-              }}
-            </div>
-          </div> -->
+
           <div class="col-xs-12 row items-start">
             <div class="col-12 text-top">ความคิดเห็นและเหตุผล</div>
             <div class="col-12 text-detail">
               {{
-                dataDetail.oligarchReject
-                  ? dataDetail.oligarchApproveReason
-                  : dataDetail.oligarchApproveReason
+                rowsApprover &&
+                rowsApprover.approvers &&
+                rowsApprover.approvers[0]?.comment
+                  ? rowsApprover?.approvers[0].comment
+                  : "-"
               }}
             </div>
           </div>
         </div>
       </div>
     </q-card>
+
+    <!-- ส่งไปพิจารณา -->
+
     <q-card
       bordered
       class="row col-12 text-dark q-mt-sm q-pa-sm"
-      v-if="statusCheck == 'WAITTING' && (isOfficer || isStaff)"
+      v-if="
+        !checkRoutePermisson &&
+        ((isStaff && group === '1.1' && approveStep === 'st1') ||
+          (isStaff && group !== '1.1' && approveStep === 'st1') ||
+          (isOfficer && group !== '1.1' && approveStep === 'st3'))
+      "
     >
       <q-btn
         @click="onSend"
         :disable="
-          rowsApprover?.approvers.length == 0 ||
-          rowsApprover?.commanders.length == 0
+          (group === '1.1' &&
+            (rowsApprover?.approvers.length == 0 ||
+              rowsApprover?.commanders.length == 0)) ||
+          (group !== '1.1 ' &&
+            rowsApprover?.commanders.length == 0 &&
+            approveStep === 'st1') ||
+          (group !== '1.1 ' &&
+            rowsApprover?.approvers.length == 0 &&
+            approveStep === 'st3')
         "
         label="ส่งไปพิจารณา"
         color="secondary"
@@ -837,6 +752,7 @@ onMounted(async () => {
         ><q-tooltip>คลิกเพื่อส่งไปพิจารณา</q-tooltip></q-btn
       >
     </q-card>
+
     <!-- แก้ไขข้อมูลเพื่อลงบัญชีแนบท้าย -->
     <q-card bordered class="row col-12 text-dark q-mt-sm">
       <q-form
@@ -852,7 +768,14 @@ onMounted(async () => {
           </div>
           <q-space />
           <!-- && workflowRef?.permission.isUpdate -->
-          <div v-if="!checkRoutePermisson">
+          <div
+            v-if="
+              !checkRoutePermisson &&
+              (dataDetail.status === 'APPROVE' ||
+                dataDetail.status === 'REJECT') &&
+              ((isStaff && group === '1.1') || (isOfficer && group !== '1.1'))
+            "
+          >
             <div class="q-gutter-sm" v-if="!edit">
               <q-btn
                 outline
@@ -956,24 +879,7 @@ onMounted(async () => {
                 />
               </div>
             </div>
-            <!-- <div class="col-xs-6 col-sm-3 row">
-              <div class="col-12">
-                <q-input
-                  v-model="salary"
-                  :outlined="edit"
-                  dense
-                  :readonly="!edit"
-                  :borderless="!edit"
-                  hide-bottom-space
-                  :label="`${'เงินเดือน'}`"
-                  :rules="[(val:number) => !!val || `${'กรุณากรอกเงินเดือน'}`]"
-                  lazy-rules
-                  :class="getClass(edit)"
-                  mask="###,###,###,###"
-                  reverse-fill-mask
-                />
-              </div>
-            </div> -->
+
             <div class="col-12"><q-separator /></div>
             <div class="col-xs-4 row">
               <div class="col-12">
@@ -1076,13 +982,6 @@ onMounted(async () => {
         </div>
       </q-form>
     </q-card>
-
-    <!-- <WorkFlow
-      ref="workflowRef"
-      v-model:is-check-data="isCheckData"
-      :id="id"
-      sys-name="RETIREMENT_CANCEL"
-    /> -->
   </div>
 
   <q-dialog v-model="modal" persistent>
@@ -1090,7 +989,7 @@ onMounted(async () => {
       <q-form greedy @submit.prevent @validation-success="onSubmit">
         <DialogHeader
           :tittle="`${
-            actionPass ? 'อนุญาตยกเลิกการลาออก' : 'ยับยั้งยกเลิกการลาออก'
+            actionPass ? 'อนุญาตยกเลิกการลาออก' : 'ไม่อนุญาตยกเลิกการลาออก'
           }`"
           :close="closeModal"
         />
@@ -1102,7 +1001,7 @@ onMounted(async () => {
               dense
               outlined
               lazy-rules
-              :rules="[(val:string) => !!val || 'กรุณากรอกความคิดเห็น/เหตุผล']"
+              :rules="  !actionPass ? [(val:string) => !!val || 'กรุณากรอกความคิดเห็น/เหตุผล'] :[]"
               v-model="reasonReign"
               :label="`${'กรอกความคิดเห็น/เหตุผล'}`"
               type="textarea"
@@ -1111,12 +1010,11 @@ onMounted(async () => {
           </div>
         </q-card-section>
         <q-separator />
-        <q-card-actions align="right" class="bg-white text-teal">
+        <q-card-actions align="right">
           <q-btn label="บันทึก" color="secondary" type="submit"
             ><q-tooltip>บันทึกข้อมูล</q-tooltip></q-btn
           >
         </q-card-actions>
-        <!-- <DialogFooter :editvisible="true" :save="conditionPopup" /> -->
       </q-form>
     </q-card>
   </q-dialog>
diff --git a/src/modules/06_retirement/components/02_resign/Table.vue b/src/modules/06_retirement/components/02_resign/Table.vue
index db911343f..a02cff9d6 100644
--- a/src/modules/06_retirement/components/02_resign/Table.vue
+++ b/src/modules/06_retirement/components/02_resign/Table.vue
@@ -6,7 +6,11 @@ import { useRouter } from "vue-router";
 import { useCounterMixin } from "@/stores/mixin";
 import { useDataStore } from "@/modules/06_retirement/store/resignMain";
 import { useRetirementDataStore } from "@/modules/06_retirement/store/Main";
-import { checkPermission } from "@/utils/permissions";
+import {
+  checkPermission,
+  checkPermissionList,
+  checkPermissionCreate,
+} from "@/utils/permissions";
 import http from "@/plugins/http";
 import config from "@/app.config";
 
@@ -131,7 +135,9 @@ const columns = ref<QTableProps["columns"]>([
     sortable: true,
     field: "status",
     format(val, row) {
-      return statusText(row.status);
+      return stroeResign.mainTabs === "1"
+        ? statusText(row.status)
+        : statusText(row.status, "อนุญาต");
     },
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
@@ -290,7 +296,11 @@ onMounted(async () => {
             </template>
           </q-select>
           <q-btn
-            v-if="checkPermission($route)?.attrIsUpdate"
+            v-if="
+              checkPermission($route)?.attrIsUpdate &&
+              checkPermissionList(['COMMAND']) &&
+              checkPermissionCreate('COMMAND')
+            "
             @click="openModalOrder"
             flat
             round
@@ -309,7 +319,7 @@ onMounted(async () => {
             ref="filterRef"
             outlined
             placeholder="ค้นหา"
-            @keydown.enter="onSearch"
+            @keydown.enter.prevent="onSearch"
           >
             <template v-slot:append>
               <q-icon name="search" />
@@ -367,7 +377,11 @@ onMounted(async () => {
                 <q-btn
                   v-if="
                     checkPermission($route)?.attrIsGet &&
-                    checkPermission($route)?.attrIsUpdate
+                    checkPermission($route)?.attrIsUpdate &&
+                    (props.row.status === 'WAITTING' ||
+                      props.row.status === 'PENDING' ||
+                      props.row.status === 'APPROVE' ||
+                      props.row.status === 'REJECT')
                   "
                   flat
                   dense
diff --git a/src/modules/06_retirement/components/03_resignEmp/DialogSendToCommand.vue b/src/modules/06_retirement/components/03_resignEmp/DialogSendToCommand.vue
index 8927151a6..b90c88e31 100644
--- a/src/modules/06_retirement/components/03_resignEmp/DialogSendToCommand.vue
+++ b/src/modules/06_retirement/components/03_resignEmp/DialogSendToCommand.vue
@@ -119,7 +119,7 @@ const columns = ref<QTableProps["columns"]>([
     field: "organizationPositionOld",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
-    
+
     // กรณี copy ทั้งหมด เเล้ว ค้นหา
     // format(val, row) {
     //   return `${row.organizationPositionOld.replace(/\n/g, " ")}`;
@@ -145,7 +145,9 @@ const columns = ref<QTableProps["columns"]>([
     sortable: true,
     field: "status",
     format(val, row) {
-      return statusText(row.status);
+      return props.mainTabs === "1"
+        ? statusText(row.status)
+        : statusText(row.status, "อนุญาต");
     },
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
@@ -220,7 +222,7 @@ watch(
               dense
               :model-value="filterKeyword"
               placeholder="ค้นหา"
-              @keydown.enter="onSearch"
+              @keydown.enter.prevent="onSearch"
             >
               <template v-slot:append>
                 <q-icon name="search" />
diff --git a/src/modules/06_retirement/components/03_resignEmp/ResignByid.vue b/src/modules/06_retirement/components/03_resignEmp/ResignByid.vue
index 50ffe5dce..e9a484ea0 100644
--- a/src/modules/06_retirement/components/03_resignEmp/ResignByid.vue
+++ b/src/modules/06_retirement/components/03_resignEmp/ResignByid.vue
@@ -8,8 +8,8 @@ import http from "@/plugins/http";
 import config from "@/app.config";
 import genReport from "@/plugins/genreport";
 import { useCounterMixin } from "@/stores/mixin";
-import { checkPermission } from "@/utils/permissions";
 import { useRetirementDataStore } from "@/modules/06_retirement/store/Main";
+import { useRoleWorkflowDataStore } from "@/stores/roleWorkflow";
 
 import type {
   TypeFile,
@@ -27,7 +27,6 @@ import type {
 import DialogHeader from "@/components/DialogHeader.vue";
 import PopupPersonal from "@/components/Dialogs/PopupPersonal.vue";
 import CardProfile from "@/components/CardProfile.vue";
-import WorkFlow from "@/components/Workflow/Main.vue";
 import DialogAddCommander from "@/modules/06_retirement/components/DialogAddCommander.vue";
 
 /** Use */
@@ -35,6 +34,7 @@ const $q = useQuasar();
 const route = useRoute();
 const router = useRouter();
 const store = useRetirementDataStore();
+const { fetchDataCheckIsoffice } = useRoleWorkflowDataStore();
 const { convertStatusText } = store;
 const checkRoutePermisson = ref<boolean>(route.name == "resignDetailbyidEMP");
 const mixin = useCounterMixin();
@@ -54,14 +54,8 @@ const modalPersonal = ref<boolean>(false);
 const personId = ref<string>("");
 const roleUser = ref<string>("");
 const dataProfile = ref<DataProfile>();
+const approveStep = ref<string>("");
 
-const approveCheck = computed(() => {
-  return (
-    rowsApprover.value?.commanders?.every(
-      (commander) => commander.approveStatus === "APPROVE"
-    ) ?? false
-  );
-});
 const idCheck = computed(() => {
   if (
     typeAdd.value == "COMMANDER" &&
@@ -82,29 +76,6 @@ const idCheck = computed(() => {
   }
 });
 
-const approvePendingCheck = computed(() => {
-  const commanders = rowsApprover.value?.commanders || [];
-  const index = commanders.findIndex((c) => c.profileId === keycloakId.value);
-
-  if (index === -1) {
-    return false;
-  }
-
-  const currentCommander = commanders[index];
-
-  if (currentCommander.approveStatus !== "PENDING") {
-    return false;
-  }
-
-  if (index === 0) {
-    return true;
-  }
-
-  const previousApproved = commanders
-    .slice(0, index)
-    .every((c) => c.approveStatus === "APPROVE");
-  return previousApproved;
-});
 const isOfficer = ref<boolean>(false);
 const isStaff = ref<boolean>(false);
 const profileType = ref<string>("");
@@ -169,6 +140,9 @@ const columnsCommanders = ref<QTableProps["columns"]>([
     align: "left",
     label: "วันสุดท้ายที่ยับยั้ง",
     field: "rejectDate",
+    format(val, row) {
+      return date2Thai(val);
+    },
     sortable: true,
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
@@ -206,7 +180,6 @@ const dataDetail = ref<any>({
   reasonResign: "",
 });
 
-const workflowRef = ref<any>(null);
 const organizationPositionOld = ref<string>("");
 const positionTypeOld = ref<string>("");
 const positionLevelOld = ref<string>("");
@@ -223,20 +196,6 @@ const actionPass = ref<boolean>(false);
 const reasonReign = ref<string>("");
 const dateBreak = ref<Date | null>(null);
 
-const isCheckData = computed(() => {
-  if (
-    organizationPositionOld.value !== "" &&
-    positionTypeOld.value !== "" &&
-    positionLevelOld.value !== "" &&
-    posNo.value !== "" &&
-    date.value !== null &&
-    dataDetail.value.commanderReject !== null &&
-    dataDetail.value.oligarchReject !== null
-  ) {
-    return true;
-  } else return false;
-});
-
 /** คอลัมน์ */
 const rows = ref<TypeFile[]>([]);
 const columns = ref<QTableProps["columns"]>([
@@ -269,13 +228,10 @@ const columns = ref<QTableProps["columns"]>([
   },
 ]);
 
-/**เปิด-ปิด modal */
+/**ฟังก์ชันปิด popup อนุญาตการลาออก,ยับยั้งการลาออก*/
 function closeModal() {
   modal.value = false;
 }
-function openModal() {
-  modal.value = true;
-}
 
 const file = ref<any>(null);
 const fileList = ref<FileList[]>([]);
@@ -291,6 +247,7 @@ const rowsFileDownload = ref<rowFile[]>([
   },
 ]);
 
+/** ฟังก์ชันคำนวนวันที่ขอลาออกจากราชการ*/
 function diffDate() {
   if (date.value !== null && dateLeave.value !== null) {
     const time = dateLeave.value.getTime() - date.value.getTime();
@@ -304,9 +261,11 @@ function diffDate() {
   return false;
 }
 
-/** นำข้อมูลมาจาก API*/
+/**
+ * ฟังก์ชันดึงข้อมูลรายละเอียดการลาออก
+ * @param id  รายการลาออก
+ */
 async function fetchData(id: string) {
-  showLoader();
   await http
     .get(config.API.resingByidEMP(id))
     .then(async (res) => {
@@ -339,7 +298,7 @@ async function fetchData(id: string) {
       isNoDebt.value = data.isNoDebt;
       isNoBurden.value = data.isNoBurden;
       isDiscipline.value = data.isDiscipline;
-
+      approveStep.value = data.approveStep;
       statusCheck.value = data.status;
       profileType.value = data.profileType;
       keycloakUserId.value = data.keycloakUserId;
@@ -350,32 +309,40 @@ async function fetchData(id: string) {
     })
     .catch((e) => {
       messageError($q, e);
-    })
-    .finally(() => {
-      hideLoader();
     });
 }
 
-/**Pop up */
+/**
+ * ฟังก์ชันเปิด popup  อนุญาต,ยับยั้ง
+ * @param action   อนุญาต, ยับยั้ง
+ * @param type ผู้บังคับบัญชา, ผู้มีอำนาจ
+ */
 function popUp(action: "pass" | "passNot", type: string) {
   reasonReign.value = "";
   dateBreak.value = null;
   actionPass.value = action === "pass";
   roleUser.value = type;
-  openModal();
+  modal.value = true;
 }
 
-//เงื่อนไขpop up
+/** ฟังก์ชันบันทึกผลการพิจารณา*/
 function onSubmit() {
-  if (actionPass.value) {
-    confirmpopUp();
-  } else {
-    rejectpopUp();
+  if (roleUser.value === "commander" && actionPass.value) {
+    confirmpopUp("/comander");
+  } else if (roleUser.value === "commander" && !actionPass.value) {
+    rejectpopUp("/comander");
+  } else if (roleUser.value === "oligarch" && actionPass.value) {
+    confirmpopUp("");
+  } else if (roleUser.value === "oligarch" && !actionPass.value) {
+    rejectpopUp("");
   }
 }
 
-//pop up ยืนยันการอนุญาต
-async function confirmpopUp() {
+/**
+ * ฟังก์ชันยืนยันการอนุญาตผลการพิจารณา
+ * @param path ประเภทของผู้พิจารณา comander === 'บังคับบัญชา', '' === 'ผู้มีอำนาจ'
+ */
+async function confirmpopUp(path: string) {
   dialogConfirm(
     $q,
     async () => {
@@ -384,7 +351,15 @@ async function confirmpopUp() {
         reason: reasonReign.value,
       };
       await http
-        .put(config.API.commanderApproveRetirement("-employee", id.value,'approve'), body)
+        .put(
+          config.API.commanderApproveRetirement(
+            "-employee",
+            id.value,
+            "approve",
+            path
+          ),
+          body
+        )
         .then(async () => {
           await fetchData(id.value);
           closeModal();
@@ -402,8 +377,11 @@ async function confirmpopUp() {
   );
 }
 
-//pop up การยับยั้งสำเร็จ
-async function rejectpopUp() {
+/**
+ ฟังก์ชันยืนยันการยับยั้งผลการพิจารณา
+ * @param path ประเภทของผู้พิจารณา comander === 'บังคับบัญชา', '' === 'ผู้มีอำนาจ'
+ */
+async function rejectpopUp(path: string) {
   dialogConfirm(
     $q,
     async () => {
@@ -413,7 +391,15 @@ async function rejectpopUp() {
         date: dateBreak.value,
       };
       await http
-        .put(config.API.commanderApproveRetirement('-employee', id.value,'reject'), body)
+        .put(
+          config.API.commanderApproveRetirement(
+            "-employee",
+            id.value,
+            "reject",
+            path
+          ),
+          body
+        )
         .then(async () => {
           await fetchData(id.value);
           closeModal();
@@ -431,9 +417,7 @@ async function rejectpopUp() {
   );
 }
 
-/**
- * กดยกเลิก
- */
+/** ฟังก์ชันยกเลิกการแก้ไขข้อมูลเพื่อลงบัญชีแนบท้าย*/
 async function clickCancel() {
   edit.value = false;
   const data = dataDetail.value;
@@ -454,17 +438,20 @@ async function clickCancel() {
     isDiscipline.value = data.isDiscipline;
   }
   myForm.value?.resetValidation();
-  // await fetchData(id.value);
-}
-/**
- * กดยกเลิก
- */
-async function clickCancelConditions() {
-  await fetchData(id.value);
-  conditions.value = false;
 }
 
-/** Function บันทึก รายการตรวจสอบเงื่อนไขต่างๆ*/
+/** ฟังก์ขันยกเลิกการแก้ไขเงื่อนไขต่างๆ*/
+async function clickCancelConditions() {
+  const data = dataDetail.value;
+  if (data) {
+    isNoDebt.value = data.isNoDebt;
+    isNoBurden.value = data.isNoBurden;
+    isDiscipline.value = data.isDiscipline;
+    conditions.value = false;
+  }
+}
+
+/** ฟังก์ชันบันทึกรายการตรวจสอบเงื่อนไขต่างๆ*/
 function onSubmitConditions() {
   dialogConfirm($q, async () => {
     showLoader();
@@ -488,7 +475,7 @@ function onSubmitConditions() {
   });
 }
 
-/** Function บันทึก ,แก้ไขข้อมูลเพื่อลงบัญชีแนบท้าย*/
+/** ฟังก์ชันบันทึกข้อมูลเพื่อลงบัญชีแนบท้าย*/
 function onSubmitAttached() {
   dialogConfirm($q, () => {
     const formData = new FormData();
@@ -522,7 +509,7 @@ function onSubmitAttached() {
 }
 
 /**
- * Function เพิ่ม Class เวลา Edit
+ * ฟังก์ชัน  Class เวลา Edit
  * @param val เมื่อเป็นEdit จะเปลี่ยน Class
  */
 function getClass(val: boolean) {
@@ -532,17 +519,11 @@ function getClass(val: boolean) {
   };
 }
 
-/** แปลง StatusOrder */
-function statusOrder(val: boolean) {
-  switch (val) {
-    case true:
-      return "ยับยั้ง";
-    case false:
-      return "อนุญาต";
-  }
-}
-
-// ดาว์นโหลดไฟล์
+/**
+ * ฟังก์ชันดาว์นโหลดไฟล์
+ * @param type นามสกุลไฟล์
+ * @param fileName ชื่อไฟล์ที่ต้องการโหลด
+ */
 async function fileDownload(type: string, fileName: string) {
   showLoader();
   await http
@@ -559,12 +540,16 @@ async function fileDownload(type: string, fileName: string) {
     });
 }
 
+/**
+ * ฟังก์ชันอัปเดท modal ของ popup ทะเบียนประวัติ
+ * @param modal modal
+ */
 function updatemodalPersonal(modal: boolean) {
   modalPersonal.value = modal;
 }
 
+/** ฟังก์ชันดึงข้อมูลไฟล์*/
 async function fetchFile() {
-  showLoader();
   await http
     .get(config.API.file("พ้นจากราชการ", "หลักฐานลาออก", id.value))
     .then(async (res) => {
@@ -572,10 +557,10 @@ async function fetchFile() {
     })
     .catch((e) => {
       messageError($q, e);
-      hideLoader();
     });
 }
 
+/** ฟังก์ชันสร้าง Path ที่เก็บไฟล์*/
 function uploadFiles() {
   showLoader();
   http
@@ -603,6 +588,10 @@ function uploadFiles() {
     });
 }
 
+/**
+ * ฟังก์ชันอัปโหลดไฟล์
+ * @param uploadUrl ที่อยู่ที่เก็บไฟล์
+ */
 async function uploadFileURL(uploadUrl: string) {
   const Data = new FormData();
   Data.append("file", file.value);
@@ -626,6 +615,10 @@ async function uploadFileURL(uploadUrl: string) {
     });
 }
 
+/**
+ * ฟังก์ชันโหลดไฟล์
+ * @param fileName ชื่อไฟล์ที่ต้องการโหลด
+ */
 async function downloadFiles(fileName: string) {
   showLoader();
   await http
@@ -645,13 +638,13 @@ async function downloadFiles(fileName: string) {
 }
 
 /**
- * ลบไฟล์
- * @param id id file
+ * ฟังก์ชันลบไฟล์
+ * @param fileName ชื่อไฟล์ที่ต้องการลบ
  */
 function removeFile(fileName: string) {
-  dialogRemove($q, () => {
+  dialogRemove($q, async () => {
     showLoader();
-    http
+    await http
       .delete(
         config.API.fileByFile(
           "พ้นจากราชการ",
@@ -660,20 +653,25 @@ function removeFile(fileName: string) {
           fileName
         )
       )
-      .then(() => {
+      .then(async () => {
         setTimeout(async () => {
           await fetchFile();
           success($q, `ลบไฟล์สำเร็จ`);
-          hideLoader();
         }, 1000);
       })
       .catch((e) => {
         messageError($q, e);
+      })
+      .finally(() => {
         hideLoader();
       });
   });
 }
 
+/**
+ * ฟังก์ชันแปลงเหตุผลที่ลาออก
+ * @param val เหตุผลที่ลาออก
+ */
 function convertStatus(val: string) {
   if (/^[A-Za-z]+$/.test(val)) {
     switch (val) {
@@ -691,25 +689,27 @@ function convertStatus(val: string) {
   } else return val;
 }
 
-/** เปิด POP UP  */
+/**
+ * ฟังกฺชันเปิด pop up เพิ่มรายชื่อพิจารณา
+ * @param type COMMANDER === ผู้บังคับบัญชา, APPROVER === ผู้มีอำนาจ
+ */
 function onAddPerson(type: string) {
   modalAdd.value = true;
   typeAdd.value = type;
 }
 
+/** ฟังก์ชันดึงข้อมูลสิทธ์ของผู้ใช่*/
 async function checkOfficer() {
-  http
-    .get(config.API.checkIsofficer + `SYS_RESIGN_EMP`)
-    .then(async (res) => {
-      isOfficer.value = await res.data.result.isOfficer;
-      isStaff.value = await res.data.result.isStaff;
-    })
-    .catch((e) => {
-      messageError($q, e);
-    })
-    .finally(() => {});
+  try {
+    const data = await fetchDataCheckIsoffice("SYS_RESIGN_EMP");
+    isOfficer.value = data.isOfficer;
+    isStaff.value = data.isStaff;
+  } catch (err) {
+    messageError($q, err);
+  }
 }
 
+/** ฟังก์ชันยืนยันการส่งไปพิจารณา*/
 function onSend() {
   dialogConfirm(
     $q,
@@ -717,20 +717,23 @@ function onSend() {
       showLoader();
       http
         .get(config.API.sendApproveRetirement("-employee", id.value))
-        .then(async (res) => {
+        .then(async () => {
           await fetchData(id.value);
           success($q, "ส่งไปพิจารณา");
         })
         .catch((e) => {
           messageError($q, e);
         })
-        .finally(() => {});
+        .finally(() => {
+          hideLoader();
+        });
     },
     "ยืนยันการส่งไปพิจารณา",
     "ต้องการส่งไปพิจารณาใช่หรือไม่"
   );
 }
 
+/** ฟังก์ชันดึงข้อมูลตำแหน่งจาก Keycloak*/
 async function fetchKeycloakPosition() {
   if (keycloakId.value == "") {
     await http
@@ -749,10 +752,10 @@ async function fetchKeycloakPosition() {
 onMounted(async () => {
   showLoader();
   await Promise.all([
-    await fetchData(id.value),
-    await fetchKeycloakPosition(),
+    fetchData(id.value),
+    fetchKeycloakPosition(),
     fetchFile(),
-    await checkOfficer(),
+    checkOfficer(),
   ]).finally(() => {
     hideLoader();
   });
@@ -784,39 +787,6 @@ onMounted(async () => {
     <q-card bordered class="row col-12 text-dark q-mt-sm">
       <div class="bg-grey-1 q-pa-sm col-12 row items-center text-primary">
         <div class="q-pl-sm text-weight-bold text-dark">ข้อมูลการลาออก</div>
-        <!-- <q-space />
-        <div
-          class="q-gutter-x-sm"
-          v-if="
-            (roleUser === 'officer' && dataDetail.officerReject === null) ||
-            (roleUser === 'commander' &&
-              dataDetail.commanderReject === null &&
-              dataDetail.officerReject !== null) ||
-            (roleUser === 'oligarch' &&
-              dataDetail.oligarchReject === null &&
-              dataDetail.commanderReject !== null &&
-              dataDetail.officerReject !== null)
-          "
-        >
-          <q-btn
-            outline
-            color="primary"
-            dense
-            icon-right="check"
-            class="q-px-sm"
-            label="อนุญาต"
-            @click="popUp('pass')"
-          />
-          <q-btn
-            outline
-            color="red"
-            dense
-            icon-right="close"
-            class="q-px-sm"
-            label="ยับยั้ง"
-            @click="popUp('passNot')"
-          />
-        </div> -->
       </div>
       <div class="col-12"><q-separator /></div>
       <div class="row col-12 q-pa-md">
@@ -998,11 +968,7 @@ onMounted(async () => {
               <q-space />
 
               <div
-                v-if="
-                  !checkRoutePermisson &&
-                  isStaff &&
-                  dataDetail.statusMain === 'WAITTING'
-                "
+                v-if="!checkRoutePermisson && isStaff && approveStep === 'st1'"
               >
                 <div v-if="!conditions">
                   <q-btn
@@ -1164,51 +1130,6 @@ onMounted(async () => {
       </div>
     </q-card>
 
-    <!-- ผลการพิจารณาของการเจ้าหน้าที่ของหน่วยงาน -->
-    <!-- <q-card bordered class="row col-12 text-dark q-mt-sm">
-      <div class="bg-grey-1 q-pa-sm col-12 row items-center text-primary">
-        <div class="q-pl-sm text-weight-bold text-dark">
-          ผลการพิจารณาของการเจ้าหน้าที่ของหน่วยงาน
-        </div>
-      </div>
-      <div class="col-12"><q-separator /></div>
-      <div class="row col-12 q-pa-md">
-        <div class="col-12 row bg-white q-col-gutter-md">
-          <div class="col-xs-6 row items-start">
-            <div class="col-12 text-top">สถานะ</div>
-            <div class="col-12 text-detail">
-              {{
-                dataDetail.officerReject !== null
-                  ? statusOrder(dataDetail.officerReject)
-                  : "-"
-              }}
-            </div>
-          </div>
-          <div class="col-xs-6 row items-start">
-            <div class="col-12 text-top">วันสุดท้ายที่ยับยั้ง</div>
-            <div class="col-12 text-detail">
-              {{
-                dataDetail.officerRejectDate !== null
-                  ? date2Thai(dataDetail.officerRejectDate)
-                  : "-"
-              }}
-            </div>
-          </div>
-          <div class="col-xs-12 row items-start">
-            <div class="col-12 text-top">ความคิดเห็นและเหตุผล</div>
-
-            <div class="col-12 text-detail">
-              {{
-                dataDetail.officerReject
-                  ? dataDetail.officerRejectReason
-                  : dataDetail.officerApproveReason
-              }}
-            </div>
-          </div>
-        </div>
-      </div>
-    </q-card> -->
-
     <!-- ผลการพิจารณาของผู้บังคับบัญชา -->
     <q-card bordered class="row col-12 text-dark q-mt-sm">
       <div class="bg-grey-1 q-pa-sm col-12 row items-center text-primary">
@@ -1216,7 +1137,7 @@ onMounted(async () => {
           ผลการพิจารณาของผู้บังคับบัญชา
         </div>
         <q-btn
-          v-if="statusCheck == 'WAITTING' && (isOfficer || isStaff)"
+          v-if="!checkRoutePermisson && isStaff && approveStep === 'st1'"
           flat
           round
           icon="add"
@@ -1229,33 +1150,6 @@ onMounted(async () => {
         </q-btn>
 
         <q-space />
-        <!-- <div
-          class="q-gutter-x-sm"
-          v-if="
-            isDirector &&
-            dataDetail.commanderReject === null &&
-            dataDetail.statusMain === 'WAITTING'
-          "
-        >
-          <q-btn
-            outline
-            color="primary"
-            dense
-            icon-right="check"
-            class="q-px-sm"
-            label="อนุญาต"
-            @click="popUp('pass', 'commander')"
-          />
-          <q-btn
-            outline
-            color="red"
-            dense
-            icon-right="close"
-            class="q-px-sm"
-            label="ยับยั้ง"
-            @click="popUp('passNot', 'commander')"
-          />
-        </div> -->
       </div>
 
       <div class="col-12"><q-separator /></div>
@@ -1286,25 +1180,19 @@ onMounted(async () => {
                 </div>
                 <div v-else-if="col.name == 'comment'">
                   <div
+                    class="q-gutter-x-xs"
                     v-if="
                       props.row.approveStatus == 'PENDING' &&
-                      props.row.comment == ''
+                      props.row.comment == '' &&
+                      approveStep === 'st2'
                     "
                   >
                     <q-btn
-                      :disable="
-                        statusCheck == 'NEW' ||
-                        !approvePendingCheck ||
-                        (props.row.profileId !== keycloakId &&
-                          checkPermission($route)?.attrIsUpdate)
-                      "
-                      :outline="
-                        props.row.profileId !== keycloakId ||
-                        statusCheck == 'NEW' ||
-                        !approvePendingCheck
-                          ? false
-                          : true
+                      v-if="
+                        props.row.profileId === keycloakId &&
+                        approveStep === 'st2'
                       "
+                      outline
                       dense
                       color="primary"
                       icon-right="check"
@@ -1312,20 +1200,13 @@ onMounted(async () => {
                       label="อนุญาต"
                       @click="popUp('pass', 'commander')"
                     />
+
                     <q-btn
-                      :disable="
-                        statusCheck == 'NEW' ||
-                        !approvePendingCheck ||
-                        (props.row.profileId !== keycloakId &&
-                          checkPermission($route)?.attrIsUpdate)
-                      "
-                      :outline="
-                        props.row.profileId !== keycloakId ||
-                        statusCheck == 'NEW' ||
-                        !approvePendingCheck
-                          ? false
-                          : true
+                      v-if="
+                        props.row.profileId === keycloakId &&
+                        approveStep === 'st2'
                       "
+                      outline
                       color="red"
                       dense
                       icon-right="close"
@@ -1334,6 +1215,7 @@ onMounted(async () => {
                       @click="popUp('passNot', 'commander')"
                     />
                   </div>
+
                   <div v-else>
                     {{ props.row.comment ? props.row.comment : "-" }}
                   </div>
@@ -1362,7 +1244,7 @@ onMounted(async () => {
           ผลการพิจารณาของผู้มีอำนาจ
         </div>
         <q-btn
-          v-if="statusCheck == 'WAITTING' && (isOfficer || isStaff)"
+          v-if="!checkRoutePermisson && isStaff && approveStep === 'st1'"
           flat
           round
           icon="add"
@@ -1374,17 +1256,15 @@ onMounted(async () => {
           <q-tooltip>เพิ่มรายชื่อผู้มีอำนาจ</q-tooltip>
         </q-btn>
         <q-space />
+
         <div
           class="q-gutter-x-sm"
           v-if="
-            checkPermission($route)?.attrIsUpdate &&
-            dataDetail.oligarchReject === null &&
-            dataDetail.statusMain === 'WAITTING' &&
             rowsApprover &&
             rowsApprover.approvers &&
             rowsApprover.approvers[0]?.profileId == keycloakId &&
             rowsApprover.approvers[0]?.approveStatus == 'PENDING' &&
-            approveCheck
+            approveStep === 'st3'
           "
         >
           <q-btn
@@ -1438,8 +1318,10 @@ onMounted(async () => {
             <div class="col-12 text-top">วันสุดท้ายที่ยับยั้ง</div>
             <div class="col-12 text-detail">
               {{
-                dataDetail.oligarchRejectDate !== null
-                  ? date2Thai(dataDetail.oligarchRejectDate)
+                rowsApprover &&
+                rowsApprover.approvers &&
+                rowsApprover.approvers[0]?.rejectDate
+                  ? date2Thai(rowsApprover?.approvers[0].rejectDate)
                   : "-"
               }}
             </div>
@@ -1448,19 +1330,23 @@ onMounted(async () => {
             <div class="col-12 text-top">ความคิดเห็นและเหตุผล</div>
             <div class="col-12 text-detail">
               {{
-                dataDetail.oligarchReject
-                  ? dataDetail.oligarchRejectReason
-                  : dataDetail.oligarchApproveReason
+                rowsApprover &&
+                rowsApprover.approvers &&
+                rowsApprover.approvers[0]?.comment
+                  ? rowsApprover?.approvers[0].comment
+                  : "-"
               }}
             </div>
           </div>
         </div>
       </div>
     </q-card>
+
+    <!-- ส่งไปพิจารณา -->
     <q-card
       bordered
       class="row col-12 text-dark q-mt-sm q-pa-sm"
-      v-if="statusCheck == 'WAITTING' && (isOfficer || isStaff)"
+      v-if="!checkRoutePermisson && isStaff && approveStep === 'st1'"
     >
       <q-btn
         @click="onSend"
@@ -1474,6 +1360,7 @@ onMounted(async () => {
         ><q-tooltip>คลิกเพื่อส่งไปพิจารณา</q-tooltip></q-btn
       >
     </q-card>
+
     <!-- แก้ไขข้อมูลเพื่อลงบัญชีแนบท้าย -->
     <q-card bordered class="row col-12 text-dark q-mt-sm">
       <q-form
@@ -1492,8 +1379,9 @@ onMounted(async () => {
           <div
             v-if="
               !checkRoutePermisson &&
-              isStaff &&
-              dataDetail.statusMain === 'WAITTING'
+              (dataDetail.statusMain === 'APPROVE' ||
+                dataDetail.statusMain === 'REJECT') &&
+              isStaff
             "
           >
             <div class="q-gutter-sm" v-if="!edit">
@@ -1599,24 +1487,7 @@ onMounted(async () => {
                 />
               </div>
             </div>
-            <!-- <div class="col-xs-6 col-sm-3 row">
-              <div class="col-12">
-                <q-input
-                  v-model="salary"
-                  :outlined="edit"
-                  dense
-                  :readonly="!edit"
-                  :borderless="!edit"
-                  hide-bottom-space
-                  :label="`${'เงินเดือน'}`"
-                  :rules="[(val:number) => !!val || `${'กรุณากรอกเงินเดือน'}`]"
-                  lazy-rules
-                  :class="getClass(edit)"
-                  mask="###,###,###,###"
-                  reverse-fill-mask
-                />
-              </div>
-            </div> -->
+
             <div class="col-12"><q-separator /></div>
             <div class="col-xs-4 row">
               <div class="col-12">
@@ -1718,15 +1589,9 @@ onMounted(async () => {
         </div>
       </q-form>
     </q-card>
-
-    <!-- <WorkFlow
-      ref="workflowRef"
-      v-model:is-check-data="isCheckData"
-      :id="id"
-      sys-name="SYS_RESIGN"
-    /> -->
   </div>
 
+  <!-- popup อนุญาตการลาออก,ยับยั้งการลาออก  -->
   <q-dialog v-model="modal" persistent>
     <q-card style="width: 800px">
       <q-form greedy @submit.prevent @validation-success="onSubmit">
@@ -1742,7 +1607,7 @@ onMounted(async () => {
               dense
               outlined
               lazy-rules
-              :rules="[(val:string) => !!val || 'กรุณากรอกความคิดเห็น/เหตุผล']"
+              :rules="  !actionPass ? [(val:string) => !!val || 'กรุณากรอกความคิดเห็น/เหตุผล'] :[]"
               v-model="reasonReign"
               :label="`${'กรอกความคิดเห็น/เหตุผล'}`"
               type="textarea"
@@ -1812,7 +1677,7 @@ onMounted(async () => {
   <DialogAddCommander
     v-model:modal="modalAdd"
     :type="typeAdd"
-    :profileType="'officer'"
+    :profileType="'-employee'"
     :get-data="fetchData"
     :id-check="idCheck"
     :keycloak-user-id="keycloakUserId"
diff --git a/src/modules/06_retirement/components/03_resignEmp/ResignReject.vue b/src/modules/06_retirement/components/03_resignEmp/ResignReject.vue
index b0c611071..cab33a779 100644
--- a/src/modules/06_retirement/components/03_resignEmp/ResignReject.vue
+++ b/src/modules/06_retirement/components/03_resignEmp/ResignReject.vue
@@ -1,22 +1,16 @@
 <script setup lang="ts">
 import { ref, onMounted, computed } from "vue";
-import axios from "axios";
 import { useRouter, useRoute } from "vue-router";
 import { useQuasar, QForm } from "quasar";
 
 import http from "@/plugins/http";
 import config from "@/app.config";
-import genReport from "@/plugins/genreport";
+
 import { useCounterMixin } from "@/stores/mixin";
-import { checkPermission } from "@/utils/permissions";
 import DialogHeader from "@/components/DialogHeader.vue";
 import { useRetirementDataStore } from "@/modules/06_retirement/store/Main";
+import { useRoleWorkflowDataStore } from "@/stores/roleWorkflow";
 
-import type {
-  TypeFile,
-  rowFile,
-  FileList,
-} from "@/modules/06_retirement/interface/response/Main";
 import type { QTableProps } from "quasar";
 import type { DataProfile } from "@/modules/05_placement/interface/index/Main";
 import type {
@@ -25,15 +19,14 @@ import type {
 } from "@/modules/06_retirement/interface/response/Main";
 
 import DialogAddCommander from "@/modules/06_retirement/components/DialogAddCommander.vue";
-import PopupPersonal from "@/components/Dialogs/PopupPersonal.vue";
 import CardProfile from "@/components/CardProfile.vue";
-import WorkFlow from "@/components/Workflow/Main.vue";
 
 /** Use */
 const $q = useQuasar();
 const route = useRoute();
 const router = useRouter();
 const store = useRetirementDataStore();
+const { fetchDataCheckIsoffice } = useRoleWorkflowDataStore();
 const { convertStatusText } = store;
 const checkRoutePermisson = ref<boolean>(route.name == "resignDetailRejectEMP");
 const mixin = useCounterMixin();
@@ -43,22 +36,14 @@ const {
   showLoader,
   hideLoader,
   success,
-
   dialogConfirm,
-  dialogRemove,
 } = mixin;
 
 /** ตัวแปร */
 const roleUser = ref<string>("");
 const dataProfile = ref<DataProfile>();
+const approveStep = ref<string>("");
 
-const approveCheck = computed(() => {
-  return (
-    rowsApprover.value?.commanders?.every(
-      (commander) => commander.approveStatus === "APPROVE"
-    ) ?? false
-  );
-});
 const idCheck = computed(() => {
   if (
     typeAdd.value == "COMMANDER" &&
@@ -79,29 +64,6 @@ const idCheck = computed(() => {
   }
 });
 
-const approvePendingCheck = computed(() => {
-  const commanders = rowsApprover.value?.commanders || [];
-  const index = commanders.findIndex((c) => c.profileId === keycloakId.value);
-
-  if (index === -1) {
-    return false;
-  }
-
-  const currentCommander = commanders[index];
-
-  if (currentCommander.approveStatus !== "PENDING") {
-    return false;
-  }
-
-  if (index === 0) {
-    return true;
-  }
-
-  const previousApproved = commanders
-    .slice(0, index)
-    .every((c) => c.approveStatus === "APPROVE");
-  return previousApproved;
-});
 const isOfficer = ref<boolean>(false);
 const profileType = ref<string>("");
 const keycloakUserId = ref<string>("");
@@ -159,15 +121,6 @@ const columnsCommanders = ref<QTableProps["columns"]>([
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
   },
-  {
-    name: "rejectDate",
-    align: "left",
-    label: "วันสุดท้ายที่ยับยั้ง",
-    field: "rejectDate",
-    sortable: true,
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
 ]);
 
 const id = ref<string>(route.params.id.toString());
@@ -197,7 +150,6 @@ const dataDetail = ref<any>({
   statusMain: "",
 });
 
-const workflowRef = ref<any>(null);
 const organizationPositionOld = ref<string>("");
 const positionTypeOld = ref<string>("");
 const positionLevelOld = ref<string>("");
@@ -214,32 +166,16 @@ const actionPass = ref<boolean>(false);
 const reasonReign = ref<string>("");
 const dateBreak = ref<Date | null>(null);
 
-const isCheckData = computed(() => {
-  if (
-    organizationPositionOld.value !== "" &&
-    positionTypeOld.value !== "" &&
-    positionLevelOld.value !== "" &&
-    posNo.value !== "" &&
-    date.value !== null &&
-    dataDetail.value.commanderReject !== null &&
-    dataDetail.value.oligarchReject !== null
-  ) {
-    return true;
-  } else return false;
-});
-
 /**เปิด-ปิด modal */
 function closeModal() {
   modal.value = false;
 }
-function openModal() {
-  modal.value = true;
-}
 
 const isNoDebt = ref<boolean>(false);
 const isNoBurden = ref<boolean>(false);
 const isDiscipline = ref<boolean>(false);
 
+/** ฟังก์ชันคำนวนวันที่ขอลาออกจากราชการ*/
 function diffDate() {
   if (date.value !== null && dateLeave.value !== null) {
     const time = dateLeave.value.getTime() - date.value.getTime();
@@ -253,9 +189,11 @@ function diffDate() {
   return false;
 }
 
-/** นำข้อมูลมาจาก API*/
+/**
+ * ฟังก์ชันดึงข้อมูลรายละเอียดการยกเลิกลาออก
+ * @param id  รายการยกเลิกลาออก
+ */
 async function fetchData(id: string) {
-  showLoader();
   await http
     .get(config.API.listResignEMP() + `/cancel/${id}`)
     .then(async (res) => {
@@ -272,43 +210,55 @@ async function fetchData(id: string) {
       dateLeave.value = data.activeDate ? new Date(data.activeDate) : null;
       reason.value = data.reason ?? "";
       location.value = data.location ?? "";
+      approveStep.value = data.approveStep ?? "";
       status.value = data.status ?? "";
       remarkHorizontal.value = data.remarkHorizontal ?? "-";
       isNoDebt.value = data.isNoDebt;
       statusCheck.value = data.status;
       isNoBurden.value = data.isNoBurden;
       isDiscipline.value = data.isDiscipline;
+      profileType.value = data.profileType;
+      keycloakUserId.value = data.keycloakUserId;
+
+      rowsApprover.value = {
+        commanders: data.commanders,
+        approvers: data.approvers,
+      };
     })
     .catch((e) => {
       messageError($q, e);
-    })
-    .finally(() => {
-      hideLoader();
     });
 }
 
-/**Pop up */
+/**
+ * ฟังก์ชันเปิด popup  อนุญาต,ไม่อนุญาต
+ * @param action   อนุญาต, ไม่อนุญาต
+ * @param type ผู้บังคับบัญชา, ผู้มีอำนาจ
+ */
 function popUp(action: "pass" | "passNot", type: string) {
   reasonReign.value = "";
   dateBreak.value = null;
   actionPass.value = action === "pass";
   roleUser.value = type;
-  openModal();
+  modal.value = true;
 }
 
-//เงื่อนไขpop up
+/** ฟังก์ชันยืนยันการอนุญาตผลการพิจารณา*/
 function onSubmit() {
   dialogConfirm($q, async () => {
     showLoader();
     const body = {
       reason: reasonReign.value,
-      reject: !actionPass.value,
+      Date: new Date(),
     };
+    const action = actionPass.value ? "approve" : "reject";
+
+    const endpoint =
+      roleUser.value === "commander"
+        ? config.API.comanderCancelResign("-employee", action, id.value)
+        : config.API.approverCancelResign("-employee", action, id.value);
     await http
-      .put(
-        config.API.resignRejectEMP(`${roleUser.value}-cancel`, id.value),
-        body
-      )
+      .put(endpoint, body)
       .then(async () => {
         await fetchData(id.value);
         closeModal();
@@ -323,7 +273,7 @@ function onSubmit() {
   });
 }
 
-/** กดยกเลิก*/
+/** ฟังก์ชันยกเลิกการแก้ไขข้อมูลเพื่อลงบัญชีแนบท้าย*/
 async function clickCancel() {
   edit.value = false;
   const data = dataDetail.value;
@@ -346,7 +296,7 @@ async function clickCancel() {
   myForm.value?.resetValidation();
 }
 
-/** Function บันทึก ,แก้ไขข้อมูลเพื่อลงบัญชีแนบท้าย*/
+/** ฟังก์ชันบันทึกข้อมูลเพื่อลงบัญชีแนบท้าย*/
 function onSubmitAttached() {
   dialogConfirm($q, () => {
     const formData = new FormData();
@@ -381,7 +331,7 @@ function onSubmitAttached() {
 }
 
 /**
- * Function เพิ่ม Class เวลา Edit
+ * ฟังก์ชัน  Class เวลา Edit
  * @param val เมื่อเป็นEdit จะเปลี่ยน Class
  */
 function getClass(val: boolean) {
@@ -391,71 +341,53 @@ function getClass(val: boolean) {
   };
 }
 
-/** แปลง StatusOrder */
-function statusOrder(val: boolean) {
-  switch (val) {
-    case true:
-      return "ยับยั้ง";
-    case false:
-      return "อนุญาต";
-  }
-}
-
-const isDirector = ref<boolean>(false);
 const isStaff = ref<boolean>(false);
 
-function fetchCheckIsofficer() {
-  http
-    .get(config.API.workflowKeycloakSystem("RETIREMENT_CANCEL_EMP"))
-    .then((res) => {
-      isStaff.value = res.data.result.isStaff;
-      isDirector.value = res.data.result.isDirector;
-    })
-    .catch((err) => {
-      messageError($q, err);
-    });
-}
-
-/** เปิด POP UP  */
+/**
+ * ฟังกฺชันเปิด pop up เพิ่มรายชื่อพิจารณา
+ * @param type COMMANDER === ผู้บังคับบัญชา, APPROVER === ผู้มีอำนาจ
+ */
 function onAddPerson(type: string) {
   modalAdd.value = true;
   typeAdd.value = type;
 }
 
+/** ฟังก์ชันดึงข้อมูลสิทธ์ของผู้ใช่*/
 async function checkOfficer() {
-  http
-    .get(config.API.checkIsofficer + `SYS_RESIGN_EMP`)
-    .then(async (res) => {
-      isOfficer.value = await res.data.result.isOfficer;
-      isStaff.value = await res.data.result.isStaff;
-    })
-    .catch((e) => {
-      messageError($q, e);
-    })
-    .finally(() => {});
+  try {
+    const data = await fetchDataCheckIsoffice("SYS_RESIGN_EMP");
+    isOfficer.value = data.isOfficer;
+    isStaff.value = data.isStaff;
+  } catch (err) {
+    messageError($q, err);
+  }
 }
 
+/** ฟังก์ชันยืนยันการส่งไปพิจารณา*/
 function onSend() {
   dialogConfirm(
     $q,
-    () => {
+    async () => {
       showLoader();
-      http
-        .get(config.API.sendApproveRetirement("-employee", id.value))
-        .then(async (res) => {
+      await http
+        .get(config.API.officerCancelResign("-employee", id.value))
+        .then(async () => {
           await fetchData(id.value);
           success($q, "ส่งไปพิจารณา");
         })
         .catch((e) => {
           messageError($q, e);
         })
-        .finally(() => {});
+        .finally(() => {
+          hideLoader();
+        });
     },
     "ยืนยันการส่งไปพิจารณา",
     "ต้องการส่งไปพิจารณาใช่หรือไม่"
   );
 }
 
+/** ฟังก์ชันดึงข้อมูลตำแหน่งจาก Keycloak*/
 async function fetchKeycloakPosition() {
   if (keycloakId.value == "") {
     await http
@@ -472,7 +404,14 @@ async function fetchKeycloakPosition() {
 
 /** Hook */
 onMounted(async () => {
-  await Promise.all([await fetchKeycloakPosition(),fetchData(id.value), checkOfficer()]);
+  showLoader();
+  await Promise.all([
+    fetchData(id.value),
+    fetchKeycloakPosition(),
+    checkOfficer(),
+  ]).finally(() => {
+    hideLoader();
+  });
 });
 </script>
 
@@ -490,7 +429,9 @@ onMounted(async () => {
         @click="router.push('/retirement/resign-employee')"
       />
       รายละเอียดการยกเลิกลาออก
-      {{ dataDetail.prefix.dataDetail.firstName + "  " + dataDetail.lastName }}
+      {{
+        dataDetail.prefix + dataDetail.firstName + "  " + dataDetail.lastName
+      }}
     </div>
 
     <CardProfile :type="'employee'" :data="dataProfile as DataProfile" />
@@ -499,39 +440,6 @@ onMounted(async () => {
     <q-card bordered class="row col-12 text-dark q-mt-sm">
       <div class="bg-grey-1 q-pa-sm col-12 row items-center text-primary">
         <div class="q-pl-sm text-weight-bold text-dark">ข้อมูลการลาออก</div>
-        <!-- <q-space />
-        <div
-          class="q-gutter-x-sm"
-          v-if="
-            (roleUser === 'officer' && dataDetail.officerReject === null) ||
-            (roleUser === 'commander' &&
-              dataDetail.commanderReject === null &&
-              dataDetail.officerReject !== null) ||
-            (roleUser === 'oligarch' &&
-              dataDetail.oligarchReject === null &&
-              dataDetail.commanderReject !== null &&
-              dataDetail.officerReject !== null)
-          "
-        >
-          <q-btn
-            outline
-            color="primary"
-            dense
-            icon-right="check"
-            class="q-px-sm"
-            label="อนุญาต"
-            @click="popUp('pass')"
-          />
-          <q-btn
-            outline
-            color="red"
-            dense
-            icon-right="close"
-            class="q-px-sm"
-            label="ยับยั้ง"
-            @click="popUp('passNot')"
-          />
-        </div> -->
       </div>
       <div class="col-12"><q-separator /></div>
       <div class="row col-12 q-pa-md">
@@ -579,6 +487,15 @@ onMounted(async () => {
               </div>
             </div>
           </div>
+
+          <div class="col-12 row items-start">
+            <div class="col-12">
+              <div class="col-12 text-top">เหตุผลการขอยกเลิก</div>
+              <div class="col-12 text-detail text-red">
+                {{ dataDetail.cancelReason }}
+              </div>
+            </div>
+          </div>
         </div>
       </div>
     </q-card>
@@ -590,7 +507,7 @@ onMounted(async () => {
           ผลการพิจารณาของผู้บังคับบัญชา
         </div>
         <q-btn
-          v-if="statusCheck == 'WAITTING' && (isOfficer || isStaff)"
+          v-if="!checkRoutePermisson && isStaff && approveStep === 'st1'"
           flat
           round
           icon="add"
@@ -602,33 +519,6 @@ onMounted(async () => {
           <q-tooltip>เพิ่มรายชื่อผู้บังคับบัญชา</q-tooltip>
         </q-btn>
         <q-space />
-        <!-- <div
-          class="q-gutter-x-sm"
-          v-if="
-            isDirector &&
-            dataDetail.commanderReject === null &&
-            dataDetail.statusMain === 'WAITTING'
-          "
-        >
-          <q-btn
-            outline
-            color="primary"
-            dense
-            icon-right="check"
-            class="q-px-sm"
-            label="อนุญาต"
-            @click="popUp('pass', 'commander')"
-          />
-          <q-btn
-            outline
-            color="red"
-            dense
-            icon-right="close"
-            class="q-px-sm"
-            label="ยับยั้ง"
-            @click="popUp('passNot', 'commander')"
-          />
-        </div> -->
       </div>
 
       <div class="col-12"><q-separator /></div>
@@ -659,25 +549,19 @@ onMounted(async () => {
                 </div>
                 <div v-else-if="col.name == 'comment'">
                   <div
+                    class="q-gutter-x-xs"
                     v-if="
                       props.row.approveStatus == 'PENDING' &&
-                      props.row.comment == ''
+                      props.row.comment == '' &&
+                      approveStep === 'st2'
                     "
                   >
                     <q-btn
-                      :disable="
-                        statusCheck == 'NEW' ||
-                        !approvePendingCheck ||
-                        (props.row.profileId !== keycloakId &&
-                          checkPermission($route)?.attrIsUpdate)
-                      "
-                      :outline="
-                        props.row.profileId !== keycloakId ||
-                        statusCheck == 'NEW' ||
-                        !approvePendingCheck
-                          ? false
-                          : true
+                      v-if="
+                        props.row.profileId === keycloakId &&
+                        approveStep === 'st2'
                       "
+                      outline
                       dense
                       color="primary"
                       icon-right="check"
@@ -686,24 +570,16 @@ onMounted(async () => {
                       @click="popUp('pass', 'commander')"
                     />
                     <q-btn
-                      :disable="
-                        statusCheck == 'NEW' ||
-                        !approvePendingCheck ||
-                        (props.row.profileId !== keycloakId &&
-                          checkPermission($route)?.attrIsUpdate)
-                      "
-                      :outline="
-                        props.row.profileId !== keycloakId ||
-                        statusCheck == 'NEW' ||
-                        !approvePendingCheck
-                          ? false
-                          : true
+                      v-if="
+                        props.row.profileId === keycloakId &&
+                        approveStep === 'st2'
                       "
+                      outline
                       color="red"
                       dense
                       icon-right="close"
                       class="q-px-sm"
-                      label="ยับยั้ง"
+                      label="ไม่อนุญาต"
                       @click="popUp('passNot', 'commander')"
                     />
                   </div>
@@ -714,7 +590,7 @@ onMounted(async () => {
                 <div v-else-if="col.name == 'approveStatus'">
                   {{
                     props.row.approveStatus
-                      ? convertStatusText(props.row.approveStatus)
+                      ? convertStatusText(props.row.approveStatus, "ไม่อนุญาต")
                       : "-"
                   }}
                 </div>
@@ -735,7 +611,8 @@ onMounted(async () => {
           ผลการพิจารณาของผู้มีอำนาจ
         </div>
         <q-btn
-          v-if="statusCheck == 'WAITTING' && (isOfficer || isStaff)"
+          q-btn
+          v-if="!checkRoutePermisson && isStaff && approveStep === 'st1'"
           flat
           round
           icon="add"
@@ -751,14 +628,11 @@ onMounted(async () => {
         <div
           class="q-gutter-x-sm"
           v-if="
-            checkPermission($route)?.attrIsUpdate &&
-            dataDetail.oligarchReject === null &&
-            dataDetail.statusMain === 'WAITTING' &&
             rowsApprover &&
             rowsApprover.approvers &&
             rowsApprover.approvers[0]?.profileId == keycloakId &&
             rowsApprover.approvers[0]?.approveStatus == 'PENDING' &&
-            approveCheck
+            approveStep === 'st3'
           "
         >
           <q-btn
@@ -776,7 +650,7 @@ onMounted(async () => {
             dense
             icon-right="close"
             class="q-px-sm"
-            label="ยับยั้ง"
+            label="ไม่อนุญาต"
             @click="popUp('passNot', 'oligarch')"
           />
         </div>
@@ -803,38 +677,36 @@ onMounted(async () => {
                 rowsApprover &&
                 rowsApprover.approvers &&
                 rowsApprover.approvers[0]?.approveStatus
-                  ? convertStatusText(rowsApprover?.approvers[0].approveStatus)
+                  ? convertStatusText(
+                      rowsApprover?.approvers[0].approveStatus,
+                      "ไม่อนุญาต"
+                    )
                   : "-"
               }}
             </div>
           </div>
-          <!-- <div class="col-xs-6 row items-start">
-            <div class="col-12 text-top">วันสุดท้ายที่ยับยั้ง</div>
-            <div class="col-12 text-detail">
-              {{
-                dataDetail.oligarchRejectDate !== null
-                  ? date2Thai(dataDetail.oligarchRejectDate)
-                  : "-"
-              }}
-            </div>
-          </div> -->
+
           <div class="col-xs-12 row items-start">
             <div class="col-12 text-top">ความคิดเห็นและเหตุผล</div>
             <div class="col-12 text-detail">
               {{
-                dataDetail.oligarchReject
-                  ? dataDetail.oligarchApproveReason
-                  : dataDetail.oligarchApproveReason
+                rowsApprover &&
+                rowsApprover.approvers &&
+                rowsApprover.approvers[0]?.comment
+                  ? rowsApprover?.approvers[0].comment
+                  : "-"
               }}
             </div>
           </div>
         </div>
       </div>
     </q-card>
+
+    <!-- ส่งไปพิจารณา -->
     <q-card
       bordered
       class="row col-12 text-dark q-mt-sm q-pa-sm"
-      v-if="statusCheck == 'WAITTING' && (isOfficer || isStaff)"
+      v-if="!checkRoutePermisson && isStaff && approveStep === 'st1'"
     >
       <q-btn
         @click="onSend"
@@ -848,6 +720,7 @@ onMounted(async () => {
         ><q-tooltip>คลิกเพื่อส่งไปพิจารณา</q-tooltip></q-btn
       >
     </q-card>
+
     <!-- แก้ไขข้อมูลเพื่อลงบัญชีแนบท้าย -->
     <q-card bordered class="row col-12 text-dark q-mt-sm">
       <q-form
@@ -863,11 +736,13 @@ onMounted(async () => {
           </div>
           <q-space />
           <!-- && workflowRef?.permission.isUpdate -->
+
           <div
             v-if="
               !checkRoutePermisson &&
-              isStaff &&
-              dataDetail.statusMain === 'WAITTING'
+              (dataDetail.status === 'APPROVE' ||
+                dataDetail.status === 'REJECT') &&
+              isStaff
             "
           >
             <div class="q-gutter-sm" v-if="!edit">
@@ -1093,20 +968,15 @@ onMounted(async () => {
         </div>
       </q-form>
     </q-card>
-    <!-- <WorkFlow
-      ref="workflowRef"
-      v-model:is-check-data="isCheckData"
-      :id="id"
-      sys-name="RETIREMENT_CANCEL"
-    /> -->
   </div>
 
+  <!-- pooup อนุญาตยกเลิกการลาออก -->
   <q-dialog v-model="modal" persistent>
     <q-card style="width: 800px">
       <q-form greedy @submit.prevent @validation-success="onSubmit">
         <DialogHeader
           :tittle="`${
-            actionPass ? 'อนุญาตยกเลิกการลาออก' : 'ยับยั้งยกเลิกการลาออก'
+            actionPass ? 'อนุญาตยกเลิกการลาออก' : 'ไม่อนุญาตยกเลิกการลาออก'
           }`"
           :close="closeModal"
         />
@@ -1118,7 +988,7 @@ onMounted(async () => {
               dense
               outlined
               lazy-rules
-              :rules="[(val:string) => !!val || 'กรุณากรอกความคิดเห็น/เหตุผล']"
+              :rules="  !actionPass ? [(val:string) => !!val || 'กรุณากรอกความคิดเห็น/เหตุผล'] :[]"
               v-model="reasonReign"
               :label="`${'กรอกความคิดเห็น/เหตุผล'}`"
               type="textarea"
@@ -1140,7 +1010,7 @@ onMounted(async () => {
   <DialogAddCommander
     v-model:modal="modalAdd"
     :type="typeAdd"
-    :profileType="'officer'"
+    :profileType="'-employee'"
     :get-data="fetchData"
     :id-check="idCheck"
     :keycloak-user-id="keycloakUserId"
diff --git a/src/modules/06_retirement/components/03_resignEmp/Table.vue b/src/modules/06_retirement/components/03_resignEmp/Table.vue
index 8b71f68d0..55d7c9c77 100644
--- a/src/modules/06_retirement/components/03_resignEmp/Table.vue
+++ b/src/modules/06_retirement/components/03_resignEmp/Table.vue
@@ -6,7 +6,11 @@ import { useRouter } from "vue-router";
 import { useCounterMixin } from "@/stores/mixin";
 import { useDataStore } from "@/modules/06_retirement/store/resignMain";
 import { useRetirementDataStore } from "@/modules/06_retirement/store/Main";
-import { checkPermission } from "@/utils/permissions";
+import {
+  checkPermission,
+  checkPermissionList,
+  checkPermissionCreate,
+} from "@/utils/permissions";
 import http from "@/plugins/http";
 import config from "@/app.config";
 
@@ -23,13 +27,8 @@ const stroeResign = useDataStore();
 const { statusText } = stroe;
 const router = useRouter();
 const mixin = useCounterMixin();
-const {
-  messageError,
-  date2Thai,
-  showLoader,
-  hideLoader,
-  onSearchDataTable
-} = mixin;
+const { messageError, date2Thai, showLoader, hideLoader, onSearchDataTable } =
+  mixin;
 
 /** Table */
 const rows = ref<ResponseItems[]>([]);
@@ -130,7 +129,9 @@ const columns = ref<QTableProps["columns"]>([
     sortable: true,
     field: "status",
     format(val, row) {
-      return statusText(row.status);
+      return stroeResign.mainTabs === "1"
+        ? statusText(row.status)
+        : statusText(row.status, "อนุญาต");
     },
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
@@ -291,7 +292,11 @@ onMounted(async () => {
           </q-select>
 
           <q-btn
-            v-if="checkPermission($route)?.attrIsUpdate"
+            v-if="
+              checkPermission($route)?.attrIsUpdate &&
+              checkPermissionList(['COMMAND']) &&
+              checkPermissionCreate('COMMAND')
+            "
             @click="openModalOrder"
             flat
             round
@@ -310,7 +315,7 @@ onMounted(async () => {
             ref="filterRef"
             outlined
             placeholder="ค้นหา"
-            @keydown.enter="onSearch"
+            @keydown.enter.prevent="onSearch"
           >
             <template v-slot:append>
               <q-icon name="search" />
diff --git a/src/modules/06_retirement/components/05_deceased/SendCircularPage.vue b/src/modules/06_retirement/components/05_deceased/SendCircularPage.vue
index 904f8957f..75b43cdb5 100644
--- a/src/modules/06_retirement/components/05_deceased/SendCircularPage.vue
+++ b/src/modules/06_retirement/components/05_deceased/SendCircularPage.vue
@@ -326,7 +326,7 @@ onMounted(async () => {
             outlined
             placeholder="ค้นหา"
             class="q-ml-sm"
-            @keydown.enter="onSearch"
+            @keydown.enter.prevent="onSearch"
           >
             <template v-slot:append>
               <q-icon name="search" />
diff --git a/src/modules/06_retirement/components/06_dismissOrder/DialogSendToCommand.vue b/src/modules/06_retirement/components/06_dismissOrder/DialogSendToCommand.vue
index 95419afff..3c4aca498 100644
--- a/src/modules/06_retirement/components/06_dismissOrder/DialogSendToCommand.vue
+++ b/src/modules/06_retirement/components/06_dismissOrder/DialogSendToCommand.vue
@@ -206,7 +206,7 @@ watchEffect(() => {
               dense
               v-model="filterKeyword"
               placeholder="ค้นหา"
-              @keydown.enter="onSearch"
+              @keydown.enter.prevent="onSearch"
             >
               <template v-slot:append>
                 <q-icon name="search" />
diff --git a/src/modules/06_retirement/components/06_dismissOrder/DialogSendToCommandEmp.vue b/src/modules/06_retirement/components/06_dismissOrder/DialogSendToCommandEmp.vue
index d69abcbf2..fa2c3d6be 100644
--- a/src/modules/06_retirement/components/06_dismissOrder/DialogSendToCommandEmp.vue
+++ b/src/modules/06_retirement/components/06_dismissOrder/DialogSendToCommandEmp.vue
@@ -206,7 +206,7 @@ watchEffect(() => {
               dense
               v-model="filterKeyword"
               placeholder="ค้นหา"
-              @keydown.enter="onSearch"
+              @keydown.enter.prevent="onSearch"
             >
               <template v-slot:append>
                 <q-icon name="search" />
diff --git a/src/modules/06_retirement/components/DialogAddCommander.vue b/src/modules/06_retirement/components/DialogAddCommander.vue
index 80455b16c..8feda4342 100644
--- a/src/modules/06_retirement/components/DialogAddCommander.vue
+++ b/src/modules/06_retirement/components/DialogAddCommander.vue
@@ -31,6 +31,8 @@ const {
 } = mixin;
 
 const pageId = ref<string>(route.params.id as string);
+const routeName = ref<string>(route?.name as string);
+
 const keyword = ref<string>("");
 const isAct = ref<boolean>(false);
 
@@ -114,6 +116,7 @@ async function getData() {
       keyword: keyword.value,
       isAct: isAct.value,
       keycloakId: props.keycloakUserId,
+      type: props.profileType === "officer" ? props.profileType : "employee",
     })
     .then(async (res) => {
       const data = res.data.result;
@@ -134,7 +137,7 @@ async function getData() {
 
 function onSubmit() {
   if (selected.value.length !== 0) {
-    dialogConfirm($q, () => {
+    dialogConfirm($q, async () => {
       if (props.keycloakUserId) {
         const body = selected.value.map((items: any, index: any) => ({
           seq: index,
@@ -146,26 +149,36 @@ function onSubmit() {
           keycloakId: items.keycloakId,
         }));
         showLoader();
-        http
-          .post(
-            config.API.addResign(
-              (props.profileType?.toLocaleLowerCase() as string) == "officer"
-                ? ""
-                : "-employee",
-              props.type?.toLocaleLowerCase() as string,
-              pageId.value
-            ),
-            body
-          )
-          .then((res) => {
+        const profileSuffix =
+          (props.profileType?.toLocaleLowerCase() as string) === "officer"
+            ? ""
+            : "-employee";
+
+        const apiEndpoint =
+          routeName.value === "resignReject" || routeName.value === "resignRejectEMP"
+            ? config.API.addResignCancel(
+                profileSuffix,
+                props.type?.toLocaleLowerCase() as string,
+                pageId.value
+              )
+            : config.API.addResign(
+                profileSuffix,
+                props.type?.toLocaleLowerCase() as string,
+                pageId.value
+              );
+        await http
+          .post(apiEndpoint, body)
+          .then(async () => {
+            await props.getData?.(pageId.value);
             closeDialog();
             success($q, "บันทึกสำเร็จ");
-            props.getData?.(pageId.value);
           })
           .catch((e) => {
             messageError($q, e);
           })
-          .finally(() => {});
+          .finally(() => {
+            hideLoader();
+          });
       } else {
         closeDialog();
       }
@@ -179,6 +192,7 @@ function closeDialog() {
   modal.value = false;
   rows.value = [];
   selected.value = [];
+  keyword.value = "";
 }
 
 watch(
diff --git a/src/modules/06_retirement/store/Main.ts b/src/modules/06_retirement/store/Main.ts
index 5115fef89..d131253ad 100644
--- a/src/modules/06_retirement/store/Main.ts
+++ b/src/modules/06_retirement/store/Main.ts
@@ -1,16 +1,16 @@
 import { defineStore } from "pinia";
 
 export const useRetirementDataStore = defineStore("retirement", () => {
-  const statusText = (val: string) => {
+  const statusText = (val: string, rejectText: string = "อนุมัติ") => {
     switch (val) {
       case "WAITTING":
         return "ใหม่";
       case "PENDING":
         return "รอดำเนินการ";
       case "APPROVE":
-        return "อนุมัติ";
+        return rejectText;
       case "REJECT":
-        return "ไม่อนุมัติ";
+        return `ไม่${rejectText}`;
       case "REPORT":
         return "ส่งรายชื่อไปออกคำสั่ง";
       case "WAITING":
@@ -18,29 +18,31 @@ export const useRetirementDataStore = defineStore("retirement", () => {
       case "DONE":
         return "ออกคำสั่งเสร็จสิ้น";
       case "DONECANCEL":
-        return "ยกเลิกการลาออก";
+        return "ยกเลิกการลาออกสำเร็จ";
       case "CANCEL":
-        return "ยกเลิกการลาออก";
+        return "ยกเลิกการลาออกสำเร็จ";
       case "DONEREJECT":
         return "ออกคำสั่งยกเลิกลาออกเสร็จแล้ว";
+      case "CANCELING":
+        return "กำลังดำเนินการยกเลิก";
       default:
         return "-";
     }
   };
 
-  function convertStatusText(val: string) {
+  function convertStatusText(val: string, rejectText: string = "ไม่อนุมัติ") {
     switch (val) {
       case "PENDING":
         return "รอดำเนินการ";
       case "APPROVE":
         return "อนุญาต";
       case "REJECT":
-        return "ยับยั้ง";
+        return rejectText;
     }
   }
 
   return {
     statusText,
-    convertStatusText
+    convertStatusText,
   };
 });
diff --git a/src/modules/06_retirement/store/resignMain.ts b/src/modules/06_retirement/store/resignMain.ts
index 3ab0dcc5d..0ccfb3123 100644
--- a/src/modules/06_retirement/store/resignMain.ts
+++ b/src/modules/06_retirement/store/resignMain.ts
@@ -18,7 +18,7 @@ export const useDataStore = defineStore("resign", () => {
       group: "1",
     },
     {
-      name: "อนุมัติแล้ว",
+      name: "อนุมัติ/ยับยั้ง",
       value: "APPROVE",
       group: "1",
     },
@@ -37,9 +37,13 @@ export const useDataStore = defineStore("resign", () => {
       value: "DONE",
       group: "1",
     },
-
     {
-      name: "ยกเลิกลาออก",
+      name: "กำลังดำเนินการยกเลิก",
+      value: "CANCELING",
+      group: "1",
+    },
+    {
+      name: "ยกเลิกลาออกสำเร็จ",
       value: "CANCEL",
       group: "1",
     },
@@ -54,7 +58,7 @@ export const useDataStore = defineStore("resign", () => {
       group: "2",
     },
     {
-      name: "อนุมัติแล้ว",
+      name: "อนุญาต/ไม่อนุญาต",
       value: "APPROVE",
       group: "2",
     },
diff --git a/src/modules/06_retirement/views/01_retirement.vue b/src/modules/06_retirement/views/01_retirement.vue
index 72b56a7b3..60007ace4 100644
--- a/src/modules/06_retirement/views/01_retirement.vue
+++ b/src/modules/06_retirement/views/01_retirement.vue
@@ -321,7 +321,7 @@ onMounted(async () => {
                 ref="filterRef"
                 outlined
                 placeholder="ค้นหา"
-                @keydown.enter="onSearch"
+                @keydown.enter.prevent="onSearch"
               >
                 <template v-slot:append>
                   <q-icon name="search" />
diff --git a/src/modules/06_retirement/views/04_exitInterview.vue b/src/modules/06_retirement/views/04_exitInterview.vue
index 0f2a6d4dd..93d7f746a 100644
--- a/src/modules/06_retirement/views/04_exitInterview.vue
+++ b/src/modules/06_retirement/views/04_exitInterview.vue
@@ -328,7 +328,7 @@ onMounted(async () => {
               ref="filterRef"
               outlined
               placeholder="ค้นหา"
-              @keydown.enter="onSearch"
+              @keydown.enter.prevent="onSearch"
             >
               <template v-slot:append>
                 <q-icon name="search" />
diff --git a/src/modules/06_retirement/views/05_deceased.vue b/src/modules/06_retirement/views/05_deceased.vue
index ebbfca1ec..0b0fd0d22 100644
--- a/src/modules/06_retirement/views/05_deceased.vue
+++ b/src/modules/06_retirement/views/05_deceased.vue
@@ -231,7 +231,7 @@ onMounted(() => {
               ref="filterRef"
               outlined
               placeholder="ค้นหา"
-              @keydown.enter="onSearch"
+              @keydown.enter.prevent="onSearch"
             >
               <template v-slot:append>
                 <q-icon name="search" />
diff --git a/src/modules/06_retirement/views/06_dismissOrder.vue b/src/modules/06_retirement/views/06_dismissOrder.vue
index 25c4a78c6..5c18462c6 100644
--- a/src/modules/06_retirement/views/06_dismissOrder.vue
+++ b/src/modules/06_retirement/views/06_dismissOrder.vue
@@ -7,7 +7,11 @@ import { useRouter } from "vue-router";
 import http from "@/plugins/http";
 import config from "@/app.config";
 import { useCounterMixin } from "@/stores/mixin";
-import { checkPermission } from "@/utils/permissions";
+import {
+  checkPermission,
+  checkPermissionList,
+  checkPermissionCreate,
+} from "@/utils/permissions";
 import { useTransferDataStore } from "@/modules/05_placement/store";
 
 import type { DataOption } from "@/modules/06_retirement/interface/index/Main";
@@ -259,7 +263,11 @@ onMounted(async () => {
             </q-select>
           </div>
           <q-btn
-            v-if="checkPermission($route)?.attrIsUpdate"
+            v-if="
+              checkPermission($route)?.attrIsUpdate &&
+              checkPermissionList(['COMMAND']) &&
+              checkPermissionCreate('COMMAND')
+            "
             @click="openModalOrder"
             size="14px"
             flat
@@ -278,7 +286,7 @@ onMounted(async () => {
               v-model="filterKeyword"
               outlined
               placeholder="ค้นหา"
-              @keydown.enter="onSearch"
+              @keydown.enter.prevent="onSearch"
             >
               <template v-slot:append>
                 <q-icon name="search" />
diff --git a/src/modules/06_retirement/views/08_dismissOrderEmp.vue b/src/modules/06_retirement/views/08_dismissOrderEmp.vue
index 0b0d5174b..fc0a7bdde 100644
--- a/src/modules/06_retirement/views/08_dismissOrderEmp.vue
+++ b/src/modules/06_retirement/views/08_dismissOrderEmp.vue
@@ -7,7 +7,11 @@ import { useRouter } from "vue-router";
 import http from "@/plugins/http";
 import config from "@/app.config";
 import { useCounterMixin } from "@/stores/mixin";
-import { checkPermission } from "@/utils/permissions";
+import {
+  checkPermission,
+  checkPermissionList,
+  checkPermissionCreate,
+} from "@/utils/permissions";
 import { useTransferDataStore } from "@/modules/05_placement/store";
 
 import type { DataOption } from "@/modules/06_retirement/interface/index/Main";
@@ -261,7 +265,11 @@ onMounted(async () => {
             </q-select>
           </div>
           <q-btn
-            v-if="checkPermission($route)?.attrIsUpdate"
+            v-if="
+              checkPermission($route)?.attrIsUpdate &&
+              checkPermissionList(['COMMAND']) &&
+              checkPermissionCreate('COMMAND')
+            "
             @click="openModalOrder"
             size="14px"
             flat
@@ -281,7 +289,7 @@ onMounted(async () => {
               v-model="filterKeyword"
               outlined
               placeholder="ค้นหา"
-              @keydown.enter="onSearch"
+              @keydown.enter.prevent="onSearch"
             >
               <template v-slot:append>
                 <q-icon name="search" />
diff --git a/src/modules/07_insignia/components/1_Round/DialogDetail.vue b/src/modules/07_insignia/components/1_Round/DialogDetail.vue
index e603bebdd..e60d7da40 100644
--- a/src/modules/07_insignia/components/1_Round/DialogDetail.vue
+++ b/src/modules/07_insignia/components/1_Round/DialogDetail.vue
@@ -527,7 +527,7 @@ watch(
                           lazy-rules
                           label="คำค้น"
                           hide-bottom-space
-                          @keydown.enter="fetchDataPos()"
+                          @keydown.enter.prevent="fetchDataPos()"
                         >
                           <template v-slot:append>
                             <q-icon
diff --git a/src/modules/07_insignia/components/2_Manage/InfoAssessments.vue b/src/modules/07_insignia/components/2_Manage/InfoAssessments.vue
index 1d7af73b3..e4dd6ba8f 100644
--- a/src/modules/07_insignia/components/2_Manage/InfoAssessments.vue
+++ b/src/modules/07_insignia/components/2_Manage/InfoAssessments.vue
@@ -174,7 +174,7 @@ onMounted(() => {
         v-model="keyword"
         label="ค้นหา"
         class="q-mr-sm"
-        @keydown.enter="onSearch"
+        @keydown.enter.prevent="onSearch"
       >
         <template v-slot:append>
           <q-icon name="search" />
diff --git a/src/modules/07_insignia/components/2_Manage/InfoInsignia.vue b/src/modules/07_insignia/components/2_Manage/InfoInsignia.vue
index 501794752..1980043e6 100644
--- a/src/modules/07_insignia/components/2_Manage/InfoInsignia.vue
+++ b/src/modules/07_insignia/components/2_Manage/InfoInsignia.vue
@@ -269,7 +269,7 @@ onMounted(async () => {
         v-model="keyword"
         label="ค้นหา"
         class="q-mr-sm"
-        @keydown.enter="onSearch"
+        @keydown.enter.prevent="onSearch"
       >
         <template v-slot:append>
           <q-icon name="search" />
diff --git a/src/modules/07_insignia/components/2_Manage/Tab1.vue b/src/modules/07_insignia/components/2_Manage/Tab1.vue
index c022c0c1c..1c069dc0e 100644
--- a/src/modules/07_insignia/components/2_Manage/Tab1.vue
+++ b/src/modules/07_insignia/components/2_Manage/Tab1.vue
@@ -144,15 +144,15 @@ const columns = ref<QTableProps["columns"]>([
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
   },
-  {
-    name: "employeeType",
-    align: "left",
-    label: "ประเภทตำแหน่ง",
-    sortable: true,
-    field: "employeeType",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
+  // {
+  //   name: "employeeType",
+  //   align: "left",
+  //   label: "ประเภทตำแหน่ง",
+  //   sortable: true,
+  //   field: "employeeType",
+  //   headerStyle: "font-size: 14px",
+  //   style: "font-size: 14px",
+  // },
   {
     name: "position",
     align: "left",
@@ -375,7 +375,7 @@ async function fecthlistperson() {
   http
     .get(
       config.API.registryNewOtherSystem(
-        employeeType.value == "officer" ? `` : `-employee`
+        DataStore.employeeClass == "officer" ? `` : `-employee`
       ),
       {
         params: { ...formFilter, nodeId: organization.value },
@@ -501,8 +501,7 @@ async function downloadFileexcel() {
     .put(
       config.API.insigniaDowanload(DataStore.requestId),
       {
-        profileType:
-          DataStore.employeeClass == "all" ? null : DataStore.employeeClass,
+        profileType: DataStore.employeeClass,
         InsigniaId:
           DataStore.typeinsignia == "all"
             ? null
@@ -782,32 +781,32 @@ function clickCloseReson() {
   dialogNote.value = false;
 }
 
-/**
- * function แสดงแจ้งเตือน
- * @param markDiscipline มีโทษทางวินัย
- * @param markLeave ไม่ได้เลื่อนเงินเดือน/ไม่ได้เลื่อนขั้น เนื่องจากลาเกิน
- * @param markRate ผลการประเมินการปฏิบัติราชการในรอบ 5 ปี ต่ำกว่าระดับดี (น้อยกว่าร้อยละ 70)
- */
-function clickShowWarn(
-  markDiscipline: boolean,
-  markLeave: boolean,
-  markRate: boolean
-) {
-  checkboxData.value = [
-    { id: 1, name: "มีโทษทางวินัย", val: markDiscipline },
-    {
-      id: 2,
-      name: "ไม่ได้เลื่อนเงินเดือน/ไม่ได้เลื่อนขั้น เนื่องจากลาเกิน",
-      val: markLeave,
-    },
-    {
-      id: 3,
-      name: "ผลการประเมินการปฏิบัติราชการในรอบ 5 ปี ต่ำกว่าระดับดี (น้อยกว่าร้อยละ 70)",
-      val: markRate,
-    },
-  ];
-  dialogWarn.value = true;
-}
+// /**
+//  * function แสดงแจ้งเตือน
+//  * @param markDiscipline มีโทษทางวินัย
+//  * @param markLeave ไม่ได้เลื่อนเงินเดือน/ไม่ได้เลื่อนขั้น เนื่องจากลาเกิน
+//  * @param markRate ผลการประเมินการปฏิบัติราชการในรอบ 5 ปี ต่ำกว่าระดับดี (น้อยกว่าร้อยละ 70)
+//  */
+// function clickShowWarn(
+//   markDiscipline: boolean,
+//   markLeave: boolean,
+//   markRate: boolean
+// ) {
+//   checkboxData.value = [
+//     { id: 1, name: "มีโทษทางวินัย", val: markDiscipline },
+//     {
+//       id: 2,
+//       name: "ไม่ได้เลื่อนเงินเดือน/ไม่ได้เลื่อนขั้น เนื่องจากลาเกิน",
+//       val: markLeave,
+//     },
+//     {
+//       id: 3,
+//       name: "ผลการประเมินการปฏิบัติราชการในรอบ 5 ปี ต่ำกว่าระดับดี (น้อยกว่าร้อยละ 70)",
+//       val: markRate,
+//     },
+//   ];
+//   dialogWarn.value = true;
+// }
 
 /**
  * function ค้นหาข้อมูล option
@@ -842,10 +841,11 @@ function clearInsigniaFilters(name: string) {
   if (name === "typeinsigniaOptions") {
     DataStore.typeinsignia = "all";
     typeinsigniaOptions.value = DataStore.typeinsigniaOptions;
-  } else if (name === "employeeClassOps") {
-    DataStore.employeeClass = "all";
-    employeeClassOps.value = DataStore.employeeClassOps;
   }
+  // else if (name === "employeeClassOps") {
+  //   DataStore.employeeClass = "all";
+  //   employeeClassOps.value = DataStore.employeeClassOps;
+  // }
 }
 
 watch(
@@ -954,7 +954,7 @@ onMounted(async () => {
           ref="filterRef"
           outlined
           placeholder="ค้นหา"
-          @keydown.enter="onSearch"
+          @keydown.enter.prevent="onSearch"
         >
           <template v-slot:append>
             <q-icon name="search" />
@@ -1026,7 +1026,7 @@ onMounted(async () => {
               </q-item>
             </template>
           </q-select>
-          <q-select
+          <!-- <q-select
             v-model="DataStore.employeeClass"
             dense
             outlined
@@ -1072,15 +1072,12 @@ onMounted(async () => {
                 <q-item-section class="text-grey"> ไม่มีข้อมูล </q-item-section>
               </q-item>
             </template>
-          </q-select>
+          </q-select> -->
           <q-space />
           <div>
             <q-btn
               v-if="checkPermission($route)?.attrIsGet"
-              :disable="
-                DataStore.employeeClass === 'all' ||
-                DataStore.typeinsignia === 'all'
-              "
+              :disable="DataStore.typeinsignia === 'all'"
               icon="mdi-download"
               flat
               round
@@ -1089,6 +1086,7 @@ onMounted(async () => {
             >
               <q-tooltip>ดาวน์โหลด</q-tooltip>
             </q-btn>
+
             <q-btn
               flat
               round
@@ -1096,10 +1094,10 @@ onMounted(async () => {
               icon="mdi-plus"
               @click="clickmodalAdd"
               v-if="
-                (DataStore.isLock == false &&
-                  DataStore.requestStatus == 'st5' &&
-                  DataStore.isOfficer) ||
-                (checkStatus == true && checkPermission($route)?.attrIsCreate)
+                DataStore.isLock == false &&
+                checkPermission($route)?.attrIsCreate &&
+                ((DataStore.requestStatus == 'st5' && DataStore.isOfficer) ||
+                  checkStatus == true)
               "
             >
               <q-tooltip>เพิ่ม</q-tooltip>
@@ -1330,11 +1328,14 @@ onMounted(async () => {
               </q-td> -->
               <q-td key="discipline" class="text-center">
                 <q-btn
-                  v-if="checkPermission($route)?.attrIsGet"
+                  v-if="
+                    checkPermission($route)?.attrIsGet &&
+                    props.row.markDiscipline
+                  "
                   flat
                   dense
                   icon="info"
-                  color="info"
+                  color="red"
                   @click.pervent="
                     onClickViewInfo(
                       'discipline',
@@ -1344,14 +1345,17 @@ onMounted(async () => {
                   "
                 >
                 </q-btn>
+                <div v-else>-</div>
               </q-td>
               <q-td key="leave" class="text-center">
                 <q-btn
-                  v-if="checkPermission($route)?.attrIsGet"
+                  v-if="
+                    checkPermission($route)?.attrIsGet && props.row.markLeave
+                  "
                   flat
                   dense
                   icon="info"
-                  color="info"
+                  color="red"
                   @click.pervent="
                     onClickViewInfo(
                       'leave',
@@ -1361,11 +1365,14 @@ onMounted(async () => {
                   "
                 >
                 </q-btn>
+                <div v-else>-</div>
               </q-td>
               <q-td key="assessments" class="text-center">
                 <!-- ผลการประเมินการปฏิบัติราชการในรอบ 5 ปี ต่ำกว่าระดับดี (น้อยกว่าร้อยละ 70) -->
                 <q-btn
-                  v-if="checkPermission($route)?.attrIsGet"
+                  v-if="
+                    checkPermission($route)?.attrIsGet && props.row.markRate
+                  "
                   flat
                   dense
                   icon="info"
@@ -1379,10 +1386,13 @@ onMounted(async () => {
                   "
                 >
                 </q-btn>
+                <div v-else>-</div>
               </q-td>
               <q-td key="insignia" class="text-center">
                 <q-btn
-                  v-if="checkPermission($route)?.attrIsGet"
+                  v-if="
+                    checkPermission($route)?.attrIsGet && props.row.markInsignia
+                  "
                   flat
                   dense
                   icon="info"
@@ -1396,6 +1406,7 @@ onMounted(async () => {
                   "
                 >
                 </q-btn>
+                <div v-else>-</div>
               </q-td>
             </q-tr>
           </template>
@@ -1415,7 +1426,7 @@ onMounted(async () => {
           <div class="col-xs-12 col-sm-7">
             <q-card flat bordered class="fit q-pa-sm">
               <div class="row q-col-gutter-sm q-mb-sm">
-                <div class="col-3">
+                <!-- <div class="col-3">
                   <q-select
                     outlined
                     dense
@@ -1429,7 +1440,7 @@ onMounted(async () => {
                     @update:model-value="clearForm(), fecthlistperson()"
                   >
                   </q-select>
-                </div>
+                </div> -->
                 <div class="col-3">
                   <q-select
                     dense
@@ -1451,7 +1462,9 @@ onMounted(async () => {
                   dense
                   placeholder="ค้นหา"
                   v-model="formFilter.searchKeyword"
-                  @keydown.enter="(formFilter.page = 1), fecthlistperson()"
+                  @keydown.enter.prevent="
+                    (formFilter.page = 1), fecthlistperson()
+                  "
                 >
                   <template v-slot:append>
                     <q-icon name="search" />
diff --git a/src/modules/07_insignia/components/2_Manage/Tab2.vue b/src/modules/07_insignia/components/2_Manage/Tab2.vue
index dcd530901..74a46fb24 100644
--- a/src/modules/07_insignia/components/2_Manage/Tab2.vue
+++ b/src/modules/07_insignia/components/2_Manage/Tab2.vue
@@ -67,15 +67,15 @@ const columns = ref<QTableProps["columns"]>([
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
   },
-  {
-    name: "employeeType",
-    align: "left",
-    label: "ประเภทตำแหน่ง",
-    sortable: true,
-    field: "employeeType",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
+  // {
+  //   name: "employeeType",
+  //   align: "left",
+  //   label: "ประเภทตำแหน่ง",
+  //   sortable: true,
+  //   field: "employeeType",
+  //   headerStyle: "font-size: 14px",
+  //   style: "font-size: 14px",
+  // },
   {
     name: "position",
     align: "left",
@@ -253,7 +253,7 @@ function clearInsigniaFilters(name: string) {
     DataStore.typeinsignia = "all";
     typeinsigniaOptions.value = DataStore.typeinsigniaOptions;
   } else if (name === "employeeClassOps") {
-    DataStore.employeeClass = "all";
+    // DataStore.employeeClass = "all";
     employeeClassOps.value = DataStore.employeeClassOps;
   }
 }
@@ -334,7 +334,7 @@ watch(
           ref="filterRef"
           outlined
           placeholder="ค้นหา"
-          @keydown.enter="onSearch"
+          @keydown.enter.prevent="onSearch"
         >
           <template v-slot:append>
             <q-icon name="search" />
@@ -405,7 +405,7 @@ watch(
               </q-item>
             </template>
           </q-select>
-          <q-select
+          <!-- <q-select
             v-model="DataStore.employeeClass"
             dense
             outlined
@@ -451,7 +451,7 @@ watch(
                 <q-item-section class="text-grey"> ไม่มีข้อมูล </q-item-section>
               </q-item>
             </template>
-          </q-select>
+          </q-select> -->
         </div>
       </q-card>
       <div class="col-12 q-pt-sm">
diff --git a/src/modules/07_insignia/components/2_Manage/Tab3.vue b/src/modules/07_insignia/components/2_Manage/Tab3.vue
index 2654f15b1..032d09c74 100644
--- a/src/modules/07_insignia/components/2_Manage/Tab3.vue
+++ b/src/modules/07_insignia/components/2_Manage/Tab3.vue
@@ -68,15 +68,15 @@ const columns = ref<QTableProps["columns"]>([
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
   },
-  {
-    name: "employeeType",
-    align: "left",
-    label: "ประเภทตำแหน่ง",
-    sortable: true,
-    field: "employeeType",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
+  // {
+  //   name: "employeeType",
+  //   align: "left",
+  //   label: "ประเภทตำแหน่ง",
+  //   sortable: true,
+  //   field: "employeeType",
+  //   headerStyle: "font-size: 14px",
+  //   style: "font-size: 14px",
+  // },
   {
     name: "position",
     align: "left",
@@ -254,10 +254,11 @@ function clearInsigniaFilters(name: string) {
   if (name === "typeinsigniaOptions") {
     DataStore.typeinsignia = "all";
     typeinsigniaOptions.value = DataStore.typeinsigniaOptions;
-  } else if (name === "employeeClassOps") {
-    DataStore.employeeClass = "all";
-    employeeClassOps.value = DataStore.employeeClassOps;
   }
+  // else if (name === "employeeClassOps") {
+  //   DataStore.employeeClass = "all";
+  //   employeeClassOps.value = DataStore.employeeClassOps;
+  // }
 }
 
 function onSearch() {
@@ -337,7 +338,7 @@ onMounted(async () => {
           ref="filterRef"
           outlined
           placeholder="ค้นหา"
-          @keydown.enter="onSearch"
+          @keydown.enter.prevent="onSearch"
         >
           <template v-slot:append>
             <q-icon name="search" />
@@ -406,7 +407,7 @@ onMounted(async () => {
               </q-item>
             </template>
           </q-select>
-          <q-select
+          <!-- <q-select
             v-model="DataStore.employeeClass"
             dense
             outlined
@@ -450,7 +451,7 @@ onMounted(async () => {
                 <q-item-section class="text-grey"> ไม่มีข้อมูล </q-item-section>
               </q-item>
             </template>
-          </q-select>
+          </q-select> -->
         </div>
       </q-card>
       <div class="col-12 q-pt-sm">
diff --git a/src/modules/07_insignia/components/2_Manage/Tab4.vue b/src/modules/07_insignia/components/2_Manage/Tab4.vue
index 3e7637cb7..d8ed73741 100644
--- a/src/modules/07_insignia/components/2_Manage/Tab4.vue
+++ b/src/modules/07_insignia/components/2_Manage/Tab4.vue
@@ -63,7 +63,7 @@ const pagination = ref({
 async function fecthOrg() {
   showLoader();
   await http
-    .get(config.API.insigniaNosend(props.roundId))
+    .get(config.API.insigniaNosend(props.roundId, DataStore.employeeClass))
     .then((res) => {
       let data = res.data.result;
       rows.value = data.map((e: ResponseNoSend) => ({
diff --git a/src/modules/07_insignia/components/3_result/DialogResults.vue b/src/modules/07_insignia/components/3_result/DialogResults.vue
index 928aba2d2..1e5ea5c12 100644
--- a/src/modules/07_insignia/components/3_result/DialogResults.vue
+++ b/src/modules/07_insignia/components/3_result/DialogResults.vue
@@ -171,7 +171,7 @@ function findlist(id: string = "", idCard: string) {
 function fectDataByid(id: string) {
   showLoader();
   if (props.profileType !== undefined) {
-    employeeClass.value = "officer";
+    employeeClass.value = props.profileType;
   }
   http
     .get(config.API.noteByid(id))
@@ -291,7 +291,7 @@ function classInput(val: boolean) {
 watch(props, () => {
   if (props.modal === true) {
     filterinsigniaOp2.value = DataStore.insigniaOp2;
-    employeeClass.value = "";
+    employeeClass.value = props.profileType || "";
     cardid.value = "";
     fullName.value = "";
     position.value = "";
@@ -335,9 +335,6 @@ watch(props, () => {
           <div class="row col-12 q-col-gutter-x-xs q-col-gutter-y-xs">
             <div class="col-4">
               <q-select
-                :rules="[
-                  (val:string) => !!val || 'กรุณาเลือก  ขรก.สามัญ/ลูกจ้างประจำ',
-                ]"
                 hide-bottom-space
                 :options="employeeClassOps"
                 dense
@@ -348,9 +345,9 @@ watch(props, () => {
                 map-options
                 outlined
                 v-model="employeeClass"
-                :label="`ขรก.สามัญ/ลูกจ้างประจำ`"
+                label="ประเภทตำแหน่ง"
                 @update:model-value="selectType"
-                :class="classInput(status !== '')"
+                disable
                 :readonly="status !== ''"
                 lazy-rules
               />
@@ -383,7 +380,7 @@ watch(props, () => {
                 label="เลขประจำตัวประชาชน"
                 maxlength="13"
                 mask="#############"
-                @keyup="searchcardid"
+                @change="searchcardid"
               />
             </div>
 
diff --git a/src/modules/07_insignia/interface/response/Main.ts b/src/modules/07_insignia/interface/response/Main.ts
index 320f2b07a..48992c5ef 100644
--- a/src/modules/07_insignia/interface/response/Main.ts
+++ b/src/modules/07_insignia/interface/response/Main.ts
@@ -60,6 +60,7 @@ interface ResponseInsigniaType {
 }
 
 interface ResponseRecordLists {
+  profileId?: string;
   address: string;
   citizenId: string;
   date: Date;
@@ -128,6 +129,7 @@ interface ResponseManageList {
   markDiscipline: boolean;
   markLeave: boolean;
   markRate: boolean;
+  markInsignia: boolean;
   posNo: string;
   position: string;
   profileId: string;
diff --git a/src/modules/07_insignia/router.ts b/src/modules/07_insignia/router.ts
index c82452d03..6df25fbcf 100644
--- a/src/modules/07_insignia/router.ts
+++ b/src/modules/07_insignia/router.ts
@@ -30,6 +30,12 @@ const report_02 = () =>
 const ReclaimMain = () =>
   import("@/modules/07_insignia/views/07_ReclaimMain.vue");
 
+//  รายชื่อลูกจ้างประจำ ที่มีสิทธิ์ยื่นขอพระราชทานเครื่องราชอิสริยาภรณ์
+const ManageEmpMain = () =>
+  import("@/modules/07_insignia/views/08_ManageEmpMain.vue");
+const RecordInsigniaEmp = () =>
+  import("@/modules/07_insignia/views/09_ResultMainEmp.vue");
+
 export default [
   {
     path: "/insignia/round",
@@ -124,4 +130,24 @@ export default [
       Role: "STAFF",
     },
   },
+  {
+    path: "/insignia/manage-emp/list-manage",
+    name: "insigniaManageEmp",
+    component: ManageEmpMain,
+    meta: {
+      Auth: true,
+      Key: "SYS_INSIGNIA_MANAGE_EMP",
+      Role: "STAFF",
+    },
+  },
+  {
+    path: "/insignia/record-emp",
+    name: "insigniaRecordEmp",
+    component: RecordInsigniaEmp,
+    meta: {
+      Auth: true,
+      Key: "SYS_INSIGNIA_RECORD_EMP",
+      Role: "STAFF",
+    },
+  },
 ];
diff --git a/src/modules/07_insignia/store.ts b/src/modules/07_insignia/store.ts
index c1b8892f5..3faa8e98e 100644
--- a/src/modules/07_insignia/store.ts
+++ b/src/modules/07_insignia/store.ts
@@ -37,11 +37,11 @@ export const useInsigniaDataStore = defineStore("insignia", () => {
   const typeinsigniaOptions = ref<OptionData[]>([
     { id: "all", name: "ทั้งหมด" },
   ]);
-  const employeeClass = ref<string>("all");
+  const employeeClass = ref<string>("officer");
   const employeeClassOps = ref<OptionData[]>([
-    { name: "ทั้งหมด", id: "all" },
+    // { name: "ทั้งหมด", id: "all" },
     { name: "ข้าราชการ กทม.สามัญ", id: "officer" },
-    { name: "ลูกจ้างประจำ", id: "perm" },
+    { name: "ลูกจ้างประจำ", id: "employee" },
   ]);
 
   const isOfficer = ref<boolean>(false);
@@ -101,6 +101,7 @@ export const useInsigniaDataStore = defineStore("insignia", () => {
         markDiscipline: e.markDiscipline,
         markLeave: e.markLeave,
         markRate: e.markRate,
+        markInsignia: e.markInsignia,
         isApprove: e.isApprove,
         statusMark:
           e.markDiscipline === true ||
diff --git a/src/modules/07_insignia/storeBrrow.ts b/src/modules/07_insignia/storeBrrow.ts
index 65db6bb3f..528536c41 100644
--- a/src/modules/07_insignia/storeBrrow.ts
+++ b/src/modules/07_insignia/storeBrrow.ts
@@ -27,7 +27,7 @@ export const useBrrowDataStore = defineStore("insigniaBrrow", () => {
   const employeeClassOps = ref<OptionData[]>([
     { name: "ทั้งหมด", id: "all" },
     { name: "ข้าราชการ กทม.สามัญ", id: "officer" },
-    { name: "ลูกจ้างประจำ", id: "perm" },
+    { name: "ลูกจ้างประจำ", id: "employee" },
   ]);
   const type = ref<any[]>([]);
 
diff --git a/src/modules/07_insignia/storeReclaim.ts b/src/modules/07_insignia/storeReclaim.ts
index d758be103..d2abcda4a 100644
--- a/src/modules/07_insignia/storeReclaim.ts
+++ b/src/modules/07_insignia/storeReclaim.ts
@@ -10,7 +10,7 @@ export const useInsigniaReclaimStore = defineStore("insigniaReclaim", () => {
   const employeeClassData = ref<OptionData[]>([
     { name: "ทั้งหมด", id: "all" },
     { name: "ข้าราชการ กทม.สามัญ", id: "officer" },
-    { name: "ลูกจ้างประจำ", id: "perm" },
+    { name: "ลูกจ้างประจำ", id: "employee" },
   ]);
 
   return {
diff --git a/src/modules/07_insignia/storeResult.ts b/src/modules/07_insignia/storeResult.ts
index df90b2bee..c2bca8176 100644
--- a/src/modules/07_insignia/storeResult.ts
+++ b/src/modules/07_insignia/storeResult.ts
@@ -87,6 +87,7 @@ export const useResultDataStore = defineStore("insigniaResult", () => {
     rows.value = [];
     const alllist = await data.map((e: ResponseRecordLists) => ({
       id: e.id,
+      profileId: e.profileId,
       citizenId: e.citizenId,
       prefix: e.prefix,
       position: e.position,
diff --git a/src/modules/07_insignia/views/!08_ManageEmpMain.vue b/src/modules/07_insignia/views/!08_ManageEmpMain.vue
new file mode 100644
index 000000000..74a790bd8
--- /dev/null
+++ b/src/modules/07_insignia/views/!08_ManageEmpMain.vue
@@ -0,0 +1,192 @@
+<script setup lang="ts">
+import { useQuasar } from "quasar";
+import { onMounted, ref } from "vue";
+
+import http from "@/plugins/http";
+import config from "@/app.config";
+import { checkPermission } from "@/utils/permissions";
+import { useCounterMixin } from "@/stores/mixin";
+import { useRoleWorkflowDataStore } from "@/stores/roleWorkflow";
+
+/** import Type*/
+import type { DataStat } from "@/modules/07_insignia/interface/index/Main";
+import type { ResponsePeriod } from "@/modules/07_insignia/interface/response/Main";
+
+/**import Componrnts*/
+import cardTop from "@/modules/07_insignia/components/2_Manage/StatCard.vue"; // stat
+
+/**use  */
+const $q = useQuasar(); //ใช้ noti quasar
+const { fetchDataCheckIsoffice } = useRoleWorkflowDataStore();
+const { messageError, dialogConfirm, showLoader, hideLoader, success } =
+  useCounterMixin();
+
+//การเจ้าหน้าที่
+const isStaff = ref<boolean>(false);
+const isOfficer = ref<boolean>(false);
+const isDirector = ref<boolean>(false);
+const isDeputy = ref<boolean>(false);
+
+//ข้อมูล สถิติ
+const stat = ref<DataStat>({
+  allUserUser: 0,
+  orgAllCount: 0,
+  orgNoSendCount: 0,
+  orgSendCount: 0,
+});
+
+//ข้อมูลรอบการเสนอขอพระราชทานเครื่องราชอิสริยาภรณ์
+const round = ref<string>("");
+const optionRound = ref<
+  Array<{ id: number; year: string; name: string; period_revision: string }>
+>([]);
+
+/** ฟังก์ชันเรียกข้อมูลการเป็นเจ้าหน้าที่*/
+async function fetchCheckIsofficer() {
+  try {
+    const data = await fetchDataCheckIsoffice("SYS_INSIGNIA_MANAGE_EMP");
+    isStaff.value = data.isStaff;
+    // isStaff.value = true; // สำหรับการทดสอบ
+    isOfficer.value = data.isOfficer;
+    isDirector.value = data.isDirector;
+    isDeputy.value = data.isDeputy;
+  } catch (err) {
+    messageError($q, err);
+  }
+}
+
+/** ฟังก์ชันเรียกข้อมูลรอบการเสนอขอพระราชทานเครื่องราชอิสริยาภรณ์*/
+async function fecthRoundData() {
+  await http
+    .get(config.API.listRoundInsignia(), { params: { path: "MANAGE" } })
+    .then(async (res) => {
+      optionRound.value = await res.data.result.map((e: ResponsePeriod) => ({
+        id: e.period_id,
+        year: e.period_year,
+        name: e.period_name,
+        period_revision: e.period_revision,
+      }));
+      //มีรอบการเสนอขอพระราชทานเครื่อง
+      if (optionRound.value.length !== 0) {
+        // DataStore.optionRound = optionRound.value;
+        // const lastValue = optionRound.value[0];
+        // await fetchListOrg(lastValue.period_revision);
+        // await fecthAgency(lastValue.period_revision);
+        // if (DataStore.roundId) {
+        // round.value = DataStore.roundId; // รอบการเสนอให้ใช้รอบที่เลือก
+        // } else {
+        // round.value = lastValue.id.toString(); // รอบการเสนอให้ใช้รอบล่าสุด
+        // }
+        // await fecthStat(round.value);
+        // DataStore.roundId = round.value;
+        // roundName.value = lastValue.name;
+        // loadview.value = true;
+      }
+    })
+    .catch((err) => {
+      messageError($q, err);
+    });
+}
+
+/** ฟังก์ชันยื่นยันการล็อกข้อมูล*/
+function onConfrimIsLockData() {
+  dialogConfirm(
+    $q,
+    () => {},
+    "ยืนยันการล็อกข้อมูล",
+    "คุณต้องการล็อกข้อมูลใช่หรือไม่"
+  );
+}
+
+onMounted(async () => {
+  showLoader();
+  try {
+    await fetchCheckIsofficer();
+    if (isStaff.value || isOfficer.value || isDirector.value) {
+      await Promise.all([fecthRoundData()]);
+    }
+  } catch (error) {
+    messageError($q, error);
+  } finally {
+    hideLoader();
+  }
+});
+</script>
+
+<template>
+  <div class="toptitle text-dark col-12 row items-center">
+    รายชื่อลูกจ้างประจำ ที่มีสิทธิ์ยื่นขอพระราชทานเครื่องราชอิสริยาภรณ์
+  </div>
+
+  <q-card
+    bordered
+    class="row col-12 q-mt-sm"
+    v-if="isDirector || isOfficer || isStaff"
+  >
+    <div class="row col-12 items-center bg-grey-1">
+      <div class="q-pl-md q-pr-sm text-weight-medium text-grey-7">รอบ</div>
+      <q-select
+        borderless
+        dense
+        v-model="round"
+        :options="optionRound"
+        map-options
+        emit-value
+        option-value="id"
+        option-label="name"
+      />
+      <!-- @update:model-value="changround" -->
+
+      <q-space />
+      <!-- สกจ. Freez ข้อมูล -->
+      <q-btn
+        v-if="isOfficer && checkPermission($route)?.attrIsUpdate"
+        dense
+        unelevated
+        label="ล็อกข้อมูล"
+        color="public"
+        class="q-px-md q-ml-md"
+        @click="onConfrimIsLockData"
+      >
+        <q-tooltip>ล็อกข้อมูล</q-tooltip>
+      </q-btn>
+    </div>
+    <div class="col-12"><q-separator /></div>
+    <div v-if="isOfficer" class="col-12 row bg-white">
+      <div class="fit q-px-md q-py-sm">
+        <div class="row col-12 q-col-gutter-sm fit">
+          <cardTop
+            :amount="stat.orgAllCount"
+            label="หน่วยงานทั้งหมด"
+            color="#016987"
+          />
+          <cardTop
+            :amount="stat.orgSendCount"
+            label="หน่วยงานที่ส่งรายชื่อเเล้ว"
+            color="#02A998"
+          />
+          <cardTop
+            :amount="stat.orgNoSendCount"
+            label="หน่วยงานที่ยังไม่ได้ส่งรายชื่อ"
+            color="#2EA0FF"
+          />
+          <cardTop
+            :amount="stat.allUserUser"
+            label="จำนวนคนที่ยื่นขอ"
+            color="#4154B3"
+          />
+        </div>
+      </div>
+    </div>
+  </q-card>
+
+  <q-card v-else>
+    <div class="q-pa-md q-gutter-sm">
+      <q-banner inline-actions rounded class="bg-grey-1 text-center">
+        ไม่มีข้อมูลรอบการเสนอขอพระราชทานเครื่องราชอิสริยาภรณ์
+      </q-banner>
+    </div>
+  </q-card>
+</template>
+
+<style scoped></style>
diff --git a/src/modules/07_insignia/views/01_RoundMain.vue b/src/modules/07_insignia/views/01_RoundMain.vue
index 4a163283d..1f1bba0f8 100644
--- a/src/modules/07_insignia/views/01_RoundMain.vue
+++ b/src/modules/07_insignia/views/01_RoundMain.vue
@@ -210,7 +210,7 @@ onMounted(async () => {
           v-model="filterKeyword"
           outlined
           placeholder="ค้นหา"
-          @keydown.enter="onSearch"
+          @keydown.enter.prevent="onSearch"
         >
           <template v-slot:append>
             <q-icon name="search" />
diff --git a/src/modules/07_insignia/views/02_ManageMain.vue b/src/modules/07_insignia/views/02_ManageMain.vue
index 0de4d28d8..1f284b5d0 100644
--- a/src/modules/07_insignia/views/02_ManageMain.vue
+++ b/src/modules/07_insignia/views/02_ManageMain.vue
@@ -5,6 +5,7 @@ import { useQuasar } from "quasar";
 import { useRoute } from "vue-router";
 import { useCounterMixin } from "@/stores/mixin";
 import { useInsigniaDataStore } from "@/modules/07_insignia/store";
+import { useRoleWorkflowDataStore } from "@/stores/roleWorkflow";
 import { checkPermission } from "@/utils/permissions";
 import http from "@/plugins/http";
 import config from "@/app.config";
@@ -33,6 +34,7 @@ const tab1 = defineAsyncComponent(
 const $q = useQuasar(); //ใช้ noti quasar
 const route = useRoute();
 const DataStore = useInsigniaDataStore();
+const { fetchDataCheckIsoffice } = useRoleWorkflowDataStore();
 const mixin = useCounterMixin();
 const { messageError, dialogConfirm, showLoader, hideLoader, success } = mixin;
 
@@ -184,18 +186,15 @@ async function fecthInsignia() {
 }
 
 async function fetchCheckIsofficer() {
-  http
-    .get(config.API.checkIsofficer + `SYS_INSIGNIA_MANAGE`)
-    .then((res) => {
-      const data = res.data.result;
-      DataStore.isStaff = data.isStaff;
-      DataStore.isOfficer = data.isOfficer;
-      DataStore.isDirector = data.isDirector;
-      DataStore.isDeputy = data.isDeputy;
-    })
-    .catch((err) => {
-      messageError($q, err);
-    });
+  try {
+    const data = await fetchDataCheckIsoffice("SYS_INSIGNIA_MANAGE");
+    DataStore.isStaff = data.isStaff;
+    DataStore.isOfficer = data.isOfficer;
+    DataStore.isDirector = data.isDirector;
+    DataStore.isDeputy = data.isDeputy;
+  } catch (err) {
+    messageError($q, err);
+  }
 }
 
 /**
@@ -235,7 +234,7 @@ async function fecthInsigniaByOc(
   ocId: string,
   role: string,
   status: string,
-  isDeputy: boolean = false
+  isDeputy: boolean = DataStore.isDeputy
 ) {
   DataStore.rows = [];
   if (roundId && ocId && role && status) {
@@ -243,6 +242,7 @@ async function fecthInsigniaByOc(
     await http
       .get(config.API.insigniaList(roundId, ocId, role, status, isDeputy))
       .then(async (res) => {
+        DataStore.isLock = res.data.result.isLock; // เช็คว่ามีการล็อกข้อมูลหรือไม่
         requestNote.value = res.data.result.requestNote;
         requestStatus.value = res.data.result.requestStatus;
         requestId.value = res.data.result.requestId;
@@ -423,6 +423,35 @@ function requestSendNote() {
   });
 }
 
+/**
+ * function อัปเดตข้อมูลคุณสมบัติ
+ */
+async function updateDataProperty() {
+  dialogConfirm($q, async () => {
+    showLoader();
+    await http
+      .put(config.API.insigniaUpdateProperty, {
+        insigniaPeriodId: round.value,
+        agencyId: DataStore.agency,
+        type: "officer",
+      })
+      .then(async () => {
+        hideLoader();
+        await fecthInsigniaByOc(
+          round.value,
+          DataStore.agency,
+          "officer",
+          tab.value
+        );
+        success($q, "อัปเดตข้อมูลคุณสมบัติสำเร็จ");
+      })
+      .catch((err) => {
+        messageError($q, err);
+        hideLoader();
+      });
+  });
+}
+
 /**
  * function อัปโหลดไฟล์เจ้าหน้าที่
  * @param event file
@@ -456,6 +485,7 @@ async function uploadFile(event: any) {
  *  hook
  */
 onMounted(async () => {
+  DataStore.employeeClass = "officer"; // กำหนดประเภทข้าราชการสามัญฯ เป็น ขรก.
   tab.value = DataStore.mainTab ?? "";
   await Promise.all([fecthlistRound(), fecthInsignia(), fetchCheckIsofficer()]);
 });
@@ -508,6 +538,23 @@ onUnmounted(() => {
       >
         <q-tooltip>ล็อกข้อมูล</q-tooltip>
       </q-btn>
+      <!-- อัปเดตข้อมูลคุณสมบัติ -->
+      <q-btn
+        v-if="
+          ((DataStore.isOfficer && DataStore.optionsTypeOc.findIndex(
+          (v: OptionData) => v.id === DataStore.selectOrganization && v.isDeputy === true) > -1) || DataStore.isStaff) &&
+          DataStore.isLock !== true && (requestStatus == 'st1' || requestStatus == 'st4') &&
+          checkPermission($route)?.attrIsUpdate
+        "
+        dense
+        unelevated
+        label="อัปเดตข้อมูลคุณสมบัติ"
+        color="info"
+        class="q-px-md q-ml-sm"
+        @click="updateDataProperty"
+      >
+        <q-tooltip>อัปเดตข้อมูลคุณสมบัติ</q-tooltip>
+      </q-btn>
     </div>
     <div class="col-12"><q-separator /></div>
     <div v-if="DataStore.isOfficer" class="col-12 row bg-white">
@@ -643,7 +690,7 @@ onUnmounted(() => {
         dense
         v-model="fileUpload"
         accept=".pdf"
-        :style="fileUpload === null ? 'width: 150px' : 'width: auto'"
+        :style="fileUpload === null ? 'width: 250px' : 'width: auto'"
         label="อัปโหลดไฟล์"
       >
         <template v-slot:prepend>
@@ -689,6 +736,7 @@ onUnmounted(() => {
 
       <q-btn
         v-if="
+        !DataStore.isLock &&
           ((DataStore.isOfficer && DataStore.optionsTypeOc.findIndex(
           (v: OptionData) => v.id === DataStore.selectOrganization && v.isDeputy === true) > -1) || DataStore.isStaff) &&
           (requestStatus == 'st1' || requestStatus == 'st4') &&
@@ -702,6 +750,7 @@ onUnmounted(() => {
       />
       <q-btn
         v-if="
+          !DataStore.isLock &&
           DataStore.isDirector &&
           (requestStatus == 'st3' || requestStatus == 'st5') &&
           checkPermission($route)?.attrIsUpdate
@@ -714,6 +763,7 @@ onUnmounted(() => {
       />
       <q-btn
         v-if="
+          !DataStore.isLock &&
           DataStore.isDirector &&
           requestStatus == 'st3' &&
           checkPermission($route)?.attrIsUpdate
diff --git a/src/modules/07_insignia/views/03_ResultMain.vue b/src/modules/07_insignia/views/03_ResultMain.vue
index bec014a54..d6c100cdd 100644
--- a/src/modules/07_insignia/views/03_ResultMain.vue
+++ b/src/modules/07_insignia/views/03_ResultMain.vue
@@ -22,6 +22,7 @@ import DialogHeader from "@/components/DialogHeader.vue";
 import Dialogbody from "@/modules/07_insignia/components/3_result/DialogReceive_Return.vue"; //รับ-คืนเครื่องราชฯ
 import DialogForm from "@/modules/07_insignia/components/3_result/DialogResults.vue"; //บันทึกผล
 import fileUploadview from "../components/3_result/TabDocuments.vue";
+import PopupPersonal from "@/components/Dialogs/PopupPersonalNew.vue";
 
 /** use*/
 const $q = useQuasar();
@@ -106,15 +107,15 @@ const columns = ref<QTableProps["columns"]>([
     sort: (a: string, b: string) =>
       a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
   },
-  {
-    name: "employeeType",
-    align: "left",
-    label: "ประเภทตำแหน่ง",
-    field: "employeeType",
-    sortable: true,
-    sort: (a: string, b: string) =>
-      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
-  },
+  // {
+  //   name: "employeeType",
+  //   align: "left",
+  //   label: "ประเภทตำแหน่ง",
+  //   field: "employeeType",
+  //   sortable: true,
+  //   sort: (a: string, b: string) =>
+  //     a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
+  // },
   {
     name: "type",
     align: "left",
@@ -480,12 +481,13 @@ function filterSelector(val: string, update: Function, name: string) {
       filterInvoice.value = DataStore.invoiceTypeop.filter(
         (v: OptionData) => v.name.toLowerCase().indexOf(needle) > -1
       );
-    } else if (name === "filterEmployee") {
-      DataStore.employeeClass = val ? "" : DataStore.employeeClass;
-      filterEmployee.value = DataStore.employeeClassOps.filter(
-        (v: OptionData) => v.name.toLowerCase().indexOf(needle) > -1
-      );
     }
+    // else if (name === "filterEmployee") {
+    //   DataStore.employeeClass = val ? "" : DataStore.employeeClass;
+    //   filterEmployee.value = DataStore.employeeClassOps.filter(
+    //     (v: OptionData) => v.name.toLowerCase().indexOf(needle) > -1
+    //   );
+    // }
   });
 }
 
@@ -501,7 +503,7 @@ function clearInsigniaFilters(name: string) {
     DataStore.invoiceType = "all";
     filterInvoice.value = DataStore.invoiceTypeop;
   } else if (name === "filterEmployee") {
-    DataStore.employeeClass = "all";
+    // DataStore.employeeClass = "all";
     filterEmployee.value = DataStore.employeeClassOps;
   }
 }
@@ -534,6 +536,21 @@ function serchDataTableDailog() {
   );
 }
 
+const modalPersonal = ref<boolean>(false); // popup ทะเบียนประวัติ
+/**
+ *  function redirect to ทะเบียนประวัติ
+ * @param id profileId
+ */
+function viewRegistry(id: string, type: string) {
+  modalPersonal.value = true;
+  personId.value = id;
+  profileType.value = type;
+}
+
+function updatemodalPersonal(modal: boolean) {
+  modalPersonal.value = modal;
+}
+
 /**
  * callback function จำทำงานเมื่อ tab มีการเปลี่ยนแปลง
  */
@@ -805,7 +822,7 @@ onMounted(() => {
                 </q-item>
               </template>
             </q-select>
-            <q-select
+            <!-- <q-select
               v-model="DataStore.employeeClass"
               dense
               outlined
@@ -851,7 +868,7 @@ onMounted(() => {
                   </q-item-section>
                 </q-item>
               </template>
-            </q-select>
+            </q-select> -->
             <div>
               <q-btn
                 v-if="checkPermission($route)?.attrIsCreate"
@@ -884,6 +901,23 @@ onMounted(() => {
             <template v-slot:body="props">
               <q-tr :props="props">
                 <q-td auto-width>
+                  <!-- ดูข้อมูลทะเบียนประวัติ -->
+                  <q-btn
+                    v-if="
+                      checkPermission($route)?.attrIsGet && props.row.profileId
+                    "
+                    flat
+                    round
+                    dense
+                    icon="info"
+                    color="info"
+                    @click.stop="
+                      viewRegistry(props.row.profileId, props.row.profileType)
+                    "
+                  >
+                    <q-tooltip>ดูข้อมูลทะเบียนประวัติ</q-tooltip>
+                  </q-btn>
+
                   <q-btn
                     v-if="
                       checkPermission($route)?.attrIsGet &&
@@ -962,7 +996,7 @@ onMounted(() => {
     :round-id="selectRound"
     :action="action"
     :person-id="personId"
-    :profile-type="profileType"
+    profile-type="officer"
     :fecthlist-insignia="fecthlistInsignia"
   />
 
@@ -1036,6 +1070,13 @@ onMounted(() => {
       </q-card-actions>
     </q-card>
   </q-dialog>
+
+  <PopupPersonal
+    :modal="modalPersonal"
+    :id="personId"
+    :type="profileType"
+    @update:modal="updatemodalPersonal"
+  />
 </template>
 <style lang="scss" scoped>
 .arrow {
diff --git a/src/modules/07_insignia/views/07_ReclaimMain.vue b/src/modules/07_insignia/views/07_ReclaimMain.vue
index facf9aef4..b125424cd 100644
--- a/src/modules/07_insignia/views/07_ReclaimMain.vue
+++ b/src/modules/07_insignia/views/07_ReclaimMain.vue
@@ -213,7 +213,7 @@ const isInsigniaRound = ref<boolean>(false); //สถานะรอบ
 
 const roundOps = ref<DataRound[]>(roundData.value); //รอบเครืองราช
 const insigniaTypeOps = ref<OptionData[]>(insigniaTypeData.value); //ประเภทเครื่องราช
-const employeeClassOps = ref<OptionData[]>(employeeClassData.value); //ตำแหน่งประเภท
+const employeeClassOps = ref<OptionData[]>(employeeClassData.value); //ประเภทตำแหน่ง
 
 const modalForm = ref<boolean>(false); // modal บันทึกการเรียกคืนเครื่องราชฯ
 const isEdit = ref<boolean>(false); // สถานะการแก้ไข
@@ -515,7 +515,7 @@ onMounted(async () => {
                 outlined
                 lazy-rules
                 hide-bottom-space
-                :label="`${'ตำแหน่งประเภท'}`"
+                :label="`${'ประเภทตำแหน่ง'}`"
                 emit-value
                 use-input
                 hide-selected
diff --git a/src/modules/07_insignia/views/08_ManageEmpMain.vue b/src/modules/07_insignia/views/08_ManageEmpMain.vue
new file mode 100644
index 000000000..954319095
--- /dev/null
+++ b/src/modules/07_insignia/views/08_ManageEmpMain.vue
@@ -0,0 +1,799 @@
+<script setup lang="ts">
+import { onMounted, onUnmounted, defineAsyncComponent, ref } from "vue";
+import { useQuasar } from "quasar";
+
+import { useRoute } from "vue-router";
+import { useCounterMixin } from "@/stores/mixin";
+import { useInsigniaDataStore } from "@/modules/07_insignia/store";
+import { useRoleWorkflowDataStore } from "@/stores/roleWorkflow";
+import { checkPermission } from "@/utils/permissions";
+import http from "@/plugins/http";
+import config from "@/app.config";
+
+import type { DataStructureTree } from "@/interface/main";
+import type {
+  OptionData,
+  OptionRound,
+  DataStat,
+} from "@/modules/07_insignia/interface/index/Main";
+import type { ResponsePeriod } from "@/modules/07_insignia/interface/response/Main";
+
+/**import Componrnts*/
+import cardTop from "@/modules/07_insignia/components/2_Manage/StatCard.vue"; // stat
+// import tab1 from "@/modules/07_insignia/components/2_Manage/Tab1.vue"; //คนที่ยืนขอ
+import tab2 from "@/modules/07_insignia/components/2_Manage/Tab2.vue"; //คนไม่ที่ยืนขอ
+import tab3 from "@/modules/07_insignia/components/2_Manage/Tab3.vue"; //คนที่ถูกลบ
+import tab4 from "@/modules/07_insignia/components/2_Manage/Tab4.vue"; //หน่วยงานที่ไม่ได้ส่งชื่อ
+import DialogPopupReason from "@/components/Dialogs/PopupReason.vue"; //หมายเหตุ
+
+const tab1 = defineAsyncComponent(
+  () => import("@/modules/07_insignia/components/2_Manage/Tab1.vue")
+);
+
+/**use  */
+const $q = useQuasar(); //ใช้ noti quasar
+const route = useRoute();
+const DataStore = useInsigniaDataStore();
+const { fetchDataCheckIsoffice } = useRoleWorkflowDataStore();
+const mixin = useCounterMixin();
+const { messageError, dialogConfirm, showLoader, hideLoader, success } = mixin;
+
+/**
+ * ตัวแปร
+ */
+const loadview = ref<boolean>(false); //แสดง View
+// const hideBottom = ref<boolean>(false);
+const round = ref<string>(""); //รอยการเสนอขอ
+const roundName = ref<string>(""); //ชื่อรอบการเสนอ
+const optionRound = ref<OptionRound[]>([]);
+const optiontypeOc = ref<OptionData[]>([]);
+const tab = ref<string>(""); //tab รายชื่อ
+//ข้อมูล สถิติ
+const stat = ref<DataStat>({
+  allUserUser: 0,
+  orgAllCount: 0,
+  orgNoSendCount: 0,
+  orgSendCount: 0,
+});
+const requestNote = ref<string>(""); //หมายเหตุ ตีกลับ
+const requestStatus = ref<string>(""); //สถานะของรอบการเสนอขอ
+const requestId = ref<string>(""); //id ของรอบการเสนอขอ
+const document = ref<string>(""); //เอกสารดาวน์โหลด
+const fileUpload = ref<any>(null); //ไฟล์อัปโหลด
+const modalPopupBackToEdit = ref<boolean>(false); //model แก้ไข
+const modalbackInsignia2Role = ref<boolean>(false); // popup หมายเหตุการตีกลับ
+
+/**
+ * function เรียกรอบการเสนอขอพระราชทานเครื่อง
+ */
+async function fecthlistRound() {
+  showLoader();
+  loadview.value = false;
+  await http
+    .get(config.API.listRoundInsignia(), { params: { path: "MANAGE" } })
+    .then(async (res) => {
+      optionRound.value = await res.data.result.map((e: ResponsePeriod) => ({
+        id: e.period_id,
+        year: e.period_year,
+        name: e.period_name,
+        period_revision: e.period_revision,
+      }));
+
+      //มีรอบการเสนอขอพระราชทานเครื่องแสดง UI
+      if (optionRound.value.length !== 0) {
+        DataStore.optionRound = optionRound.value;
+        const lastValue = optionRound.value[0];
+        await fetchListOrg(lastValue.period_revision);
+        await fecthAgency(lastValue.period_revision);
+        if (DataStore.roundId) {
+          round.value = DataStore.roundId; // รอบการเสนอให้ใช้รอบที่เลือก
+        } else {
+          round.value = lastValue.id.toString(); // รอบการเสนอให้ใช้รอบล่าสุด
+        }
+        await fecthStat(round.value);
+        DataStore.roundId = round.value;
+        roundName.value = lastValue.name;
+        loadview.value = true;
+      }
+    })
+    .catch((err) => {
+      messageError($q, err);
+    })
+    .finally(() => {
+      hideLoader();
+    });
+}
+
+/**
+ * function เรียกดู Stat ของรอบการเสนอขอพระราชทานเครื่อง
+ */
+async function fecthStat(id: string) {
+  if (DataStore.isOfficer) {
+    await http
+      .get(config.API.insigniaDashboard(id, "employee"))
+      .then((res) => {
+        stat.value = res.data.result;
+      })
+      .catch((err) => {
+        messageError($q, err);
+      });
+  }
+}
+
+/**
+ * function fetch ข้อมูลโครองสร้างปัจจุบัน
+ * @param id โครงสร้างปัจจุบัน
+ */
+async function fetchListOrg(id: string) {
+  if (DataStore.isOfficer) {
+    await http
+      .get(config.API.orgByIdSystemRoot(id, route.meta.Key as string))
+      .then(async (res) => {
+        const data = res.data.result;
+        if (data.length !== 0) {
+          optiontypeOc.value = await res.data.result.map(
+            (item: DataStructureTree) => ({
+              id: item.orgTreeId,
+              name: item.orgName,
+              isDeputy: item.isDeputy,
+            })
+          );
+
+          await DataStore.fetchOption(optiontypeOc.value); //ค่าของหน่วยงานทั้งหมดไว้ที่  DataStore
+        }
+      })
+      .catch((err) => {
+        messageError($q, err);
+      });
+  }
+}
+
+/**
+ * funcion เช็คหน่วยงาน
+ */
+async function fecthAgency(id: string) {
+  await http
+    .get(config.API.keycloakPosition(), {
+      params: {
+        revisionId: id,
+      },
+    })
+    .then((res) => {
+      DataStore.agency = res.data.result.rootId;
+      DataStore.selectOrganization = res.data.result.rootId;
+      DataStore.typeOc = DataStore.agency;
+    })
+    .catch((err) => {
+      messageError($q, err);
+    });
+}
+
+/**
+ * function เรียกประเภทเครื่องราช
+ */
+async function fecthInsignia() {
+  if (DataStore.dataInsigniaType.length === 0) {
+    await http
+      .get(config.API.insigniaOrg)
+      .then((res) => {
+        const data = res.data.result;
+        DataStore.fetchInsigniaType(data);
+      })
+      .catch((err) => {
+        messageError($q, err);
+      });
+  }
+}
+
+async function fetchCheckIsofficer() {
+  try {
+    const data = await fetchDataCheckIsoffice("SYS_INSIGNIA_MANAGE");
+    DataStore.isStaff = data.isStaff;
+    DataStore.isOfficer = data.isOfficer;
+    DataStore.isDirector = data.isDirector;
+    DataStore.isDeputy = data.isDeputy;
+  } catch (err) {
+    messageError($q, err);
+  }
+}
+
+/**
+ * function เปลี่ยนรอบการแสดง
+ */
+async function changround() {
+  DataStore.roundId = round.value;
+
+  // get round name
+  await fecthStat(round.value); //เรียกดู Stat รอบที่เลือก
+  const roundFilter = optionRound.value.find(
+    (x: OptionRound) => x.id === round.value
+  );
+  if (roundFilter) {
+    await fetchListOrg(roundFilter?.period_revision);
+    await fecthAgency(roundFilter?.period_revision);
+    roundName.value = `รอบการเสนอขอพระราชทานเครื่องราชฯ ปี ${
+      roundFilter.year + 543
+    }`;
+  }
+  var organization =
+    DataStore.agency != null //ถ้ามี agency เรียกข้อมูลตาม agency  ถ้าไม่มีเรียนตาม Oc ที่เลือก
+      ? DataStore.agency
+      : DataStore.typeOc;
+  await fecthInsigniaByOc(round.value, organization, "officer", tab.value); // เรียกข้อมูลรายชื่อข้าราชการสามัญฯ ที่มีสิทธิ์ยื่นขอพระราชทานเครื่องราชอิสริยาภรณ์
+}
+
+/**
+ * function เรียกข้อมูลรายชื่อข้าราชการสามัญฯ  ที่มีสิทธิ์ยื่นขอพระราชทานเครื่องราชอิสริยาภรณ์ ตามรอบการเสนอขอ
+ * @param roundId id รอบการเสนอขอ
+ * @param ocId id หน่วยงาน
+ * @param role   ประเภท officer,employee
+ * @param status สถานะ
+ */
+async function fecthInsigniaByOc(
+  roundId: string,
+  ocId: string,
+  role: string,
+  status: string,
+  isDeputy: boolean = DataStore.isDeputy
+) {
+  DataStore.rows = [];
+  if (roundId && ocId && role && status) {
+    showLoader();
+    await http
+      .get(
+        config.API.insigniaList(
+          roundId,
+          ocId,
+          role,
+          status,
+          isDeputy,
+          "employee"
+        )
+      )
+      .then(async (res) => {
+        requestNote.value = res.data.result.requestNote;
+        requestStatus.value = res.data.result.requestStatus;
+        requestId.value = res.data.result.requestId;
+        document.value = res.data.result.document;
+        await DataStore.fetchData(res.data.result.items); // ส่งรายชื่อข้าราชการสามัญฯ
+        await DataStore.fetchDataInsignia(res.data.result); // ส่งข้อมูลรอบบการแสดง
+        // แสดงปุมล็อกข้อมูล
+        // if (res.data.result.items !== null) {
+        //   if (res.data.result.items.length !== 0) {
+        //     hideBottom.value = true;
+        //   } else hideBottom.value = false;
+        // }
+      })
+      .catch((err) => {
+        messageError($q, err);
+      })
+      .finally(() => {
+        hideLoader();
+      });
+  }
+}
+
+/**
+ * function ยืนยันการส่งรอบการเสนอขอต่อ เฉพาะ รอบที่ requestStatus st1 และ st4
+ */
+function sendToDirector() {
+  dialogConfirm($q, () => {
+    showLoader();
+    http
+      .get(
+        config.API.insigniaSendToDirector(
+          round.value,
+          DataStore.agency,
+          "employee"
+        )
+      )
+      .then(async () => {
+        await fecthStat(round.value);
+        await fecthInsigniaByOc(
+          round.value,
+          DataStore.agency,
+          "officer",
+          tab.value
+        );
+        await success($q, "บันทึกสำเร็จ");
+      })
+      .catch((err) => {
+        messageError($q, err);
+        hideLoader();
+      });
+  });
+}
+
+/**
+ * function open popup แก้ไข*
+ */
+function popupBackToEdit() {
+  modalPopupBackToEdit.value = true;
+}
+
+/**
+ * function  open popup ตีกลับ admin
+ */
+function popupBackToInsignia2Role() {
+  modalbackInsignia2Role.value = true;
+}
+
+/**
+ * funtion ยืนยันการ ตีกลับรอบการเสนอขอ  เฉพาะ รอบที่ requestStatus st3 และ insignia2Role
+ * @param reason หมายเหตุการตีกลับ
+ */
+function backToEdit(reason: string) {
+  dialogConfirm(
+    $q,
+    () => {
+      showLoader();
+      http
+        .put(
+          config.API.insigniaDirectorBackToEdit(
+            round.value,
+            DataStore.agency,
+            "employee"
+          ),
+          {
+            reason: reason,
+          }
+        )
+        .then(async () => {
+          await fecthInsigniaByOc(
+            round.value,
+            DataStore.agency,
+            "officer",
+            tab.value
+          );
+          await success($q, "บันทึกสำเร็จ");
+          modalPopupBackToEdit.value = false;
+        })
+        .catch((err) => {
+          messageError($q, err);
+          hideLoader();
+        });
+    },
+    "ยืนยันการตีกลับ",
+    "ต้องการยืนยันการตีกลับใช่หรือไม่?"
+  );
+}
+
+/**
+ * function ยืนยันการอนุมัติรอบการเสนอขอ  เฉพาะ รอบที่ requestStatus st3 และ insignia2Role
+ */
+function directorApproved() {
+  dialogConfirm(
+    $q,
+    () => {
+      showLoader();
+      http
+        .get(
+          config.API.insigniaDirectorApproved(
+            round.value,
+            DataStore.agency,
+            "employee"
+          )
+        )
+        .then(async () => {
+          await fecthInsigniaByOc(
+            round.value,
+            DataStore.agency,
+            "officer",
+            tab.value
+          );
+          await fecthStat(round.value);
+          await success($q, "บันทึกสำเร็จ");
+        })
+        .catch((err) => {
+          messageError($q, err);
+          hideLoader();
+        });
+    },
+    "ยืนยันการอนุมัติ",
+    "ต้องการยืนยันการอนุมัติใช่หรือไม่?"
+  );
+}
+
+/**
+ * function ยืนยันการตีกลับรอบการเสนอขอ  เฉพาะ รอบที่ requestStatus st5 และ adminRole
+ * @param reason หมายเหตุการตีกลับ
+ */
+function backToEditinsignia2Role(reason: string) {
+  dialogConfirm($q, () => {
+    http
+      .put(
+        config.API.rejectRequest(round.value, DataStore.typeOc, "employee"),
+        {
+          reason: reason,
+        }
+      )
+      .then(async () => {
+        await fecthInsigniaByOc(
+          round.value,
+          DataStore.typeOc,
+          "officer",
+          tab.value
+        );
+        await success($q, "การตีกลับสำเร็จ");
+        modalbackInsignia2Role.value = false;
+      })
+      .catch((err) => {
+        messageError($q, err);
+      });
+  });
+}
+
+/**
+ * function อัปเดตข้อมูลคุณสมบัติ
+ */
+async function updateDataProperty() {
+  dialogConfirm($q, async () => {
+    showLoader();
+    await http
+      .put(config.API.insigniaUpdateProperty, {
+        insigniaPeriodId: round.value,
+        agencyId: DataStore.agency,
+        type: "employee",
+      })
+      .then(async () => {
+        hideLoader();
+        await fecthInsigniaByOc(
+          round.value,
+          DataStore.agency,
+          "officer",
+          tab.value
+        );
+        success($q, "อัปเดตข้อมูลคุณสมบัติสำเร็จ");
+      })
+      .catch((err) => {
+        messageError($q, err);
+        hideLoader();
+      });
+  });
+}
+
+/**
+ * function อัปโหลดไฟล์เจ้าหน้าที่
+ * @param event file
+ */
+async function uploadFile(event: any) {
+  dialogConfirm($q, async () => {
+    const selectedFile = event;
+    const formdata = new FormData();
+    formdata.append("Document", selectedFile);
+    await http
+      .put(config.API.uploadfileOnlyInsignia(requestId.value), formdata)
+      .then(async () => {
+        await fecthInsigniaByOc(
+          round.value,
+          DataStore.agency,
+          "officer",
+          tab.value
+        );
+        success($q, "อัปโหลดไฟล์สำเร็จ");
+        fileUpload.value = null;
+      })
+      .catch((err) => {
+        messageError($q, err);
+      }),
+      "ยืนยันการอัปโหลดไฟล์",
+      "ต้องการยืนยันการอัปโหลดไฟล์นี้หรือไม่ ?";
+  });
+}
+
+/**
+ *  hook
+ */
+onMounted(async () => {
+  tab.value = DataStore.mainTab ?? "";
+  DataStore.employeeClass = "employee"; // กำหนดประเภทตำแหน่งเป็นลูกจ้างประจำ
+  await Promise.all([fecthlistRound(), fecthInsignia(), fetchCheckIsofficer()]);
+});
+
+onUnmounted(() => {
+  DataStore.typeOc = "";
+});
+</script>
+
+<template>
+  <div class="toptitle text-dark col-12 row items-center">
+    รายชื่อลูกจ้างประจำ ที่มีสิทธิ์ยื่นขอพระราชทานเครื่องราชอิสริยาภรณ์
+  </div>
+  <q-card
+    bordered
+    class="row col-12 q-mt-sm"
+    v-if="
+      loadview &&
+      (DataStore.isDirector || DataStore.isOfficer || DataStore.isStaff)
+    "
+  >
+    <div class="row col-12 items-center bg-grey-1">
+      <div class="q-pl-md q-pr-sm text-weight-medium text-grey-7">รอบ</div>
+      <q-select
+        borderless
+        dense
+        v-model="round"
+        :options="optionRound"
+        map-options
+        emit-value
+        option-value="id"
+        option-label="name"
+        @update:model-value="changround"
+      />
+
+      <q-space />
+
+      <!-- อัปเดตข้อมูลคุณสมบัติ -->
+      <q-btn
+        v-if="
+          ((DataStore.isOfficer && DataStore.optionsTypeOc.findIndex(
+          (v: OptionData) => v.id === DataStore.selectOrganization && v.isDeputy === true) > -1) || DataStore.isStaff) &&
+          DataStore.isLock !== true && (requestStatus == 'st1' || requestStatus == 'st4') &&
+          checkPermission($route)?.attrIsUpdate
+        "
+        dense
+        unelevated
+        label="อัปเดตข้อมูลคุณสมบัติ"
+        color="info"
+        class="q-px-md q-ml-sm"
+        @click="updateDataProperty"
+      >
+        <q-tooltip>อัปเดตข้อมูลคุณสมบัติ</q-tooltip>
+      </q-btn>
+    </div>
+    <div class="col-12"><q-separator /></div>
+    <div v-if="DataStore.isOfficer" class="col-12 row bg-white">
+      <div class="fit q-px-md q-py-sm">
+        <div class="row col-12 q-col-gutter-sm fit">
+          <!-- stat -->
+          <cardTop
+            :amount="stat.orgAllCount"
+            label="หน่วยงานทั้งหมด"
+            color="#016987"
+          />
+          <cardTop
+            :amount="stat.orgSendCount"
+            label="หน่วยงานที่ส่งรายชื่อเเล้ว"
+            color="#02A998"
+          />
+          <cardTop
+            :amount="stat.orgNoSendCount"
+            label="หน่วยงานที่ยังไม่ได้ส่งรายชื่อ"
+            color="#2EA0FF"
+          />
+          <cardTop
+            :amount="stat.allUserUser"
+            label="จำนวนคนที่ยื่นขอ"
+            color="#4154B3"
+          />
+        </div>
+      </div>
+    </div>
+  </q-card>
+
+  <q-card v-else>
+    <div class="q-pa-md q-gutter-sm">
+      <q-banner inline-actions rounded class="bg-grey-1 text-center">
+        ไม่มีข้อมูลรอบการเสนอขอพระราชทานเครื่องราชอิสริยาภรณ์
+      </q-banner>
+    </div>
+  </q-card>
+
+  <q-card
+    flat
+    bordered
+    class="col-12 q-mt-sm"
+    v-if="
+      loadview &&
+      (DataStore.isDirector || DataStore.isOfficer || DataStore.isStaff)
+    "
+  >
+    <div
+      v-if="
+        (((DataStore.isOfficer && DataStore.optionsTypeOc.findIndex((v: OptionData) => v.id === DataStore.selectOrganization && v.isDeputy === true) > -1) || DataStore.isStaff) && requestStatus == 'st4') ||
+        (DataStore.isDirector && requestStatus == 'st5')
+      "
+      class="q-pa-md q-gutter-sm"
+    >
+      <q-banner
+        inline-actions
+        bordered
+        class="bg-orange-1 text-orange border-orange"
+      >
+        <q-icon name="mdi-information-outline" size="20px" /> หมายเหตุ ตีกลับ
+        {{ requestNote }}
+      </q-banner>
+    </div>
+
+    <q-tabs
+      v-model="tab"
+      dense
+      class="text-grey"
+      active-color="primary"
+      active-class="bg-teal-1"
+      indicator-color="primary"
+      align="left"
+    >
+      <q-tab name="pending" label="ผู้มีคุณสมบัติ" />
+      <q-tab name="delete" label="ผู้ขาดคุณสมบัติ" />
+      <q-tab name="reject" label="ผู้ไม่เสนอขอ" />
+      <q-tab
+        v-if="DataStore.isOfficer"
+        name="organization"
+        label="หน่วยงานที่ยังไม่ได้ส่งรายชื่อ"
+      />
+    </q-tabs>
+
+    <div class="col-12"><q-separator /></div>
+    <q-tab-panels v-model="tab" animated>
+      <!-- แทบคนที่ยื่นขอ -->
+      <q-tab-panel name="pending" class="q-pa-none">
+        <tab1
+          :tab="tab"
+          :round-id="round"
+          :round-name="roundName"
+          :fecth-insignia-by-oc="fecthInsigniaByOc"
+          :request-status="requestStatus"
+          :fecth-stat="fecthStat"
+        />
+      </q-tab-panel>
+
+      <!-- แทบคนที่ไม่ยื่นขอ -->
+      <q-tab-panel name="reject" class="q-pa-none">
+        <tab2
+          :tab="tab"
+          :round-id="round"
+          :fecth-insignia-by-oc="fecthInsigniaByOc"
+        />
+      </q-tab-panel>
+
+      <!-- แทบคนที่ถูกลบออก -->
+      <q-tab-panel name="delete" class="q-pa-none">
+        <tab3
+          :tab="tab"
+          :round-id="round"
+          :fecth-insignia-by-oc="fecthInsigniaByOc"
+        />
+      </q-tab-panel>
+
+      <!-- แทบหน่วยงานที่ยังไม่ได้ส่งรายชื่อ -->
+      <q-tab-panel
+        v-if="DataStore.isOfficer"
+        name="organization"
+        class="q-pa-none"
+      >
+        <tab4 :tab="tab" :round-id="round" />
+      </q-tab-panel>
+    </q-tab-panels>
+
+    <q-toolbar class="q-py-md text-right">
+      <q-file
+        v-if="((DataStore.isOfficer && DataStore.optionsTypeOc.findIndex((v: OptionData) => v.id === DataStore.selectOrganization && v.isDeputy === true) > -1) || DataStore.isStaff) && checkPermission($route)?.attrIsUpdate"
+        bg-color="white"
+        clearable
+        outlined
+        dense
+        v-model="fileUpload"
+        accept=".pdf"
+        :style="fileUpload === null ? 'width: 250px' : 'width: auto'"
+        label="อัปโหลดไฟล์"
+      >
+        <template v-slot:prepend>
+          <q-icon color="light-blue" name="attach_file" />
+          <q-tooltip>อัปโหลดไฟล์</q-tooltip>
+        </template>
+      </q-file>
+
+      <q-btn
+        flat
+        round
+        color="light-blue"
+        icon="upload"
+        @click="uploadFile(fileUpload)"
+        v-if="fileUpload !== null"
+      />
+      <div v-if="document">
+        <q-btn
+          size="md"
+          icon="mdi-download"
+          flat
+          round
+          color="primary"
+          v-if="checkPermission($route)?.attrIsGet"
+          :href="document"
+          target="_blank"
+        >
+          <q-tooltip>ดาวน์โหลด</q-tooltip>
+        </q-btn>
+        <q-btn
+          v-else-if="checkPermission($route)?.attrIsGet"
+          color="primary"
+          icon-right="mdi-download"
+          label="ดาวน์โหลดไฟล์"
+          outline
+          :href="document"
+          target="_blank"
+        >
+          <q-tooltip>ดาวน์โหลด</q-tooltip></q-btn
+        >
+      </div>
+      <q-space />
+
+      <q-btn
+        v-if="
+        !DataStore.isLock &&
+          ((DataStore.isOfficer && DataStore.optionsTypeOc.findIndex(
+          (v: OptionData) => v.id === DataStore.selectOrganization && v.isDeputy === true) > -1) || DataStore.isStaff) &&
+          (requestStatus == 'st1' || requestStatus == 'st4') &&
+          checkPermission($route)?.attrIsUpdate
+        "
+        unelevated
+        label="บันทึกข้อมูล"
+        color="public"
+        class="q-px-md"
+        @click="sendToDirector"
+      />
+      <q-btn
+        v-if="
+          !DataStore.isLock &&
+          DataStore.isDirector &&
+          (requestStatus == 'st3' || requestStatus == 'st5') &&
+          checkPermission($route)?.attrIsUpdate
+        "
+        unelevated
+        label="ตีกลับ"
+        color="orange"
+        class="q-px-md"
+        @click="popupBackToEdit"
+      />
+      <q-btn
+        v-if="
+          !DataStore.isLock &&
+          DataStore.isDirector &&
+          requestStatus == 'st3' &&
+          checkPermission($route)?.attrIsUpdate
+        "
+        unelevated
+        label="อนุมัติ"
+        color="positive"
+        class="q-px-md q-ml-md"
+        @click="directorApproved"
+      />
+      <q-btn
+        v-if="
+          !DataStore.isLock &&
+          requestStatus == 'st6' &&
+          DataStore.isOfficer &&
+          !DataStore.isLock &&
+          checkPermission($route)?.attrIsUpdate
+        "
+        unelevated
+        label="ตีกลับ"
+        color="orange"
+        class="q-px-md"
+        @click="popupBackToInsignia2Role"
+      />
+    </q-toolbar>
+  </q-card>
+
+  <!-- popup หมายเหตุ -->
+  <DialogPopupReason
+    v-model:modal="modalPopupBackToEdit"
+    title="หมายเหตุการตีกลับ"
+    label="หมายเหตุ"
+    :savaForm="backToEdit"
+  />
+  <DialogPopupReason
+    v-model:modal="modalbackInsignia2Role"
+    title="หมายเหตุการตีกลับ"
+    label="หมายเหตุ"
+    :savaForm="backToEditinsignia2Role"
+  />
+</template>
+
+<style lang="scss" scope>
+.border-orange {
+  border: 1px solid #ffa800;
+  border-radius: 5px;
+}
+</style>
diff --git a/src/modules/07_insignia/views/09_ResultMainEmp.vue b/src/modules/07_insignia/views/09_ResultMainEmp.vue
new file mode 100644
index 000000000..791df0ec9
--- /dev/null
+++ b/src/modules/07_insignia/views/09_ResultMainEmp.vue
@@ -0,0 +1,1112 @@
+<script setup lang="ts">
+import { ref, onMounted, watch } from "vue";
+import { useQuasar } from "quasar";
+
+import { checkPermission } from "@/utils/permissions";
+import { useResultDataStore } from "@/modules/07_insignia/storeResult";
+import { useCounterMixin } from "@/stores/mixin";
+import http from "@/plugins/http";
+import config from "@/app.config";
+
+/** import Type*/
+import type { QTableProps, QInput } from "quasar";
+import type {
+  OptionData,
+  DataPerson,
+  DataRecord,
+} from "@/modules/07_insignia/interface/index/Main";
+import type { ResponseRound } from "@/modules/07_insignia/interface/response/Main";
+
+/** import Components*/
+import DialogHeader from "@/components/DialogHeader.vue";
+import Dialogbody from "@/modules/07_insignia/components/3_result/DialogReceive_Return.vue"; //รับ-คืนเครื่องราชฯ
+import DialogForm from "@/modules/07_insignia/components/3_result/DialogResults.vue"; //บันทึกผล
+import fileUploadview from "../components/3_result/TabDocuments.vue";
+import PopupPersonal from "@/components/Dialogs/PopupPersonalNew.vue";
+
+/** use*/
+const $q = useQuasar();
+const DataStore = useResultDataStore();
+const mixin = useCounterMixin();
+const {
+  date2Thai,
+  dialogConfirm,
+  showLoader,
+  hideLoader,
+  messageError,
+  success,
+  onSearchDataTable,
+} = mixin;
+
+/** ตัวแปร*/
+const tab = ref<string>(""); //Tab รายการ
+const selectRound = ref<string>(""); //รอบการเสนอขอ
+const selectRoundOption = ref<OptionData[]>([]); //รายการรอบการเสนอขอ
+const modal = ref<boolean>(false); //popup บันทึกผล
+const action = ref<string>(""); //ประเภทแก่ไข,เพิ่ม
+const personId = ref<string>(); //id คนที่ต้องการ
+const profileType = ref<string>(""); //ประเภทข้ารายกาช
+const fileResult = ref<any>(null); //ไฟล์บันทึกผลการได้รับพระราชทานเครื่องราชอิสริยาภรณ์
+const fileinvoice = ref<any>(null); //ไฟล์บันทึกผลการจ่ายใบกำกับ
+const loadView = ref<boolean>(false); //แสดง ข้อมูล
+const insigniaTypeOption = ref<OptionData[]>([]); //ข้อมูลประเภทเครื่องราช
+const insigniaTypeFilter = ref<OptionData[]>([]); //รายการตัวเลือกประเภทเครื่องราช
+const filterInvoice = ref<OptionData[]>(DataStore.invoiceTypeop); //รายการตัวเลือกใบกำกับ
+// const filterEmployee = ref<OptionData[]>(DataStore.employeeClassOps); //รายการตัวเลือกสถานะภาพ
+const ModalDialog = ref<boolean>(false); //popup รับ-คืนเครื่องราชฯ
+const dateCheckReceive = ref<string>(); //วันที่รับ
+const dateCheckReturn = ref<string>(); //วันที่คืน
+const dataModal = ref<DataPerson>(); //ช้อมูลที่ต้องการ
+
+/** ข้อมูล Tabla*/
+const rowsMain = ref<DataRecord[]>([]);
+const filterRef = ref<QInput>();
+const filter = ref<string>("");
+const columns = ref<QTableProps["columns"]>([
+  {
+    name: "no",
+    align: "left",
+    label: "ลำดับ",
+    field: "no",
+    sortable: false,
+  },
+  {
+    name: "status",
+    align: "left",
+    label: "สถานะ",
+    field: "status",
+    sortable: true,
+    sort: (a: string, b: string) =>
+      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
+  },
+
+  {
+    name: "citizenId",
+    align: "left",
+    label: "เลขประจำตัวประชาชน",
+    field: "citizenId",
+    sortable: true,
+    sort: (a: string, b: string) =>
+      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
+  },
+  {
+    name: "name",
+    align: "left",
+    label: "ชื่อ-นามสกุล",
+    field: "name",
+    sortable: true,
+    sort: (a: string, b: string) =>
+      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
+  },
+  {
+    name: "position",
+    align: "left",
+    label: "ตำแหน่ง",
+    field: "position",
+    sortable: true,
+    sort: (a: string, b: string) =>
+      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
+  },
+  // {
+  //   name: "employeeType",
+  //   align: "left",
+  //   label: "ประเภทตำแหน่ง",
+  //   field: "employeeType",
+  //   sortable: true,
+  //   sort: (a: string, b: string) =>
+  //     a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
+  // },
+  {
+    name: "type",
+    align: "left",
+    label: "เครื่องราชฯ",
+    field: "type",
+    sortable: true,
+    sort: (a: string, b: string) =>
+      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
+  },
+  {
+    name: "dateReceive",
+    align: "left",
+    label: "วันที่ได้รับพระราชทาน",
+    field: "dateReceive",
+    sortable: true,
+    sort: (a: string, b: string) =>
+      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
+  },
+  {
+    name: "date",
+    align: "left",
+    label: "วันที่ในราชกิจนุเบกษา",
+    field: "date",
+    sortable: true,
+    sort: (a: string, b: string) =>
+      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
+  },
+  {
+    name: "volumeNo",
+    align: "left",
+    label: "เล่มที่ในราชกิจนุเบกษา",
+    field: "volumeNo",
+    sortable: true,
+    sort: (a: string, b: string) =>
+      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
+  },
+  {
+    name: "section",
+    align: "left",
+    label: "ตอนที่ในราชกิจนุเบกษา",
+    field: "section",
+    sortable: true,
+    sort: (a: string, b: string) =>
+      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
+  },
+
+  {
+    name: "page",
+    align: "left",
+    label: "หน้าที่ในราชกิจนุเบกษา",
+    field: "page",
+    sortable: true,
+    sort: (a: string, b: string) =>
+      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
+  },
+  {
+    name: "number",
+    align: "left",
+    label: "ลำดับที่ในราชกิจจานุเบกษา",
+    field: "number",
+    sortable: true,
+    sort: (a: string, b: string) =>
+      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
+  },
+  {
+    name: "vatnumber",
+    align: "left",
+    label: "หมายเลขใบกำกับ",
+    field: "vatnumber",
+    sortable: true,
+    sort: (a: string, b: string) =>
+      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
+  },
+  {
+    name: "datepay",
+    align: "left",
+    label: "วันที่จ่ายใบกำกับฯ",
+    field: "datepay",
+    sortable: true,
+    sort: (a: string, b: string) =>
+      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
+  },
+  {
+    name: "typepay",
+    align: "left",
+    label: "รูปแบบการจ่าย",
+    field: "typepay",
+    sortable: true,
+    sort: (a: string, b: string) =>
+      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
+  },
+  {
+    name: "address",
+    align: "left",
+    label: "ที่อยู่ที่จ่าย",
+    field: "address",
+    sortable: true,
+    sort: (a: string, b: string) =>
+      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
+  },
+]);
+const visibleColumns = ref<String[]>([
+  "action",
+  "no",
+  "status",
+  "citizenId",
+  "name",
+  "position",
+  "type",
+  "dateReceive",
+  "date",
+  "employeeType",
+  "section",
+  "page",
+  "number",
+  "vatnumber",
+  "datepay",
+  "typepay",
+  "address",
+]);
+
+/** function เรียกรอบการเสนอขอพระราชทานเครื่องราช*/
+async function fecthRound() {
+  showLoader();
+  await http
+    .get(config.API.noteround(), { params: { path: "RECORD" } })
+    .then(async (res) => {
+      let data = res.data.result;
+      if (data.length !== 0) {
+        selectRoundOption.value = data.map((e: ResponseRound) => ({
+          name: "รอบการเสนอขอพระราชทานเครื่องราชฯ ปี" + "  " + (e.year + 543),
+          id: e.id,
+        }));
+        selectRound.value = data[0].id;
+        await Promise.all([fecthInsignia(), fecthInsigniaType()]);
+      } else {
+        hideLoader();
+      }
+    })
+    .catch((err) => {
+      messageError($q, err);
+      hideLoader();
+    });
+}
+
+/** function เรียกประเภทเครื่องราช*/
+async function fecthInsignia() {
+  await http
+    .get(config.API.insigniaOrg)
+    .then(async (res) => {
+      let data = await res.data.result;
+      DataStore.fetchDatainsignia(data);
+    })
+    .catch((err) => {
+      messageError($q, err);
+    });
+}
+
+/** function เรียกระดับเครื่องราช*/
+async function fecthInsigniaType() {
+  await http(config.API.insigniaTypeOrg)
+    .then(async (res) => {
+      let data = await res.data.result;
+      DataStore.fetchDatainsigniaType(data);
+      tab.value = DataStore.insigniaType[0].name;
+      loadView.value = true;
+    })
+    .catch((err) => {
+      messageError($q, err);
+    });
+}
+
+/** function เลือกประเภทเครื่องราช*/
+function selectorInsignia() {
+  fecthlistInsignia();
+}
+
+/**
+ *  function เลือกรอบการเสนอขอ
+ * @param round รอบการเสนอขอ
+ */
+function selectorRound(round: string) {
+  if (round) {
+    selectRound.value = round;
+  }
+  fecthlistInsignia();
+}
+
+/** function เรียกรายชื่อบันทึกผลการได้รับพระราชทานเครื่องราชอิสริยาภรณ์/การจ่ายใบกำกับ */
+async function fecthlistInsignia() {
+  showLoader();
+  let data = {
+    insigniaTypeId: tab.value,
+    insigniaNoteId: selectRound.value,
+    insigniaId: DataStore.insignia,
+  };
+  await http
+    .post(config.API.noteSearch("employee"), data)
+    .then(async (res) => {
+      let data = await res.data.result;
+      await DataStore.fetchlistinsignia(data);
+      rowsMain.value = DataStore.rows;
+    })
+    .catch((err) => {
+      messageError($q, err);
+    })
+    .finally(() => {
+      hideLoader();
+    });
+}
+
+/**
+ * function uploadFile
+ * @param event file
+ * @param action  typepreview
+ */
+function uploadFile(event: any, action: string) {
+  if (selectRound.value !== undefined) {
+    let id = selectRound.value;
+    dialogConfirm($q, () => {
+      showLoader();
+      const formdata = new FormData();
+      formdata.append("file", event);
+      http
+        .put(config.API.uploadfileInsignia(action, id), formdata)
+        .then(async () => {
+          await fecthlistInsignia();
+          if (action === "receice") {
+            fileResult.value = null;
+          } else if (action === "invoice") {
+            fileinvoice.value = null;
+          }
+
+          await success($q, "อัพโหลดไฟล์สำเร็จ");
+          modelPerview.value = false;
+        })
+        .catch((err) => {
+          messageError($q, err);
+          hideLoader();
+        });
+    }),
+      "ยืนยันการบันทึกรายการข้อมูล",
+      "ต้องการยืนยันรายการข้อมูลนี้หรื้อไม่ ?";
+  }
+}
+
+/** function ปิด popup ทั้งหมด*/
+function close() {
+  modal.value = false;
+  ModalDialog.value = false;
+}
+
+/** function เปิด popup บันทึกผล เพิ่มคน*/
+function addData() {
+  modal.value = true;
+  action.value = "addData";
+}
+
+/** function  เปิด popup บันทึกผล แก้ไขข้อมูล*/
+function editData(data: DataPerson) {
+  personId.value = data.id;
+  profileType.value = data.profileType;
+  action.value = "editData";
+  modal.value = true;
+}
+
+/** ข้อมูล ไฟล์*/
+const modelPerview = ref<boolean>(false);
+const filterPreview = ref<string>("");
+const rowspreview = ref<any[]>([]);
+const rowspreviewMain = ref<any[]>([]);
+
+const typepreview = ref<string>("");
+const fileInsignia = ref<any>(null);
+
+/**
+ * function แสดง fileupload
+ * @param event  ไฟล
+ * @param actionType  ประเภทไฟล์ receice,invoice
+ */
+function perviewfile(event: any, actionType: string) {
+  showLoader();
+  typepreview.value = actionType;
+  fileInsignia.value = event;
+  if (selectRound.value !== undefined) {
+    let id = selectRound.value.toString();
+    const formdata = new FormData();
+    formdata.append("file", event);
+    http
+      .put(config.API.previewfileInsignia(actionType, id), formdata)
+      .then((res) => {
+        let data = res.data.result;
+        rowspreview.value = data.map((e: any) => ({
+          id: e.id,
+          citizenId: e.citizenId,
+          prefix: e.prefix,
+          position: e.position,
+          status: DataStore.status(e.status),
+          dateReceive: date2Thai(e.dateReceive),
+          name: e.fullName,
+          type: e.requestInsignia,
+          employeeType: DataStore.profileType(e.profileType),
+          profileType: e.profileType,
+          date: date2Thai(e.date),
+          volumeNo: e.volumeNo,
+          section: e.section,
+          page: e.page,
+          number: e.no,
+          vatnumber: e.number,
+          datepay: date2Thai(e.datePayment),
+          typepay: e.typePayment,
+          address: e.address,
+        }));
+
+        rowspreviewMain.value = rowspreview.value;
+        modelPerview.value = true;
+      })
+      .catch((err) => {
+        messageError($q, err);
+      })
+      .finally(() => {
+        hideLoader();
+      });
+  }
+}
+
+function closeDialogPerview() {
+  modelPerview.value = false;
+  filterPreview.value = "";
+  rowspreview.value = [];
+  rowspreviewMain.value = [];
+}
+
+/**
+ * function เปิด popup รับ-คืนเครื่องราชฯ
+ * @param data ข้อมูลที่ต้องการแก่้ไข
+ *
+ */
+function OpenModal(data: DataPerson) {
+  dataModal.value = data;
+  ModalDialog.value = true;
+  dateCheckReceive.value = data.dateReceiveInsignia;
+  dateCheckReturn.value = data.dateReturnInsignia;
+  personId.value = data.id;
+}
+
+/**
+ * function ค้นหาข้อมูล option
+ * @param val คำค้นหา
+ * @param update function
+ * @param name ชื่อ selec
+ */
+function filterSelector(val: string, update: Function, name: string) {
+  update(() => {
+    const needle = val.toLowerCase();
+    if (name === "insigniaTypeFilter") {
+      DataStore.insignia = val ? (null as any) : DataStore.insignia;
+      insigniaTypeFilter.value = insigniaTypeOption.value.filter(
+        (v: OptionData) => v.name.toLowerCase().indexOf(needle) > -1
+      );
+    } else if (name === "filterInvoice") {
+      DataStore.invoiceType = val ? "" : DataStore.invoiceType;
+      filterInvoice.value = DataStore.invoiceTypeop.filter(
+        (v: OptionData) => v.name.toLowerCase().indexOf(needle) > -1
+      );
+    }
+    // else if (name === "filterEmployee") {
+    //   DataStore.employeeClass = val ? "" : DataStore.employeeClass;
+    //   filterEmployee.value = DataStore.employeeClassOps.filter(
+    //     (v: OptionData) => v.name.toLowerCase().indexOf(needle) > -1
+    //   );
+    // }
+  });
+}
+
+/**
+ * function clearfilter เครื่องราช
+ * @param name ชื่อ selec
+ */
+function clearInsigniaFilters(name: string) {
+  if (name === "insigniaTypeFilter") {
+    DataStore.insignia = "";
+    insigniaTypeFilter.value = insigniaTypeOption.value;
+  } else if (name === "filterInvoice") {
+    DataStore.invoiceType = "all";
+    filterInvoice.value = DataStore.invoiceTypeop;
+  }
+  // else if (name === "filterEmployee") {
+  //   DataStore.employeeClass = "all";
+  //   filterEmployee.value = DataStore.employeeClassOps;
+  // }
+}
+
+const paging = ref<boolean>(true);
+const pagination = ref({
+  sortBy: "name",
+  descending: false,
+  page: 1,
+  rowsPerPage: 10,
+});
+const paginationLabel = (start: number, end: number, total: number) => {
+  if (paging.value == true) return " " + start + "-" + end + " ใน " + total;
+  else return start + "-" + end + " ใน " + total;
+};
+
+function serchDataTable() {
+  DataStore.rows = onSearchDataTable(
+    filter.value,
+    rowsMain.value,
+    columns.value ? columns.value : []
+  );
+}
+
+function serchDataTableDailog() {
+  rowspreview.value = onSearchDataTable(
+    filterPreview.value,
+    rowspreviewMain.value,
+    columns.value ? columns.value : []
+  );
+}
+
+const modalPersonal = ref<boolean>(false); // popup ทะเบียนประวัติ
+/**
+ *  function redirect to ทะเบียนประวัติ
+ * @param id profileId
+ */
+function viewRegistry(id: string, type: string) {
+  modalPersonal.value = true;
+  personId.value = id;
+  profileType.value = type;
+}
+
+function updatemodalPersonal(modal: boolean) {
+  modalPersonal.value = modal;
+}
+
+/**
+ * callback function จำทำงานเมื่อ tab มีการเปลี่ยนแปลง
+ */
+watch(tab, () => {
+  if (tab.value !== "doc") {
+    DataStore.rows = [];
+    rowsMain.value = [];
+    DataStore.insignia = "";
+    fecthlistInsignia();
+    insigniaTypeOption.value = DataStore.insigniaOp.filter(
+      (e: any) => e.insigniaType == tab.value || e.name == "ทั้งหมด"
+    );
+    insigniaTypeFilter.value = insigniaTypeOption.value;
+  }
+});
+
+/** hook*/
+onMounted(() => {
+  fecthRound();
+});
+</script>
+
+<template>
+  <div class="toptitle text-dark col-12 row items-center">
+    บันทึกผลการได้รับพระราชทานเครื่องราชอิสริยาภรณ์/การจ่ายใบกำกับ
+    (ลูกจ้างประจำ)
+  </div>
+
+  <q-card
+    flat
+    bordered
+    class="col-12 q-my-md q-mt-sm rounded-borders"
+    v-if="loadView == true"
+  >
+    <div class="bg-grey-1 col-12 row items-center">
+      <div class="q-pl-md q-pr-sm text-weight-medium text-grey-7">รอบ</div>
+      <div>
+        <q-select
+          hide-bottom-space
+          borderless
+          dense
+          lazy-rules
+          emit-value
+          map-options
+          options-dense
+          option-label="name"
+          option-value="id"
+          v-model="selectRound"
+          :options="selectRoundOption"
+          use-input
+          input-debounce="0"
+          input-class="text-bold text-grey"
+          @update:model-value="selectorRound(selectRound)"
+        >
+        </q-select>
+      </div>
+    </div>
+    <q-separator />
+    <q-tabs
+      dense
+      v-model="tab"
+      align="left"
+      class="bg-white text-grey"
+      active-color="primary"
+      indicator-color="primary"
+    >
+      <div v-for="item in DataStore.insigniaType">
+        <q-tab :name="item.name" :label="item.label" />
+      </div>
+
+      <q-tab name="doc" label="เอกสารอ้างอิง" />
+    </q-tabs>
+    <q-separator />
+    <q-tab-panels v-model="tab" animated>
+      <q-tab-panel
+        v-for="item in DataStore.insigniaType"
+        :key="item.name"
+        :name="item.name"
+        class="q-pa-none"
+      >
+        <div class="q-pa-md">
+          <q-card
+            bordered
+            class="col-12 q-mb-sm q-pa-sm"
+            v-if="checkPermission($route)?.attrIsCreate"
+          >
+            <div class="row col-12 q-col-gutter-x-xs">
+              <div class="col-xs-12 col-sm-6 row no-wrap q-col-gutter-x-xs">
+                <q-file
+                  dense
+                  clearable
+                  outlined
+                  v-model="fileResult"
+                  label="บันทึกผลการได้รับพระราชทานเครื่องราชอิสริยาภรณ์"
+                  accept=".xlsx"
+                  class="full-width"
+                >
+                  <template v-slot:prepend>
+                    <q-icon name="attach_file" color="primary" />
+                  </template>
+                  <q-tooltip
+                    >อัพโหลดไฟล์บันทึกผลการได้รับพระราชทานเครื่องราชอิสริยาภรณ์</q-tooltip
+                  >
+                </q-file>
+                <div v-if="fileResult !== null">
+                  <q-btn
+                    size="12px"
+                    flat
+                    class="bg-teal-1 fit"
+                    color="primary"
+                    icon="mdi-upload"
+                    @click="perviewfile(fileResult, 'receice')"
+                  >
+                    <q-tooltip
+                      >อัพโหลดไฟล์บันทึกผลการได้รับพระราชทานเครื่องราชอิสริยาภรณ์</q-tooltip
+                    >
+                  </q-btn>
+                </div>
+              </div>
+              <div class="col-xs-12 col-sm-6 row no-wrap q-col-gutter-x-xs">
+                <q-file
+                  dense
+                  clearable
+                  outlined
+                  v-model="fileinvoice"
+                  label="บันทึกผลการจ่ายใบกำกับ"
+                  accept=".xlsx"
+                  class="full-width"
+                >
+                  <template v-slot:prepend>
+                    <q-icon name="attach_file" color="primary" />
+                  </template>
+                  <q-tooltip>อัพโหลดไฟล์บันทึกผลการจ่ายใบกำกับ</q-tooltip>
+                </q-file>
+                <div v-if="fileinvoice !== null">
+                  <q-btn
+                    size="12px"
+                    flat
+                    color="primary"
+                    class="bg-teal-1 fit"
+                    icon="mdi-upload"
+                    @click="perviewfile(fileinvoice, 'invoice')"
+                  >
+                    <q-tooltip>อัพโหลดไฟล์บันทึกผลการจ่ายใบกำกับ</q-tooltip>
+                  </q-btn>
+                </div>
+              </div>
+            </div>
+          </q-card>
+          <div class="row col-12 q-pb-sm q-col-gutter-xs">
+            <q-select
+              v-model="DataStore.insignia"
+              dense
+              outlined
+              lazy-rules
+              hide-bottom-space
+              :label="`${'เครื่องราชฯ'}`"
+              emit-value
+              map-options
+              use-input
+              option-label="name"
+              :options="insigniaTypeFilter"
+              option-value="id"
+              :readonly="false"
+              :borderless="false"
+              style="width: 300px"
+              @update:model-value="selectorInsignia"
+              @filter="(inputValue:string,
+                      doneFn:Function) => filterSelector(inputValue, doneFn,'insigniaTypeFilter'
+                      ) "
+            >
+              <template v-if="DataStore.insignia" v-slot:append>
+                <q-icon
+                  name="cancel"
+                  @click.stop.prevent="
+                    clearInsigniaFilters('insigniaTypeFilter'),
+                      selectorInsignia()
+                  "
+                  class="cursor-pointer"
+                />
+              </template>
+              <template v-slot:no-option>
+                <q-item>
+                  <q-item-section class="text-grey">
+                    ไม่มีข้อมูล
+                  </q-item-section>
+                </q-item>
+              </template>
+            </q-select>
+            <q-space />
+            <div class="items-center" style="display: flex">
+              <!-- ค้นหาข้อความใน table -->
+              <q-input
+                standout
+                dense
+                v-model="filter"
+                ref="filterRef"
+                outlined
+                placeholder="ค้นหา"
+                style="max-width: 200px"
+                class="q-ml-sm"
+                @keydown.enter.prevent="serchDataTable"
+              >
+                <template v-slot:append>
+                  <q-icon name="search" />
+                </template>
+              </q-input>
+              <!-- แสดงคอลัมน์ใน table -->
+              <q-select
+                v-model="visibleColumns"
+                :display-value="$q.lang.table.columns"
+                multiple
+                outlined
+                dense
+                :options="columns"
+                options-dense
+                option-value="name"
+                map-options
+                emit-value
+                style="min-width: 140px"
+                class="gt-xs q-ml-sm"
+              />
+            </div>
+          </div>
+          <div class="row col-12 q-mb-sm q-col-gutter-xs">
+            <q-select
+              v-model="DataStore.invoiceType"
+              dense
+              outlined
+              lazy-rules
+              hide-bottom-space
+              :label="`${'ใบกำกับ'}`"
+              emit-value
+              map-options
+              use-input
+              option-label="name"
+              :options="filterInvoice"
+              option-value="id"
+              :readonly="false"
+              :borderless="false"
+              style="width: 250px"
+              @update:model-value="
+                DataStore.searchData(
+                  DataStore.invoiceType,
+                  DataStore.employeeClass
+                )
+              "
+              @filter="(inputValue:string,
+                      doneFn:Function) => filterSelector(inputValue, doneFn,'filterInvoice'
+                      ) "
+            >
+              <template v-if="DataStore.invoiceType !== 'all'" v-slot:append>
+                <q-icon
+                  name="cancel"
+                  @click.stop.prevent="
+                    clearInsigniaFilters('filterInvoice'),
+                      DataStore.searchData(
+                        DataStore.invoiceType,
+                        DataStore.employeeClass
+                      )
+                  "
+                  class="cursor-pointer"
+                />
+              </template>
+              <template v-slot:no-option>
+                <q-item>
+                  <q-item-section class="text-grey">
+                    ไม่มีข้อมูล
+                  </q-item-section>
+                </q-item>
+              </template>
+            </q-select>
+            <!-- <q-select
+              v-model="DataStore.employeeClass"
+              dense
+              outlined
+              lazy-rules
+              hide-bottom-space
+              :label="`${'ประเภทตำแหน่ง'}`"
+              emit-value
+              map-options
+              use-input
+              option-label="name"
+              :options="filterEmployee"
+              option-value="id"
+              :readonly="false"
+              :borderless="false"
+              style="width: 280px"
+              @update:model-value="
+                DataStore.searchData(
+                  DataStore.invoiceType,
+                  DataStore.employeeClass
+                )
+              "
+              @filter="(inputValue:string,
+                    doneFn:Function) => filterSelector(inputValue, doneFn,'filterEmployee'
+                    ) "
+            >
+              <template v-if="DataStore.employeeClass !== 'all'" v-slot:append>
+                <q-icon
+                  name="cancel"
+                  @click.stop.prevent="
+                    clearInsigniaFilters('filterEmployee'),
+                      DataStore.searchData(
+                        DataStore.invoiceType,
+                        DataStore.employeeClass
+                      )
+                  "
+                  class="cursor-pointer"
+                />
+              </template>
+              <template v-slot:no-option>
+                <q-item>
+                  <q-item-section class="text-grey">
+                    ไม่มีข้อมูล
+                  </q-item-section>
+                </q-item>
+              </template>
+            </q-select> -->
+            <div>
+              <q-btn
+                v-if="checkPermission($route)?.attrIsCreate"
+                @click="addData()"
+                flat
+                round
+                color="primary"
+                icon="mdi-plus"
+              >
+                <q-tooltip>เพิ่ม</q-tooltip>
+              </q-btn>
+            </div>
+          </div>
+          <d-table
+            :rows="DataStore.rows"
+            :columns="columns"
+            :visible-columns="visibleColumns"
+            row-key="name"
+            :pagination-label="paginationLabel"
+            v-model:pagination="pagination"
+          >
+            <template v-slot:header="props">
+              <q-tr :props="props">
+                <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>
+                </q-th>
+              </q-tr>
+            </template>
+            <template v-slot:body="props">
+              <q-tr :props="props">
+                <q-td auto-width>
+                  <!-- ดูข้อมูลทะเบียนประวัติ -->
+                  <q-btn
+                    v-if="
+                      checkPermission($route)?.attrIsGet && props.row.profileId
+                    "
+                    flat
+                    round
+                    dense
+                    icon="info"
+                    color="info"
+                    @click.stop="
+                      viewRegistry(props.row.profileId, props.row.profileType)
+                    "
+                  >
+                    <q-tooltip>ดูข้อมูลทะเบียนประวัติ</q-tooltip>
+                  </q-btn>
+
+                  <q-btn
+                    v-if="
+                      checkPermission($route)?.attrIsGet &&
+                      checkPermission($route)?.attrIsUpdate
+                    "
+                    flat
+                    round
+                    dense
+                    icon="edit"
+                    color="edit"
+                    @click.stop="editData(props.row)"
+                  >
+                    <q-tooltip> แก้ไขข้อมูล</q-tooltip>
+                  </q-btn>
+
+                  <q-btn
+                    v-if="
+                      checkPermission($route)?.attrIsGet &&
+                      checkPermission($route)?.attrIsUpdate &&
+                      props.row.statusMain === 'DONE'
+                    "
+                    flat
+                    round
+                    dense
+                    icon="mdi-information-outline"
+                    color="blue"
+                    @click.stop="OpenModal(props.row)"
+                  >
+                    <q-tooltip> รับ-คืนเครื่องราชฯ</q-tooltip>
+                  </q-btn>
+                </q-td>
+
+                <q-td v-for="col in props.cols" :key="col.name" :props="props">
+                  <div v-if="col.name == 'no'">
+                    {{ props.rowIndex + 1 }}
+                  </div>
+
+                  <div v-else>
+                    {{ col.value ? col.value : "-" }}
+                  </div>
+                </q-td>
+              </q-tr>
+            </template>
+          </d-table>
+        </div>
+      </q-tab-panel>
+      <q-tab-panel name="doc" class="q-pa-none">
+        <fileUploadview :roundId="selectRound" />
+      </q-tab-panel>
+    </q-tab-panels>
+  </q-card>
+
+  <q-card v-else>
+    <div class="q-pa-md q-gutter-sm">
+      <q-banner inline-actions rounded class="bg-grey-1 text-center">
+        ไม่มีข้อมูลรอบการเสนอขอพระราชทานเครื่องราชอิสริยาภรณ์
+      </q-banner>
+    </div>
+  </q-card>
+
+  <!-- รับ-คืนเครื่องราชฯ -->
+  <Dialogbody
+    :modal="ModalDialog"
+    :close="close"
+    :date-check-receive="dateCheckReceive"
+    :date-check-return="dateCheckReturn"
+    :data-modal="dataModal"
+    :person-id="personId"
+    :fecthlist-insignia="fecthlistInsignia"
+  />
+
+  <!-- บันทึกผล -->
+  <DialogForm
+    :modal="modal"
+    :close="close"
+    :round-id="selectRound"
+    :action="action"
+    :person-id="personId"
+    profile-type="employee"
+    :fecthlist-insignia="fecthlistInsignia"
+  />
+
+  <!-- ยืนยันรายการข้อมูล -->
+  <q-dialog v-model="modelPerview" persistent>
+    <q-card style="min-width: 80%">
+      <DialogHeader tittle="ยืนยันรายการข้อมูล" :close="closeDialogPerview" />
+      <q-separator />
+      <q-card-section>
+        <div class="row col-12 q-col-gutter-sm">
+          <div class="row col-12">
+            <q-space />
+            <div class="row q-col-gutter-sm">
+              <q-input
+                dense
+                outlined
+                v-model="filterPreview"
+                label="ค้นหา"
+                @keydown.enter.prevent="serchDataTableDailog"
+              >
+                <template v-slot:append>
+                  <q-icon name="search" />
+                </template>
+              </q-input>
+
+              <q-select
+                v-model="visibleColumns"
+                multiple
+                outlined
+                dense
+                options-dense
+                :display-value="$q.lang.table.columns"
+                emit-value
+                map-options
+                :options="columns"
+                option-value="name"
+                style="min-width: 140px"
+              />
+            </div>
+          </div>
+          <div class="col-12">
+            <d-table
+              :rows="rowspreview"
+              :columns="columns"
+              :visible-columns="visibleColumns"
+              row-key="name"
+            >
+              <template v-slot:body-cell="props">
+                <q-td :props="props">
+                  <div v-if="props.col.name == 'no'">
+                    {{ props.rowIndex + 1 }}
+                  </div>
+                  <div v-else>
+                    {{ props.value ? props.value : "-" }}
+                  </div>
+                </q-td>
+              </template>
+            </d-table>
+          </div>
+        </div>
+      </q-card-section>
+      <q-separator />
+
+      <q-card-actions align="right">
+        <q-btn
+          unelevated
+          color="public"
+          label="บันทึก"
+          @click="uploadFile(fileInsignia, typepreview)"
+        />
+      </q-card-actions>
+    </q-card>
+  </q-dialog>
+
+  <PopupPersonal
+    :modal="modalPersonal"
+    :id="personId"
+    :type="profileType"
+    @update:modal="updatemodalPersonal"
+  />
+</template>
+
+<style lang="scss" scoped>
+.arrow {
+  transition: transform 0.5s;
+}
+
+.arrow-active {
+  transition: transform 0.5s;
+  transform: rotate(-90deg);
+}
+
+.bg-base {
+  background-color: #f3f3f398;
+}
+
+.v-enter-active,
+.v-leave-active {
+  transition: opacity 0.5s ease;
+}
+
+.v-enter-from,
+.v-leave-to {
+  opacity: 0;
+}
+
+.flexsave {
+  display: flex;
+  justify-content: flex-end;
+}
+</style>
diff --git a/src/modules/08_registryEmployee/views/Main.vue b/src/modules/08_registryEmployee/views/Main.vue
index ac14797ae..21e25ac6e 100644
--- a/src/modules/08_registryEmployee/views/Main.vue
+++ b/src/modules/08_registryEmployee/views/Main.vue
@@ -2,7 +2,11 @@
 import { ref, onMounted, reactive, watch } from "vue";
 import { useQuasar } from "quasar";
 import { useRouter } from "vue-router";
-import { checkPermission } from "@/utils/permissions";
+import {
+  checkPermission,
+  checkPermissionList,
+  checkPermissionCreate,
+} from "@/utils/permissions";
 import { useCounterMixin } from "@/stores/mixin";
 import { useRegistryEmp } from "@/modules/08_registryEmployee/stores/registry-employee";
 import http from "@/plugins/http";
@@ -318,7 +322,11 @@ onMounted(async () => {
         <q-tooltip>เพิ่มข้อมูล</q-tooltip>
       </q-btn>
       <q-btn
-        v-if="checkPermission($route)?.attrIsUpdate"
+        v-if="
+          checkPermission($route)?.attrIsUpdate &&
+          checkPermissionList(['COMMAND']) &&
+          checkPermissionCreate('COMMAND')
+        "
         flat
         round
         color="primary"
diff --git a/src/modules/09_leave/components/02_WorkList/Tab1.vue b/src/modules/09_leave/components/02_WorkList/Tab1.vue
index 9dca91523..d65d6e0e5 100644
--- a/src/modules/09_leave/components/02_WorkList/Tab1.vue
+++ b/src/modules/09_leave/components/02_WorkList/Tab1.vue
@@ -144,6 +144,7 @@ async function fetchListTimeRecord() {
     keyword: keyword.value.trim(), //keyword ค้นหา
     profileType: roleStatus.value.trim(), //keyword ค้นหา
   };
+
   showLoader();
   await http
     .get(
@@ -219,10 +220,11 @@ onMounted(async () => {
     @update:pagination="updatePaging"
     v-model:role-status="roleStatus"
   />
+
   <TableList
     :total="total"
     :rows="rows.length > 0 ? rows : []"
-    :page="page"
+    v-model:page="page"
     :rowsPerPage="rowsPerPage"
     :maxPage="maxPage"
     @update:pagination="updatePaging"
diff --git a/src/modules/09_leave/components/02_WorkList/Tab2.vue b/src/modules/09_leave/components/02_WorkList/Tab2.vue
index f6a17f085..8d1992d78 100644
--- a/src/modules/09_leave/components/02_WorkList/Tab2.vue
+++ b/src/modules/09_leave/components/02_WorkList/Tab2.vue
@@ -181,7 +181,7 @@ onMounted(async () => {
   <TableList
     :total="total"
     :rows="rows.length > 0 ? rows : []"
-    :page="page"
+    v-model:page="page"
     :rowsPerPage="rowsPerPage"
     :maxPage="maxPage"
     @update:pagination="updatePagingProp"
diff --git a/src/modules/09_leave/components/02_WorkList/TableList.vue b/src/modules/09_leave/components/02_WorkList/TableList.vue
index db391c93f..98c3901db 100644
--- a/src/modules/09_leave/components/02_WorkList/TableList.vue
+++ b/src/modules/09_leave/components/02_WorkList/TableList.vue
@@ -9,15 +9,18 @@ import DialogDetail from "@/modules/09_leave/components/02_WorkList/DialogDetail
 import DialogEdit from "@/modules/09_leave/components/02_WorkList/DialogEdit.vue";
 
 const workStore = useWorklistDataStore();
+const currentPage = defineModel<number>("page", {
+  default: 1,
+});
 const props = defineProps({
   rows: {
     type: Object,
     require: true,
   },
-  page: {
-    type: Number,
-    require: true,
-  },
+  // page: {
+  //   type: Number,
+  //   require: true,
+  // },
   rowsPerPage: {
     type: Number,
     require: true,
@@ -48,10 +51,10 @@ const dataDetail = ref<any>();
 const modalEdit = ref<boolean>(false);
 
 /** pagination */
-const currentPage = ref<number>(1);
+// const currentPage = ref<number>(1);
 const pagination = ref({
   descending: false,
-  page: Number(props.page),
+  page: Number(currentPage.value),
   rowsPerPage: props.rowsPerPage,
 });
 
diff --git a/src/modules/09_leave/components/05_Leave/DetailLeavePage.vue b/src/modules/09_leave/components/05_Leave/DetailLeavePage.vue
index 6a8e35594..5357fba06 100644
--- a/src/modules/09_leave/components/05_Leave/DetailLeavePage.vue
+++ b/src/modules/09_leave/components/05_Leave/DetailLeavePage.vue
@@ -9,6 +9,7 @@ import genReport from "@/plugins/genreport";
 import { useCounterMixin } from "@/stores/mixin";
 import { useLeavelistDataStore } from "@/modules/09_leave/stores/LeaveStore";
 import { checkPermission } from "@/utils/permissions";
+import { useRoleWorkflowDataStore } from "@/stores/roleWorkflow";
 
 /** importType */
 import type { FremData } from "@/modules/09_leave/interface/request/leave";
@@ -38,6 +39,7 @@ import DialogAddCommander from "@/modules/09_leave/components/05_Leave/Dialog/Di
 /** use */
 const $q = useQuasar();
 const mixin = useCounterMixin();
+const { fetchDataCheckIsoffice } = useRoleWorkflowDataStore();
 const {
   dialogConfirm,
   showLoader,
@@ -426,10 +428,7 @@ function checkLeaveType(leaveTypeId: string, formData: FremData) {
       checkForm.value = "FormHajj";
     } else if (type === "LV-007") {
       checkForm.value = "FormCheckSelect";
-    } else if (
-      type === "LV-008" &&
-      formData.leaveSubTypeName === "ศึกษาต่อ"
-    ) {
+    } else if (type === "LV-008" && formData.leaveSubTypeName === "ศึกษาต่อ") {
       checkForm.value = "FormStudy";
     } else if (
       (type === "LV-008" && formData.leaveSubTypeName === "ฝึกอบรม") ||
@@ -615,23 +614,19 @@ function onSend() {
 }
 
 async function checkOfficer() {
-  http
-    .get(
-      config.API.checkIsofficer +
-        `${
-          formData.profileType == "OFFICER"
-            ? "SYS_LEAVE_LIST"
-            : "SYS_LEAVE_LIST_EMP"
-        }`
-    )
-    .then(async (res) => {
-      isOfficer.value = await res.data.result.isOfficer;
-      isStaff.value = await res.data.result.isStaff;
-    })
-    .catch((e) => {
-      messageError($q, e);
-    })
-    .finally(() => {});
+  try {
+    const data = await fetchDataCheckIsoffice(
+      `${
+        formData.profileType == "OFFICER"
+          ? "SYS_LEAVE_LIST"
+          : "SYS_LEAVE_LIST_EMP"
+      }`
+    );
+    isOfficer.value = data.isOfficer;
+    isStaff.value = data.isStaff;
+  } catch (err) {
+    messageError($q, err);
+  }
 }
 
 async function fetchKeycloakPosition() {
diff --git a/src/modules/09_leave/components/05_Leave/DetailLeaveReject.vue b/src/modules/09_leave/components/05_Leave/DetailLeaveReject.vue
index ad6fdf58a..c70abf79b 100644
--- a/src/modules/09_leave/components/05_Leave/DetailLeaveReject.vue
+++ b/src/modules/09_leave/components/05_Leave/DetailLeaveReject.vue
@@ -9,6 +9,7 @@ import genReport from "@/plugins/genreport";
 import { useCounterMixin } from "@/stores/mixin";
 import { useLeavelistDataStore } from "@/modules/09_leave/stores/LeaveStore";
 import { checkPermission } from "@/utils/permissions";
+import { useRoleWorkflowDataStore } from "@/stores/roleWorkflow";
 
 /** importType */
 import type {
@@ -35,6 +36,7 @@ import FormVocationalRehabilitation from "@/modules/09_leave/components/05_Leave
 
 /** use */
 const $q = useQuasar();
+const { fetchDataCheckIsoffice } = useRoleWorkflowDataStore();
 const mixin = useCounterMixin();
 const {
   dialogConfirm,
@@ -457,23 +459,19 @@ async function onClickDownloadFile(id: string, fileName: string, type: string) {
 }
 
 async function checkOfficer() {
-  http
-    .get(
-      config.API.checkIsofficer +
-        `${
-          formData.profileType == "OFFICER"
-            ? "SYS_LEAVE_LIST"
-            : "SYS_LEAVE_LIST_EMP"
-        }`
-    )
-    .then(async (res) => {
-      isOfficer.value = await res.data.result.isOfficer;
-      isStaff.value = await res.data.result.isStaff;
-    })
-    .catch((e) => {
-      messageError($q, e);
-    })
-    .finally(() => {});
+  try {
+    const data = await fetchDataCheckIsoffice(
+      `${
+        formData.profileType == "OFFICER"
+          ? "SYS_LEAVE_LIST"
+          : "SYS_LEAVE_LIST_EMP"
+      }`
+    );
+    isOfficer.value = data.isOfficer;
+    isStaff.value = data.isStaff;
+  } catch (err) {
+    messageError($q, err);
+  }
 }
 
 async function fetchKeycloakPosition() {
@@ -839,7 +837,7 @@ async function fetchKeycloakPosition() {
         v-if="
           rows &&
           rows.approvers[0]?.profileId == myProfileId &&
-          rows.approvers[0]?.approveStatus == 'PENDING'
+          formDataReject.status == 'NEW'
         "
       />
       <div
@@ -847,12 +845,11 @@ async function fetchKeycloakPosition() {
         v-if="
           rows &&
           rows.approvers[0]?.profileId == myProfileId &&
-          rows.approvers[0]?.approveStatus == 'PENDING'
+          formDataReject.status == 'NEW'
         "
       >
         <q-btn
           unelevated
-          :disable="rows?.approvers.length == 0 || rows?.commanders.length == 0"
           color="orange-5"
           label="ไม่อนุญาต"
           @click="openModal('UnApprove')"
diff --git a/src/modules/09_leave/views/01_RoundMain.vue b/src/modules/09_leave/views/01_RoundMain.vue
index 6f77842d3..182e6e70a 100644
--- a/src/modules/09_leave/views/01_RoundMain.vue
+++ b/src/modules/09_leave/views/01_RoundMain.vue
@@ -157,7 +157,7 @@ onMounted(async () => {
         ref="filterRef"
         outlined
         placeholder="ค้นหา"
-        @keydown.enter="onSearch"
+        @keydown.enter.prevent="onSearch"
       >
         <template v-slot:append>
           <q-icon name="search" />
diff --git a/src/modules/11_discipline/components/6_BasicInformation/Channel/MainPage.vue b/src/modules/11_discipline/components/6_BasicInformation/Channel/MainPage.vue
index 404d555e5..def2af083 100644
--- a/src/modules/11_discipline/components/6_BasicInformation/Channel/MainPage.vue
+++ b/src/modules/11_discipline/components/6_BasicInformation/Channel/MainPage.vue
@@ -203,7 +203,7 @@ onMounted(() => {
         for="filterKeyword"
         outlined
         placeholder="ค้นหา"
-        @keydown.enter="onSearch"
+        @keydown.enter.prevent="onSearch"
       >
         <template v-slot:append>
           <q-icon name="search" />
diff --git a/src/modules/11_discipline/components/7_ListSuspend/ListsPage.vue b/src/modules/11_discipline/components/7_ListSuspend/ListsPage.vue
index f5fcda435..a4427b18c 100644
--- a/src/modules/11_discipline/components/7_ListSuspend/ListsPage.vue
+++ b/src/modules/11_discipline/components/7_ListSuspend/ListsPage.vue
@@ -15,7 +15,11 @@ import type {
 import type { QTableProps } from "quasar";
 
 import DialogSendToCommand from "@/modules/11_discipline/components/7_ListSuspend/DialogSendToCommand.vue";
-import { checkPermission } from "@/utils/permissions";
+import {
+  checkPermission,
+  checkPermissionList,
+  checkPermissionCreate,
+} from "@/utils/permissions";
 
 /** use */
 const dataStore = useDisciplineSuspendStore();
@@ -338,7 +342,11 @@ onMounted(async () => {
           </div>
           <div>
             <q-btn
-              v-if="checkPermission($route)?.attrIsUpdate"
+              v-if="
+                checkPermission($route)?.attrIsUpdate &&
+                checkPermissionList(['COMMAND']) &&
+                checkPermissionCreate('COMMAND')
+              "
               @click="openModalOrder"
               flat
               round
diff --git a/src/modules/11_discipline/components/9_DisciplineReport/Main.vue b/src/modules/11_discipline/components/9_DisciplineReport/Main.vue
index 841eda64e..728cd7dfc 100644
--- a/src/modules/11_discipline/components/9_DisciplineReport/Main.vue
+++ b/src/modules/11_discipline/components/9_DisciplineReport/Main.vue
@@ -5,7 +5,7 @@ import { useRoute } from "vue-router";
 import { VuePDF, usePDF } from "@tato30/vue-pdf";
 import axios from "axios";
 import genReportXLSX from "@/plugins/genreportxlsx";
-import genReport from "@/plugins/genreport";
+
 
 import http from "@/plugins/http";
 import config from "@/app.config";
diff --git a/src/modules/12_evaluatePersonal/components/Detail/viewTab2/DialogDirector.vue b/src/modules/12_evaluatePersonal/components/Detail/viewTab2/DialogDirector.vue
index 1dfd6d58a..614827f86 100644
--- a/src/modules/12_evaluatePersonal/components/Detail/viewTab2/DialogDirector.vue
+++ b/src/modules/12_evaluatePersonal/components/Detail/viewTab2/DialogDirector.vue
@@ -205,7 +205,7 @@ watch(
           v-model="filterKeyword2"
           placeholder="ค้นหารายชื่อ"
           style="max-width: 100%"
-          @keydown.enter="onSearch"
+          @keydown.enter.prevent="onSearch"
         >
           <template v-slot:append>
             <q-icon name="search" />
diff --git a/src/modules/12_evaluatePersonal/components/Detail/viewTab2/DialogMeet.vue b/src/modules/12_evaluatePersonal/components/Detail/viewTab2/DialogMeet.vue
index 79a9c5540..0601f0879 100644
--- a/src/modules/12_evaluatePersonal/components/Detail/viewTab2/DialogMeet.vue
+++ b/src/modules/12_evaluatePersonal/components/Detail/viewTab2/DialogMeet.vue
@@ -205,7 +205,7 @@ watch(
           v-model="filterKeyword"
           placeholder="ค้นหารายการประชุม"
           style="max-width: 100%"
-          @keydown.enter="onSearch"
+          @keydown.enter.prevent="onSearch"
         >
           <template v-slot:append>
             <q-icon name="search" />
diff --git a/src/modules/12_evaluatePersonal/components/Director/MainPage.vue b/src/modules/12_evaluatePersonal/components/Director/MainPage.vue
index 01f77ffd0..4134a8a33 100644
--- a/src/modules/12_evaluatePersonal/components/Director/MainPage.vue
+++ b/src/modules/12_evaluatePersonal/components/Director/MainPage.vue
@@ -151,7 +151,7 @@ onMounted(() => {
         ref="filterRef"
         outlined
         placeholder="ค้นหา"
-        @keydown.enter="onSearch"
+        @keydown.enter.prevent="onSearch"
       >
         <template v-slot:append>
           <q-icon name="search" />
diff --git a/src/modules/12_evaluatePersonal/components/Meeting/MainPage.vue b/src/modules/12_evaluatePersonal/components/Meeting/MainPage.vue
index 323a8277a..3bb9d7472 100644
--- a/src/modules/12_evaluatePersonal/components/Meeting/MainPage.vue
+++ b/src/modules/12_evaluatePersonal/components/Meeting/MainPage.vue
@@ -119,7 +119,7 @@ onMounted(() => {
         ref="filterRef"
         outlined
         placeholder="ค้นหา"
-        @keydown.enter="onSearch"
+        @keydown.enter.prevent="onSearch"
       >
         <template v-slot:append>
           <q-icon name="search" />
diff --git a/src/modules/13_salary/components/04_salaryLists/Dashboard.vue b/src/modules/13_salary/components/04_salaryLists/Dashboard.vue
index 3989acd69..d957823dc 100644
--- a/src/modules/13_salary/components/04_salaryLists/Dashboard.vue
+++ b/src/modules/13_salary/components/04_salaryLists/Dashboard.vue
@@ -540,7 +540,7 @@ watch([() => props?.snapShot, () => props.roundFilter], () => {
             v-model="filter"
             placeholder="ค้นหา"
             outlined
-            @keydown.enter="onSearch"
+            @keydown.enter.prevent="onSearch"
           >
             <template v-slot:append>
               <q-icon name="search" />
diff --git a/src/modules/13_salary/components/05_salaryListsEmployee/Dashboard.vue b/src/modules/13_salary/components/05_salaryListsEmployee/Dashboard.vue
index 4f3cdc9dd..ac7ea863f 100644
--- a/src/modules/13_salary/components/05_salaryListsEmployee/Dashboard.vue
+++ b/src/modules/13_salary/components/05_salaryListsEmployee/Dashboard.vue
@@ -517,7 +517,7 @@ watch([() => props?.snapShot, () => props.roundFilter], () => {
             v-model="filter"
             placeholder="ค้นหา"
             outlined
-            @keydown.enter="onSearch"
+            @keydown.enter.prevent="onSearch"
           >
             <template v-slot:append>
               <q-icon name="search" />
diff --git a/src/modules/13_salary/components/05_salaryListsEmployee/TabMain.vue b/src/modules/13_salary/components/05_salaryListsEmployee/TabMain.vue
index eb7675cf3..441c724c2 100644
--- a/src/modules/13_salary/components/05_salaryListsEmployee/TabMain.vue
+++ b/src/modules/13_salary/components/05_salaryListsEmployee/TabMain.vue
@@ -338,7 +338,12 @@ async function onClickDownload(data: DataOption, type: string = "xlsx") {
             data.id,
             props.rootId,
             props.periodId
-          )
+          ) +
+            `${
+              data.id === "emp2-04" || data.id === "emp-04"
+                ? `/${data.typeName}`
+                : ""
+            }`
         )
         .then(async (res) => {
           const dataList = await res.data.result;
diff --git a/src/modules/13_salary/components/InfoDiscipline.vue b/src/modules/13_salary/components/InfoDiscipline.vue
index 1a5af20f6..943d4d547 100644
--- a/src/modules/13_salary/components/InfoDiscipline.vue
+++ b/src/modules/13_salary/components/InfoDiscipline.vue
@@ -140,7 +140,7 @@ onMounted(() => {
         v-model="keyword"
         label="ค้นหา"
         class="q-mr-sm"
-        @keydown.enter="onSearch"
+        @keydown.enter.prevent="onSearch"
       >
         <template v-slot:append>
           <q-icon name="search" />
diff --git a/src/modules/13_salary/components/InfoLeave.vue b/src/modules/13_salary/components/InfoLeave.vue
index ebdcb4c19..735fa6158 100644
--- a/src/modules/13_salary/components/InfoLeave.vue
+++ b/src/modules/13_salary/components/InfoLeave.vue
@@ -174,7 +174,7 @@ onMounted(() => {
         v-model="keyword"
         label="ค้นหา"
         class="q-mr-sm"
-        @keydown.enter="onSearch"
+        @keydown.enter.prevent="onSearch"
       >
         <template v-slot:append>
           <q-icon name="search" />
diff --git a/src/modules/13_salary/components/InfoSalary.vue b/src/modules/13_salary/components/InfoSalary.vue
index 8ee49a92f..4984ccf19 100644
--- a/src/modules/13_salary/components/InfoSalary.vue
+++ b/src/modules/13_salary/components/InfoSalary.vue
@@ -391,7 +391,7 @@ onMounted(() => {
         v-model="keyword"
         label="ค้นหา"
         class="q-mr-sm"
-        @keydown.enter="onSearch"
+        @keydown.enter.prevent="onSearch"
       >
         <template v-slot:append>
           <q-icon name="search" />
diff --git a/src/modules/13_salary/interface/index/Main.ts b/src/modules/13_salary/interface/index/Main.ts
index 894a3ef64..85b357746 100644
--- a/src/modules/13_salary/interface/index/Main.ts
+++ b/src/modules/13_salary/interface/index/Main.ts
@@ -2,6 +2,7 @@ interface DataOption {
   id: string;
   name: string;
   type?: string;
+  typeName?: string;
 }
 
 interface DataOptionShort {
diff --git a/src/modules/13_salary/store/SalaryEmployeeListsStore.ts b/src/modules/13_salary/store/SalaryEmployeeListsStore.ts
index 43029235c..81215e9cd 100644
--- a/src/modules/13_salary/store/SalaryEmployeeListsStore.ts
+++ b/src/modules/13_salary/store/SalaryEmployeeListsStore.ts
@@ -77,8 +77,15 @@ export const useSalaryEmployeeListSDataStore = defineStore(
       },
       {
         id: "emp-04",
-        name: "แบบ ลจ. กทม. 1 - รายชื่อลูกจ้างผู้สมควรได้เลื่อนขั้นค่าจ้าง",
+        name: "แบบ ลจ. กทม. 1 - รายชื่อลูกจ้างผู้สมควรได้เลื่อนขั้นค่าจ้าง (0.5 ขั้น)",
+        typeName: "HAFT",
       },
+      {
+        id: "emp-04",
+        name: "แบบ ลจ. กทม. 1 - รายชื่อลูกจ้างผู้สมควรได้เลื่อนขั้นค่าจ้าง (1 ขั้น) ",
+        typeName: "FULL",
+      },
+
       {
         id: "emp-05",
         name: "แบบ ลจ. กทม. 1 - 1 - รายชื่อลูกจ้างผู้สมควรได้รับค่าตอบแทนพิเศษ",
@@ -147,7 +154,18 @@ export const useSalaryEmployeeListSDataStore = defineStore(
       },
       {
         id: "emp2-04",
-        name: "บัญชีรายชื่อลูกจ้างประจำกรุงเทพมหานครผู้สมควรได้เลื่อนขั้นค่าจ้าง (แบบ ลจ. กทม. 1)",
+        name: "บัญชีรายชื่อลูกจ้างประจำกรุงเทพมหานครผู้สมควรได้เลื่อนขั้นค่าจ้าง (แบบ ลจ. กทม. 1) (0.5 ขั้น)",
+        typeName: "HAFT",
+      },
+      {
+        id: "emp2-04",
+        name: "บัญชีรายชื่อลูกจ้างประจำกรุงเทพมหานครผู้สมควรได้เลื่อนขั้นค่าจ้าง (แบบ ลจ. กทม. 1) (1 ขั้น)",
+        typeName: "FULL",
+      },
+      {
+        id: "emp2-04",
+        name: "บัญชีรายชื่อลูกจ้างประจำกรุงเทพมหานครผู้สมควรได้เลื่อนขั้นค่าจ้าง (แบบ ลจ. กทม. 1) (1.5 ขั้น)",
+        typeName: "FULLHAFT",
       },
       {
         id: "emp2-05",
diff --git a/src/modules/13_salary/views/04_salaryLists.vue b/src/modules/13_salary/views/04_salaryLists.vue
index 19f593ebf..4abe19ad6 100644
--- a/src/modules/13_salary/views/04_salaryLists.vue
+++ b/src/modules/13_salary/views/04_salaryLists.vue
@@ -4,7 +4,11 @@ import { useQuasar } from "quasar";
 
 import { useSalaryListSDataStore } from "@/modules/13_salary/store/SalaryListsStore";
 import { useCounterMixin } from "@/stores/mixin";
-import { checkPermission } from "@/utils/permissions";
+import {
+  checkPermission,
+  checkPermissionList,
+  checkPermissionCreate,
+} from "@/utils/permissions";
 import config from "@/app.config";
 import http from "@/plugins/http";
 
@@ -444,7 +448,9 @@ onMounted(async () => {
         v-if="
           (((isOfficer || isStaff) && snapFilter === 'SNAP2') ||
             roundFilter?.shortCode === 'SPECIAL') &&
-          periodLatest?.group1IsClose
+          periodLatest?.group1IsClose &&
+          checkPermissionList(['COMMAND']) &&
+          checkPermissionCreate('COMMAND')
         "
       >
         <q-btn
diff --git a/src/modules/13_salary/views/05_salaryListsEmployee.vue b/src/modules/13_salary/views/05_salaryListsEmployee.vue
index 24295411f..56e0713d7 100644
--- a/src/modules/13_salary/views/05_salaryListsEmployee.vue
+++ b/src/modules/13_salary/views/05_salaryListsEmployee.vue
@@ -4,7 +4,11 @@ import { useQuasar } from "quasar";
 
 import { useSalaryEmployeeListSDataStore } from "@/modules/13_salary/store/SalaryEmployeeListsStore";
 import { useCounterMixin } from "@/stores/mixin";
-import { checkPermission } from "@/utils/permissions";
+import {
+  checkPermission,
+  checkPermissionList,
+  checkPermissionCreate,
+} from "@/utils/permissions";
 import config from "@/app.config";
 import http from "@/plugins/http";
 
@@ -407,7 +411,9 @@ onMounted(async () => {
         v-if="
           (((isOfficer || isStaff) && snapFilter === 'SNAP2') ||
             roundFilter?.shortCode === 'SPECIAL') &&
-          periodLatest?.group1IsClose
+          periodLatest?.group1IsClose &&
+          checkPermissionList(['COMMAND']) &&
+          checkPermissionCreate('COMMAND')
         "
       >
         <q-btn
@@ -586,7 +592,7 @@ onMounted(async () => {
     v-model:is-officer="isOfficer"
     v-model:is-staff="isStaff"
     system-name="SALARY_EMP"
-    :command-type-code-array="['C-PM-36', 'C-PM-37']"
+    :command-type-code-array="['C-PM-36', 'C-PM-37', 'C-PM-45', 'C-PM-46']"
     :salary-period-id="salaryPeriodId"
     :title-command="titleCommand"
   />
diff --git a/src/modules/14_KPI/components/results/tableIndividual.vue b/src/modules/14_KPI/components/results/tableIndividual.vue
index 52b79cc7e..01e38b2c2 100644
--- a/src/modules/14_KPI/components/results/tableIndividual.vue
+++ b/src/modules/14_KPI/components/results/tableIndividual.vue
@@ -293,7 +293,7 @@ onMounted(async () => {
         outlined
         v-model="keyword"
         placeholder="ค้นหา"
-        @keydown.enter="onSearchData"
+        @keydown.enter.prevent="onSearchData"
       >
         <template v-slot:append>
           <q-icon name="search" />
diff --git a/src/modules/14_KPI/components/results/tableResults.vue b/src/modules/14_KPI/components/results/tableResults.vue
index d134a7982..dccb69de2 100644
--- a/src/modules/14_KPI/components/results/tableResults.vue
+++ b/src/modules/14_KPI/components/results/tableResults.vue
@@ -329,7 +329,7 @@ onMounted(async () => {
           outlined
           v-model="keyword"
           placeholder="ค้นหา"
-          @keydown.enter="onSearchData"
+          @keydown.enter.prevent="onSearchData"
         >
           <template v-slot:append>
             <q-icon name="search" />
diff --git a/src/modules/16_positionEmployee/components/DialogMovePos.vue b/src/modules/16_positionEmployee/components/DialogMovePos.vue
index 8243ada33..683ebb520 100644
--- a/src/modules/16_positionEmployee/components/DialogMovePos.vue
+++ b/src/modules/16_positionEmployee/components/DialogMovePos.vue
@@ -216,7 +216,7 @@ watch(
                     dense
                     v-model="filterTable"
                     label="ค้นหา"
-                    @keydown.enter="onSearchData"
+                    @keydown.enter.prevent="onSearchData"
                   >
                     <template v-slot:append>
                       <q-icon name="search" />
diff --git a/src/modules/17_acting/views/main.vue b/src/modules/17_acting/views/main.vue
index e76cce14f..f3c10d52a 100644
--- a/src/modules/17_acting/views/main.vue
+++ b/src/modules/17_acting/views/main.vue
@@ -4,7 +4,11 @@ import { useQuasar } from "quasar";
 
 import http from "@/plugins/http";
 import config from "@/app.config";
-import { checkPermission } from "@/utils/permissions";
+import {
+  checkPermission,
+  checkPermissionList,
+  checkPermissionCreate,
+} from "@/utils/permissions";
 import { useCounterMixin } from "@/stores/mixin";
 import { useActingStore } from "@/modules/17_acting/store/Main";
 import { useStructureTree } from "@/stores/structureTree";
@@ -316,7 +320,11 @@ onMounted(async () => {
 
     <q-btn
       class="q-px-sm"
-      v-if="storeActing.isOfficer"
+      v-if="
+        storeActing.isOfficer &&
+        checkPermissionList(['COMMAND']) &&
+        checkPermissionCreate('COMMAND')
+      "
       dense
       flat
       round
@@ -439,7 +447,7 @@ onMounted(async () => {
                             dense
                             v-model="keyword"
                             label="ค้นหา"
-                            @keydown.enter="onSearchRowPosition"
+                            @keydown.enter.prevent="onSearchRowPosition"
                           >
                             <template v-slot:append>
                               <q-icon name="search" color="grey-5" />
@@ -525,7 +533,7 @@ onMounted(async () => {
                             dense
                             v-model="keywordAct"
                             label="ค้นหา"
-                            @keydown.enter="onSearchListPerson"
+                            @keydown.enter.prevent="onSearchListPerson"
                           >
                             <template v-slot:append>
                               <q-icon name="search" color="grey-5" />
diff --git a/src/modules/18_command/components/Step/2_ListPersons.vue b/src/modules/18_command/components/Step/2_ListPersons.vue
index b4d1f6dfe..8a69fa33a 100644
--- a/src/modules/18_command/components/Step/2_ListPersons.vue
+++ b/src/modules/18_command/components/Step/2_ListPersons.vue
@@ -387,7 +387,7 @@ onMounted(async () => {
                   ref="filterRef"
                   outlined
                   placeholder="ค้นหา"
-                  @keydown.enter="onSearchData()"
+                  @keydown.enter.prevent="onSearchData()"
                 >
                   <template v-slot:append>
                     <q-icon name="search" />
diff --git a/src/modules/18_command/components/Step/3_ReceivedCopy.vue b/src/modules/18_command/components/Step/3_ReceivedCopy.vue
index e25adbee6..ce7263e21 100644
--- a/src/modules/18_command/components/Step/3_ReceivedCopy.vue
+++ b/src/modules/18_command/components/Step/3_ReceivedCopy.vue
@@ -232,7 +232,7 @@ onMounted(() => {
           outlined
           placeholder="ค้นหา"
           class="q-ml-sm"
-          @keydown.enter="onSearchData()"
+          @keydown.enter.prevent="onSearchData()"
         >
           <template v-slot:append>
             <q-icon name="search" />
diff --git a/src/modules/18_command/views/lists.vue b/src/modules/18_command/views/lists.vue
index 3d5350d02..ab642b701 100644
--- a/src/modules/18_command/views/lists.vue
+++ b/src/modules/18_command/views/lists.vue
@@ -193,7 +193,7 @@ onMounted(async () => {
               outlined
               v-model="queryParams.keyword"
               label="ค้นหา"
-              @keydown.enter="(queryParams.page = 1), fetchListCommand()"
+              @keydown.enter.prevent="(queryParams.page = 1), fetchListCommand()"
             >
               <template v-slot:append> <q-icon name="search" /> </template
             ></q-input>
diff --git a/src/modules/20_positionTemp/components/DialogMovePos.vue b/src/modules/20_positionTemp/components/DialogMovePos.vue
index 2cac2351c..264cae70a 100644
--- a/src/modules/20_positionTemp/components/DialogMovePos.vue
+++ b/src/modules/20_positionTemp/components/DialogMovePos.vue
@@ -216,7 +216,7 @@ watch(
                     dense
                     v-model="filterTable"
                     label="ค้นหา"
-                    @keydown.enter="onSearchData"
+                    @keydown.enter.prevent="onSearchData"
                   >
                     <template v-slot:append>
                       <q-icon name="search" />
diff --git a/src/modules/21_report/views/02_reportRegistry.vue b/src/modules/21_report/views/02_reportRegistry.vue
index 9de904811..b2081e488 100644
--- a/src/modules/21_report/views/02_reportRegistry.vue
+++ b/src/modules/21_report/views/02_reportRegistry.vue
@@ -139,6 +139,7 @@ const visibleColumnsBase = ref<string[]>([
   "age",
   "positionDate",
   "levelDate",
+  "posExecutiveDate",
 ]);
 
 const columns = computed<QTableProps["columns"]>(() => {
@@ -360,6 +361,17 @@ const columns = computed<QTableProps["columns"]>(() => {
       sort: (a: string, b: string) =>
         a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
     },
+    {
+      name: "posExecutiveDate",
+      align: "left",
+      label: "ระยะเวลาดำรงตำแหน่ง (บริหาร) ปัจจุบัน",
+      sortable: true,
+      field: "posExecutiveDate",
+      headerStyle: "font-size: 14px",
+      style: "font-size: 14px",
+      sort: (a: string, b: string) =>
+        a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
+    },
   ];
 });
 
@@ -608,9 +620,15 @@ async function onSearch() {
           ) ?? "-",
         levelDate:
           formatDatePositionReport(
-            item.levelDate?.posExecutiveYears,
-            item.levelDate?.posExecutiveMonths,
-            item.levelDate?.posExecutiveDays
+            item.levelDate?.Years,
+            item.levelDate?.Months,
+            item.levelDate?.Days
+          ) ?? "-",
+        posExecutiveDate:
+          formatDatePositionReport(
+            item.posExecutiveDate?.Years,
+            item.posExecutiveDate?.Months,
+            item.posExecutiveDate?.Days
           ) ?? "-",
         empType: employeeClass.value,
         dateRetireLaw: item.dateRetireLaw ?? "-",
@@ -1539,6 +1557,13 @@ watch(
                           size="xs"
                           class="text-grey-8"
                         />
+                        <q-radio
+                          v-model="typeTerm"
+                          val="tenureType"
+                          label="ระยะเวลาดำรงตำแหน่ง (บริหาร) ปัจจุบัน"
+                          size="xs"
+                          class="text-grey-8"
+                        />
                       </div>
                       <div class="q-pa-md" v-if="typeTerm">
                         <q-range
diff --git a/src/plugins/genreport.ts b/src/plugins/genreport.ts
index df010ad8c..94c685bbb 100644
--- a/src/plugins/genreport.ts
+++ b/src/plugins/genreport.ts
@@ -1,13 +1,10 @@
 import axios from "axios";
 import config from "@/app.config";
 
-import { useQuasar } from "quasar";
 import { useCounterMixin } from "@/stores/mixin";
 
-const $q = useQuasar();
-
 const mixin = useCounterMixin();
-const { showLoader, hideLoader, messageError } = mixin;
+const { showLoader, hideLoader } = mixin;
 
 async function genReport(
   data: any,
@@ -54,7 +51,7 @@ async function genReport(
       }
     })
     .catch((err) => {
-      messageError($q, err);
+      console.log(err);
     })
     .finally(() => {
       hideLoader();
diff --git a/src/plugins/genreportxlsx.ts b/src/plugins/genreportxlsx.ts
index 379e031db..6c2f05e35 100644
--- a/src/plugins/genreportxlsx.ts
+++ b/src/plugins/genreportxlsx.ts
@@ -1,13 +1,10 @@
 import axios from "axios";
 import config from "@/app.config";
 
-import { useQuasar } from "quasar";
 import { useCounterMixin } from "@/stores/mixin";
 
-const $q = useQuasar();
-
 const mixin = useCounterMixin();
-const { showLoader, hideLoader, messageError } = mixin;
+const { showLoader, hideLoader } = mixin;
 
 async function genReportXLSX(
   data: any,
@@ -53,7 +50,7 @@ async function genReportXLSX(
       }
     })
     .catch((e) => {
-      messageError($q, e);
+      console.log(e);
     })
     .finally(() => {
       hideLoader();
diff --git a/src/stores/roleWorkflow.ts b/src/stores/roleWorkflow.ts
new file mode 100644
index 000000000..ea0d81b53
--- /dev/null
+++ b/src/stores/roleWorkflow.ts
@@ -0,0 +1,25 @@
+import { defineStore } from "pinia";
+import { ref } from "vue";
+import http from "@/plugins/http";
+import config from "@/app.config";
+
+import type { DataRoleWorkflow } from "@/interface/response/main";
+
+export const useRoleWorkflowDataStore = defineStore("rolewrokflow", () => {
+  const dataRole = ref<{ [key: string]: DataRoleWorkflow[] }>({});
+
+  async function fetchDataCheckIsoffice(sysKey: string) {
+    if (dataRole.value[sysKey]) {
+      return dataRole.value[sysKey] || [];
+    } else {
+      try {
+        const res = await http.get(config.API.checkIsofficer + `${sysKey}`);
+        dataRole.value[sysKey] = res.data.result;
+        return res.data.result;
+      } catch (err) {
+        throw err;
+      }
+    }
+  }
+  return { fetchDataCheckIsoffice };
+});
diff --git a/src/stores/structureTree.ts b/src/stores/structureTree.ts
index 1de8bf225..d509f637c 100644
--- a/src/stores/structureTree.ts
+++ b/src/stores/structureTree.ts
@@ -1,6 +1,5 @@
 import { defineStore } from "pinia";
 import { ref } from "vue";
-import { useQuasar } from "quasar";
 
 import http from "@/plugins/http";
 import config from "@/app.config";
@@ -12,8 +11,7 @@ import type {
   DataActing,
 } from "@/interface/main";
 
-const $q = useQuasar();
-const { showLoader, hideLoader, messageError } = useCounterMixin();
+const { showLoader, hideLoader } = useCounterMixin();
 
 export const useStructureTree = defineStore("structureTree", () => {
   const activeId = ref<string>("");
@@ -48,7 +46,7 @@ export const useStructureTree = defineStore("structureTree", () => {
       const data = res.data.result;
       activeId.value = data.activeId;
     } catch (err) {
-      messageError($q, err);
+      console.log(err);
     }
   }
 
@@ -71,7 +69,8 @@ export const useStructureTree = defineStore("structureTree", () => {
       dataStore.value[sysKey] = data;
       return data;
     } catch (err) {
-      messageError($q, err);
+      console.log(err);
+      return [];
     } finally {
       isLoad && hideLoader();
     }
@@ -89,7 +88,7 @@ export const useStructureTree = defineStore("structureTree", () => {
         dataStrategy.value = data;
         return data;
       } catch (err) {
-        messageError($q, err);
+        console.log(err);
       } finally {
         hideLoader();
       }
@@ -110,7 +109,7 @@ export const useStructureTree = defineStore("structureTree", () => {
         dataActing.value = data;
         return data;
       } catch (err) {
-        messageError($q, err);
+        console.log(err);
       } finally {
         hideLoader();
       }
diff --git a/src/style/quasar-variables.sass b/src/style/quasar-variables.sass
index f5aac1211..0cb640aa1 100644
--- a/src/style/quasar-variables.sass
+++ b/src/style/quasar-variables.sass
@@ -198,3 +198,6 @@ h3.resigtry-tab-title
 
 .filter-card
     background-color: #f1f1f1b0
+
+.dp__menu
+    position: fixed !important