From a0faabac355c1210f42a3f10a5c2185fedd20444 Mon Sep 17 00:00:00 2001
From: "DESKTOP-1R2VSQH\\Lenovo ThinkPad E490" <nicey2t1096@gmail.com>
Date: Wed, 9 Jul 2025 13:54:18 +0700
Subject: [PATCH 1/5] =?UTF-8?q?fix=20await=20=E0=B8=AA=E0=B9=88=E0=B8=87?=
 =?UTF-8?q?=E0=B8=88=E0=B8=B2=E0=B8=81=E0=B8=AB=E0=B8=99=E0=B9=89=E0=B8=B2?=
 =?UTF-8?q?=E0=B8=A3=E0=B8=B2=E0=B8=A2=E0=B8=A5=E0=B8=B0=E0=B9=80=E0=B8=AD?=
 =?UTF-8?q?=E0=B8=B5=E0=B8=A2=E0=B8=94=E0=B8=97=E0=B8=B0=E0=B9=80=E0=B8=9A?=
 =?UTF-8?q?=E0=B8=B5=E0=B8=A2=E0=B8=99=E0=B8=9B=E0=B8=A3=E0=B8=B0=E0=B8=A7?=
 =?UTF-8?q?=E0=B8=B1=E0=B8=95=E0=B8=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../04_registryPerson/views/detailView.vue    | 20 ++++++++++---------
 1 file changed, 11 insertions(+), 9 deletions(-)

diff --git a/src/modules/04_registryPerson/views/detailView.vue b/src/modules/04_registryPerson/views/detailView.vue
index 0d48df7f3..a8585fb26 100644
--- a/src/modules/04_registryPerson/views/detailView.vue
+++ b/src/modules/04_registryPerson/views/detailView.vue
@@ -375,7 +375,9 @@ async function fetchDataPersonal() {
           res.data.result.leaveReason !== null &&
           res.data.result.leaveReason !== ""
         ) {
-          leaveReason.value = `(พ้นจากราชการ : ${storeRegistry.convertTypeRetired(res.data.result.leaveType)})`;
+          leaveReason.value = `(พ้นจากราชการ : ${storeRegistry.convertTypeRetired(
+            res.data.result.leaveType
+          )})`;
         }
         reasonStatus.value = reason.length > 0 ? true : false;
       }
@@ -439,8 +441,8 @@ function helpPost() {
     await http
       .post(config.API.placemenHelpGov, formData)
       .then(async () => {
-        await router.push("/placement/help-government");
         await success($q, "ดำเนินการสำเร็จ");
+        router.push("/placement/help-government");
       })
       .catch((e) => {
         messageError($q, e);
@@ -460,8 +462,8 @@ function repatriationPost() {
     await http
       .post(config.API.placemenRepatriation, formData)
       .then(async () => {
-        await router.push("/placement/repatriate");
         await success($q, "ดำเนินการสำเร็จ");
+        router.push("/placement/repatriate");
       })
       .catch((e) => {
         messageError($q, e);
@@ -481,8 +483,8 @@ function appointPost() {
     await http
       .post(config.API.placemenAppointment, formData)
       .then(async () => {
-        await router.push("/placement/appoint-promote");
         await success($q, "ดำเนินการสำเร็จ");
+        router.push("/placement/appoint-promote");
       })
       .catch((e) => {
         messageError($q, e);
@@ -516,14 +518,14 @@ function outPost() {
     await http
       .post(config.API.retirementOut, formData)
       .then(async () => {
-        await router.push(
+        await success($q, "ดำเนินการสำเร็จ");
+        router.push(
           `${
             empType.value === "-employee"
               ? `/retirementEmployee`
               : `/retirement/dismiss-order`
           }`
         );
-        await success($q, "ดำเนินการสำเร็จ");
       })
       .catch((e) => {
         messageError($q, e);
@@ -547,8 +549,8 @@ function otherPost() {
     await http
       .post(config.API.placemenOther, formData)
       .then(async () => {
-        await router.push("/placement/other");
         await success($q, "ดำเนินการสำเร็จ");
+        router.push("/placement/other");
       })
       .catch((e) => {
         messageError($q, e);
@@ -568,8 +570,8 @@ function appointEmployeePost() {
     await http
       .post(config.API.appointEmployee(), formData)
       .then(async () => {
-        await router.push("/placement/appoint-employee");
         await success($q, "ดำเนินการสำเร็จ");
+        router.push("/placement/appoint-employee");
       })
       .catch((e) => {
         messageError($q, e);
@@ -599,8 +601,8 @@ function clickSaveDeceased() {
     await http
       .post(config.API.listDeceased(), formData)
       .then(async () => {
-        await router.push("/retirement/deceased");
         await success($q, "บันทึกข้อมูลสำเร็จ");
+        router.push("/retirement/deceased");
       })
       .catch((e) => {
         messageError($q, e);

From 136d22c7fc3d683c700baa47fe4428406c1396ef Mon Sep 17 00:00:00 2001
From: "DESKTOP-1R2VSQH\\Lenovo ThinkPad E490" <nicey2t1096@gmail.com>
Date: Wed, 9 Jul 2025 16:52:21 +0700
Subject: [PATCH 2/5] =?UTF-8?q?fix=20fetch=20=E0=B8=A3=E0=B8=B2=E0=B8=8A?=
 =?UTF-8?q?=E0=B8=8A=E0=B8=B7=E0=B9=88=E0=B8=AD=E0=B8=84=E0=B8=93=E0=B8=B0?=
 =?UTF-8?q?=E0=B8=81=E0=B8=A3=E0=B8=A3=E0=B8=A1=E0=B8=81=E0=B8=B2=E0=B8=A3?=
 =?UTF-8?q?=20=3D=3D=3D>=20=E0=B9=81=E0=B8=95=E0=B9=88=E0=B8=87=E0=B8=95?=
 =?UTF-8?q?=E0=B8=B1=E0=B9=89=E0=B8=87=E0=B8=84=E0=B8=93=E0=B8=B0=E0=B8=81?=
 =?UTF-8?q?=E0=B8=A3=E0=B8=A3=E0=B8=A1=E0=B8=81=E0=B8=B2=E0=B8=A3=E0=B8=9B?=
 =?UTF-8?q?=E0=B8=A3=E0=B8=B0=E0=B9=80=E0=B8=A1=E0=B8=B4=E0=B8=99=E0=B8=9C?=
 =?UTF-8?q?=E0=B8=A5=E0=B8=81=E0=B8=B2=E0=B8=A3=E0=B8=97=E0=B8=94=E0=B8=A5?=
 =?UTF-8?q?=E0=B8=AD=E0=B8=87=E0=B8=9B=E0=B8=8F=E0=B8=B4=E0=B8=9A=E0=B8=B1?=
 =?UTF-8?q?=E0=B8=95=E0=B8=B4=E0=B8=AB=E0=B8=99=E0=B9=89=E0=B8=B2=E0=B8=97?=
 =?UTF-8?q?=E0=B8=B5=E0=B9=88=E0=B8=A3=E0=B8=B2=E0=B8=8A=E0=B8=81=E0=B8=B2?=
 =?UTF-8?q?=E0=B8=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/probation/FormAppoint/FormAppoint.vue           | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/src/modules/05_placement/components/probation/FormAppoint/FormAppoint.vue b/src/modules/05_placement/components/probation/FormAppoint/FormAppoint.vue
index b938bbf8a..d64ccb033 100644
--- a/src/modules/05_placement/components/probation/FormAppoint/FormAppoint.vue
+++ b/src/modules/05_placement/components/probation/FormAppoint/FormAppoint.vue
@@ -304,7 +304,8 @@ function onAddPerson() {
 async function getPerson() {
   showLoader();
   await http
-    .post(config.API.orgProfileDirector, {
+    .post(config.API.probationCommanderDirector, {
+      profileId: profileId.value,
       isAct: isAct.value,
       isDirector: isDirector.value,
       pageSize: pagination.value.rowsPerPage,

From aa2a7a5f5d5da4d688e96be9230af9d18499a304 Mon Sep 17 00:00:00 2001
From: "DESKTOP-1R2VSQH\\Lenovo ThinkPad E490" <nicey2t1096@gmail.com>
Date: Fri, 11 Jul 2025 09:33:55 +0700
Subject: [PATCH 3/5] =?UTF-8?q?fix=20CurrentPage=20=E0=B9=82=E0=B8=84?=
 =?UTF-8?q?=E0=B8=A3=E0=B8=87=E0=B8=AA=E0=B8=A3=E0=B9=89=E0=B8=B2=E0=B8=87?=
 =?UTF-8?q?=E0=B8=AD=E0=B8=B1=E0=B8=95=E0=B8=A3=E0=B8=B2=E0=B8=81=E0=B8=B3?=
 =?UTF-8?q?=E0=B8=A5=E0=B8=B1=E0=B8=87?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/modules/02_organization/components/TableMain.vue | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/src/modules/02_organization/components/TableMain.vue b/src/modules/02_organization/components/TableMain.vue
index 7d3033dea..7f32cc047 100644
--- a/src/modules/02_organization/components/TableMain.vue
+++ b/src/modules/02_organization/components/TableMain.vue
@@ -6,6 +6,7 @@ import config from "@/app.config";
 import http from "@/plugins/http";
 import genreport from "@/plugins/genreportxlsx";
 import { checkPermission } from "@/utils/permissions";
+import { updateCurrentPage } from "@/utils/function";
 import { useOrganizational } from "@/modules/02_organization/store/organizational";
 import { useCounterMixin } from "@/stores/mixin";
 
@@ -322,6 +323,11 @@ function onClickDelete(id: string) {
     await http
       .delete(config.API.orgPosMasterById(id))
       .then(async () => {
+        reqMaster.value.page = await updateCurrentPage(
+          reqMaster.value.page,
+          totalPage.value,
+          posMaster.value.length
+        );
         await Promise.all([
           props.fetchDataTable?.(
             reqMaster.value.id,

From 938b1f8e9874af5695c825434d5ec170f97c71bd Mon Sep 17 00:00:00 2001
From: "DESKTOP-1R2VSQH\\Lenovo ThinkPad E490" <nicey2t1096@gmail.com>
Date: Fri, 11 Jul 2025 12:14:16 +0700
Subject: [PATCH 4/5] fix reprot

---
 src/interface/main.ts                         |   2 +
 .../07_insignia/views/06_ReportMain.vue       |   2 +-
 .../21_report/components/01_org/Main.vue      |  68 ++++-----
 .../21_report/components/01_org/TreeMain.vue  |   2 +-
 .../21_report/views/04_reportEvaluate.vue     | 113 +++++++++++----
 .../21_report/views/05_reportSalary.vue       | 134 ++++++++++++++----
 6 files changed, 229 insertions(+), 92 deletions(-)

diff --git a/src/interface/main.ts b/src/interface/main.ts
index b6126d2ec..91b4f8464 100644
--- a/src/interface/main.ts
+++ b/src/interface/main.ts
@@ -55,6 +55,8 @@ interface DataStructureTree {
   orgRootCode: string;
   orgRootShortName: string;
   isDeputy?: boolean;
+  id?: string;
+  orgTreeDnaId?: string; // Added for compatibility with the new structure
 }
 
 interface DataStrategy {
diff --git a/src/modules/07_insignia/views/06_ReportMain.vue b/src/modules/07_insignia/views/06_ReportMain.vue
index cc252c64b..e0b285020 100644
--- a/src/modules/07_insignia/views/06_ReportMain.vue
+++ b/src/modules/07_insignia/views/06_ReportMain.vue
@@ -510,7 +510,7 @@ onMounted(async () => {
                           <template v-slot:default-header="prop">
                             <q-item
                               @click.stop="onSelectedNode(prop.node)"
-                              :active="nodeId === prop.node.orgTreeId"
+                              :active="nodeId === prop.node.orgTreeDnaId"
                               clickable
                               active-class="my-list-link text-primary text-weight-medium"
                               class="row col-12 items-center text-dark q-py-xs q-pl-sm rounded-borders my-list"
diff --git a/src/modules/21_report/components/01_org/Main.vue b/src/modules/21_report/components/01_org/Main.vue
index 6c83fdc9a..40512081d 100644
--- a/src/modules/21_report/components/01_org/Main.vue
+++ b/src/modules/21_report/components/01_org/Main.vue
@@ -144,29 +144,29 @@ async function fetchDataTable(id: string, level: number, action: boolean) {
 }
 
 /**  ดึงข้อมูลสถิติจำนวนด้านบน*/
-function getSummary() {
-  http
-    .post(config.API.orgSummary, {
-      id: reqMaster.id, //*Id node
-      type: reqMaster.type, //*ประเภทnode
-      isNode: reqMaster.isAll, //*นับทั้ง node ไหม
-    })
-    .then(async (res: any) => {
-      const data = await res.data.result;
-      store.getSumPosition({
-        totalPosition: data.totalPosition,
-        totalPositionCurrentUse: data.totalPositionCurrentUse,
-        totalPositionCurrentVacant: data.totalPositionCurrentVacant,
-        totalPositionNextUse: data.totalPositionNextUse,
-        totalPositionNextVacant: data.totalPositionNextVacant,
-        totalRootPosition: data.totalPosition,
-        totalRootPositionCurrentUse: data.totalPositionCurrentUse,
-        totalRootPositionCurrentVacant: data.totalPositionCurrentVacant,
-        totalRootPositionNextUse: data.totalPositionNextUse,
-        totalRootPositionNextVacant: data.totalPositionNextVacant,
-      });
-    });
-}
+// function getSummary() {
+//   http
+//     .post(config.API.orgSummary, {
+//       id: reqMaster.id, //*Id node
+//       type: reqMaster.type, //*ประเภทnode
+//       isNode: reqMaster.isAll, //*นับทั้ง node ไหม
+//     })
+//     .then(async (res: any) => {
+//       const data = await res.data.result;
+//       store.getSumPosition({
+//         totalPosition: data.totalPosition,
+//         totalPositionCurrentUse: data.totalPositionCurrentUse,
+//         totalPositionCurrentVacant: data.totalPositionCurrentVacant,
+//         totalPositionNextUse: data.totalPositionNextUse,
+//         totalPositionNextVacant: data.totalPositionNextVacant,
+//         totalRootPosition: data.totalPosition,
+//         totalRootPositionCurrentUse: data.totalPositionCurrentUse,
+//         totalRootPositionCurrentVacant: data.totalPositionCurrentVacant,
+//         totalRootPositionNextUse: data.totalPositionNextUse,
+//         totalRootPositionNextVacant: data.totalPositionNextVacant,
+//       });
+//     });
+// }
 
 /** funcion ค้นหาข้อมูลใน Table*/
 async function filterKeyword() {
@@ -222,17 +222,17 @@ watch([() => reqMaster.page, () => reqMaster.pageSize], () => {
 });
 
 /** callblck function ทำการ fetch ข้อมูล Table เมื่อแสดงตำแหน่งทั้งหมด*/
-watch(
-  () => reqMaster.isAll,
-  () => {
-    getSummary();
-    if (reqMaster.page !== 1) {
-      reqMaster.page = 1;
-    } else {
-      fetchDataTable(reqMaster.id, reqMaster.type, false);
-    }
-  }
-);
+// watch(
+//   () => reqMaster.isAll,
+//   () => {
+//     getSummary();
+//     if (reqMaster.page !== 1) {
+//       reqMaster.page = 1;
+//     } else {
+//       fetchDataTable(reqMaster.id, reqMaster.type, false);
+//     }
+//   }
+// );
 
 watch(
   () => store.draftId,
diff --git a/src/modules/21_report/components/01_org/TreeMain.vue b/src/modules/21_report/components/01_org/TreeMain.vue
index 1fd822ea7..96279f6a9 100644
--- a/src/modules/21_report/components/01_org/TreeMain.vue
+++ b/src/modules/21_report/components/01_org/TreeMain.vue
@@ -71,7 +71,7 @@ function updateSelected(data: DataTree) {
       .post(config.API.orgSummary, {
         id: data.orgTreeId, //*Id node
         type: data.orgLevel, //*ประเภทnode
-        isNode: false, //*นับทั้ง node ไหม
+        isNode: true, //*นับทั้ง node ไหม
       })
       .then(async (res: any) => {
         const data = await res.data.result;
diff --git a/src/modules/21_report/views/04_reportEvaluate.vue b/src/modules/21_report/views/04_reportEvaluate.vue
index c0413e795..a2e2b674d 100644
--- a/src/modules/21_report/views/04_reportEvaluate.vue
+++ b/src/modules/21_report/views/04_reportEvaluate.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { ref, onMounted } from "vue";
+import { ref, onMounted, computed } from "vue";
 import { useQuasar } from "quasar";
 import { VuePDF, usePDF } from "@tato30/vue-pdf";
 import axios from "axios";
@@ -21,14 +21,23 @@ const { fetchStructureTree } = useStructureTree();
 const { messageError } = useCounterMixin();
 
 const loadingBtn = ref<boolean>(false);
-const expandedModal = ref<boolean>(false);
+// const expandedModal = ref<boolean>(false);
 const org = ref<string>("");
 
 const isLoadStructureTree = ref<boolean>(true);
-const filterTree = ref<string>("");
+// const filterTree = ref<string>("");
 const nodeId = ref<string>("");
-const nodeName = ref<string>("");
-const node = ref<DataStructureTree[]>([]);
+// const nodeName = ref<string>("");
+// const node = ref<DataStructureTree[]>([]);
+const organizationOpsMain = ref<DataStructureTree[]>([]);
+const organizationOps = ref<DataStructureTree[]>([]);
+const organizationName = computed(() => {
+  return (
+    organizationOpsMain.value.find(
+      (e: DataStructureTree) => e.orgTreeDnaId === nodeId.value
+    )?.orgRootName || ""
+  );
+});
 
 const year = ref<number>(new Date().getFullYear());
 
@@ -49,7 +58,9 @@ async function fetchDataTree() {
         ...item,
         children: null,
       }));
-      node.value = data;
+      organizationOps.value = data;
+      organizationOpsMain.value = data;
+      // node.value = data;
     }
   } catch (err) {
     messageError($q, err);
@@ -110,24 +121,24 @@ async function fetchDocumentTemplate(data: any) {
 function onDownloadFile(type: string) {
   genReportXLSX(
     detailReport.value,
-    `รายงานสรุปจำนวนผลงานการประเมิน_${nodeName.value}`,
+    `รายงานสรุปจำนวนผลงานการประเมิน_${organizationName.value}`,
     type
   );
 }
 
-/**
- * function เลือกหน่วยงาน
- * @param id id หน่วยงาน
- * @param level ระดับหน่วยงาน
- */
-function onSelectedNode(data: any) {
-  if (data.orgTreeId !== nodeId.value) {
-    nodeId.value = data.orgTreeDnaId;
-    nodeName.value = data.orgTreeName;
-    org.value = data.orgName;
-    expandedModal.value = false;
-  }
-}
+// /**
+//  * function เลือกหน่วยงาน
+//  * @param id id หน่วยงาน
+//  * @param level ระดับหน่วยงาน
+//  */
+// function onSelectedNode(data: any) {
+//   if (data.orgTreeId !== nodeId.value) {
+//     nodeId.value = data.orgTreeDnaId;
+//     nodeName.value = data.orgTreeName;
+//     org.value = data.orgName;
+//     expandedModal.value = false;
+//   }
+// }
 
 /** กลับหน้าก่อนหน้าของรายงาน */
 function backPage() {
@@ -147,9 +158,30 @@ function clearFilter() {
   pdfSrc.value = undefined;
   detailReport.value = undefined;
   year.value = new Date().getFullYear();
-  org.value = "";
+  // org.value = "";
   nodeId.value = "";
-  nodeName.value = "";
+  // nodeName.value = "";
+}
+
+/**
+ * function ค้นหาคำใน select
+ * @param val คำค้นหา
+ * @param update function
+ * @param type ประเภท select
+ */
+function filterSelector(val: string, update: Function, type: string) {
+  switch (type) {
+    case "organization":
+      update(() => {
+        organizationOps.value = organizationOpsMain.value.filter(
+          (v: DataStructureTree) => v.labelName.toLowerCase().indexOf(val) > -1
+        );
+      });
+      break;
+
+    default:
+      break;
+  }
 }
 
 onMounted(() => {
@@ -229,8 +261,36 @@ onMounted(() => {
                   />
                 </q-card-section>
                 <q-card-section class="q-pa-none">
-                  <div class="col-12">
-                    <q-expansion-item
+                  <div class="col-12 q-pb-xs q-px-sm">
+                    <q-select
+                      menu-anchor="top left"
+                      menu-self="bottom left"
+                      class="bg-white"
+                      dense
+                      borderless
+                      hide-selected
+                      fill-input
+                      hide-bottom-space
+                      option-label="orgRootName"
+                      option-value="orgTreeDnaId"
+                      emit-value
+                      map-options
+                      v-model="nodeId"
+                      :options="organizationOps"
+                      label="หน่วยงาน"
+                      use-input
+                      @filter="(inputValue: string,
+            doneFn: Function) => filterSelector(inputValue, doneFn,'organization' )"
+                    >
+                      <template v-slot:no-option>
+                        <q-item>
+                          <q-item-section class="text-grey">
+                            ไม่มีข้อมูล
+                          </q-item-section>
+                        </q-item>
+                      </template>
+                    </q-select>
+                    <!-- <q-expansion-item
                       v-model="expandedModal"
                       dense
                       dense-toggle
@@ -249,7 +309,6 @@ onMounted(() => {
                           >
                           </q-input>
                         </div>
-                        <!-- @click="onOpenOrg" -->
                       </template>
                       <q-separator />
 
@@ -287,7 +346,7 @@ onMounted(() => {
                           <template v-slot:default-header="prop">
                             <q-item
                               @click.stop="onSelectedNode(prop.node)"
-                              :active="nodeId === prop.node.orgTreeId"
+                              :active="nodeId === prop.node.orgTreeDnaId"
                               clickable
                               active-class="my-list-link text-primary text-weight-medium"
                               class="row col-12 items-center text-dark q-py-xs q-pl-sm rounded-borders my-list"
@@ -313,7 +372,7 @@ onMounted(() => {
                           </template>
                         </q-tree>
                       </q-card-section>
-                    </q-expansion-item>
+                    </q-expansion-item> -->
                   </div>
                   <q-separator />
                   <div class="col-12 q-px-sm">
diff --git a/src/modules/21_report/views/05_reportSalary.vue b/src/modules/21_report/views/05_reportSalary.vue
index 4d8387726..af32b2dcd 100644
--- a/src/modules/21_report/views/05_reportSalary.vue
+++ b/src/modules/21_report/views/05_reportSalary.vue
@@ -25,8 +25,8 @@ const { messageError, showLoader, hideLoader } = useCounterMixin();
 
 const checkId = ref<string>("");
 const isLoadStructureTree = ref<boolean>(true);
-const expandedModal = ref<boolean>(false);
-const org = ref<string>("");
+// const expandedModal = ref<boolean>(false);
+// const org = ref<string>("");
 const year = ref<number>(new Date().getFullYear());
 const isLoadFilePdf = ref<boolean>(false);
 const employeeClass = ref<string>("officer");
@@ -81,14 +81,24 @@ const numOfPages = ref<number>(0);
 const page = ref<number>(1);
 const pdfSrc = ref<any>();
 
-const filterTree = ref<string>("");
+// const filterTree = ref<string>("");
 const nodeId = ref<string>("");
-const nodeName = ref<string>("");
-const node = ref<DataStructureTree[]>([]);
+// const nodeName = ref<string>("");
+// const node = ref<DataStructureTree[]>([]);
 
 const detailReport = ref<any>();
 const splitterModel = ref(14);
 
+const organizationOpsMain = ref<DataStructureTree[]>([]);
+const organizationOps = ref<DataStructureTree[]>([]);
+const organizationName = computed(() => {
+  return (
+    organizationOpsMain.value.find(
+      (e: DataStructureTree) => e.id === nodeId.value
+    )?.orgRootName || ""
+  );
+});
+
 /** ฟังก์ชันเรียกข้อมูลรอบการขึ้นเงินเดือน*/
 async function fetchDataRound() {
   isRound.value = false;
@@ -142,7 +152,9 @@ async function fetchDataOrg(revisionId: string) {
       children: null,
       labelName: `${item.orgRootName} ${item.orgRootCode} ${item.orgRootShortName}`,
     }));
-    node.value = data;
+    // node.value = data;
+    organizationOps.value = data;
+    organizationOpsMain.value = data;
   } catch (err) {
     messageError($q, err);
   } finally {
@@ -150,19 +162,19 @@ async function fetchDataOrg(revisionId: string) {
   }
 }
 
-/**
- * function เลือกหน่วยงาน
- * @param id id หน่วยงาน
- * @param level ระดับหน่วยงาน
- */
-function onSelectedNode(data: any) {
-  if (data.id !== nodeId.value) {
-    nodeId.value = data.id;
-    nodeName.value = data.orgRootName;
-    org.value = data.orgRootName;
-    expandedModal.value = false;
-  }
-}
+// /**
+//  * function เลือกหน่วยงาน
+//  * @param id id หน่วยงาน
+//  * @param level ระดับหน่วยงาน
+//  */
+// function onSelectedNode(data: any) {
+//   if (data.id !== nodeId.value) {
+//     nodeId.value = data.id;
+//     nodeName.value = data.orgRootName;
+//     org.value = data.orgRootName;
+//   }
+//   expandedModal.value = false;
+// }
 
 function onChangeYear() {
   fetchDataRound();
@@ -253,7 +265,7 @@ async function fetchDataReportUnified(
     try {
       const res = await http.get(finalUrl);
       const dataList = res.data.result;
-      await fetchDocumentTemplate(dataList);
+      dataList && (await fetchDocumentTemplate(dataList));
     } catch (e) {
       messageError($q, e);
     } finally {
@@ -296,7 +308,7 @@ function onDownloadFile(type: string) {
   const name = reportOption.value.find(
     (e) => e.keyId === report.value?.keyId
   )?.name;
-  genReportXLSX(detailReport.value, `${name}_${nodeName.value}`, type);
+  genReportXLSX(detailReport.value, `${name}_${organizationName.value}`, type);
 }
 
 /** กลับหน้าก่อนหน้าของรายงาน */
@@ -322,9 +334,30 @@ function clearFilter() {
 
   detailReport.value = undefined;
   pdfSrc.value = undefined;
-  org.value = "";
+  // org.value = "";
   nodeId.value = "";
-  nodeName.value = "";
+  // nodeName.value = "";
+}
+
+/**
+ * function ค้นหาคำใน select
+ * @param val คำค้นหา
+ * @param update function
+ * @param type ประเภท select
+ */
+function filterSelector(val: string, update: Function, type: string) {
+  switch (type) {
+    case "organization":
+      update(() => {
+        organizationOps.value = organizationOpsMain.value.filter(
+          (v: DataStructureTree) => v.labelName.toLowerCase().indexOf(val) > -1
+        );
+      });
+      break;
+
+    default:
+      break;
+  }
 }
 
 onMounted(() => {
@@ -493,7 +526,14 @@ onMounted(() => {
                       lazy-rules
                       hide-bottom-space
                       bg-color="white"
-                    />
+                      :hint="
+                        group === 'GROUP1'
+                          ? 'ทั่วไป: ปฏิบัติงาน, ชำนาญงาน, อาวุโส\nวิชาการ: ปฏิบัติการ, ชำนาญการ, ชำนาญการพิเศษ\nอำนวยการ: ต้น'
+                          : 'ทั่วไป: ทักษะพิเศษ\nวิชาการ: เชี่ยวชาญ, ทรงคุณวุฒิ\nอำนวยการ: สูง\nบริหาร: ต้น, สูง'
+                      "
+                      class="multiline-hint"
+                    >
+                    </q-select>
                   </div>
                   <q-separator v-if="employeeClass === 'officer'" />
                   <div class="col-12 q-px-sm">
@@ -509,8 +549,36 @@ onMounted(() => {
                     />
                   </div>
                   <q-separator />
-                  <div class="col-12">
-                    <q-expansion-item
+                  <div class="col-12 q-pb-xs q-px-sm">
+                    <q-select
+                      menu-anchor="top left"
+                      menu-self="bottom left"
+                      class="bg-white"
+                      dense
+                      borderless
+                      hide-selected
+                      fill-input
+                      hide-bottom-space
+                      option-label="orgRootName"
+                      option-value="id"
+                      emit-value
+                      map-options
+                      v-model="nodeId"
+                      :options="organizationOps"
+                      label="หน่วยงาน"
+                      use-input
+                      @filter="(inputValue: string,
+            doneFn: Function) => filterSelector(inputValue, doneFn,'organization' )"
+                    >
+                      <template v-slot:no-option>
+                        <q-item>
+                          <q-item-section class="text-grey">
+                            ไม่มีข้อมูล
+                          </q-item-section>
+                        </q-item>
+                      </template>
+                    </q-select>
+                    <!-- <q-expansion-item
                       v-model="expandedModal"
                       dense
                       dense-toggle
@@ -529,7 +597,6 @@ onMounted(() => {
                           >
                           </q-input>
                         </div>
-                        <!-- @click="onOpenOrg" -->
                       </template>
                       <q-separator />
 
@@ -575,7 +642,7 @@ onMounted(() => {
                           <template v-slot:default-header="prop">
                             <q-item
                               @click.stop="onSelectedNode(prop.node)"
-                              :active="nodeId === prop.node.orgTreeId"
+                              :active="nodeId === prop.node.id"
                               clickable
                               active-class="my-list-link text-primary text-weight-medium"
                               class="row col-12 items-center text-dark q-py-xs q-pl-sm rounded-borders my-list"
@@ -601,7 +668,7 @@ onMounted(() => {
                           </template>
                         </q-tree>
                       </q-card-section>
-                    </q-expansion-item>
+                    </q-expansion-item> -->
                   </div>
                 </q-card-section>
                 <q-separator />
@@ -780,4 +847,13 @@ onMounted(() => {
   min-height: 32px;
   padding: 2px 9px;
 }
+
+.multiline-hint :deep(.q-field__messages) {
+  white-space: pre-line;
+  font-size: 0.8rem;
+  line-height: 1.2;
+  background-color: #eeeeee;
+  padding: 8px;
+  border-radius: 4px;
+}
 </style>

From 584c5d6756e8170938b0bce11770126a06ba8926 Mon Sep 17 00:00:00 2001
From: "DESKTOP-1R2VSQH\\Lenovo ThinkPad E490" <nicey2t1096@gmail.com>
Date: Fri, 11 Jul 2025 14:02:51 +0700
Subject: [PATCH 5/5] =?UTF-8?q?fix=20=E0=B8=A3=E0=B8=B2=E0=B8=A2=E0=B8=87?=
 =?UTF-8?q?=E0=B8=B2=E0=B8=99=E0=B9=82=E0=B8=84=E0=B8=A3=E0=B8=87=E0=B8=AA?=
 =?UTF-8?q?=E0=B8=A3=E0=B9=89=E0=B8=B2=E0=B8=87=E0=B9=81=E0=B8=A5=E0=B8=B0?=
 =?UTF-8?q?=E0=B8=81=E0=B8=A3=E0=B8=AD=E0=B8=9A=E0=B8=AD=E0=B8=B1=E0=B8=95?=
 =?UTF-8?q?=E0=B8=A3=E0=B8=B2=E0=B8=81=E0=B8=B3=E0=B8=A5=E0=B8=B1=E0=B8=87?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../21_report/components/01_org/Main.vue      | 221 ++----------------
 .../21_report/components/01_org/TableMain.vue |  47 +---
 .../21_report/components/01_org/TreeMain.vue  | 101 ++++----
 src/modules/21_report/views/01_reportOrg.vue  | 180 +-------------
 4 files changed, 73 insertions(+), 476 deletions(-)

diff --git a/src/modules/21_report/components/01_org/Main.vue b/src/modules/21_report/components/01_org/Main.vue
index 40512081d..1a408ecee 100644
--- a/src/modules/21_report/components/01_org/Main.vue
+++ b/src/modules/21_report/components/01_org/Main.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { ref, reactive, onMounted, watch } from "vue";
+import { ref, onMounted, watch } from "vue";
 import { useQuasar } from "quasar";
 
 import http from "@/plugins/http";
@@ -8,13 +8,7 @@ import { useOrganizational } from "@/modules/02_organization/store/organizationa
 import { useCounterMixin } from "@/stores/mixin";
 
 /** importType*/
-import type {
-  OrgTree,
-  PosMaster,
-  Position,
-  PosMaster2,
-} from "@/modules/02_organization/interface/response/organizational";
-import type { FilterMaster } from "@/modules/02_organization/interface/request/organizational";
+import type { OrgTree } from "@/modules/02_organization/interface/response/organizational";
 
 /** importComponents*/
 import TreeMain from "@/modules/21_report/components/01_org/TreeMain.vue";
@@ -32,35 +26,15 @@ const count = defineModel<number>("count", { required: true });
 
 const nodeTree = ref<OrgTree[]>(); // ข้อมูล Tree
 const nodeId = ref<string>(""); // id ของ Tree
-const orgRootId = ref<string>("");
-const orgLevel = ref<number>(0); // levelTree
+const orgRootId = ref<string>(""); // id ของ Root
 const isLoad = ref<boolean>(false); // loadTable
-const isLoadTree = ref<boolean>(false); // loadTable
-const mainTree = ref<OrgTree>();
-
-const selected = ref<string>("");
-
-const reqMaster = reactive<FilterMaster>({
-  id: "",
-  type: 0,
-  isAll: false,
-  page: 1,
-  pageSize: 10,
-  keyword: "",
-  revisionId: "",
-});
-const totalPage = ref<number>(1);
-const totalData = ref<number>(1);
-const action1 = ref<boolean>(false);
-const posMaster = ref<PosMaster2[]>([]);
-const shortName = ref<string>("");
+const selected = ref<string>(""); // selected node
 
 /**
  * function fetch ข้อมูลของ Tree
  * @param id id โครงสร้าง
  */
 async function fetchDataTree(id: string) {
-  isLoadTree.value = false;
   showLoader();
   await http
     .get(config.API.orgByid(id))
@@ -80,120 +54,6 @@ async function fetchDataTree(id: string) {
     });
 }
 
-/**
- * function fetch ข้อรายการตำแหน่ง
- * @param id  idTree
- * @param level  levelTree
- */
-async function fetchDataTable(id: string, level: number, action: boolean) {
-  searchAndReplaceOrgName(nodeTree.value, id);
-  orgLevel.value = level;
-  reqMaster.id = id;
-  reqMaster.type = level;
-  action1.value = action;
-  if (action) {
-    setTimeout(() => {
-      action1.value = false;
-    }, 1000);
-    reqMaster.isAll = false;
-    reqMaster.page = 1;
-    reqMaster.pageSize = 10;
-    reqMaster.keyword = "";
-    reqMaster.revisionId =
-      store.typeOrganizational == "draft"
-        ? store.draftId
-        : store.typeOrganizational == "current"
-        ? store.activeId
-        : store.historyId;
-    isLoad.value = true;
-  }
-  posMaster.value = [];
-
-  await http
-    .post(config.API.orgPosMasterList, {
-      ...reqMaster,
-      keyword: reqMaster.keyword.trim(),
-    })
-    .then(async (res) => {
-      const dataMain: PosMaster[] = [];
-      totalPage.value = Math.ceil(res.data.result.total / reqMaster.pageSize);
-      totalData.value = res.data.result.total;
-      res.data.result.data.forEach((e: PosMaster) => {
-        const p = e.positions;
-        if (p.length !== 0) {
-          const a = p.find((el: Position) => el.positionIsSelected === true);
-          const { id, ...rest } = a ? a : p[0];
-          const test = {
-            ...e,
-            ...rest,
-          };
-          dataMain.push(test);
-        }
-      });
-      posMaster.value = store.fetchPosMaster(dataMain);
-    })
-    .catch((err) => {
-      messageError($q, err);
-      posMaster.value = [];
-    })
-    .finally(() => {
-      setTimeout(() => {
-        isLoad.value = false;
-      }, 1000);
-    });
-}
-
-/**  ดึงข้อมูลสถิติจำนวนด้านบน*/
-// function getSummary() {
-//   http
-//     .post(config.API.orgSummary, {
-//       id: reqMaster.id, //*Id node
-//       type: reqMaster.type, //*ประเภทnode
-//       isNode: reqMaster.isAll, //*นับทั้ง node ไหม
-//     })
-//     .then(async (res: any) => {
-//       const data = await res.data.result;
-//       store.getSumPosition({
-//         totalPosition: data.totalPosition,
-//         totalPositionCurrentUse: data.totalPositionCurrentUse,
-//         totalPositionCurrentVacant: data.totalPositionCurrentVacant,
-//         totalPositionNextUse: data.totalPositionNextUse,
-//         totalPositionNextVacant: data.totalPositionNextVacant,
-//         totalRootPosition: data.totalPosition,
-//         totalRootPositionCurrentUse: data.totalPositionCurrentUse,
-//         totalRootPositionCurrentVacant: data.totalPositionCurrentVacant,
-//         totalRootPositionNextUse: data.totalPositionNextUse,
-//         totalRootPositionNextVacant: data.totalPositionNextVacant,
-//       });
-//     });
-// }
-
-/** funcion ค้นหาข้อมูลใน Table*/
-async function filterKeyword() {
-  reqMaster.page = 1;
-  action1.value === false &&
-    fetchDataTable(reqMaster.id, reqMaster.type, false);
-}
-
-/**
- * ค้นหาโครงสร้างในข้อมูลแบบลำดับชั้นเพื่อหาที่ตรงกับ orgTreeId
- * @param data ข้อมูลโครงสร้าง
- * @param targetId id ของโครงสร้างที่ต้องการค้นหา
- */
-function searchAndReplaceOrgName(data: any, targetId: string) {
-  for (const child of data) {
-    if (child.orgTreeId === targetId) {
-      mainTree.value = child;
-
-      return true; // Found the targetId in this level
-    }
-    if (child.children && searchAndReplaceOrgName(child.children, targetId)) {
-      return true; // Found the targetId in the nested children
-    }
-  }
-  return false; // Not found in this branch
-}
-
 /** callback function ทำงาน ทำการ fetch ข้อมูล Tree เมื่อมีการเลือกประวัติโครงสร้าง*/
 watch(
   () => count.value,
@@ -202,7 +62,7 @@ watch(
   }
 );
 
-/** callblck function ทำการ fetch ข้อมูล Tree เมื่อมีการเปลี่ยนโครงสร้าง*/
+/** callback function ทำการ fetch ข้อมูล Tree เมื่อมีการเปลี่ยนโครงสร้าง*/
 watch(
   () => store.typeOrganizational,
   () => {
@@ -215,44 +75,22 @@ watch(
   }
 );
 
-/** callblck function ทำการ fetch ข้อมูล Table เมื่อมีการเปลี่ยนหน้า */
-watch([() => reqMaster.page, () => reqMaster.pageSize], () => {
-  action1.value === false &&
-    fetchDataTable(reqMaster.id, reqMaster.type, false);
-});
-
-/** callblck function ทำการ fetch ข้อมูล Table เมื่อแสดงตำแหน่งทั้งหมด*/
-// watch(
-//   () => reqMaster.isAll,
-//   () => {
-//     getSummary();
-//     if (reqMaster.page !== 1) {
-//       reqMaster.page = 1;
-//     } else {
-//       fetchDataTable(reqMaster.id, reqMaster.type, false);
-//     }
-//   }
-// );
-
+/** callback function ทำการ fetch ข้อมูล Tree เมื่อมีการเปลี่ยนแปลง activeId */
 watch(
-  () => store.draftId,
+  () => store.activeId,
   () => {
-    store.draftId && fetchDataTree(store.draftId?.toString());
+    store.activeId && fetchDataTree(store.activeId?.toString());
   }
 );
 
 /**
  * lifecycle Hook ทำเมือ่ Components ถูกเรียกใช้งาน
- *
  * ุ และดึงช้อมูลโครงสร้างตาม ID ของประเภทโครงสร้าง ปัจจุบัน,แบบร่าง
  */
 onMounted(async () => {
   const id =
-    store.typeOrganizational === "current"
-      ? store.activeId
-      : store.typeOrganizational === "draft"
-      ? store.draftId
-      : historyId.value;
+    store.typeOrganizational === "current" ? store.activeId : historyId.value;
+
   id && (await fetchDataTree(id));
 });
 </script>
@@ -264,11 +102,8 @@ onMounted(async () => {
         <div class="col-12 row no-wrap bg-grey-1">
           <TreeMain
             v-model:node-tree="nodeTree"
-            v-model:short-name="shortName"
             v-model:node-id="nodeId"
             v-model:org-root-id="orgRootId"
-            :fetch-data-table="fetchDataTable"
-            :fetch-data-tree="fetchDataTree"
           />
 
           <div class="col-12 row">
@@ -294,36 +129,18 @@ onMounted(async () => {
                   <q-space />
                   <q-badge
                     color="secondary"
-                    :label="
-                      reqMaster.isAll
-                        ? store.sumPosition.total
-                        : store.sumPosition.totalRoot
-                    "
+                    :label="store.sumPosition.totalRoot"
                   />
                 </div>
                 <div class="row col q-pa-sm item">
                   <div class="ellipsis">ตำแหน่งที่มีคนครอง</div>
                   <q-space />
-                  <q-badge
-                    color="primary"
-                    :label="
-                      reqMaster.isAll
-                        ? store.sumPosition.use
-                        : store.sumPosition.useRoot
-                    "
-                  />
+                  <q-badge color="primary" :label="store.sumPosition.useRoot" />
                 </div>
                 <div class="row col q-pa-sm item">
                   <div class="ellipsis">ตำแหน่งว่าง</div>
                   <q-space />
-                  <q-badge
-                    color="red"
-                    :label="
-                      reqMaster.isAll
-                        ? store.sumPosition.vacant
-                        : store.sumPosition.vacantRoot
-                    "
-                  />
+                  <q-badge color="red" :label="store.sumPosition.vacantRoot" />
                 </div>
               </q-card>
 
@@ -331,19 +148,7 @@ onMounted(async () => {
                 <div class="q-pa-sm">
                   <TreeTable
                     v-if="nodeId !== ''"
-                    v-model:node-tree="nodeTree"
-                    v-model:org-level="orgLevel"
-                    v-model:tree-id="nodeId"
-                    v-model:pos-master="posMaster"
-                    v-model:req-master="reqMaster"
-                    v-model:total-page="totalPage"
                     v-model:org-root-id="orgRootId"
-                    v-model:total-data="totalData"
-                    :short-name="shortName"
-                    :main-tree="mainTree"
-                    :fetch-data-table="fetchDataTable"
-                    :filter-keyword="filterKeyword"
-                    :fetch-data-tree="fetchDataTree"
                   />
                 </div>
               </q-card>
diff --git a/src/modules/21_report/components/01_org/TableMain.vue b/src/modules/21_report/components/01_org/TableMain.vue
index eaf4ec504..21689f88d 100644
--- a/src/modules/21_report/components/01_org/TableMain.vue
+++ b/src/modules/21_report/components/01_org/TableMain.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { ref, watch } from "vue";
+import { ref } from "vue";
 import { useQuasar } from "quasar";
 import axios from "axios";
 import { VuePDF, usePDF } from "@tato30/vue-pdf";
@@ -11,11 +11,8 @@ import { useCounterMixin } from "@/stores/mixin";
 import genReportXLSX from "@/plugins/genreportxlsx";
 
 import type { DataDocument } from "@/modules/02_organization/interface/index/Main";
-import type { FilterMaster } from "@/modules/02_organization/interface/request/organizational";
-import type { PosMaster2 } from "@/modules/02_organization/interface/response/organizational";
 
 /** importComponents*/
-
 import LoadView from "@/components/LoadView.vue";
 
 const $q = useQuasar();
@@ -27,36 +24,14 @@ const page = ref<number>(1);
 const pdfSrc = ref<any>();
 const splitterModel = ref(14);
 
-/** prosp*/
+/** props */
 const isLoadPDF = ref<boolean>(false);
 const detailReport = ref<any>();
 
-const reqMaster = defineModel<FilterMaster>("reqMaster", { required: true });
-const posMaster = defineModel<PosMaster2[]>("posMaster", { required: true });
 const orgRootId = defineModel<string>("orgRootId", { required: true });
-const props = defineProps({
-  filterKeyword: { type: Function, require: true, default: () => {} },
-  fetchDataTable: {
-    type: Function,
-    require: true,
-    default: () => {},
-  },
-  shortName: { type: String, required: true },
-  fetchDataTree: {
-    type: Function,
-    require: true,
-    default: () => {},
-  },
-  mainTree: {
-    type: Object,
-    require: true,
-  },
-});
 
 const title = ref<string>("");
 
-/** ListMenu Table*/
-
 const baseDocument = ref<DataDocument[]>([
   {
     name: "บัญชี 2",
@@ -69,10 +44,9 @@ const baseDocument = ref<DataDocument[]>([
   },
 ]);
 
-const modalDialogMMove = ref<boolean>(false);
-
 /**
- * function DownloadReport
+ * ฟังก์ชัน DownloadReport
+ * @param list รายงานที่ต้องการดาวน์โหลด
  */
 async function getReport(list: string) {
   const listFind = baseDocument.value.find(
@@ -101,7 +75,7 @@ async function getReport(list: string) {
 }
 
 /**
- * function เรียกไฟล์ PDF
+ * ฟังก์ชันเรียกไฟล์ PDF
  * @param data  ข้อมูลบัญชีวันลา
  */
 async function fetchDocumentTemplate(data: any) {
@@ -141,17 +115,6 @@ function backPage() {
     page.value--;
   }
 }
-
-watch(
-  () => modalDialogMMove.value,
-  () => {
-    if (!modalDialogMMove.value) {
-      if (posMaster.value.length === 0) {
-        props.fetchDataTable?.(reqMaster.value.id, reqMaster.value.type, false);
-      }
-    }
-  }
-);
 </script>
 
 <template>
diff --git a/src/modules/21_report/components/01_org/TreeMain.vue b/src/modules/21_report/components/01_org/TreeMain.vue
index 96279f6a9..4f7e9feed 100644
--- a/src/modules/21_report/components/01_org/TreeMain.vue
+++ b/src/modules/21_report/components/01_org/TreeMain.vue
@@ -19,7 +19,7 @@ import { useCounterMixin } from "@/stores/mixin";
 /** use*/
 const $q = useQuasar();
 const store = useOrganizational();
-const { showLoader } = useCounterMixin();
+const { showLoader, hideLoader, messageError } = useCounterMixin();
 
 /** props*/
 const nodeTEST = defineModel<OrgTree[]>("nodeTree", { default: [] });
@@ -27,17 +27,6 @@ const nodeId = defineModel<string>("nodeId", { required: true });
 const orgRootId = defineModel<string | undefined>("orgRootId", {
   required: true,
 });
-const shortName = defineModel<string>("shortName", { required: true });
-const props = defineProps({
-  fetchDataTree: {
-    type: Function,
-    require: true,
-  },
-  fetchDataTable: {
-    type: Function,
-    require: true,
-  },
-});
 
 const filter = ref<string>("");
 const nodes = ref<Array<OrgTree>>([]);
@@ -51,50 +40,31 @@ const orgLevel = ref<number>(0);
  * funtion เลือกข้อมูล Tree
  * @param data ข่อมูล Tree
  */
-function updateSelected(data: DataTree) {
-  orgRootId.value = data?.orgLevel === 0 ? data?.orgTreeId : data?.orgRootId;
-  store.rootId = (
-    data.orgLevel === 0 ? data.orgTreeId : data.orgRootId
-  ) as string;
-  shortName.value = data.orgTreeShortName;
+async function updateSelected(data: DataTree) {
+  showLoader();
+  try {
+    orgRootId.value = data?.orgLevel === 0 ? data?.orgTreeId : data?.orgRootId;
+    store.rootId = (
+      data.orgLevel === 0 ? data.orgTreeId : data.orgRootId
+    ) as string;
 
-  if (!store.treeId || store.treeId != data.orgTreeId) {
-    store.treeId = data.orgTreeId;
-    store.level = data.orgLevel;
+    if (!store.treeId || store.treeId != data.orgTreeId) {
+      store.treeId = data.orgTreeId;
+      store.level = data.orgLevel;
 
-    nodeId.value = data.orgTreeId ? data.orgTreeId : "111";
+      nodeId.value = data.orgTreeId ? data.orgTreeId : "";
 
-    data.orgTreeId &&
-      props.fetchDataTable?.(data.orgTreeId, data.orgLevel, true);
-    /** ดึงข้อมูลสถิติจำนวนด้านบน*/
-    http
-      .post(config.API.orgSummary, {
-        id: data.orgTreeId, //*Id node
-        type: data.orgLevel, //*ประเภทnode
-        isNode: true, //*นับทั้ง node ไหม
-      })
-      .then(async (res: any) => {
-        const data = await res.data.result;
-        if (data) {
-          store.getSumPosition({
-            totalPosition: data.totalPosition,
-            totalPositionCurrentUse: data.totalPositionCurrentUse,
-            totalPositionCurrentVacant: data.totalPositionCurrentVacant,
-            totalPositionNextUse: data.totalPositionNextUse,
-            totalPositionNextVacant: data.totalPositionNextVacant,
-            totalRootPosition: data.totalPosition,
-            totalRootPositionCurrentUse: data.totalPositionCurrentUse,
-            totalRootPositionCurrentVacant: data.totalPositionCurrentVacant,
-            totalRootPositionNextUse: data.totalPositionNextUse,
-            totalRootPositionNextVacant: data.totalPositionNextVacant,
-          });
-        }
-      });
+      /** ดึงข้อมูลสถิติจำนวนด้านบน*/
+      await fetchSummary(data);
+    }
+  } catch (error) {
+    console.error("Error showing loader:", error);
+  } finally {
+    hideLoader();
   }
 }
 
 const treeId = ref<string>("");
-
 const dialogDetail = ref<boolean>(false);
 /**
  * funtion ดูรายละเอียดโครงสร้าง
@@ -108,6 +78,39 @@ function onClickDetail(id: string, level: number) {
   orgLevel.value = level;
 }
 
+/**
+ * ฟังก์ชันดึงข้อมูลสถิติ
+ * @param data ขอมูลโครงสร้าง
+ */
+async function fetchSummary(data: DataTree) {
+  await http
+    .post(config.API.orgSummary, {
+      id: data.orgTreeId, //*Id node
+      type: data.orgLevel, //*ประเภทnode
+      isNode: true, //*นับทั้ง node ไหม
+    })
+    .then(async (res: any) => {
+      const data = await res.data.result;
+      if (data) {
+        store.getSumPosition({
+          totalPosition: data.totalPosition,
+          totalPositionCurrentUse: data.totalPositionCurrentUse,
+          totalPositionCurrentVacant: data.totalPositionCurrentVacant,
+          totalPositionNextUse: data.totalPositionNextUse,
+          totalPositionNextVacant: data.totalPositionNextVacant,
+          totalRootPosition: data.totalPosition,
+          totalRootPositionCurrentUse: data.totalPositionCurrentUse,
+          totalRootPositionCurrentVacant: data.totalPositionCurrentVacant,
+          totalRootPositionNextUse: data.totalPositionNextUse,
+          totalRootPositionNextVacant: data.totalPositionNextVacant,
+        });
+      }
+    })
+    .catch((err) => {
+      messageError($q, err);
+    });
+}
+
 watch(
   () => nodeTEST.value,
   () => {
diff --git a/src/modules/21_report/views/01_reportOrg.vue b/src/modules/21_report/views/01_reportOrg.vue
index 76866448c..cd534a6a7 100644
--- a/src/modules/21_report/views/01_reportOrg.vue
+++ b/src/modules/21_report/views/01_reportOrg.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { ref, onMounted, watch } from "vue";
+import { ref, onMounted } from "vue";
 import { useQuasar } from "quasar";
 
 import http from "@/plugins/http";
@@ -16,31 +16,19 @@ import type { OrgRevision } from "@/modules/02_organization/interface/response/o
 import TreeView from "@/modules/21_report/components/01_org/Main.vue";
 import StructureView from "@/modules/02_organization/components/StructureMain.vue";
 import StructureOrgMain from "@/modules/02_organization/components/StructureOrgMain.vue";
-// import DialogHeader from "@/components/DialogHeader.vue";
 
 /** use*/
 const $q = useQuasar();
 const { showLoader, hideLoader, messageError, date2Thai } = useCounterMixin();
 const store = useOrganizational();
 
-/** ตัวแปร*/
-const modalNewStructure = ref<boolean>(false); // เพิ่มโครงสร้าง
-const modalDateTime = ref<boolean>(false); //  ตั้งเวลาเผยแพร่
-const isStatusData = ref<boolean>(false); // แสดงตั้งเวลาเผยแพร่
-const typeStructure = ref<string>(""); // ประเภทการเพิ่มโครงสร้าง
 /** ประวัติโครงสร้าง*/
 const itemHistory = ref<DataOrgRevision[]>([]); // List ประวัติโครงสร้าง
 const historyId = ref<string>(""); // ID ประวัติโครงสร้าง
 const labelHistory = ref<string>("ประวัติโครงสร้าง"); // ชื่อประวัติโครงสร้าง
 const count = ref<number>(0);
 
-// const modalCommand = ref<boolean>(false); //ส่งไปออกคำสั่ง
-// const modalRemark = ref<boolean>(false); // หมายเหตุ
-
-/**
- * function เรียกข้อมูลโครงสร้าง แบบปัจุบันและ แบบร่าง
- * เก็บข่อมูลใน store
- */
+/** ฟังก์ชันเรียกข้อมูลโครงสร้าง แบบปัจุบันและ แบบร่าง*/
 async function fetchOrganizationActive() {
   showLoader();
   await http
@@ -49,25 +37,6 @@ async function fetchOrganizationActive() {
       const data = await res.data.result;
       if (data) {
         await store.fetchDataActive(data);
-        // ต้องมี id ของแบบร่างถึงจะเช็ค isLock
-        if (data.draftId) {
-          await fetchCheckIslock(data.draftId);
-        } else {
-          store.isLosck = false;
-        }
-
-        if (data.activeName === null && data.draftName === null) {
-          isStatusData.value = false;
-        } else {
-          isStatusData.value = true;
-          if (isStatusData.value) {
-            if (data.activeName === null) {
-              store.typeOrganizational = "draft";
-            } else if (data.draftName === null) {
-              store.typeOrganizational = "current";
-            }
-          }
-        }
       }
     })
     .catch((err) => {
@@ -76,7 +45,7 @@ async function fetchOrganizationActive() {
     });
 }
 
-/** function เรียกข้อมูรายการลประวัติโครงสร้าง*/
+/** ฟังก์ชันเรียกข้อมูลรายการประวัติโครงสร้าง*/
 async function fetchHistory() {
   await http
     .get(config.API.organizationHistoryNew)
@@ -99,20 +68,6 @@ async function fetchHistory() {
     });
 }
 
-// /**
-//  * function openPopup เพิ่มโครงสร้าง
-//  * @param type ประเภทการเพิ่มโครงาสร้าง
-//  */
-// function ocClickAddStructure(type: string) {
-//   modalNewStructure.value = !modalNewStructure.value;
-//   typeStructure.value = type;
-// }
-
-// /** function openPopup ตั้งเวลาเผยแพร่ */
-// function onClickDateTime() {
-//   modalDateTime.value = !modalDateTime.value;
-// }
-
 /**
  * function เปิดประวัติโครงสร้าง
  * @param id id โครงสร้าง
@@ -125,46 +80,6 @@ function onClickHistory(id: string, name: string) {
   count.value++;
 }
 
-// async function workflowSystem() {
-//   http
-//     .get(config.API.workflowKeycloakSystem("SYS_ORG"))
-//     .then((res) => {
-//       const data = res.data.result;
-//       store.isOfficer = data.isOfficer;
-//       store.isStaff = data.isStaff;
-//     })
-//     .catch((e) => {
-//       messageError($q, e);
-//     });
-// }
-
-async function fetchCheckIslock(id: string) {
-  http
-    .get(config.API.orgIsLock + `/${id}`)
-    .then((res) => {
-      const data = res.data.result;
-      store.isLosck = data;
-    })
-    .catch((e) => {
-      messageError($q, e);
-    });
-}
-
-// watch(
-//   () => store.typeOrganizational,
-//   () => {
-//     if (
-//       store.typeOrganizational === "draft" &&
-//       store.isOfficer === null &&
-//       store.isStaff === null
-//     ) {
-//       workflowSystem();
-//     } else if (store.typeOrganizational === "draft") {
-//       store.rootId = "";
-//     }
-//   }
-// );
-
 /**
  * lifecycleHook ทำงานเมื่อมีการเรียกใช้ Components
  * ดึงข้อมูลโครงสร้างและรายการประวัติโครงสร้าง
@@ -180,71 +95,9 @@ onMounted(async () => {
       รายงานโครงสร้างและกรอบอัตรากำลัง
     </div>
     <q-space />
-
-    <!-- <div
-      class="toptitle row items-center"
-      v-if="store.typeOrganizational === 'draft'"
-    >
-      <div
-        v-if="store.isPublic && store.orgPublishDate"
-        class="q-pr-md text-caption"
-      >
-        วันที่เผยแพร่ :
-        <strong>{{ date2Thai(store.orgPublishDate) }}</strong>
-      </div>
-      <q-btn
-        v-if="checkPermission($route)?.attrOwnership == 'OWNER'"
-        dense
-        class="q-px-md"
-        color="indigo-9"
-        icon="alarm"
-        label="ตั้งเวลาเผยแพร่"
-        @click="onClickDateTime"
-      >
-      </q-btn>
-    </div> -->
   </div>
 
   <q-card flat bordered>
-    <!-- <div class="q-pa-xl" v-if="!isStatusData">
-      <q-card
-        flat
-        bordered
-        style="
-          height: 70vh;
-          border: 1px solid rgb(210, 210, 210);
-          border-radius: 5px;
-        "
-      >
-        <div
-          class="text-center row"
-          style="
-            display: flex;
-            align-items: center;
-            justify-content: center;
-            height: 100%;
-          "
-        >
-          <div>
-            <q-btn
-              v-if="checkPermission($route)?.attrIsCreate"
-              flat
-              style="background-color: #d8f5f2"
-              round
-              color="primary"
-              size="lg"
-              icon="add"
-              @click="ocClickAddStructure('NEW')"
-            >
-              <q-tooltip>เพิ่มโครงสร้าง </q-tooltip>
-            </q-btn>
-            <div class="q-mt-sm">เพิ่มโครงสร้าง</div>
-          </div>
-        </div>
-      </q-card>
-    </div>
-
-    <div v-else> -->
     <q-card class="my-card">
       <q-card-section class="q-pa-sm">
         <q-toolbar class="q-gutter-md items-center" style="padding: 0px">
@@ -294,17 +147,6 @@ onMounted(async () => {
             </q-btn-dropdown>
           </q-btn-group>
 
-          <!-- <q-btn
-              v-if="store.remark"
-              flat
-              round
-              color="info"
-              icon="info"
-              @click="modalRemark = true"
-            >
-              <q-tooltip>หมายเหตุ</q-tooltip>
-            </q-btn> -->
-
           <q-space />
           <q-btn
             flat
@@ -352,23 +194,7 @@ onMounted(async () => {
         </q-tab-panels>
       </q-card-section>
     </q-card>
-    <!-- </div> -->
   </q-card>
-
-  <!-- <q-dialog v-model="modalRemark">
-    <q-card style="width: 300px">
-      <DialogHeader tittle="หมายเหตุ" :close="() => (modalRemark = false)" />
-
-      <q-separator />
-      <q-card-section>
-        <div class="row">
-          <div class="col">
-            {{ store.remark }}
-          </div>
-        </div>
-      </q-card-section>
-    </q-card>
-  </q-dialog> -->
 </template>
 
 <style scoped></style>