diff --git a/src/api/02_organizational/api.organization.ts b/src/api/02_organizational/api.organization.ts
index b07565b76..92d126242 100644
--- a/src/api/02_organizational/api.organization.ts
+++ b/src/api/02_organizational/api.organization.ts
@@ -112,4 +112,10 @@ export default {
    * รายการคำร้องขอแก้ไขทะเบียนประวัติ
    */
   requestEdit: `${orgProfile}/edit/`,
+
+  /**
+   * รายการเมนู
+   */
+  orgPermissions: `${organization}/permission/menu`,
+  orgPermissionsSys: `${organization}/permission`,
 };
diff --git a/src/interface/response/main.ts b/src/interface/response/main.ts
new file mode 100644
index 000000000..7db230f15
--- /dev/null
+++ b/src/interface/response/main.ts
@@ -0,0 +1,40 @@
+interface ListMenu {
+  id: string;
+  icon: string;
+  order: number;
+  parentId?: string | null;
+  path: string;
+  sysDescription: string;
+  sysName: string;
+  children?: ListMenu[];
+}
+
+interface ChildConfig {
+  sysName?: string;
+  path: string;
+}
+
+interface ChildLevelTree {
+  [key: string]: ChildConfig[];
+}
+
+interface DataPermissions {
+  id: string;
+  roleDescription: string;
+  roleName: string;
+  roles: DataRoles[];
+}
+
+interface DataRoles {
+  attrIsCreate: boolean;
+  attrIsDelete: boolean;
+  attrIsGet: boolean;
+  attrIsList: boolean;
+  attrIsUpdate: boolean;
+  attrOwnership: string;
+  attrPrivilege: string;
+  authSysId: string;
+  parentNode: string;
+}
+
+export type { ListMenu, ChildLevelTree, ChildConfig, DataPermissions };
diff --git a/src/main.ts b/src/main.ts
index 646376a1b..24545e6ac 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -98,24 +98,27 @@ const kcToken = getCookie("BMAHRIS_KEYCLOAK_IDENTITY");
 const kcRefreshToken = getCookie("BMAHRIS_KEYCLOAK_REFRESH");
 
 if (kcToken && kcRefreshToken) {
-  keycloak
-    .init({
-      // onLoad: 'login-required',
-      checkLoginIframe: false,
-      token: kcToken,
-      refreshToken: kcRefreshToken,
-    })
-    .then((authenticated) => {
-      console.log("authenticated", authenticated);
-      if (!authenticated) {
-        window.location.reload();
-      } else {
-        console.log("Authenticated");
-      }
-    })
-    .catch((err) => {
-      console.error("Keycloak initialization failed:", err);
-    });
+  keycloak.init({
+    // onLoad: 'login-required',
+    checkLoginIframe: false,
+    token: kcToken,
+    refreshToken: kcRefreshToken,
+  });
+  keycloak.authenticated = true;
+
+  // .then((authenticated) => {
+  //   console.log("authenticated", authenticated);
+  //   if (!authenticated) {
+  //     window.location.reload();
+  //   } else {
+  //     console.log("Authenticated");
+  //   }
+  // })
+  // .catch((err) => {
+  //   console.error("Keycloak initialization failed:", err);
+  // });
+} else {
+  keycloak.authenticated = false;
 }
 
 app.mount("#app");
diff --git a/src/modules/02_organizationalNew/components/DialogAddPosition.vue b/src/modules/02_organizationalNew/components/DialogAddPosition.vue
index dc16d3528..197a0144f 100644
--- a/src/modules/02_organizationalNew/components/DialogAddPosition.vue
+++ b/src/modules/02_organizationalNew/components/DialogAddPosition.vue
@@ -11,7 +11,6 @@ import config from "@/app.config";
 import type {
   DataOption,
   FormPositionSelect,
-  FormPositionSelectRef,
 } from "@/modules/02_organizationalNew/interface/index/Main";
 import type {
   OptionType,
diff --git a/src/modules/02_organizationalNew/components/DialogFormDateTime.vue b/src/modules/02_organizationalNew/components/DialogFormDateTime.vue
index 74add7fa9..70ac8a855 100644
--- a/src/modules/02_organizationalNew/components/DialogFormDateTime.vue
+++ b/src/modules/02_organizationalNew/components/DialogFormDateTime.vue
@@ -70,10 +70,10 @@ function onSubmit() {
       .put(config.API.orgSetDateTime(store.draftId as string), {
         orgPublishDate: dateTime.value,
       })
-      .then((res) => {
-        props.close?.();
-        props.fetchActive();
-        success($q, "บันทึกข้อมูลสำเร็จ");
+      .then(async () => {
+        await props.fetchActive();
+        await props.close?.();
+        await success($q, "บันทึกข้อมูลสำเร็จ");
       })
       .catch((e) => {
         messageError($q, e);
@@ -91,9 +91,9 @@ function onClickPublish() {
       showLoader();
       http
         .get(config.API.organizationPublishGet)
-        .then((res) => {
-          props.fetchActive();
-          props.close?.();
+        .then(async () => {
+          await props.fetchActive();
+          await props.close?.();
         })
         .catch((e) => {
           messageError($q, e);
diff --git a/src/modules/02_organizationalNew/components/DialogFormPosition.vue b/src/modules/02_organizationalNew/components/DialogFormPosition.vue
index 34b900283..865b51d4e 100644
--- a/src/modules/02_organizationalNew/components/DialogFormPosition.vue
+++ b/src/modules/02_organizationalNew/components/DialogFormPosition.vue
@@ -1,30 +1,58 @@
 <script setup lang="ts">
 import { ref, reactive, watch } from "vue";
 import { useQuasar } from "quasar";
-import { useCounterMixin } from "@/stores/mixin";
-import type { QTableProps } from "quasar";
-import DialogHeader from "@/components/DialogHeader.vue";
-import DialogAddPosition from "@/modules/02_organizationalNew/components/DialogAddPosition.vue";
 
+import http from "@/plugins/http";
+import config from "@/app.config";
+
+/**
+ * importType
+ */
+import type { QTableProps } from "quasar";
 import type {
   FormDataPosition,
   FormPositionRef,
   DataOption,
   FormPositionSelect,
   RowDetailPositions,
-  FormPositionSelectRef,
   ListMenu,
 } from "@/modules/02_organizationalNew/interface/index/Main";
 import type {
   OptionType,
-  OptionLevel,
   OptionExecutive,
-  DataPosition,
 } from "@/modules/02_organizationalNew/interface/response/organizational";
 import type { FilterMaster } from "@/modules/02_organizationalNew/interface/request/organizational";
-import http from "@/plugins/http";
-import config from "@/app.config";
 
+/**
+ * importComponents
+ */
+import DialogHeader from "@/components/DialogHeader.vue";
+import DialogAddPosition from "@/modules/02_organizationalNew/components/DialogAddPosition.vue";
+
+/**
+ * importStore
+ */
+import { useCounterMixin } from "@/stores/mixin";
+
+/**
+ * use
+ */
+const $q = useQuasar();
+const mixin = useCounterMixin();
+const {
+  dialogConfirm,
+  showLoader,
+  hideLoader,
+  messageError,
+  success,
+  dialogRemove,
+  dialogMessageNotify,
+} = mixin;
+
+/**
+ * props
+ */
+const reqMaster = defineModel<FilterMaster>("reqMaster", { required: true });
 const props = defineProps({
   modal: Boolean,
   close: Function,
@@ -39,24 +67,10 @@ const props = defineProps({
 
 const isEdit = ref<boolean>(false);
 const modalAdd = ref<boolean>(false);
-const reqMaster = defineModel<FilterMaster>("reqMaster", { required: true });
 const isReadonly = ref<boolean>(false); // อ่านได้อย่างเดียว
 const isDisValidate = ref<boolean>(false);
 const isPosition = ref<boolean>(false);
-const succession = ref<boolean>(false); // id ของตำแหน่งที่จะสืบทอด
 const dataCopy = ref<any>();
-const $q = useQuasar();
-const mixin = useCounterMixin();
-const {
-  dialogConfirm,
-  showLoader,
-  hideLoader,
-  messageError,
-  success,
-  dialogRemove,
-  dialogMessageNotify,
-} = mixin;
-const selected = ref<any>([]);
 const search = ref<string>("");
 const type = ref<string>("positionName");
 const optionFilter = ref<DataOption[]>([
@@ -68,12 +82,10 @@ const optionFilter = ref<DataOption[]>([
   { id: "positionExecutiveField", name: "ด้านทางการบริหาร" },
   { id: "positionArea", name: "ด้าน/สาขา" },
 ]);
-
 const typeOpsMain = ref<DataOption[]>([]);
 const executiveOpsMain = ref<DataOption[]>([]);
 const executiveOps = ref<DataOption[]>([]);
 const typeOps = ref<DataOption[]>([]);
-
 const listMenu = ref<ListMenu[]>([
   {
     label: "คัดลอก",
@@ -101,14 +113,6 @@ const rowsPositionSelect = ref<RowDetailPositions[]>([]);
 const prefixNoRef = ref<Object | null>(null);
 const positionNoRef = ref<Object | null>(null);
 
-const positionNameRef = ref<Object | null>(null);
-const positionFieldRef = ref<Object | null>(null);
-const positionTypeRef = ref<Object | null>(null);
-const positionLevelRef = ref<Object | null>(null);
-const positionExecutiveRef = ref<Object | null>(null);
-const positionExecutiveFieldRef = ref<Object | null>(null);
-const positionAreaRef = ref<Object | null>(null);
-
 const formData = reactive<FormDataPosition>({
   shortName: props.shortName,
   prefixNo: "",
@@ -135,16 +139,6 @@ const objectPositionRef: FormPositionRef = {
   positionNo: positionNoRef,
 };
 
-const objectPositionSelectRef: FormPositionSelectRef = {
-  positionName: positionNameRef,
-  positionField: positionFieldRef,
-  positionType: positionTypeRef,
-  positionLevel: positionLevelRef,
-  positionExecutive: positionExecutiveRef,
-  positionExecutiveField: positionExecutiveFieldRef,
-  positionArea: positionAreaRef,
-};
-
 const columns = ref<QTableProps["columns"]>([
   {
     name: "no",
@@ -274,26 +268,6 @@ async function fetchType() {
     });
 }
 
-/** function เรียกรายการระดับตำแหน่ง */
-// async function fetchLevel() {
-//   showLoader();
-//   await http
-//     .get(config.API.orgPosLevel)
-//     .then((res) => {
-//       levelOpsMain.value = res.data.result.map((e: OptionLevel) => ({
-//         id: e.id,
-//         name: e.posLevelName,
-//       }));
-//       levelOps.value = levelOpsMain.value;
-//     })
-//     .catch((err) => {
-//       messageError($q, err);
-//     })
-//     .finally(() => {
-//       hideLoader();
-//     });
-// }
-
 /** function เรียกรายการตำแหน่งทางการบริหาร */
 async function fetchExecutive() {
   showLoader();
@@ -335,24 +309,6 @@ function validateForm() {
   }
 }
 
-/** ฟังก์ชั่นตรวจสอบความถูกต้องของข้อมูลในฟอร์ม */
-// function validateFormPositionEdit() {
-//   isDisValidate.value = false;
-//   const hasError = [];
-//   for (const key in objectPositionSelectRef) {
-//     if (Object.prototype.hasOwnProperty.call(objectPositionSelectRef, key)) {
-//       const property = objectPositionSelectRef[key];
-//       if (property.value && typeof property.value.validate === "function") {
-//         const isValid = property.value.validate();
-//         hasError.push(isValid);
-//       }
-//     }
-//   }
-//   if (hasError.every((result) => result === true)) {
-//     onSubmitSelectEdit();
-//   }
-// }
-
 /** ฟังชั่น บันทึก */
 function onSubmit() {
   dialogConfirm($q, async () => {
@@ -387,15 +343,15 @@ function onSubmit() {
     props.actionType === "ADD" || props.actionType === "COPY"
       ? await http
           .post(config.API.orgPosMaster, body)
-          .then(() => {
-            success($q, "เพิ่มข้อมูลสำเร็จ");
-            props.fetchDataTable?.(
+          .then(async () => {
+            await props.fetchDataTable?.(
               reqMaster.value.id,
               reqMaster.value.type,
               false
             );
-            props.getSummary?.();
-            close();
+            await props.getSummary?.();
+            await close();
+            await success($q, "เพิ่มข้อมูลสำเร็จ");
           })
           .catch((err) => {
             messageError($q, err);
@@ -406,14 +362,14 @@ function onSubmit() {
       : props.rowId &&
         (await http
           .put(config.API.orgPosMasterById(props.rowId), body)
-          .then(() => {
-            success($q, "แก้ไขข้อมูลสำเร็จ");
-            props.fetchDataTable?.(
+          .then(async () => {
+            await props.fetchDataTable?.(
               reqMaster.value.id,
               reqMaster.value.type,
               false
             );
-            close();
+            await close();
+            await success($q, "แก้ไขข้อมูลสำเร็จ");
           })
           .catch((err) => {
             messageError($q, err);
@@ -423,42 +379,6 @@ function onSubmit() {
           }));
   });
 }
-/** ฟังชั่น บันทึก */
-// function onSubmitSelectEdit() {
-//   dialogConfirm(
-//     $q,
-//     async () => {
-//       showLoader();
-//       const body = {
-//         posDictName: formPositionSelect.positionName,
-//         posDictField: formPositionSelect.positionField, //สายงาน
-//         posTypeId: formPositionSelect.positionType, //*ประเภทตำแหน่ง
-//         posLevelId: formPositionSelect.positionLevel, //*ระดับตำแหน่ง
-//         posExecutiveId:
-//           formPositionSelect.positionExecutive !== ""
-//             ? formPositionSelect.positionExecutive
-//             : null, //ตำแหน่งทางการบริหาร
-//         posDictExecutiveField: formPositionSelect.positionExecutiveField, //ด้านทางการบริหาร
-//         posDictArea: formPositionSelect.positionArea, //ด้าน/สาขา
-//       };
-//       await http
-//         .post(config.API.orgPosPosition, body)
-//         .then(() => {
-//           success($q, "เพิ่มข้อมูลสำเร็จ");
-
-//           clearFormPositionSelect();
-//         })
-//         .catch((err) => {
-//           messageError($q, err);
-//         })
-//         .finally(() => {
-//           hideLoader();
-//         });
-//     },
-//     "ยืนยันการเพิ่มตำแหน่ง",
-//     "ต้องการยืนยันการเพิ่มตำแหน่งนี้ใช่หรือไม่?"
-//   );
-// }
 
 /** input ค้นหา */
 const searchRef = ref<any>(null);
@@ -483,16 +403,6 @@ async function searchInput() {
   }
 }
 
-// function updateSelectType(val: string) {
-//   const listLevel = dataLevel.value.find((e: any) => e.id === val);
-//   levelOpsMain.value = listLevel.posLevels.map((e: OptionLevel) => ({
-//     id: e.id,
-//     name: e.posLevelName,
-//   }));
-//   levelOps.value = levelOpsMain.value;
-//   formPositionSelect.positionLevel = "";
-// }
-
 /**
  * คัดลอกข้อมูล
  * @param data ข้อมูลตำแหน่ง
@@ -779,7 +689,6 @@ async function emitSearch(keyword: string, typeSelect: string) {
                               {{ col.value }}
                             </div>
                           </q-td>
-
                         </q-tr>
                       </template>
                     </d-table>
@@ -983,7 +892,6 @@ async function emitSearch(keyword: string, typeSelect: string) {
                               {{ col.value }}
                             </div>
                           </q-td>
-
                         </q-tr>
                       </template>
                     </d-table>
diff --git a/src/modules/02_organizationalNew/components/DialogHistory.vue b/src/modules/02_organizationalNew/components/DialogHistory.vue
index 060dbedd5..ccee85592 100644
--- a/src/modules/02_organizationalNew/components/DialogHistory.vue
+++ b/src/modules/02_organizationalNew/components/DialogHistory.vue
@@ -1,26 +1,43 @@
 <script setup lang="ts">
-import { ref, reactive, watch } from "vue";
+import { ref, watch } from "vue";
 import { useQuasar } from "quasar";
-import { useCounterMixin } from "@/stores/mixin";
-import type { QTableProps } from "quasar";
-import type { HistoryPostType } from "@/modules/02_organizationalNew/interface/index/Main";
-
-import DialogHeader from "@/components/DialogHeader.vue";
-import Modal from "@/modules/05_placement/components/AppointEmployee/Modal.vue";
-import { getDateMeta } from "@fullcalendar/core/internal";
-
 import http from "@/plugins/http";
 import config from "@/app.config";
 
+/**
+ * importType
+ */
+import type { QTableProps } from "quasar";
+import type { HistoryPostType } from "@/modules/02_organizationalNew/interface/index/Main";
+
+/**
+ * importComponrnts
+ */
+import DialogHeader from "@/components/DialogHeader.vue";
+
+/**
+ * importStore
+ */
+import { useCounterMixin } from "@/stores/mixin";
+
+/**
+ * use
+ */
+const $q = useQuasar();
+const mixin = useCounterMixin();
+const { showLoader, hideLoader, messageError, date2Thai } = mixin;
+
+/**
+ * props
+ */
 const modal = defineModel<boolean>("history", { required: true });
 const type = defineModel<number>("type", { required: true });
 const orgId = defineModel<string>("orgId", { required: true });
 
-const $q = useQuasar();
-const mixin = useCounterMixin();
-const { showLoader, hideLoader, messageError, date2Thai } = mixin;
+/**
+ * ข้อมุล Table
+ */
 const rows = ref<HistoryPostType[]>([]);
-
 const columns = ref<QTableProps["columns"]>([
   {
     name: "no",
@@ -67,6 +84,9 @@ const visibleColumns = ref<string[]>([
   "lastUpdatedAt",
 ]);
 
+/**
+ * function เรียกข้อมูล ประวัติหน่วยงาน,ประวัติส่วนราชการ
+ */
 function postData() {
   showLoader();
   http
@@ -79,7 +99,9 @@ function postData() {
       const dataMap = dataList.map((item: HistoryPostType) => ({
         id: item.id ? item.id : "-",
         name: item.name ? item.name : "-",
-        lastUpdatedAt: item.lastUpdatedAt ? date2Thai(item.lastUpdatedAt as Date,false,true) : "-",
+        lastUpdatedAt: item.lastUpdatedAt
+          ? date2Thai(item.lastUpdatedAt as Date, false, true)
+          : "-",
         orgRevisionName: item.orgRevisionName ? item.orgRevisionName : "-",
       }));
       rows.value = dataMap;
@@ -91,6 +113,10 @@ function postData() {
       hideLoader();
     });
 }
+
+/**
+ * callback function  เมื่อ modal = true เรียกข้อมูล ประวัติหน่วยงาน,ประวัติส่วนราชการ
+ */
 watch(
   () => modal.value,
   () => {
diff --git a/src/modules/02_organizationalNew/components/DialogHistoryPos.vue b/src/modules/02_organizationalNew/components/DialogHistoryPos.vue
index 1ca12daf7..14860363b 100644
--- a/src/modules/02_organizationalNew/components/DialogHistoryPos.vue
+++ b/src/modules/02_organizationalNew/components/DialogHistoryPos.vue
@@ -37,8 +37,9 @@ const props = defineProps({
 });
 
 /**
- * Table
+ * ข้อมูล Table
  */
+const rows = ref<HistoryPos[]>([]);
 const columns = ref<QTableProps["columns"]>([
   {
     name: "no",
@@ -145,8 +146,11 @@ const columns = ref<QTableProps["columns"]>([
     style: "font-size: 14px",
   },
 ]);
-const rows = ref<HistoryPos[]>([]);
 
+/**
+ *  function เรียกข้อมูลประวัติตำแหน่ง
+ * @param id
+ */
 function fetchHistoryPos(id: string) {
   showLoader();
   http
diff --git a/src/modules/02_organizationalNew/components/DialogMovePos.vue b/src/modules/02_organizationalNew/components/DialogMovePos.vue
index 01f4c7508..03879bfec 100644
--- a/src/modules/02_organizationalNew/components/DialogMovePos.vue
+++ b/src/modules/02_organizationalNew/components/DialogMovePos.vue
@@ -4,6 +4,9 @@ import { useQuasar } from "quasar";
 import http from "@/plugins/http";
 import config from "@/app.config";
 
+/**
+ * importType
+ */
 import type { QTableProps } from "quasar";
 import type {
   OrgTree,
@@ -16,11 +19,20 @@ import type {
 } from "@/modules/02_organizationalNew/interface/request/organizational";
 import type { DataTree } from "@/modules/02_organizationalNew/interface/index/organizational";
 
+/**
+ * importComponents
+ */
 import HeaderDialog from "@/components/DialogHeader.vue";
 
+/**
+ * importStore
+ */
 import { useCounterMixin } from "@/stores/mixin";
 import { useOrganizational } from "@/modules/02_organizationalNew/store/organizational";
 
+/**
+ * use
+ */
 const $q = useQuasar();
 const store = useOrganizational();
 const {
@@ -32,13 +44,15 @@ const {
   success,
 } = useCounterMixin();
 
+/**
+ * props
+ */
 const modal = defineModel<boolean>("modal", { required: true });
 const reqMaster = defineModel<FilterMaster>("reqMaster", { required: true });
 const totalPage = defineModel<number>("totalPage", { required: true });
 const nodeTree = defineModel<OrgTree[]>("nodeTree", { required: true });
 const columns = defineModel<QTableProps[]>("columns", {});
 const rows = defineModel<PosMaster2[]>("rows", { required: true });
-
 const props = defineProps({
   fetchDataTree: {
     type: Function,
@@ -63,19 +77,13 @@ const filterTree = ref<string>("");
 const filterRef = ref();
 const selectedTree = ref<string>("");
 const levelTree = ref<number>(0);
-
 const filterTable = ref<string>("");
 const selectedFilter = ref<PosMaster2[]>([]);
 
-function resetFilter() {
-  filterTree.value = "";
-  filterRef.value.focus();
-}
-
-function updateSelected(data: DataTree) {
-  levelTree.value = data.orgLevel;
-  selectedTree.value = data.orgTreeId;
-}
+const pagination = ref({
+  page: reqMaster.value.page,
+  rowsPerPage: reqMaster.value.pageSize,
+});
 
 const isDisable = computed(() => {
   if (selectedTree.value === "" && selectedFilter.value.length === 0) {
@@ -83,12 +91,29 @@ const isDisable = computed(() => {
   } else return false;
 });
 
+/**
+ * function รีเช็ด filter
+ */
+function resetFilter() {
+  filterTree.value = "";
+  filterRef.value.focus();
+}
+
+/**
+ * function เลือกข้อมูลหน่วยงาน
+ */
+function updateSelected(data: DataTree) {
+  levelTree.value = data.orgLevel;
+  selectedTree.value = data.orgTreeId;
+}
+
+/**
+ * function ยืนยันการย้ายแหน่งจากหน่วยงาน/ส่วนราชการปัจจุบัน
+ */
 function onClickMovePos() {
   if (selectedTree.value === "" || selectedTree.value === null) {
-    console.log("เลือกหน่วยงาน");
     dialogMessageNotify($q, "กรุณาเลือกหน่วยงานที่จะย้ายไป");
   } else if (selectedFilter.value.length === 0) {
-    console.log("เลือกตำแห่นง");
     dialogMessageNotify($q, "กรุณาเลือกตำแห่นงที่จะย้าย");
   } else {
     dialogConfirm(
@@ -148,11 +173,6 @@ function updatePagination(newPagination: NewPagination) {
   reqMaster.value.pageSize = newPagination.rowsPerPage;
   reqMaster.value.page = 1;
 }
-
-const pagination = ref({
-  page: reqMaster.value.page,
-  rowsPerPage: reqMaster.value.pageSize,
-});
 </script>
 
 <template>
diff --git a/src/modules/02_organizationalNew/components/DialogNewStructure.vue b/src/modules/02_organizationalNew/components/DialogNewStructure.vue
index 7e1e01c44..4a42f44bf 100644
--- a/src/modules/02_organizationalNew/components/DialogNewStructure.vue
+++ b/src/modules/02_organizationalNew/components/DialogNewStructure.vue
@@ -4,8 +4,9 @@ import { useQuasar } from "quasar";
 import http from "@/plugins/http";
 import config from "@/app.config";
 
-import DialogHeader from "@/components/DialogHeader.vue";
-
+/**
+ * importType
+ */
 import type {
   FormDataNewStructure,
   FormNewStructureRef,
@@ -13,18 +14,29 @@ import type {
   HistoryType,
 } from "@/modules/02_organizationalNew/interface/index/Main";
 
+/** importComponents*/
+import DialogHeader from "@/components/DialogHeader.vue";
+
+/**
+ * importStore
+ */
 import { useCounterMixin } from "@/stores/mixin";
 import { useOrganizational } from "@/modules/02_organizationalNew/store/organizational";
 
+/**
+ * use
+ */
 const $q = useQuasar();
 const store = useOrganizational();
 const { dialogConfirm, showLoader, success, hideLoader, messageError } =
   useCounterMixin();
 
+/**
+ * props
+ */
 const modal = defineModel<boolean>("newStructure", { required: true });
 const status = defineModel<boolean>("status", { required: true });
 const type = defineModel<string>("type", { default: "NEW" });
-
 const props = defineProps({
   fetchActive: {
     type: Function,
@@ -51,8 +63,6 @@ const typeOp = ref<DataOption[]>([
     name: "ทำสำเนาโครงสร้าง ตำแหน่ง และคนครอง",
   },
 ]);
-const orgRevisionOpMain = ref<DataOption[]>([]);
-const orgRevisionOp = ref<DataOption[]>([]);
 
 const orgRevisionNameRef = ref<Object | null>(null);
 const typeRef = ref<Object | null>(null);
@@ -64,14 +74,18 @@ const formData = reactive<FormDataNewStructure>({
   typeDraft: "",
 });
 
-/** maping ref เข้าตัวแปรเพื่อเตรียมตรวจสอบ */
+/**
+ * maping ref เข้าตัวแปรเพื่อเตรียมตรวจสอบ
+ */
 const objectRef: FormNewStructureRef = {
   orgRevisionName: orgRevisionNameRef,
   type: typeRef,
   orgRevisionId: orgRevisionIdRef,
 };
 
-/** ฟังก์ชั่นตรวจสอบความถูกต้องของข้อมูลในฟอร์ม */
+/**
+ * ฟังก์ชั่นตรวจสอบความถูกต้องของข้อมูลในฟอร์ม
+ */
 function validateForm() {
   const hasError = [];
   for (const key in objectRef) {
@@ -88,7 +102,9 @@ function validateForm() {
   }
 }
 
-/** ฟังชั่น บันทึก */
+/**
+ * ฟังชั่น บันทึก
+ */
 function onSubmit() {
   dialogConfirm(
     $q,
@@ -120,6 +136,9 @@ function onSubmit() {
   );
 }
 
+/**
+ * ฟังชั่น ปิด popup
+ */
 function close() {
   modal.value = false;
   formData.orgRevisionId = "";
@@ -127,20 +146,18 @@ function close() {
   formData.typeDraft = "";
 }
 
-async function fetchOrgRevision() {
+/**
+ * เรียกข้อมูล
+ */
+function fetchOrgRevision() {
   showLoader();
-  await http
+  http
     .get(config.API.organizationHistoryNew)
     .then(async (res) => {
       const data = res.data.result.filter(
         (e: HistoryType) => e.orgRevisionIsDraft === false
       );
       if (data) {
-        // const listOption = data.map((e: HistoryType) => ({
-        //   id: e.orgRevisionId,
-        //   name: e.orgRevisionName,
-        // }));
-        // orgRevisionOpMain.value = listOption;
         const currentStr = await data.find(
           (x: any) => x.orgRevisionIsCurrent === true
         );
@@ -155,20 +172,6 @@ async function fetchOrgRevision() {
     });
 }
 
-// function filterSelector(val: any, update: Function, refData: string) {
-//   switch (refData) {
-//     case "orgRevisionId":
-//       update(() => {
-//         orgRevisionOp.value = orgRevisionOpMain.value.filter(
-//           (v: DataOption) => v.name.indexOf(val) > -1
-//         );
-//       });
-//       break;
-//     default:
-//       break;
-//   }
-// }
-
 watch(
   () => modal.value,
   () => {
@@ -218,36 +221,6 @@ watch(
                   lazy-rules
                 />
               </div>
-              <!-- <div class="col-6" v-if="type !== 'NEW'">
-                <q-select
-                  for="#orgRevisionId"
-                  ref="orgRevisionIdRef"
-                  dense
-                  hide-bottom-space
-                  outlined
-                  option-label="name"
-                  option-value="id"
-                  emit-value
-                  map-options
-                  v-model="formData.orgRevisionId"
-                  :options="orgRevisionOp"
-                  label="เลือกโครงสร้าง"
-                  :rules="[(val) => !!val || `${'กรุณาเลือกโครงการสร้าง'}`]"
-                  lazy-rules
-                  use-input
-                  @filter="(inputValue:any,
-                  doneFn:Function) => filterSelector(inputValue, doneFn,'orgRevisionId'
-                  ) "
-                >
-                  <template v-slot:no-option>
-                    <q-item>
-                      <q-item-section class="text-grey-5">
-                        ไม่พบข้อมูล
-                      </q-item-section>
-                    </q-item>
-                  </template>
-                </q-select>
-              </div> -->
             </div>
           </q-card-section>
           <q-separator />
diff --git a/src/modules/02_organizationalNew/components/DialogPositionDetail.vue b/src/modules/02_organizationalNew/components/DialogPositionDetail.vue
index 1a2e8e37e..d73b003d1 100644
--- a/src/modules/02_organizationalNew/components/DialogPositionDetail.vue
+++ b/src/modules/02_organizationalNew/components/DialogPositionDetail.vue
@@ -1,30 +1,31 @@
 <script setup lang="ts">
-import { ref, reactive, watch } from "vue";
+import { reactive, watch } from "vue";
 import { useQuasar } from "quasar";
-import http from "@/plugins/http";
-import config from "@/app.config";
 
-/** import type*/
-import type { QTableProps } from "quasar";
-import type {
-  FormDetailPosition,
-  Position,
-} from "@/modules/02_organizationalNew/interface/index/organizational";
+/**
+ * import type
+ */
+import type { FormDetailPosition } from "@/modules/02_organizationalNew/interface/index/organizational";
 
-/** importComponents*/
+/**
+ * importComponents
+ */
 import DialogHeader from "@/components/DialogHeader.vue";
 
-/** importStore*/
-import { useCounterMixin } from "@/stores/mixin";
+/**
+ * importStore
+ */
 import { useOrganizational } from "@/modules/02_organizationalNew/store/organizational";
 
-/**use*/
+/**
+ * use
+ */
 const $q = useQuasar();
-const mixin = useCounterMixin();
 const store = useOrganizational();
-const { showLoader, hideLoader, messageError, date2Thai } = mixin;
 
-/**Props*/
+/**
+ * Props
+ */
 const modal = defineModel<boolean>("positionDetail", { required: true });
 const prosp = defineProps({
   dataDetailPos: { type: Object, require: true },
@@ -43,88 +44,16 @@ const formData = reactive<FormDetailPosition>({
   status: "", //*สถานะตำแหน่ง
 });
 
-// const columns = ref<QTableProps["columns"]>([
-//   {
-//     name: "no",
-//     align: "left",
-//     label: "ลำดับ",
-//     sortable: false,
-//     field: "no",
-//     headerStyle: "font-size: 14px",
-//     style: "font-size: 14px",
-//   },
-//   {
-//     name: "positionName",
-//     align: "left",
-//     label: "ตำแหน่งในสายงาน",
-//     sortable: true,
-//     field: "positionName",
-//     headerStyle: "font-size: 14px",
-//     style: "font-size: 14px",
-//   },
-//   {
-//     name: "positionField",
-//     align: "left",
-//     label: "สายงาน",
-//     sortable: true,
-//     field: "positionField",
-//     headerStyle: "font-size: 14px",
-//     style: "font-size: 14px",
-//   },
-//   {
-//     name: "posTypeName",
-//     align: "left",
-//     label: "ประเภทตำเเหน่ง",
-//     sortable: true,
-//     field: "posTypeName",
-//     headerStyle: "font-size: 14px",
-//     style: "font-size: 14px",
-//   },
-//   {
-//     name: "posLevelName",
-//     align: "left",
-//     label: "ระดับตำแหน่ง",
-//     sortable: true,
-//     field: "posLevelName",
-//     headerStyle: "font-size: 14px",
-//     style: "font-size: 14px",
-//   },
-//   {
-//     name: "posExecutiveName",
-//     align: "left",
-//     label: "ตำแหน่งทางการบริหาร",
-//     sortable: true,
-//     field: "posExecutiveName",
-//     headerStyle: "font-size: 14px",
-//     style: "font-size: 14px",
-//   },
-//   {
-//     name: "positionExecutiveField",
-//     align: "left",
-//     label: "ด้านทางการบริหาร",
-//     sortable: true,
-//     field: "positionExecutiveField",
-//     headerStyle: "font-size: 14px",
-//     style: "font-size: 14px",
-//   },
-//   {
-//     name: "positionArea",
-//     align: "left",
-//     label: "ด้าน/สาขา",
-//     sortable: true,
-//     field: "positionArea",
-//     headerStyle: "font-size: 14px",
-//     style: "font-size: 14px",
-//   },
-// ]);
-// const row = ref<Position[]>([]);
-
-/** function ปิด popup*/
+/**
+ * function ปิด popup
+ */
 function close() {
   modal.value = false;
 }
 
-/** callblack function ทำเมื่อเปิด popup set ตำแหน่งเลขที่ และสถานะตำแหน่ง */
+/**
+ * callblack function ทำเมื่อเปิด popup set ตำแหน่งเลขที่ และสถานะตำแหน่ง
+ */
 watch(
   () => modal.value,
   () => {
@@ -151,19 +80,6 @@ watch(
           .positionExecutiveField
           ? prosp.dataDetailPos.positionExecutiveField
           : "-";
-
-        // row.value = prosp.dataDetailPos.positions.map((e: Position) => ({
-        //   ...e,
-        //   positionName: e.positionName ? e.positionName : "-",
-        //   positionField: e.positionField ? e.positionField : "-",
-        //   posTypeName: e.posTypeName ? e.posTypeName : "-",
-        //   posLevelName: e.posLevelName ? e.posLevelName : "-",
-        //   posExecutiveName: e.posExecutiveName ? e.posExecutiveName : "-",
-        //   positionExecutiveField: e.positionExecutiveField
-        //     ? e.positionExecutiveField
-        //     : "-",
-        //   positionArea: e.positionArea ? e.positionArea : "-",
-        // }));
       }
     }
   }
diff --git a/src/modules/02_organizationalNew/components/DialogSelectPerson.vue b/src/modules/02_organizationalNew/components/DialogSelectPerson.vue
index 3a6fb8e4e..a5f4c8a66 100644
--- a/src/modules/02_organizationalNew/components/DialogSelectPerson.vue
+++ b/src/modules/02_organizationalNew/components/DialogSelectPerson.vue
@@ -4,7 +4,9 @@ import { useQuasar } from "quasar";
 import http from "@/plugins/http";
 import config from "@/app.config";
 
-/** importType*/
+/**
+ * importType
+ */
 import type { QTableProps } from "quasar";
 import type {
   Position,
@@ -22,14 +24,20 @@ import type {
   TypePos,
 } from "@/modules/02_organizationalNew/interface/response/organizational";
 
-/** importCompoonents*/
+/**
+ * importCompoonents
+ */
 import DialogHeader from "@/components/DialogHeader.vue";
 
-/** import*Store*/
+/**
+ * import*Store
+ */
 import { useCounterMixin } from "@/stores/mixin";
 import { useOrganizational } from "@/modules/02_organizationalNew/store/organizational";
 
-/** use*/
+/**
+ * use
+ */
 const $q = useQuasar();
 const store = useOrganizational();
 const {
@@ -41,7 +49,9 @@ const {
   dialogMessageNotify,
 } = useCounterMixin();
 
-/** props*/
+/**
+ * props
+ */
 const modal = defineModel<boolean>("modal", { required: true });
 const props = defineProps({
   fetchActive: {
@@ -60,7 +70,6 @@ const props = defineProps({
 });
 
 const isReadonly = ref<boolean>(false); // อ่านได้อย่างเดียว
-const isDisValidate = ref<boolean>(false);
 const typeOpsMain = ref<DataOption[]>([]);
 const levelOpsMain = ref<DataOption[]>([]);
 const typeOps = ref<DataOption[]>([]);
@@ -78,7 +87,11 @@ const formData = reactive<FormPositionFilter>({
   status: "",
 });
 
-/** Table*/
+/**
+ * ข้อมูล Table
+ */
+const row = ref<Position[]>([]);
+const rowResult = ref<SeaechResult[]>([]);
 const visibleColumnsResult = ref<String[]>([
   "no",
   "citizenId",
@@ -216,18 +229,20 @@ const columnsResult = ref<QTableProps["columns"]>([
     style: "font-size: 14px",
   },
 ]);
-const row = ref<Position[]>([]);
-const rowResult = ref<SeaechResult[]>([]);
 
-/** function closePopup*/
+/**
+ * function closePopup
+ */
 function close() {
   modal.value = false;
 }
 
-/** function เรียกข้อมูลประเภทตำแหน่ง*/
-async function fetchType() {
+/**
+ * function เรียกข้อมูลประเภทตำแหน่ง
+ */
+function fetchType() {
   showLoader();
-  await http
+  http
     .get(config.API.orgPosType)
     .then((res) => {
       dataLevel.value = res.data.result;
@@ -256,7 +271,9 @@ function inputEdit(val: boolean) {
   };
 }
 
-/** function เรียกข้แมูลระดับตำแหน่ง*/
+/**
+ * function เรียกข้แมูลระดับตำแหน่ง
+ */
 function updateSelectType(val: string) {
   const listLevel: any = dataLevel.value.find((e: TypePos) => e.id === val);
   levelOpsMain.value = listLevel?.posLevels.map((e: OptionLevel) => ({
@@ -267,7 +284,9 @@ function updateSelectType(val: string) {
   formData.positionLevel = "";
 }
 
-/** ฟังก์ชั่นตรวจสอบความถูกต้องของข้อมูลในฟอร์ม */
+/**
+ * ฟังก์ชั่นตรวจสอบความถูกต้องของข้อมูลในฟอร์ม
+ */
 function validateForm() {
   if (selected.value.length === 0) {
     dialogMessageNotify($q, "กรุณาเลือกรายการตำแหน่ง");
@@ -278,7 +297,9 @@ function validateForm() {
   }
 }
 
-/** function ยืนยันการบันทึกข้อมูล */
+/**
+ * function ยืนยันการบันทึกข้อมูล
+ */
 function onSubmit() {
   dialogConfirm(
     $q,
@@ -292,17 +313,16 @@ function onSubmit() {
       showLoader();
       http
         .post(config.API.orgProfile, body)
-        .then(() => {
-          props.fetchDataTable?.(store.treeId, store.level, false);
-          props.getSummary();
+        .then(async () => {
+          await props.fetchDataTable?.(store.treeId, store.level, false);
+          await props.getSummary();
           success($q, "บันทึกข้อมูลสำเร็จ");
+          modal.value = false;
         })
         .catch((err) => {
           messageError($q, err);
         })
-        .finally(async () => {
-          modal.value = await false;
-          close();
+        .finally(() => {
           hideLoader();
         });
     },
@@ -315,8 +335,11 @@ const page = ref<number>(1);
 const pageSize = ref<number>(10);
 const totalPage = ref<number>(0);
 const selectedProfile = ref<SeaechResult[]>([]);
-/** functiuon ค้นหาคนครอง */
-async function searchData() {
+
+/**
+ * functiuon ค้นหาคนครอง
+ */
+function searchData() {
   showLoader();
   const reqBody = {
     posTypeId: formData.positionType, // id ประเภทตำแหน่ง
@@ -326,7 +349,7 @@ async function searchData() {
     pageSize: pageSize.value, //*จำนวนแถวต่อหน้า
     keyword: formData.personal, //นามสกุล ชื่อ สกุล เลขบัตร
   };
-  await http
+  http
     .post(config.API.orgSearchProfile, reqBody)
     .then((res) => {
       totalPage.value = Math.ceil(res.data.result.total / pageSize.value);
@@ -349,13 +372,17 @@ async function searchData() {
     });
 }
 
-/** function update PageSize*/
+/**
+ * function update PageSize
+ */
 function updatePagination(newPagination: NewPagination) {
   pageSize.value = newPagination.rowsPerPage;
   page.value = 1;
 }
 
-/** function เคลียร์Form*/
+/**
+ * function เคลียร์Form
+ */
 function clearForm() {
   formData.positionType = "";
   formData.positionLevel = "";
@@ -368,13 +395,17 @@ function clearForm() {
   isSit.value = false;
 }
 
-/** function เคลียร์ตำแหน่ง*/
+/**
+ * function เคลียร์ตำแหน่ง
+ */
 function clearPosition() {
   formData.positionType = "";
   formData.positionLevel = "";
 }
 
-/** callback function ทำงานเมื่อเปิด popup*/
+/**
+ * callback function ทำงานเมื่อเปิด popup
+ */
 watch(
   () => modal.value,
   async () => {
@@ -410,7 +441,9 @@ watch(
   }
 );
 
-/** callback function ทำงานการค้นหาข้อมุลคนครองเมื่อมีการ update Pagination*/
+/**
+ * callback function ทำงานการค้นหาข้อมุลคนครองเมื่อมีการ update Pagination
+ */
 watch([() => page.value, () => pageSize.value], () => {
   searchData();
 });
@@ -625,11 +658,11 @@ watch([() => page.value, () => pageSize.value], () => {
                   />
                   <div class="col-12">
                     <d-table
-                    ref="table"
-                    flat
-                    :columns="columnsResult"
-                    :rows="rowResult"
-                    row-key="id"
+                      ref="table"
+                      flat
+                      :columns="columnsResult"
+                      :rows="rowResult"
+                      row-key="id"
                       dense
                       class="custom-header-table"
                       :paging="true"
@@ -706,7 +739,7 @@ watch([() => page.value, () => pageSize.value], () => {
                 color="primary"
                 dense
                 v-model="isSit"
-                label="ทับที่"
+                label="นั่งทับตำแหน่ง"
               />
             </div>
           </div>
diff --git a/src/modules/02_organizationalNew/components/DialogSortAgency.vue b/src/modules/02_organizationalNew/components/DialogSortAgency.vue
index 5ef01d8dd..c1cb6e042 100644
--- a/src/modules/02_organizationalNew/components/DialogSortAgency.vue
+++ b/src/modules/02_organizationalNew/components/DialogSortAgency.vue
@@ -1,22 +1,40 @@
 <script setup lang="ts">
-import { ref, reactive, watch } from "vue";
+import { ref, watch } from "vue";
 import { useQuasar } from "quasar";
 import http from "@/plugins/http";
 import config from "@/app.config";
-import type { QTableProps } from "quasar";
 
+/**
+ * importType
+ */
+import type { QTableProps } from "quasar";
+import type { DataSortAgency } from "@/modules/02_organizationalNew/interface/index/organizational";
+
+/**
+ * importComponents
+ */
 import DialogHeader from "@/components/DialogHeader.vue";
 
+/**
+ * importStore
+ */
 import { useCounterMixin } from "@/stores/mixin";
 import { useOrganizational } from "@/modules/02_organizationalNew/store/organizational";
 
+/**
+ * use
+ */
 const $q = useQuasar();
 const store = useOrganizational();
 const { dialogConfirm, showLoader, success, hideLoader, messageError } =
   useCounterMixin();
 
+/**
+ * props
+ */
 const type = defineModel<number>("type", { required: true });
-
+const modal = defineModel<boolean>("sortAgency", { required: true });
+const modalSort = defineModel<Array<any>>("data", { required: true });
 const props = defineProps({
   fetchDataTree: {
     type: Function,
@@ -25,9 +43,8 @@ const props = defineProps({
   },
 });
 
-const modal = defineModel<boolean>("sortAgency", { required: true });
-const modalSort = defineModel<Array<any>>("data", { required: true });
-const rows = ref<any[]>([]);
+/** ข้อมูล Table*/
+const rows = ref<DataSortAgency[]>([]);
 const columns = ref<QTableProps["columns"]>([
   {
     name: "name",
@@ -39,29 +56,33 @@ const columns = ref<QTableProps["columns"]>([
   },
 ]);
 
-function onDrop(from: any, to: any) {
-  onDropRow(from, to);
-}
-
-function onDropRow(from: any, to: any) {
+/**
+ * fiunction จัดลำดับ
+ * @param from ตำแหน่งปัจุบัน
+ * @param to ตำแหน่งที่จะย้ายไป
+ */
+function onDrop(from: number, to: number) {
   rows.value.splice(to, 0, rows.value.splice(from, 1)[0]);
 }
 
+/**
+ * function บันทึกการจัดลำดับ
+ */
 function save() {
   dialogConfirm($q, () => {
     showLoader();
     const data = rows.value;
-    const dataId = data.map((item: any) => item.orgTreeId);
+    const dataId = data.map((item: DataSortAgency) => item.orgTreeId);
     http
       .post(config.API.organizationShortName, {
         id: data[0].orgLevel === 0 ? data[0].orgRevisionId : data[0].orgRootId,
         type: data[0].orgLevel,
         sortId: dataId,
       })
-      .then((res) => {
+      .then(async () => {
+        await props.fetchDataTree(store.draftId);
+        await success($q, "บันทึกข้อมูลสำเร็จ");
         modal.value = false;
-        props.fetchDataTree(store.draftId);
-        success($q, "บันทึกข้อมูลสำเร็จ");
       })
       .catch((e) => {
         messageError($q, e);
@@ -71,6 +92,10 @@ function save() {
       });
   });
 }
+
+/**
+ * callback function ทำงานเมื่อ modal = true ทำการเรียกข้อมูลตำแหน่ง
+ */
 watch(
   () => modal.value,
   () => {
@@ -124,7 +149,7 @@ watch(
         </q-card-section>
         <q-separator />
         <q-card-actions align="right">
-          <q-btn type="submit" :label="`บันทึก`" color="public" @click="save" >
+          <q-btn type="submit" :label="`บันทึก`" color="public" @click="save">
             <q-tooltip>บันทึกข้อมูล</q-tooltip>
           </q-btn>
         </q-card-actions>
diff --git a/src/modules/02_organizationalNew/components/DialogSortPosition.vue b/src/modules/02_organizationalNew/components/DialogSortPosition.vue
index cdd87dc4a..fe2a3ca12 100644
--- a/src/modules/02_organizationalNew/components/DialogSortPosition.vue
+++ b/src/modules/02_organizationalNew/components/DialogSortPosition.vue
@@ -3,20 +3,42 @@ import { ref, watch, defineProps } from "vue";
 import { useQuasar } from "quasar";
 import http from "@/plugins/http";
 import config from "@/app.config";
-import type { QTableProps } from "quasar";
 
+/**
+ * importType
+ */
+import type { QTableProps } from "quasar";
+import type { DataSortPos } from "@/modules/02_organizationalNew/interface/index/organizational";
+
+/**
+ * importComponents
+ */
 import DialogHeader from "@/components/DialogHeader.vue";
 
+/**
+ * importStore
+ */
 import { useCounterMixin } from "@/stores/mixin";
 import { useOrganizational } from "@/modules/02_organizationalNew/store/organizational";
 
+/**
+ * use
+ */
 const $q = useQuasar();
 const store = useOrganizational();
 const { dialogConfirm, showLoader, success, hideLoader, messageError } =
   useCounterMixin();
 
+/**
+ * props
+ */
 const modal = defineModel<boolean>("sortPosition", { required: true });
-const rows = ref<any[]>([]);
+const props = defineProps({
+  fetchDataTable: Function,
+});
+
+/** ข้อมูล Table*/
+const rows = ref<DataSortPos[]>([]);
 const columns = ref<QTableProps["columns"]>([
   {
     name: "name",
@@ -28,22 +50,22 @@ const columns = ref<QTableProps["columns"]>([
   },
 ]);
 
-const props = defineProps({
-  fetchDataTable: Function,
-});
-
-function onDrop(from: any, to: any) {
-  onDropRow(from, to);
-}
-
-function onDropRow(from: any, to: any) {
+/**
+ * fiunction จัดลำดับ
+ * @param from ตำแหน่งปัจุบัน
+ * @param to ตำแหน่งที่จะย้ายไป
+ */
+function onDrop(from: number, to: number) {
   rows.value.splice(to, 0, rows.value.splice(from, 1)[0]);
 }
 
+/**
+ * function บันทึกการจัดลำดับ
+ */
 function save() {
   dialogConfirm($q, () => {
     const data = rows.value;
-    const dataId = data.map((item: any) => item.id);
+    const dataId = data.map((item: DataSortPos) => item.id);
     showLoader();
     http
       .post(config.API.orgPosSort, {
@@ -51,10 +73,10 @@ function save() {
         type: store.level,
         sortId: dataId,
       })
-      .then((res) => {
+      .then(async () => {
+        await props.fetchDataTable?.(store.treeId, store.level, false);
+        await success($q, "บันทึกข้อมูลสำเร็จ");
         modal.value = false;
-        success($q, "บันทึกข้อมูลสำเร็จ");
-        props.fetchDataTable?.(store.treeId, store.level, false);
       })
       .catch((e) => {
         messageError($q, e);
@@ -65,6 +87,9 @@ function save() {
   });
 }
 
+/**
+ * function เรียกรายการข้อมูลตำแหน่ง
+ */
 function getData() {
   showLoader();
   http
@@ -79,8 +104,6 @@ function getData() {
     })
     .then((res) => {
       const dataList = res.data.result.data;
-      console.log(dataList);
-
       const dataMap = dataList.map((item: any) => ({
         id: item.id,
         name: `${item.orgShortname}${
@@ -92,6 +115,7 @@ function getData() {
         posMasterNo: item.posMasterNo,
         posMasterNoSuffix: item.posMasterNoSuffix,
       }));
+
       rows.value = dataMap;
     })
     .catch((e) => {
@@ -102,6 +126,9 @@ function getData() {
     });
 }
 
+/**
+ * callback function ทำงานเมื่อ modal = true ทำการเรียกข้อมูลตำแหน่ง
+ */
 watch(
   () => modal.value,
   () => {
diff --git a/src/modules/02_organizationalNew/components/TreeTable.vue b/src/modules/02_organizationalNew/components/TreeTable.vue
index f8f327051..7c8797c2d 100644
--- a/src/modules/02_organizationalNew/components/TreeTable.vue
+++ b/src/modules/02_organizationalNew/components/TreeTable.vue
@@ -572,17 +572,6 @@ watch(
       </template>
       <template v-slot:body="props">
         <q-tr :props="props" class="cursor-pointer">
-          <q-td>
-            <q-btn
-              flat
-              size="14px"
-              color="primary"
-              round
-              dense
-              @click="props.expand = !props.expand"
-              :icon="props.expand ? 'mdi-menu-down' : 'mdi-menu-right'"
-            />
-          </q-td>
           <q-td>
             <q-btn
               flat
@@ -686,6 +675,18 @@ watch(
               </q-menu>
             </q-btn>
           </q-td>
+          <q-td>
+            <q-btn
+              flat
+              size="14px"
+              color="primary"
+              round
+              dense
+              @click="props.expand = !props.expand"
+              :icon="props.expand ? 'mdi-menu-down' : 'mdi-menu-right'"
+            />
+          </q-td>
+
           <q-td v-for="col in props.cols" :key="col.name" :props="props">
             <div v-if="col.name == 'no'">
               {{
@@ -695,7 +696,11 @@ watch(
               }}
             </div>
             <div v-else-if="col.name === 'posMasterNo'">
-              {{ props.row.isSit ? col.value + " " + "(ทับที่)" : col.value }}
+              {{
+                props.row.isSit
+                  ? col.value + " " + "(นั่งทับตำแหน่ง)"
+                  : col.value
+              }}
             </div>
             <div v-else-if="col.name === 'posLevelName'">
               {{
@@ -710,7 +715,6 @@ watch(
               {{ col.value ? col.value : "-" }}
             </div>
           </q-td>
-
         </q-tr>
 
         <q-tr v-show="props.expand" :props="props">
diff --git a/src/modules/02_organizationalNew/interface/index/organizational.ts b/src/modules/02_organizationalNew/interface/index/organizational.ts
index f6f21bd60..f5a6ee940 100644
--- a/src/modules/02_organizationalNew/interface/index/organizational.ts
+++ b/src/modules/02_organizationalNew/interface/index/organizational.ts
@@ -97,6 +97,24 @@ interface FormPositionFilter {
   status: string;
 }
 
+interface DataSortPos {
+  id: string;
+  name: string;
+  posMasterNo: number;
+  posMasterNoPrefix: string;
+  posMasterNoSuffix: string;
+}
+
+interface DataSortAgency {
+  name: string;
+  orgLevel: number;
+  orgRevisionId: string;
+  orgRootId: string;
+  orgTreeId: string;
+  orgTreeName: string;
+  orgTreeShortName: string;
+}
+
 export type {
   DataPosition,
   Position,
@@ -104,4 +122,6 @@ export type {
   DataTree,
   SeaechResult,
   FormPositionFilter,
+  DataSortPos,
+  DataSortAgency,
 };
diff --git a/src/modules/05_placement/components/PersonalList/CardPosition.vue b/src/modules/05_placement/components/PersonalList/CardPosition.vue
index 47faf00f0..786d3006b 100644
--- a/src/modules/05_placement/components/PersonalList/CardPosition.vue
+++ b/src/modules/05_placement/components/PersonalList/CardPosition.vue
@@ -302,7 +302,9 @@ onMounted(async () => {
                   </div>
                   <div v-else-if="col.name === 'posMasterNo'">
                     {{
-                      props.row.isSit ? col.value + " " + "(ทับที่)" : col.value
+                      props.row.isSit
+                        ? col.value + " " + "(นั่งทับตำแหน่ง)"
+                        : col.value
                     }}
                   </div>
                   <div v-else-if="col.name === 'isPosition'">
@@ -438,7 +440,7 @@ onMounted(async () => {
                       <div v-else-if="col.name === 'posMasterNo'">
                         {{
                           props.row.isSit
-                            ? col.value + " " + "(ทับที่)"
+                            ? col.value + " " + "(นั่งทับตำแหน่ง)"
                             : col.value
                         }}
                       </div>
diff --git a/src/modules/08_registryEmployee/components/DialogSelectPos.vue b/src/modules/08_registryEmployee/components/DialogSelectPos.vue
index f92ac04f8..2871d53d1 100644
--- a/src/modules/08_registryEmployee/components/DialogSelectPos.vue
+++ b/src/modules/08_registryEmployee/components/DialogSelectPos.vue
@@ -669,7 +669,7 @@ watch(
                                 <div v-else-if="col.name === 'posMasterNo'">
                                   {{
                                     props.row.isSit
-                                      ? col.value + " " + "(ทับที่)"
+                                      ? col.value + " " + "(นั่งทับตำแหน่ง)"
                                       : col.value
                                   }}
                                 </div>
@@ -736,7 +736,7 @@ watch(
                                 <div v-else-if="col.name === 'posMasterNo'">
                                   {{
                                     props.row.isSit
-                                      ? col.value + " " + "(ทับที่)"
+                                      ? col.value + " " + "(นั่งทับตำแหน่ง)"
                                       : col.value
                                   }}
                                 </div>
@@ -884,7 +884,7 @@ watch(
                                     <div v-else-if="col.name === 'posMasterNo'">
                                       {{
                                         props.row.isSit
-                                          ? col.value + " " + "(ทับที่)"
+                                          ? col.value + " " + "(นั่งทับตำแหน่ง)"
                                           : col.value
                                       }}
                                     </div>
diff --git a/src/modules/16_positionEmployee/components/DialogAddPosition.vue b/src/modules/16_positionEmployee/components/DialogAddPosition.vue
index 7bee3f75a..800ec9c63 100644
--- a/src/modules/16_positionEmployee/components/DialogAddPosition.vue
+++ b/src/modules/16_positionEmployee/components/DialogAddPosition.vue
@@ -4,33 +4,48 @@ import { useQuasar } from "quasar";
 import http from "@/plugins/http";
 import config from "@/app.config";
 
+/**
+ * importType
+ */
 import type {
   ResGroup,
   ResLevel,
 } from "@/modules/01_metadataNew/interface/response/positionEmployee/Main";
 import type { ObjectPosRef } from "@/modules/01_metadataNew/interface/index/positionEmployee";
 import type { DataOption } from "@/modules/16_positionEmployee/interface/index/Main";
-
 import type { OptionType } from "@/modules/16_positionEmployee/interface/response/organizational";
 
+/**
+ * importComponents
+ */
 import DialogHeader from "@/components/DialogHeader.vue";
 
+/**
+ * importStore
+ */
 import { useCounterMixin } from "@/stores/mixin";
 
-const isSpecial = ref<boolean>(false);
+/**
+ * use
+ */
+const $q = useQuasar();
+const mixin = useCounterMixin();
+const { dialogConfirm, showLoader, hideLoader, messageError, success } = mixin;
+
+/**
+ * props
+ */
+const modal = defineModel<boolean>("modalAdd", { required: true });
+const isEditCheck = defineModel<boolean>("isEdit", { required: true });
 const props = defineProps({
   emitSearch: Function,
   getData: Function,
   data: Object,
   levelOp: Object,
 });
-const modal = defineModel<boolean>("modalAdd", { required: true });
-const isEditCheck = defineModel<boolean>("isEdit", { required: true });
-const $q = useQuasar();
-const mixin = useCounterMixin();
-const { dialogConfirm, showLoader, hideLoader, messageError, success } = mixin;
 
 const isDisValidate = ref<boolean>(false);
+const isSpecial = ref<boolean>(false);
 const formDataPos = reactive({
   posName: "",
   posTypeName: "",
@@ -49,7 +64,9 @@ const posTypeMain = ref<ResGroup[]>([]);
 const posTypeOp = ref<DataOption[]>([]);
 const posLevelOp = ref<DataOption[]>([]);
 
-/** ฟังก์ชั่นตรวจสอบความถูกต้องของข้อมูลในฟอร์ม */
+/**
+ * ฟังก์ชั่นตรวจสอบความถูกต้องของข้อมูลในฟอร์ม
+ */
 function validateFormPositionEdit() {
   isDisValidate.value = false;
   const hasError = [];
@@ -80,9 +97,9 @@ async function submit() {
       ? config.API.orgEmployeePos
       : config.API.orgEmployeePosById(props?.data?.id);
     await http[!isEditCheck.value ? "post" : "put"](url, body);
-    success($q, "บันทีกข้อมูลสำเร็จ");
-    props.emitSearch?.(formDataPos.posName, "positionName");
-    close();
+    await props.emitSearch?.(formDataPos.posName, "positionName");
+    await success($q, "บันทีกข้อมูลสำเร็จ");
+    await close();
   } catch (err) {
     messageError($q, err);
   } finally {
diff --git a/src/modules/16_positionEmployee/components/DialogFormPosition.vue b/src/modules/16_positionEmployee/components/DialogFormPosition.vue
index 2ce81f998..0112925f4 100644
--- a/src/modules/16_positionEmployee/components/DialogFormPosition.vue
+++ b/src/modules/16_positionEmployee/components/DialogFormPosition.vue
@@ -4,22 +4,17 @@ import { useQuasar } from "quasar";
 import http from "@/plugins/http";
 import config from "@/app.config";
 
+/**
+ * importType
+ */
 import type { QTableProps } from "quasar";
 import type {
   FormDataPosition,
   FormPositionRef,
   DataOption,
-  FormPositionSelect,
   RowDetailPositions,
-  FormPositionSelectRef,
   ListMenu,
 } from "@/modules/16_positionEmployee/interface/index/Main";
-import type {
-  OptionType,
-  OptionLevel,
-  OptionExecutive,
-  DataPosition,
-} from "@/modules/16_positionEmployee/interface/response/organizational";
 import type { FilterMaster } from "@/modules/16_positionEmployee/interface/request/organizational";
 import DialogHeader from "@/components/DialogHeader.vue";
 import DialogAddPosition from "@/modules/16_positionEmployee/components/DialogAddPosition.vue";
@@ -705,7 +700,6 @@ watch(
                               {{ col.value }}
                             </div>
                           </q-td>
-
                         </q-tr>
                       </template>
                     </d-table>
diff --git a/src/modules/16_positionEmployee/components/DialogHistoryPos.vue b/src/modules/16_positionEmployee/components/DialogHistoryPos.vue
index c84b7da30..4b6db61fb 100644
--- a/src/modules/16_positionEmployee/components/DialogHistoryPos.vue
+++ b/src/modules/16_positionEmployee/components/DialogHistoryPos.vue
@@ -1,20 +1,42 @@
 <script setup lang="ts">
-import { ref, computed, watch } from "vue";
+import { ref, watch } from "vue";
 import { useQuasar } from "quasar";
 import http from "@/plugins/http";
 import config from "@/app.config";
 
+/**
+ * importType
+ */
 import type { QTableProps } from "quasar";
 import type { HistoryPos } from "@/modules/16_positionEmployee/interface/response/organizational";
 
+/**
+ * importCompoonents
+ */
 import Header from "@/components/DialogHeader.vue";
 
+/**
+ * import*Store
+ */
 import { useCounterMixin } from "@/stores/mixin";
 import { usePositionEmp } from "@/modules/16_positionEmployee/store/organizational";
+
+/**
+ * use
+ */
 const store = usePositionEmp();
 const { showLoader, hideLoader, messageError, date2Thai } = useCounterMixin();
 const $q = useQuasar();
+
+/**
+ * props
+ */
 const modal = defineModel<boolean>("modal", { required: true });
+const props = defineProps({
+  rowId: {
+    type: String,
+  },
+});
 
 const columns = ref<QTableProps["columns"]>([
   {
@@ -73,15 +95,13 @@ const columns = ref<QTableProps["columns"]>([
 ]);
 const rows = ref<any[]>([]);
 
-const props = defineProps({
-  rowId: {
-    type: String,
-  },
-});
-
-async function fetchHistoryPos(id: string) {
+/**
+ *  function เรียกข้อมูลประวัติตำแหน่ง
+ * @param id
+ */
+function fetchHistoryPos(id: string) {
   showLoader();
-  await http
+  http
     .get(config.API.orgPosHistory(id))
     .then((res) => {
       const data: HistoryPos[] = res.data.result;
@@ -102,6 +122,9 @@ async function fetchHistoryPos(id: string) {
     });
 }
 
+/**
+ * callback function ทำงานเมื่อ   modal === true
+ */
 watch(
   () => modal.value,
   () => {
diff --git a/src/modules/16_positionEmployee/components/DialogMovePos.vue b/src/modules/16_positionEmployee/components/DialogMovePos.vue
index dff184231..f66c63d11 100644
--- a/src/modules/16_positionEmployee/components/DialogMovePos.vue
+++ b/src/modules/16_positionEmployee/components/DialogMovePos.vue
@@ -4,6 +4,9 @@ import { useQuasar } from "quasar";
 import http from "@/plugins/http";
 import config from "@/app.config";
 
+/**
+ * importType
+ */
 import type { QTableProps } from "quasar";
 import type {
   OrgTree,
@@ -15,11 +18,20 @@ import type {
 } from "@/modules/16_positionEmployee/interface/request/organizational";
 import type { DataTree } from "@/modules/16_positionEmployee/interface/index/organizational";
 
+/**
+ * importCompoonents
+ */
 import HeaderDialog from "@/components/DialogHeader.vue";
 
+/**
+ * import*Store
+ */
 import { useCounterMixin } from "@/stores/mixin";
 import { usePositionEmp } from "@/modules/16_positionEmployee/store/organizational";
 
+/**
+ * use
+ */
 const $q = useQuasar();
 const store = usePositionEmp();
 const {
@@ -31,13 +43,15 @@ const {
   success,
 } = useCounterMixin();
 
+/**
+ * props
+ */
 const modal = defineModel<boolean>("modal", { required: true });
 const reqMaster = defineModel<FilterMaster>("reqMaster", { required: true });
 const totalPage = defineModel<number>("totalPage", { required: true });
 const nodeTree = defineModel<OrgTree[]>("nodeTree", { required: true });
 const columns = defineModel<QTableProps[]>("columns", {});
 const rows = defineModel<PosMaster2[]>("rows", { required: true });
-
 const props = defineProps({
   fetchDataTree: {
     type: Function,
@@ -66,11 +80,17 @@ const levelTree = ref<number>(0);
 const filterTable = ref<string>("");
 const selectedFilter = ref<PosMaster2[]>([]);
 
+/**
+ * function รีเช็ด filter
+ */
 function resetFilter() {
   filterTree.value = "";
   filterRef.value.focus();
 }
 
+/**
+ * function เลือกข้อมูลหน่วยงาน
+ */
 function updateSelected(data: DataTree) {
   levelTree.value = data.orgLevel;
   selectedTree.value = data.orgTreeId;
@@ -82,6 +102,9 @@ const isDisable = computed(() => {
   } else return false;
 });
 
+/**
+ * function ยืนยันการย้ายแหน่งจากหน่วยงาน/ส่วนราชการปัจจุบัน
+ */
 function onClickMovePos() {
   if (selectedTree.value === "" || selectedTree.value === null) {
     dialogMessageNotify($q, "กรุณาเลือกหน่วยงานที่จะย้ายไป");
diff --git a/src/modules/16_positionEmployee/components/DialogPositionDetail.vue b/src/modules/16_positionEmployee/components/DialogPositionDetail.vue
index a47926115..073e34490 100644
--- a/src/modules/16_positionEmployee/components/DialogPositionDetail.vue
+++ b/src/modules/16_positionEmployee/components/DialogPositionDetail.vue
@@ -26,16 +26,6 @@ function close() {
         <q-separator />
         <q-card-section>
           <div class="q-px-md">
-            <!-- <div class="row q-col-gutter-sm q-mb-xs">
-              <div class="col-4 text-bold">
-                <div>
-                  <p>ตำแหน่งเลขที่</p>
-                </div>
-              </div>
-              <div class="col-8 text-grey-8">
-                <p>{{ prosp?.dataDetailPos?.posMasterNo }}</p>
-              </div>
-            </div> -->
             <div class="row q-col-gutter-sm q-mb-xs">
               <div class="col-4 text-bold">
                 <div>
diff --git a/src/modules/16_positionEmployee/components/DialogSelectPerson.vue b/src/modules/16_positionEmployee/components/DialogSelectPerson.vue
index a84b50894..cf254922b 100644
--- a/src/modules/16_positionEmployee/components/DialogSelectPerson.vue
+++ b/src/modules/16_positionEmployee/components/DialogSelectPerson.vue
@@ -4,7 +4,9 @@ import { useQuasar } from "quasar";
 import http from "@/plugins/http";
 import config from "@/app.config";
 
-/** importType*/
+/** 
+ * importType
+ */
 import type { QTableProps } from "quasar";
 import type {
   Position,
@@ -22,14 +24,20 @@ import type {
   TypePos,
 } from "@/modules/16_positionEmployee/interface/response/organizational";
 
-/** importCompoonents*/
+/**
+ * importCompoonents
+ */
 import DialogHeader from "@/components/DialogHeader.vue";
 
-/** import*Store*/
+/**
+ * import*Store
+ */
 import { useCounterMixin } from "@/stores/mixin";
 import { usePositionEmp } from "@/modules/16_positionEmployee/store/organizational";
 
-/** use*/
+/**
+ * use
+ */
 const $q = useQuasar();
 const store = usePositionEmp();
 const {
@@ -41,7 +49,9 @@ const {
   dialogMessageNotify,
 } = useCounterMixin();
 
-/** props*/
+/**
+ * props
+ */
 const modal = defineModel<boolean>("modal", { required: true });
 const props = defineProps({
   fetchActive: {
@@ -60,7 +70,6 @@ const props = defineProps({
 });
 
 const isReadonly = ref<boolean>(false); // อ่านได้อย่างเดียว
-const isDisValidate = ref<boolean>(false);
 const typeOpsMain = ref<DataOption[]>([]);
 const levelOpsMain = ref<DataOption[]>([]);
 const typeOps = ref<DataOption[]>([]);
@@ -78,7 +87,11 @@ const formData = reactive<FormPositionFilter>({
   status: "",
 });
 
-/** Table*/
+/**
+ * ข้อมูล Table
+ */
+const row = ref<Position[]>([]);
+const rowResult = ref<SeaechResult[]>([]);
 const visibleColumnsResult = ref<String[]>([
   "no",
   "citizenId",
@@ -182,18 +195,20 @@ const columnsResult = ref<QTableProps["columns"]>([
     style: "font-size: 14px",
   },
 ]);
-const row = ref<Position[]>([]);
-const rowResult = ref<SeaechResult[]>([]);
 
-/** function closePopup*/
+/**
+ * function closePopup
+ */
 function close() {
   modal.value = false;
 }
 
-/** function เรียกข้อมูลประเภทตำแหน่ง*/
-async function fetchType() {
+/**
+ *  function เรียกข้อมูลประเภทตำแหน่ง
+ */
+function fetchType() {
   showLoader();
-  await http
+  http
     .get(config.API.orgEmployeeType)
     .then((res) => {
       dataLevel.value = res.data.result;
@@ -222,7 +237,9 @@ function inputEdit(val: boolean) {
   };
 }
 
-/** function เรียกข้แมูลระดับตำแหน่ง*/
+/**
+ * function เรียกข้แมูลระดับตำแหน่ง
+ */
 function updateSelectType(val: string) {
   const listLevel: any = dataLevel.value.find((e: TypePos) => e.id === val);
   levelOpsMain.value = listLevel?.posLevels.map((e: OptionLevel) => ({
@@ -233,7 +250,9 @@ function updateSelectType(val: string) {
   formData.positionLevel = "";
 }
 
-/** ฟังก์ชั่นตรวจสอบความถูกต้องของข้อมูลในฟอร์ม */
+/**
+ * ฟังก์ชั่นตรวจสอบความถูกต้องของข้อมูลในฟอร์ม
+ */
 function validateForm() {
   if (selected.value.length === 0) {
     dialogMessageNotify($q, "กรุณาเลือกรายการตำแหน่ง");
@@ -244,7 +263,9 @@ function validateForm() {
   }
 }
 
-/** function ยืนยันการบันทึกข้อมูล */
+/**
+ * function ยืนยันการบันทึกข้อมูล
+ */
 function onSubmit() {
   dialogConfirm(
     $q,
@@ -281,8 +302,11 @@ const page = ref<number>(1);
 const pageSize = ref<number>(10);
 const totalPage = ref<number>(0);
 const selectedProfile = ref<SeaechResult[]>([]);
-/** functiuon ค้นหาคนครอง */
-async function searchData() {
+
+/**
+ * functiuon ค้นหาคนครอง
+ */
+function searchData() {
   showLoader();
   const reqBody = {
     posTypeId: formData.positionType, // id ประเภทตำแหน่ง
@@ -292,7 +316,7 @@ async function searchData() {
     pageSize: pageSize.value, //*จำนวนแถวต่อหน้า
     keyword: formData.personal, //นามสกุล ชื่อ สกุล เลขบัตร
   };
-  await http
+  http
     .post(config.API.orgSearchProfileEmp, reqBody)
     .then((res) => {
       totalPage.value = Math.ceil(res.data.result.total / pageSize.value);
@@ -315,13 +339,17 @@ async function searchData() {
     });
 }
 
-/** function update PageSize*/
+/**
+ * function update PageSize
+ */
 function updatePagination(newPagination: NewPagination) {
   pageSize.value = newPagination.rowsPerPage;
   page.value = 1;
 }
 
-/** function เคลียร์Form*/
+/**
+ * function เคลียร์Form
+ */
 function clearForm() {
   formData.positionType = "";
   formData.positionLevel = "";
@@ -334,13 +362,17 @@ function clearForm() {
   isSit.value = false;
 }
 
-/** function เคลียร์ตำแหน่ง*/
+/**
+ * function เคลียร์ตำแหน่ง
+ */
 function clearPosition() {
   formData.positionType = "";
   formData.positionLevel = "";
 }
 
-/** callback function ทำงานเมื่อเปิด popup*/
+/**
+ * callback function ทำงานเมื่อเปิด popup
+ */
 watch(
   () => modal.value,
   async () => {
@@ -376,7 +408,9 @@ watch(
   }
 );
 
-/** callback function ทำงานการค้นหาข้อมุลคนครองเมื่อมีการ update Pagination*/
+/**
+ * callback function ทำงานการค้นหาข้อมุลคนครองเมื่อมีการ update Pagination
+ */
 watch([() => page.value, () => pageSize.value], () => {
   searchData();
 });
@@ -672,7 +706,7 @@ watch([() => page.value, () => pageSize.value], () => {
                 color="primary"
                 dense
                 v-model="isSit"
-                label="ทับที่"
+                label="นั่งทับตำแหน่ง"
               />
             </div>
           </div>
diff --git a/src/modules/16_positionEmployee/components/DialogSortPosition.vue b/src/modules/16_positionEmployee/components/DialogSortPosition.vue
index db087264a..14f6c8b22 100644
--- a/src/modules/16_positionEmployee/components/DialogSortPosition.vue
+++ b/src/modules/16_positionEmployee/components/DialogSortPosition.vue
@@ -3,20 +3,42 @@ import { ref, watch, defineProps } from "vue";
 import { useQuasar } from "quasar";
 import http from "@/plugins/http";
 import config from "@/app.config";
-import type { QTableProps } from "quasar";
 
+/**
+ * importType
+ */
+import type { QTableProps } from "quasar";
+import type { DataSortPos } from "@/modules/02_organizationalNew/interface/index/organizational";
+
+/**
+ * importComponents
+ */
 import DialogHeader from "@/components/DialogHeader.vue";
 
+/**
+ * importStore
+ */
 import { useCounterMixin } from "@/stores/mixin";
 import { usePositionEmp } from "@/modules/16_positionEmployee/store/organizational";
 
+/**
+ * use
+ */
 const $q = useQuasar();
 const store = usePositionEmp();
 const { dialogConfirm, showLoader, success, hideLoader, messageError } =
   useCounterMixin();
 
+/**
+ * props
+ */
 const modal = defineModel<boolean>("sortPosition", { required: true });
-const rows = ref<any[]>([]);
+const props = defineProps({
+  fetchDataTable: Function,
+});
+
+/** ข้อมูล Table*/
+const rows = ref<DataSortPos[]>([]);
 const columns = ref<QTableProps["columns"]>([
   {
     name: "name",
@@ -28,22 +50,22 @@ const columns = ref<QTableProps["columns"]>([
   },
 ]);
 
-const props = defineProps({
-  fetchDataTable: Function,
-});
-
-function onDrop(from: any, to: any) {
-  onDropRow(from, to);
-}
-
-function onDropRow(from: any, to: any) {
+/**
+ * fiunction จัดลำดับ
+ * @param from ตำแหน่งปัจุบัน
+ * @param to ตำแหน่งที่จะย้ายไป
+ */
+function onDrop(from: number, to: number) {
   rows.value.splice(to, 0, rows.value.splice(from, 1)[0]);
 }
 
+/**
+ * function บันทึกการจัดลำดับ
+ */
 function save() {
   dialogConfirm($q, () => {
     const data = rows.value;
-    const dataId = data.map((item: any) => item.id);
+    const dataId = data.map((item: DataSortPos) => item.id);
     showLoader();
     http
       .post(config.API.orgPosSortEmp, {
@@ -51,10 +73,10 @@ function save() {
         type: store.level,
         sortId: dataId,
       })
-      .then((res) => {
+      .then(async () => {
+        await props.fetchDataTable?.(store.treeId, store.level, false);
+        await success($q, "บันทึกข้อมูลสำเร็จ");
         modal.value = false;
-        success($q, "บันทึกข้อมูลสำเร็จ");
-        props.fetchDataTable?.(store.treeId, store.level, false);
       })
       .catch((e) => {
         messageError($q, e);
@@ -65,6 +87,9 @@ function save() {
   });
 }
 
+/**
+ * function เรียกรายการข้อมูลตำแหน่ง
+ */
 function getData() {
   showLoader();
   http
@@ -79,6 +104,7 @@ function getData() {
     })
     .then((res) => {
       const dataList = res.data.result.data;
+
       const dataMap = dataList.map((item: any) => ({
         id: item.id,
         name: `${item.orgShortname}${
@@ -100,6 +126,9 @@ function getData() {
     });
 }
 
+/**
+ * callback function ทำงานเมื่อ modal = true ทำการเรียกข้อมูลตำแหน่ง
+ */
 watch(
   () => modal.value,
   () => {
diff --git a/src/modules/16_positionEmployee/components/DialogSuccession.vue b/src/modules/16_positionEmployee/components/DialogSuccession.vue
index e2d4a8e56..050712bd3 100644
--- a/src/modules/16_positionEmployee/components/DialogSuccession.vue
+++ b/src/modules/16_positionEmployee/components/DialogSuccession.vue
@@ -49,7 +49,9 @@ const selectedTree = ref<string>("");
 const filterRef = ref();
 const levelTree = ref<number>(0);
 
-/** function เรียกข้อมูล Tree แบบ ปัจจุบัน*/
+/**
+ * function เรียกข้อมูล Tree แบบ ปัจจุบัน
+ */
 async function fetchTree() {
   showLoader();
   const id: string = store.activeId ? store.activeId?.toString() : "";
@@ -66,16 +68,20 @@ async function fetchTree() {
     });
 }
 
-/** resetFilterTree*/
+/**
+ * resetFilterTree
+ */
 function resetFilter() {
   filterTree.value = "";
   filterRef.value.focus();
 }
 
-/** function เลือกหน่วยงาน*/
+/**
+ * function เลือกหน่วยงาน
+ */
 async function updateSelected(data: DataTree) {
-  levelTree.value = data.orgLevel;
-  selectedTree.value = data.orgTreeId;
+  levelTree.value = await data.orgLevel;
+  selectedTree.value = await data.orgTreeId;
   reqMaster.id = await data.orgTreeId;
   reqMaster.type = await data.orgLevel;
   await fetchTable();
@@ -116,7 +122,9 @@ const reqMaster = reactive<FilterMaster>({
 const totalRow = ref<number>(0);
 const selectedPos = ref<PosMaster[]>([]);
 
-/** function เรียกข้อมูล Table Position*/
+/**
+ * function เรียกข้อมูล Table Position
+ */
 async function fetchTable() {
   selectedPos.value = [];
   await http
@@ -148,13 +156,17 @@ function updatePagination(newPagination: NewPagination) {
   reqMaster.page = 1;
 }
 
-/** funcion ค้นหาข้อมูลใน Table*/
+/** 
+ funcion ค้นหาข้อมูลใน Table
+ */
 async function filterKeyword() {
-  reqMaster.page = 1;
-  fetchTable();
+  reqMaster.page = await 1;
+  await fetchTable();
 }
 
-/** function ยืนยันกาสืบทอดตำแหน่ง */
+/**
+ * function ยืนยันกาสืบทอดตำแหน่ง
+ */
 function onClickConfirm() {
   if (selectedPos.value.length === 0) {
     dialogMessageNotify($q, "กรุณาเลือกตำแหน่งสืบทอด");
@@ -186,20 +198,26 @@ function onClickConfirm() {
   }
 }
 
-/** callblck function ทำการ fetch ข้อมูล tree เมื่อเปิด popup*/
+/**
+ * callblck function ทำการ fetch ข้อมูล tree เมื่อเปิด popup
+ */
 watch(
   () => modal.value,
-  async () => {
-    modal.value ? await fetchTree() : clearForm();
+  () => {
+    modal.value ? fetchTree() : clearForm();
   }
 );
 
-/** callblck function ทำการ fetch ข้อมูล Table เมื่อมีการเปลี่ยนหน้า*/
+/**
+ * callblck function ทำการ fetch ข้อมูล Table เมื่อมีการเปลี่ยนหน้า
+ */
 watch([() => reqMaster.page, () => reqMaster.pageSize], async () => {
   await fetchTable();
 });
 
-/** function clear ข้อมูล*/
+/**
+ *  function clear ข้อมูล
+ */
 function clearForm() {
   nodeTree.value = [];
   rows.value = [];
diff --git a/src/modules/16_positionEmployee/components/TreeMain.vue b/src/modules/16_positionEmployee/components/TreeMain.vue
index b72ff4499..e39127940 100644
--- a/src/modules/16_positionEmployee/components/TreeMain.vue
+++ b/src/modules/16_positionEmployee/components/TreeMain.vue
@@ -5,7 +5,6 @@ import http from "@/plugins/http";
 import config from "@/app.config";
 
 /** importType*/
-
 import type { OrgTree } from "@/modules/16_positionEmployee/interface/response/organizational";
 import type { DataTree } from "@/modules/16_positionEmployee/interface/index/organizational";
 
diff --git a/src/modules/16_positionEmployee/components/TreeTable.vue b/src/modules/16_positionEmployee/components/TreeTable.vue
index cffa6ac77..4f62bf065 100644
--- a/src/modules/16_positionEmployee/components/TreeTable.vue
+++ b/src/modules/16_positionEmployee/components/TreeTable.vue
@@ -5,20 +5,21 @@ import config from "@/app.config";
 import http from "@/plugins/http";
 import genreport from "@/plugins/genreportxlsx";
 
-/** importType*/
+/**
+ * importType
+ */
 import type { QTableProps } from "quasar";
 import type {
   ListMenu,
   NewPagination,
 } from "@/modules/16_positionEmployee/interface/index/Main";
 import type { FilterMaster } from "@/modules/16_positionEmployee/interface/request/organizational";
-import type {
-  PosMaster2,
-  OrgTree,
-} from "@/modules/16_positionEmployee/interface/response/organizational";
+import type { PosMaster2 } from "@/modules/16_positionEmployee/interface/response/organizational";
 import type { DataPosition } from "@/modules/16_positionEmployee/interface/index/organizational";
 
-/** importComponents*/
+/**
+ * importComponents
+ */
 import DialogFormPosotion from "@/modules/16_positionEmployee/components/DialogFormPosition.vue";
 import DialogPositionDetail from "@/modules/16_positionEmployee/components/DialogPositionDetail.vue";
 import DialogSort from "@/modules/16_positionEmployee/components/DialogSortPosition.vue";
@@ -27,23 +28,29 @@ import DialogHistoryPos from "@/modules/16_positionEmployee/components/DialogHis
 import DialogSelectPerson from "@/modules/16_positionEmployee/components/DialogSelectPerson.vue";
 import DialogSuccession from "@/modules/16_positionEmployee/components/DialogSuccession.vue";
 
-/** importStore*/
+/**
+ * importStore
+ */
 import { usePositionEmp } from "@/modules/16_positionEmployee/store/organizational";
 import { useCounterMixin } from "@/stores/mixin";
 
+/**
+ * ues
+ */
 const $q = useQuasar();
 const store = usePositionEmp();
 const { showLoader, hideLoader, messageError, success, dialogRemove } =
   useCounterMixin();
 
-/** prosp*/
+/**
+ * prosp
+ */
 const nodeTree = defineModel<any>("nodeTree", { required: true });
 const orgLevel = defineModel<number>("orgLevel", { required: true });
 const treeId = defineModel<string>("treeId", { required: true });
 const reqMaster = defineModel<FilterMaster>("reqMaster", { required: true });
 const totalPage = defineModel<number>("totalPage", { required: true });
 const posMaster = defineModel<PosMaster2[]>("posMaster", { required: true });
-// const shortName = defineModel<string>("shortName", { required: true });
 const props = defineProps({
   filterKeyword: { type: Function, require: true, default: () => {} },
   fetchDataTable: {
@@ -63,7 +70,17 @@ const props = defineProps({
   },
 });
 
-const modalSelectPerson = ref<boolean>(false);
+/**
+ * modal popup
+ */
+const dialogDetail = ref<boolean>(false); // รายละเอียดตำแหน่ง
+const modalSelectPerson = ref<boolean>(false); // เลือกคนครอง
+const dialogPosition = ref<boolean>(false); // อัตรากำลัง
+const modalSort = ref<boolean>(false); // จัดลำดับ
+const modalDialogMMove = ref<boolean>(false); // ย้ายตำแหน่ง
+const modalDialogSuccession = ref<boolean>(false); // สืบทอดตำแหน่ง
+const modalDialogHistoryPos = ref<boolean>(false); // ประวัติตำแหน่ง
+
 const rowId = ref<string>("");
 const actionType = ref<string>("");
 /** ListMenu Table*/
@@ -86,32 +103,6 @@ const listMenu = ref<ListMenu[]>([
     type: "MOVE",
     color: "blue-10",
   },
-  // {
-  //   label: "สืบทอดตำแหน่ง",
-  //   icon: "mdi-account-multiple-outline",
-  //   type: "INHERIT",
-  //   color: "deep-orange",
-  // },
-  // {
-  //   label: "ประวัติตำแหน่ง",
-  //   icon: "history",
-  //   type: "HISTORY",
-  //   color: "deep-purple",
-  // },
-]);
-const document = ref<any>([
-  {
-    name: "บัญชี 1",
-    val: "report1",
-  },
-  {
-    name: "บัญชี 2",
-    val: "report2",
-  },
-  {
-    name: "บัญชี 3",
-    val: "report3",
-  },
 ]);
 
 /** columns*/
@@ -172,7 +163,6 @@ const columns = ref<QTableProps["columns"]>([
   },
 ]);
 
-const dialogPosition = ref<boolean>(false);
 /**
  * function  openPopup เพิ่มอัตรากำลัง
  * @param type ประเภท
@@ -184,7 +174,6 @@ function onClickPosition(type: string, id: string) {
   dialogPosition.value = !dialogPosition.value;
 }
 
-const dialogDetail = ref<boolean>(false);
 const dataDetailPos = ref<DataPosition[]>([]);
 /**
  * function ดูรายละเอียดประวัติตำแหน่ง
@@ -218,13 +207,13 @@ function onClickDelete(id: string) {
   });
 }
 
-const modalSort = ref<boolean>(false);
-/** fdunction จัดลำดับตำแหน่ง */
+/**
+ * fdunction จัดลำดับตำแหน่ง
+ */
 function onClickSort() {
   modalSort.value = true;
 }
 
-const modalDialogMMove = ref<boolean>(false);
 const typeMove = ref<string>("");
 /**
  * function openPopup  ย้ายตำแหน่ง
@@ -237,7 +226,6 @@ function onClickMovePos(id: string, type: string) {
   rowId.value = id;
 }
 
-const modalDialogHistoryPos = ref<boolean>(false);
 /**
  * function ดูประวัติตำแหน่ง
  * @param id ID ตำแหน่ง
@@ -256,13 +244,17 @@ function updatePagination(newPagination: NewPagination) {
   reqMaster.value.page = 1;
 }
 
-/** function openPopup เลือกตนครอง*/
+/**
+ * function openPopup เลือกตนครอง
+ */
 function openSelectPerson(data: DataPosition[]) {
   modalSelectPerson.value = true;
   dataDetailPos.value = data;
 }
 
-/** ลบคนครอง */
+/**
+ * ลบคนครอง
+ */
 function removePerson(id: string) {
   dialogRemove(
     $q,
@@ -291,14 +283,17 @@ function removePerson(id: string) {
   );
 }
 
-const modalDialogSuccession = ref<boolean>(false);
-/** function openPopup สืบทอดตำแหน่ง*/
+/**
+ * function openPopup สืบทอดตำแหน่ง
+ */
 function onClickInherit(id: string) {
   modalDialogSuccession.value = !modalDialogSuccession.value;
   rowId.value = id;
 }
 
-/** ดึงข้อมูลสถิติจำนวนด้านบน*/
+/**
+ * ดึงข้อมูลสถิติจำนวนด้านบน
+ */
 function getSummary() {
   showLoader();
   http
@@ -331,22 +326,6 @@ function getSummary() {
     });
 }
 
-/** function DownloadReport*/
-async function onClickDownloadReport(val: string, name: string) {
-  showLoader();
-  await http
-    .get(config.API.orgReportEmp(val))
-    .then((res) => {
-      const data = res.data.result;
-      if (data) {
-        genreport(data, name);
-      }
-    })
-    .catch((err) => {
-      messageError($q, err);
-    });
-}
-
 const pagination = ref({
   page: reqMaster.value.page,
   rowsPerPage: reqMaster.value.pageSize,
@@ -587,7 +566,11 @@ watch(
               }}
             </div>
             <div v-else-if="col.name === 'posMasterNo'">
-              {{ props.row.isSit ? col.value + " " + "(ทับที่)" : col.value }}
+              {{
+                props.row.isSit
+                  ? col.value + " " + "(นั่งทับตำแหน่ง)"
+                  : col.value
+              }}
             </div>
             <div v-else-if="col.name === 'posLevelName'">
               {{
@@ -602,7 +585,6 @@ watch(
               {{ col.value ? col.value : "-" }}
             </div>
           </q-td>
-
         </q-tr>
       </template>
       <template v-slot:pagination="scope">
diff --git a/src/modules/16_positionEmployee/components/TreeView.vue b/src/modules/16_positionEmployee/components/TreeView.vue
index 659a8ab49..b424b3979 100644
--- a/src/modules/16_positionEmployee/components/TreeView.vue
+++ b/src/modules/16_positionEmployee/components/TreeView.vue
@@ -26,13 +26,12 @@ const store = usePositionEmp();
 const $q = useQuasar();
 const { showLoader, hideLoader, messageError } = useCounterMixin();
 
-const nodeTree = ref<OrgTree[]>(); // ข้อมูล Tree
+const nodeTree = ref<OrgTree[]>([]); // ข้อมูล Tree
 const nodeId = ref<string>(""); // id ของ Tree
 const orgLevel = ref<number>(0); // levelTree
 const isLoad = ref<boolean>(false); // loadTable
 const isLoadTree = ref<boolean>(false); // loadTable
 const mainTree = ref<OrgTree>();
-
 const selected = ref<string>("");
 
 const reqMaster = reactive<FilterMaster>({
@@ -53,10 +52,10 @@ const shortName = ref<string>("");
  * function fetch ข้อมูลของ Tree
  * @param id id โครงสร้าง
  */
-async function fetchDataTree(id: string) {
+function fetchDataTree(id: string) {
   isLoadTree.value = false;
   showLoader();
-  await http
+  http
     .get(config.API.orgByid(id.toString()))
     .then((res) => {
       const data = res.data.result;
@@ -78,9 +77,8 @@ async function fetchDataTree(id: string) {
  * @param id  idTree
  * @param level  levelTree
  */
-async function fetchDataTable(id: string, level: number, action: boolean) {
+function fetchDataTable(id: string, level: number, action: boolean) {
   searchAndReplaceOrgName(nodeTree.value, id);
-
   orgLevel.value = level;
   reqMaster.id = id;
   reqMaster.type = level;
@@ -99,7 +97,7 @@ async function fetchDataTable(id: string, level: number, action: boolean) {
   if (action === true) {
     isLoad.value = true;
   }
-  await http
+  http
     .post(config.API.orgPosMasterListEmp, reqMaster)
     .then(async (res) => {
       posMaster.value = [];
@@ -127,7 +125,9 @@ async function fetchDataTable(id: string, level: number, action: boolean) {
     });
 }
 
-/** ดึงข้อมูลสถิติจำนวนด้านบน*/
+/**
+ * ดึงข้อมูลสถิติจำนวนด้านบน
+ */
 function getSummary() {
   http
     .post(config.API.orgSummaryEmp, {
@@ -152,13 +152,20 @@ function getSummary() {
     });
 }
 
-/** funcion ค้นหาข้อมูลใน Table*/
-async function filterKeyword() {
+/**
+ * funcion ค้นหาข้อมูลใน Table
+ */
+function filterKeyword() {
   reqMaster.page = 1;
   action1.value === false &&
     fetchDataTable(reqMaster.id, reqMaster.type, false);
 }
 
+/**
+ * function ค้นหาชือ
+ * @param data ข้อมูล Tree
+ * @param targetId tree
+ */
 function searchAndReplaceOrgName(data: any, targetId: string) {
   for (const child of data) {
     if (child.orgTreeId === targetId) {
@@ -173,20 +180,26 @@ function searchAndReplaceOrgName(data: any, targetId: string) {
   return false; // Not found in this branch
 }
 
-/**lifecycle Hook*/
+/**
+ * lifecycle Hook
+ */
 onMounted(() => {
   setTimeout(async () => {
     store.activeId && (await fetchDataTree(store.activeId));
   }, 200);
 });
 
-/** callblck function ทำการ fetch ข้อมูล Table เมื่อมีการเปลี่ยนหน้า*/
+/**
+ * callblck function ทำการ fetch ข้อมูล Table เมื่อมีการเปลี่ยนหน้า
+ */
 watch([() => reqMaster.page, () => reqMaster.pageSize], () => {
   action1.value === false &&
     fetchDataTable(reqMaster.id, reqMaster.type, false);
 });
 
-/** callblck function ทำการ fetch ข้อมูล Table เมื่อแสดงตำแหน่งทั้งหมด*/
+/**
+ *  callblck function ทำการ fetch ข้อมูล Table เมื่อแสดงตำแหน่งทั้งหมด
+ */
 watch(
   () => reqMaster.isAll,
   () => {
diff --git a/src/modules/16_positionEmployee/interface/index/organizational.ts b/src/modules/16_positionEmployee/interface/index/organizational.ts
index f6f21bd60..f5a6ee940 100644
--- a/src/modules/16_positionEmployee/interface/index/organizational.ts
+++ b/src/modules/16_positionEmployee/interface/index/organizational.ts
@@ -97,6 +97,24 @@ interface FormPositionFilter {
   status: string;
 }
 
+interface DataSortPos {
+  id: string;
+  name: string;
+  posMasterNo: number;
+  posMasterNoPrefix: string;
+  posMasterNoSuffix: string;
+}
+
+interface DataSortAgency {
+  name: string;
+  orgLevel: number;
+  orgRevisionId: string;
+  orgRootId: string;
+  orgTreeId: string;
+  orgTreeName: string;
+  orgTreeShortName: string;
+}
+
 export type {
   DataPosition,
   Position,
@@ -104,4 +122,6 @@ export type {
   DataTree,
   SeaechResult,
   FormPositionFilter,
+  DataSortPos,
+  DataSortAgency,
 };
diff --git a/src/plugins/http.ts b/src/plugins/http.ts
index 813c81a9c..8aebceb21 100644
--- a/src/plugins/http.ts
+++ b/src/plugins/http.ts
@@ -33,6 +33,8 @@ http.interceptors.response.use(
       // eslint-disable-next-line no-prototype-builtins
       if (error.hasOwnProperty("response")) {
         if (error.response.status === 401 || error.response.status === 403) {
+          window.location.href = "/login";
+
           // Store.commit("SET_ERROR_MESSAGE", error.response.data.message);
           // Store.commit("REMOVE_ACCESS_TOKEN")
         }
diff --git a/src/router/index.ts b/src/router/index.ts
index a3e912901..79747b623 100644
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -108,7 +108,7 @@ const router = createRouter({
 // authen with keycloak client
 router.beforeEach((to, from, next) => {
   if (to.meta.Auth) {
-    if (keycloak.authenticated === undefined && to.meta.Auth) {
+    if (keycloak.authenticated === false && to.meta.Auth) {
       window.location.href = "/login";
     }
   } else {
diff --git a/src/stores/menuList.ts b/src/stores/menuList.ts
new file mode 100644
index 000000000..fcb1ca613
--- /dev/null
+++ b/src/stores/menuList.ts
@@ -0,0 +1,140 @@
+import { defineStore } from "pinia";
+import { ref } from "vue";
+
+/**
+ * importType
+ */
+import type {
+  ListMenu,
+  ChildLevelTree,
+  DataPermissions,
+} from "@/interface/response/main";
+
+export const useMenuDataStore = defineStore("menuUse", () => {
+  /****************** เมนู **************************/
+  /** รายการเมนู*/
+  const menuList = ref<ListMenu[]>([
+    {
+      id: "dashboard",
+      order: 0,
+      icon: "mdi-home-variant-outline",
+      sysName: "หน้าแรก",
+      sysDescription: "หน้าแรก",
+      path: "dashboard",
+      parentId: null,
+      children: [],
+    },
+  ]);
+
+  /** ข้อมูล Level3*/
+  const childLevelTree = ref<ChildLevelTree>({
+    SYS_EVA_INDICATOR: [
+      {
+        sysName: "ตามแผน",
+        path: "KPIIndicatorByPlan",
+      },
+      {
+        sysName: "ตามตำแหน่ง",
+        path: "KPIIndicatorByRole",
+      },
+      {
+        sysName: "งานที่ได้รับมอบหมาย",
+        path: "KPIAssignment",
+      },
+    ],
+    SYS_EXAM_CONTEST: [
+      {
+        sysName: "จัดการรอบสอบแข่งขัน",
+        path: "competePeriod",
+      },
+      {
+        sysName: "สถิติสมัครสอบแข่งขัน",
+        path: "competePeriodStat",
+      },
+    ],
+    SYS_EXAM_SELECT: [
+      {
+        sysName: "จัดการรอบคัดเลือก",
+        path: "qualifyPeriod",
+      },
+      {
+        sysName: "จัดการรอบคัดเลือกคนพิการ",
+        path: "disablePeriod",
+      },
+      {
+        sysName: "จัดการรายชื่อคัดเลือก",
+        path: "manage",
+      },
+      {
+        sysName: "สถิติสมัครคัดเลือก",
+        path: "qualifyPeriodStat",
+      },
+      {
+        sysName: "สถิติสมัครคัดเลือกคนพิการ",
+        path: "qualifyPeriodStatDisable",
+      },
+    ],
+    SYS_DISCIPLINE_INFO: [
+      {
+        sysName: "กรรมการ",
+        path: "disciplineDirector",
+      },
+      {
+        sysName: "ช่องทางการร้องเรียน",
+        path: "disciplineChannel",
+      },
+    ],
+    SYS_EVA_INFO: [
+      {
+        sysName: "กรรมการ",
+        path: "evaluateDirector",
+      },
+      {
+        sysName: "การประชุม",
+        path: "evaluateMeeting",
+      },
+    ],
+  });
+
+  /**
+   * function เรียกรายการเมนูทั้งหมด
+   * @param data ข้อมูลรายการทั้งหมด
+   */
+  function fetchListMenu(data: ListMenu[]) {
+    data.forEach((item) => {
+      if (item.children && item.children.length !== 0) {
+        item.children.forEach((q: ListMenu) => {
+          const config: any = childLevelTree.value[q.id];
+          if (config) {
+            if (!q.children) {
+              q.children = [];
+            }
+            // เพิ้ม ข้อมูลเลเวล 3
+            q.children.push(...config);
+          }
+        });
+      }
+    });
+    menuList.value.push(...data);
+  }
+
+  /****************** สิทธิ์ **************************/
+  const dataPermissions = ref<DataPermissions>();
+
+  /**
+   * function เรียก
+   * @param data ข้อมูลสิทธิ์
+   */
+  function fetchDataPermission(data: DataPermissions) {
+    dataPermissions.value = data;
+  }
+
+  return {
+    /****************** เมนู **************************/
+    fetchListMenu,
+    menuList,
+    /****************** สิทธิ์ **************************/
+    fetchDataPermission,
+    dataPermissions,
+  };
+});
diff --git a/src/views/MainLayout.vue b/src/views/MainLayout.vue
index 169a4c631..0fe14917c 100644
--- a/src/views/MainLayout.vue
+++ b/src/views/MainLayout.vue
@@ -6,6 +6,7 @@ import { useDataStore } from "@/stores/data";
 import { storeToRefs } from "pinia";
 import { scroll, useQuasar } from "quasar";
 import { useCounterMixin } from "@/stores/mixin";
+import { useMenuDataStore } from "@/stores/menuList";
 
 import http from "@/plugins/http";
 import config from "@/app.config";
@@ -28,6 +29,7 @@ const route = useRoute();
 const router = useRouter();
 const link = ref<string>("");
 const mixin = useCounterMixin(); //เรียกฟังก์ชันกลาง
+const storeMenu = useMenuDataStore();
 const {
   showLoader,
   hideLoader,
@@ -230,10 +232,14 @@ const activeBtn = () => {
  * ยังจับ boolean ผิด จึงต้อง set
  */
 onMounted(async () => {
+  await fetchSys();
+  await fetchPermissionsSys();
+
   if (keycloak.tokenParsed) {
     await fetchroleUser(keycloak.tokenParsed.role);
   }
   await fetchmsgNoread();
+
   // await getDataNotification(1, "NOMAL");
   myEventHandler(null, false);
   window.addEventListener("resize", (e: any) => {
@@ -499,6 +505,35 @@ const handleButtonClick = () => {
     console.log("No manual available for this page:", currentPath);
   }
 };
+
+/**
+ * function fetch รายการเมนูทั้งหมด
+ */
+function fetchSys() {
+  http
+    .get(config.API.orgPermissions)
+    .then((res) => {
+      storeMenu.fetchListMenu(res.data.result);
+    })
+    .catch((err) => {
+      messageError($q, err);
+    });
+}
+
+/**
+ * function fetch รายการเมนูทั้งหมด
+ */
+function fetchPermissionsSys() {
+  http
+    .get(config.API.orgPermissionsSys)
+    .then((res) => {
+      
+      storeMenu.fetchDataPermission(res.data.result)
+    })
+    .catch((err) => {
+      messageError($q, err);
+    });
+}
 </script>
 
 <!-- โครงเว็บ -->
@@ -762,28 +797,15 @@ const handleButtonClick = () => {
           <q-separator color="grey-9" />
           <!-- เมนูย่อย ตอนย่อ -->
           <q-list padding>
-            <div v-for="(menuItem, index) in menuList" :key="index">
-              <div v-if="role.includes(menuItem.role)">
+            <div v-for="(menuItem, index) in storeMenu.menuList" :key="index">
+              <div>
                 <q-item
                   clickable
                   v-ripple
-                  :active="link === menuItem.label"
-                  @click="link = menuItem.label"
+                  :active="link === menuItem.sysName"
+                  @click="link = menuItem.sysName"
                   active-class="text-primary menuActiveMini text-weight-medium"
-                  v-if="
-                    menuItem.key == 2 ||
-                    menuItem.key == 0 ||
-                    menuItem.key == 7 ||
-                    menuItem.key == 8 ||
-                    menuItem.key == 9 ||
-                    menuItem.key == 10 ||
-                    menuItem.key == 11 ||
-                    menuItem.key == 12 ||
-                    menuItem.key == 13 ||
-                    menuItem.key == 14 ||
-                    menuItem.key == 15 ||
-                    menuItem.key == 16
-                  "
+                  v-if="menuItem.children && menuItem.children.length !== 0"
                 >
                   <div class="row items-center no-wrap">
                     <q-icon :name="menuItem.icon" size="20px" class="q-ml-md" />
@@ -798,7 +820,7 @@ const handleButtonClick = () => {
                     self="center left"
                     :offset="[10, 10]"
                   >
-                    {{ menuItem.label }}
+                    {{ menuItem.sysName }}
                   </q-tooltip>
                   <q-menu
                     anchor="top right"
@@ -815,24 +837,25 @@ const handleButtonClick = () => {
                         <!-- เมนูย่อย 2 ชั้น -->
                         <div
                           v-if="
-                            menuItem.key == 2 ||
-                            menuItem.key == 7 ||
-                            menuItem.key == 12 ||
-                            menuItem.key == 13
+                            menuItem.id == 'SYS_EVA_METADATA' ||
+                            menuItem.id == 'SYS_EXAM' ||
+                            menuItem.id == 'SYS_DISCIPLINE' ||
+                            menuItem.id == 'SYS_EVA'
                           "
                         >
                           <q-item
                             dense
                             clickable
                             v-if="
-                              subMenu.key !== 2.0 &&
-                              subMenu.key !== 7.1 &&
-                              subMenu.key !== 12.0 &&
-                              subMenu.key !== 13.0
+                              subMenu.id == 'SYS_EVA_INDICATOR' ||
+                              subMenu.id == 'SYS_EXAM_CONTEST' ||
+                              subMenu.id == 'SYS_EXAM_SELECT' ||
+                              subMenu.id == 'SYS_DISCIPLINE_INFO' ||
+                              subMenu.id == 'SYS_EVA_INFO'
                             "
                           >
                             <q-item-section
-                              >{{ subMenu.label }}
+                              >{{ subMenu.sysName }}
                             </q-item-section>
                             <q-item-section side>
                               <q-icon name="keyboard_arrow_right" />
@@ -847,7 +870,7 @@ const handleButtonClick = () => {
                               <q-list class="text-white q-py-sm">
                                 <q-item
                                   v-for="subMenu2 in subMenu.children"
-                                  :key="subMenu2.label"
+                                  :key="subMenu2.sysName"
                                   :to="{ name: `${subMenu2.path}` }"
                                   dense
                                   class="q-pl-md text-body2"
@@ -856,7 +879,7 @@ const handleButtonClick = () => {
                                 >
                                   <q-item-section>
                                     <q-item-label>{{
-                                      subMenu2.label
+                                      subMenu2.sysName
                                     }}</q-item-label>
                                   </q-item-section>
                                 </q-item>
@@ -873,7 +896,7 @@ const handleButtonClick = () => {
                             :to="{ name: `${subMenu.path}` }"
                           >
                             <q-item-section>
-                              <q-item-label>{{ subMenu.label }}</q-item-label>
+                              <q-item-label>{{ subMenu.sysName }}</q-item-label>
                             </q-item-section>
                           </q-item>
                         </div>
@@ -887,7 +910,7 @@ const handleButtonClick = () => {
                             :to="{ name: `${subMenu.path}` }"
                           >
                             <q-item-section>
-                              <q-item-label>{{ subMenu.label }}</q-item-label>
+                              <q-item-label>{{ subMenu.sysName }}</q-item-label>
                             </q-item-section>
                           </q-item>
                         </div>
@@ -899,8 +922,8 @@ const handleButtonClick = () => {
                   clickable
                   v-ripple
                   :to="{ name: `${menuItem.path}` }"
-                  :active="link === menuItem.label"
-                  @click="link = menuItem.label"
+                  :active="link === menuItem.sysName"
+                  @click="link = menuItem.sysName"
                   active-class="text-primary menuActiveMini"
                   v-else
                 >
@@ -914,7 +937,7 @@ const handleButtonClick = () => {
                     self="center left"
                     :offset="[10, 10]"
                   >
-                    {{ menuItem.label }}
+                    {{ menuItem.sysName }}
                   </q-tooltip>
                 </q-item>
               </div>
@@ -946,28 +969,15 @@ const handleButtonClick = () => {
         </q-toolbar>
         <q-separator inset color="grey-9" />
         <q-list padding>
-          <div v-for="(menuItem, index) in menuList" :key="index">
+          <div v-for="(menuItem, index) in storeMenu.menuList" :key="index">
             <!-- เมนูย่อย -->
-            <div v-if="role.includes(menuItem.role)">
+            <div>
               <q-expansion-item
                 group="somegroup"
                 class="menuSub"
                 expand-icon="mdi-chevron-down"
                 expanded-icon="mdi-chevron-up"
-                v-if="
-                  menuItem.key == 2 ||
-                  menuItem.key == 0 ||
-                  menuItem.key == 7 ||
-                  menuItem.key == 8 ||
-                  menuItem.key == 9 ||
-                  menuItem.key == 10 ||
-                  menuItem.key == 11 ||
-                  menuItem.key == 12 ||
-                  menuItem.key == 13 ||
-                  menuItem.key == 14 ||
-                  menuItem.key == 15 ||
-                  menuItem.key == 16
-                "
+                v-if="menuItem.children && menuItem.children.length !== 0"
               >
                 <template v-slot:header>
                   <q-item-section avatar>
@@ -977,28 +987,29 @@ const handleButtonClick = () => {
                       font-size="20px"
                     />
                   </q-item-section>
-                  <q-item-section>{{ menuItem.label }}</q-item-section>
+                  <q-item-section>{{ menuItem.sysName }}</q-item-section>
                 </template>
 
                 <!-- เมนูย่อย 2 ชั้น (สรรหา) -->
                 <div
                   v-if="
-                    menuItem.key == 2 ||
-                    menuItem.key == 7 ||
-                    menuItem.key == 12 ||
-                    menuItem.key == 13
+                    menuItem.id == 'SYS_EVA_METADATA' ||
+                    menuItem.id == 'SYS_EXAM' ||
+                    menuItem.id == 'SYS_DISCIPLINE' ||
+                    menuItem.id == 'SYS_EVA'
                   "
                 >
                   <div v-for="(subMenu, i) in menuItem.children" :key="i">
                     <q-expansion-item
                       switch-toggle-side
                       dense-toggle
-                      :label="subMenu.label"
+                      :label="subMenu.sysName"
                       v-if="
-                        subMenu.key !== 2.0 &&
-                        subMenu.key !== 7.1 &&
-                        subMenu.key !== 12.0 &&
-                        subMenu.key !== 13.0
+                        subMenu.id == 'SYS_EVA_INDICATOR' ||
+                        subMenu.id == 'SYS_EXAM_CONTEST' ||
+                        subMenu.id == 'SYS_EXAM_SELECT' ||
+                        subMenu.id == 'SYS_DISCIPLINE_INFO' ||
+                        subMenu.id == 'SYS_EVA_INFO'
                       "
                       class="expan2"
                       dense
@@ -1009,12 +1020,12 @@ const handleButtonClick = () => {
                         active-class="text-primary active-item text-weight-bold menuSubAct"
                         clickable
                         v-for="subMenu2 in subMenu.children"
-                        :key="subMenu2.key"
+                        :key="subMenu2.id"
                         :to="{ name: `${subMenu2.path}` }"
                       >
                         <q-item-section>
                           <q-item-label class="font-400 subLabel"
-                            >{{ subMenu2.label }}
+                            >{{ subMenu2.sysName }}
                           </q-item-label>
                         </q-item-section>
                       </q-item>
@@ -1028,7 +1039,7 @@ const handleButtonClick = () => {
                       :to="{ name: `${subMenu.path}` }"
                     >
                       <q-item-section>
-                        <q-item-label>{{ subMenu.label }} </q-item-label>
+                        <q-item-label>{{ subMenu.sysName }} </q-item-label>
                       </q-item-section>
                     </q-item>
                   </div>
@@ -1046,7 +1057,7 @@ const handleButtonClick = () => {
                 >
                   <q-item-section>
                     <q-item-label class="font-400">{{
-                      subMenu.label
+                      subMenu.sysName
                     }}</q-item-label>
                   </q-item-section>
                 </q-item>
@@ -1066,18 +1077,12 @@ const handleButtonClick = () => {
               >
                 <q-item-section avatar>
                   <q-avatar size="md" font-size="20px">
-                    <q-icon
-                      :name="
-                        menuItem.key === active
-                          ? menuItem.activeIcon
-                          : menuItem.icon
-                      "
-                    />
+                    <q-icon :name="menuItem.icon" />
                   </q-avatar>
                 </q-item-section>
 
                 <q-item-section>
-                  <q-item-label>{{ menuItem.label }}</q-item-label>
+                  <q-item-label>{{ menuItem.sysName }}</q-item-label>
                 </q-item-section>
               </q-item>
             </div>
diff --git a/src/views/auth.vue b/src/views/auth.vue
new file mode 100644
index 000000000..13301ef08
--- /dev/null
+++ b/src/views/auth.vue
@@ -0,0 +1,30 @@
+<script setup lang="ts">
+import { onMounted } from 'vue'
+import { useRoute } from 'vue-router'
+
+const route = useRoute()
+
+function setCookie(name: string, value: any, days: number) {
+  let expires = ''
+  if (days) {
+    const date = new Date()
+    date.setTime(date.getTime() + days * 24 * 60 * 55 * 1000)
+    expires = '; expires=' + date.toUTCString()
+  }
+  document.cookie = name + '=' + (value || '') + expires + '; path=/'
+}
+
+onMounted(async () => {
+  console.log('query', route.query.token)
+  console.log('accessToken', route.query.accessToken)
+
+  setCookie('BMAHRIS_KEYCLOAK_IDENTITY', route.query.token, 1)
+  setCookie('BMAHRIS_KEYCLOAK_REFRESH', route.query.accessToken, 1)
+
+  window.location.href = '/'
+})
+</script>
+
+<template>
+  <div></div>
+</template>
diff --git a/src/views/login.vue b/src/views/login.vue
index ea2b1c615..459c7f719 100644
--- a/src/views/login.vue
+++ b/src/views/login.vue
@@ -1,42 +1,42 @@
 <!-- authen with keycloak client -->
 <script setup lang="ts">
-import { ref } from 'vue'
-import axios from 'axios'
-import { keycloakConfig } from '@/plugins/keycloak'
-import { useRouter } from 'vue-router'
-import { useQuasar } from 'quasar'
-import { useCounterMixin } from '@/stores/mixin'
+import { ref, onMounted } from "vue";
+import axios from "axios";
+import keycloak, { keycloakConfig } from "@/plugins/keycloak";
+import { useRouter } from "vue-router";
+import { useQuasar } from "quasar";
+import { useCounterMixin } from "@/stores/mixin";
 
-const router = useRouter()
-const mixin = useCounterMixin()
-const $q = useQuasar() //ใช้ noti quasar
+const router = useRouter();
+const mixin = useCounterMixin();
+const $q = useQuasar(); //ใช้ noti quasar
 
-const { showLoader, hideLoader, messageError } = mixin
+const { showLoader, hideLoader, messageError } = mixin;
 
 function setCookie(name: string, value: any, days: number) {
-  let expires = ''
+  let expires = "";
   if (days) {
-    const date = new Date()
-    date.setTime(date.getTime() + days * 24 * 60 * 60 * 1000)
-    expires = '; expires=' + date.toUTCString()
+    const date = new Date();
+    date.setTime(date.getTime() + days * 24 * 60 * 60 * 1000);
+    expires = "; expires=" + date.toUTCString();
   }
-  document.cookie = name + '=' + (value || '') + expires + '; path=/'
+  document.cookie = name + "=" + (value || "") + expires + "; path=/";
 }
 
-const username = ref<string>('')
-const password = ref<string>('')
+const username = ref<string>("");
+const password = ref<string>("");
 async function onSubmit() {
-  showLoader()
-  const formdata = new URLSearchParams()
-  formdata.append('client_id', keycloakConfig.clientId)
-  formdata.append('client_secret', keycloakConfig.clientSecret)
-  formdata.append('grant_type', 'password')
+  showLoader();
+  const formdata = new URLSearchParams();
+  formdata.append("client_id", keycloakConfig.clientId);
+  formdata.append("client_secret", keycloakConfig.clientSecret);
+  formdata.append("grant_type", "password");
   formdata.append(
-    'requested_token_type',
-    'urn:ietf:params:oauth:token-type:refresh_token'
-  )
-  formdata.append('username', username.value)
-  formdata.append('password', password.value)
+    "requested_token_type",
+    "urn:ietf:params:oauth:token-type:refresh_token"
+  );
+  formdata.append("username", username.value);
+  formdata.append("password", password.value);
 
   await axios
     .post(
@@ -44,21 +44,21 @@ async function onSubmit() {
       formdata,
       {
         headers: {
-          'Content-Type': 'application/x-www-form-urlencoded',
+          "Content-Type": "application/x-www-form-urlencoded",
         },
       }
     )
     .then(async (res) => {
-      await setCookie('BMAHRIS_KEYCLOAK_IDENTITY', res.data.access_token, 1)
-      await setCookie('BMAHRIS_KEYCLOAK_REFRESH', res.data.refresh_token, 1)
-      window.location.href = '/'
+      await setCookie("BMAHRIS_KEYCLOAK_IDENTITY", res.data.access_token, 1);
+      await setCookie("BMAHRIS_KEYCLOAK_REFRESH", res.data.refresh_token, 1);
+      window.location.href = "/";
     })
     .catch((err) => {
-      messageError($q, err, 'ชื่อผู้ใช้หรือรหัสผ่านไม่ถูกต้อง')
+      messageError($q, err, "ชื่อผู้ใช้หรือรหัสผ่านไม่ถูกต้อง");
     })
     .finally(() => {
-      hideLoader()
-    })
+      hideLoader();
+    });
 
   // if (response.status !== 200) {
   //   messageError($q, err)
@@ -68,6 +68,13 @@ async function onSubmit() {
   //   router.push('/')
   // }
 }
+onMounted(() => {
+  if (keycloak.authenticated) {
+    console.log("authenticated", keycloak.authenticated);
+
+    router.push("/");
+  }
+});
 </script>
 
 <template>
@@ -184,8 +191,8 @@ async function onSubmit() {
   margin-bottom: 10px;
 }
 
-input[type='checkbox'],
-input[type='radio'] {
+input[type="checkbox"],
+input[type="radio"] {
   margin: 1px 3px 0 0;
   line-height: normal;
 }
@@ -218,8 +225,8 @@ input[type='radio'] {
   z-index: 1 !important;
 }
 .bg-image {
-  font-family: 'Noto Sans Thai', sans-serif;
-  font-family: 'Noto Sans Thai', sans-serif;
+  font-family: "Noto Sans Thai", sans-serif;
+  font-family: "Noto Sans Thai", sans-serif;
   text-rendering: optimizeLegibility;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;