From 8cbe4fd9c5056ac2d896d69438f67ed5a254fa5c Mon Sep 17 00:00:00 2001
From: "DESKTOP-1R2VSQH\\Lenovo ThinkPad E490" <nicey2t1096@gmail.com>
Date: Wed, 5 Feb 2025 17:31:04 +0700
Subject: [PATCH 1/9] =?UTF-8?q?fix=20Code=20=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/MainProbation.vue    | 268 ++++++++----------
 .../interface/response/Probation.ts           |  47 +++
 2 files changed, 165 insertions(+), 150 deletions(-)
 create mode 100644 src/modules/05_placement/interface/response/Probation.ts

diff --git a/src/modules/05_placement/components/probation/MainProbation.vue b/src/modules/05_placement/components/probation/MainProbation.vue
index 8e456569f..3cbd5c771 100644
--- a/src/modules/05_placement/components/probation/MainProbation.vue
+++ b/src/modules/05_placement/components/probation/MainProbation.vue
@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import { ref, useAttrs, onMounted, reactive, watch } from "vue";
 import { useQuasar } from "quasar";
-import { useRoute, useRouter } from "vue-router";
+import { useRouter } from "vue-router";
 
 import http from "@/plugins/http";
 import config from "@/app.config";
@@ -10,11 +10,12 @@ import { useCounterMixin } from "@/stores/mixin";
 import { useTransferDataStore } from "@/modules/05_placement/store";
 
 import type { QTableProps } from "quasar";
+import type { Pagination } from "@/modules/05_placement/interface/index/Main";
+import type { OpfillterTypeSt } from "@/modules/05_placement/interface/request/Main";
 import type {
-  FormMainProbation,
-  FormMainProbation2,
-  OpfillterTypeSt,
-} from "@/modules/05_placement/interface/request/Main";
+  ResListProbation,
+  ResProfileProbation,
+} from "@/modules/05_placement/interface/response/Probation";
 
 import DialogHeader from "@/components/DialogHeader.vue";
 import DialogOrder from "@/modules/05_placement/components/probation/DialogOrder.vue";
@@ -22,67 +23,34 @@ import DialogOrder from "@/modules/05_placement/components/probation/DialogOrder
 const $q = useQuasar(); //ใช้ noti quasar
 const storeFn = useTransferDataStore();
 const mixin = useCounterMixin();
-const route = useRoute();
 const router = useRouter();
 const { statusProbationMain } = storeFn;
 const { messageError, success, showLoader, hideLoader, dialogConfirm } = mixin;
 
 const modalCommand = ref<boolean>(false); // ตัวแปร popup ออกคำสั่ง
-const filterRef = ref<any>(null);
 const modal = ref<boolean>(false);
-const paging = ref<boolean>(true);
-const filterRef2 = ref<any>(null);
-const attrs = ref<any>(useAttrs());
 const paging2 = ref<boolean>(true);
-const fillterStatus = ref<any>([]);
-const fillter = ref<any>("");
+const fillterStatus = ref<ResListProbation[]>([]);
+const fillter = ref<string>("");
 const filterKeyword = ref<string>("");
 const filterKeyword2 = ref<string>("");
-const rows = ref<FormMainProbation[]>([]);
-const rows2 = ref<FormMainProbation2[]>([]);
-const dataUpdate = ref<FormMainProbation[]>([]);
+const rows = ref<ResListProbation[]>([]);
+const rows2 = ref<ResProfileProbation[]>([]);
+const dataUpdate = ref<ResListProbation[]>([]);
 const Opfillter = ref<OpfillterTypeSt[]>([]);
 const Opfillter2 = ref<OpfillterTypeSt[]>([]);
 const formProbation = reactive({ keyword: "", pageSize: 10, page: 1 });
-const formMain = reactive({ keyword: "", pageSize: 10, page: 1 });
 const maxPage = ref<number>(1);
 
-const modalAdd = ref<boolean>(false);
+const modalAdd = ref<boolean>(false); //เพิ่มผู้ทดลองปฏิบัติหน้าที่ราชการ
 const personId = ref<string>(""); //เก็บ id คน ตาม row
 const topic = ref<string>(
   "แต่งตั้งคณะกรรมการประเมินผลการทดลองปฏิบัติหน้าที่ราชการ"
 );
 
-const pagination = ref({
-  sortBy: "desc",
-  descending: false,
-  page: 1,
-  rowsPerPage: 10,
-});
-
 const total = ref<number>(0);
 const totalList = ref<number>(1);
-
-const pagination2 = ref({
-  sortBy: "desc",
-  descending: false,
-  page: 1,
-  rowsPerPage: 10,
-});
-
-/** ข้อมูลที่เเสดง */
-const visibleColumns = ref<string[]>([
-  "no",
-  "name",
-  "position_line",
-  "position_level",
-  "organization",
-  "probation_no",
-  "order_number",
-  "probation_status",
-]);
-
-/** หัวตาราง */
+/** columns ฟังก์ชันดดึงข้อมูลรายการผู้ทดลองปฏิบัติหน้าที่ราชการ */
 const columns = ref<QTableProps["columns"]>([
   {
     name: "no",
@@ -164,8 +132,24 @@ const columns = ref<QTableProps["columns"]>([
     style: "font-size: 14px",
   },
 ]);
+const visibleColumns = ref<string[]>([
+  "no",
+  "name",
+  "position_line",
+  "position_level",
+  "organization",
+  "probation_no",
+  "order_number",
+  "probation_status",
+]);
+const pagination = ref({
+  sortBy: "desc",
+  descending: false,
+  page: 1,
+  rowsPerPage: 10,
+});
 
-/** หัวตาราง2 */
+/** columns หัวตารางเพิ่มผู้ทดลองปฏิบัติหน้าที่ราชการ */
 const columns2 = ref<QTableProps["columns"]>([
   {
     name: "no",
@@ -237,9 +221,16 @@ const columns2 = ref<QTableProps["columns"]>([
     style: "font-size: 14px",
   },
 ]);
+const pagination2 = ref({
+  sortBy: "desc",
+  descending: false,
+  page: 1,
+  rowsPerPage: 10,
+});
 
-/** get ข้อมูล */
-async function getpersonalList() {
+/** ฟังก์ชันดดึงข้อมูลรายการผู้ทดลองปฏิบัติหน้าที่ราชการ*/
+async function fetchProbationPersonalList() {
+  rows.value = [];
   showLoader();
   await http
     .get(
@@ -253,23 +244,28 @@ async function getpersonalList() {
     .then(async (res) => {
       const data = await res.data.result.data;
       const resTotal = await res.data.result.total;
+
       rows.value = data;
       fillterStatus.value = data;
-      dataUpdate.value = rows.value;
-      Opfillter.value = storeFn.optionStatusProbation;
-      Opfillter2.value = storeFn.optionStatusProbation;
+      dataUpdate.value = data;
       totalList.value = Math.ceil(resTotal / pagination.value.rowsPerPage);
       total.value = resTotal;
-      hideLoader();
+
+      // option  filter
+      Opfillter.value = storeFn.optionStatusProbation;
+      Opfillter2.value = storeFn.optionStatusProbation;
     })
     .catch((e) => {
       messageError($q, e);
-      hideLoader();
     })
-    .finally(() => {});
+    .finally(() => {
+      hideLoader();
+    });
 }
 
+/* ฟังก์ชันดึงข้อมูลเพิ่มผู้ทดลองปฏิบัติหน้าที่ราชการ*/
 async function onclickAddProbation() {
+  rows2.value = [];
   modal.value = true;
   modal.value && showLoader();
   await http
@@ -290,7 +286,7 @@ async function onclickAddProbation() {
  * function updatePagination
  * @param newPagination ข้อมูล Pagination ใหม่
  */
-function updatePagination(newPagination: any) {
+function updatePagination(newPagination: Pagination) {
   formProbation.page = 1;
   formProbation.pageSize = newPagination.rowsPerPage;
 }
@@ -299,103 +295,79 @@ function updatePagination(newPagination: any) {
  * function updatePagination
  * @param newPagination ข้อมูล Pagination ใหม่
  */
-function updatePaginationMain(newPagination: any) {
+function updatePaginationMain(newPagination: Pagination) {
   pagination.value.page = 1;
   pagination.value.rowsPerPage = newPagination.rowsPerPage;
 }
 
-async function filterKeyword2Fn(page: number) {
-  page !== 1 ? (formProbation.page = 1) : await onclickAddProbation();
+function filterKeyword2Fn(page: number) {
+  page !== 1 ? (formProbation.page = 1) : onclickAddProbation();
 }
 
 /**
  * เพิ่มข้อมูล ผู้ทดลองปฏิบัติหน้าที่ราชการ
  * @param data personal data
  */
-function clickAdd(data: any) {
-  const body = {
-    id: data.id,
-    prefix: data.prefix,
-    rank: data.rank,
-    firstName: data.firstName,
-    lastName: data.lastName,
-    position: data.position,
-    idcard: data.idcard,
-    order_number: data.refCommandNo ? data.refCommandNo : "",
-    posLevelName: data.posLevelName,
-    posTypeName: data.posTypeName,
-    posNo: data.posNo,
-    positionField: data.positionField,
-    positionArea: data.positionArea,
-    posExecutiveName: data.posExecutiveName,
-    positionExecutiveField: data.positionExecutiveField,
-    isProbation: data.isProbation,
-    orgRootName: data.orgRootName,
-    orgChild1Name: data.orgChild1Name,
-    orgChild2Name: data.orgChild2Name,
-    orgChild3Name: data.orgChild3Name,
-    orgChild4Name: data.orgChild4Name,
-
-    root: data.root,
-    child1: data.orgChild1,
-    child2: data.orgChild2,
-    child3: data.orgChild3,
-    child4: data.orgChild4,
-  };
+function addPersonalData(data: ResProfileProbation) {
   dialogConfirm(
     $q,
     async () => {
-      showLoader();
+      try {
+        showLoader();
+        // ส่งข้อมูลด้วย POST
+        await http.post(config.API.personalAdd(), {
+          id: data.id,
+          prefix: data.prefix,
+          rank: data.rank,
+          firstName: data.firstName,
+          lastName: data.lastName,
+          position: data.position,
+          idcard: data.idcard,
+          order_number: data.refCommandNo ? data.refCommandNo : "",
+          posLevelName: data.posLevelName,
+          posTypeName: data.posTypeName,
+          posNo: data.posNo,
+          positionField: data.positionField,
+          positionArea: data.positionArea,
+          posExecutiveName: data.posExecutiveName,
+          positionExecutiveField: data.positionExecutiveField,
+          isProbation: data.isProbation,
+          orgRootName: data.orgRootName,
+          orgChild1Name: data.orgChild1Name,
+          orgChild2Name: data.orgChild2Name,
+          orgChild3Name: data.orgChild3Name,
+          orgChild4Name: data.orgChild4Name,
+          root: data.root,
+          child1: data.orgChild1,
+          child2: data.orgChild2,
+          child3: data.orgChild3,
+          child4: data.orgChild4,
+        });
 
-      await http
-        .post(config.API.personalAdd(), body)
-        .then(async () => {
-          await http
-            .get(config.API.orgProfileStatus(data.id))
-            .then(async (res) => {
-              await getpersonalList();
-              success($q, "เพิ่มข้อมูลสำเร็จ");
-              clickClose();
-              hideLoader();
-            })
-            .catch((e) => {
-              messageError($q, e);
-              hideLoader();
-            });
-        })
-        .catch((e) => {
-          messageError($q, e);
-          hideLoader();
-        })
-        .finally(() => {});
+        // ถ้าการเพิ่มข้อมูลสำเร็จ, อัปเดตสถานะของข้อมูล
+        await http.get(config.API.orgProfileStatus(data.id));
+
+        // รีเฟรชข้อมูล
+        await fetchProbationPersonalList();
+        await onCloseDialog();
+
+        success($q, "เพิ่มข้อมูลสำเร็จ");
+      } catch (err) {
+        messageError($q, err);
+      } finally {
+        hideLoader();
+      }
     },
     "ยืนยันการเพิ่มข้อมูล",
     "ต้องการเพิ่มข้อมูลนี้หรือไม่ ?"
   );
 }
+
 /** ปิด dialog */
-async function clickClose() {
+async function onCloseDialog() {
   modal.value = false;
 }
 
-/** reset ฟิลเตอร์ */
-function resetFilter() {
-  filterKeyword.value = "";
-  filterRef.value.focus();
-  getSearchMain();
-}
-
-/** reset ฟิลเตอร์ ใน dialog */
-function resetFilter2() {
-  filterKeyword2.value = "";
-  filterRef2.value.focus();
-}
-
-function paginationLabel(start: string, end: string, total: string) {
-  if (paging.value == true) return " " + start + "-" + end + " ใน " + total;
-  else return start + "-" + end + " ใน " + total;
-}
-
 function paginationLabel2(start: string, end: string, total: string) {
   if (paging2.value == true) return " " + start + "-" + end + " ใน " + total;
   else return start + "-" + end + " ใน " + total;
@@ -414,7 +386,7 @@ function filterFn(val: string, update: Function) {
   } else {
     update(() => {
       Opfillter2.value = Opfillter.value.filter(
-        (e: any) => e.value.search(val) !== -1
+        (e: OpfillterTypeSt) => e.value.search(val) !== -1
       );
     });
   }
@@ -425,27 +397,27 @@ function onCommand() {
   modalCommand.value = true;
 }
 
+/** ฟังก์ชันยืนยันการเพิ่มการแต่งตั้งคณะกรรมการประเมินผลการทดลองปฏิบัติหน้าที่ราชการ*/
 function onSubmitAdd() {
-  dialogConfirm($q, () => {
-    const body = {
-      profileId: personId.value,
-      topic: topic.value,
-    };
+  dialogConfirm($q, async () => {
     showLoader();
-    http
-      .post(config.API.appointMain, body)
+    await http
+      .post(config.API.appointMain, {
+        profileId: personId.value,
+        topic: topic.value,
+      })
       .then((res) => {
         if (res) {
           closeAdd();
-          hideLoader();
           router.push(`/probation/assign/${res.data.result}`);
         }
       })
       .catch((e) => {
         messageError($q, e);
-        hideLoader();
       })
-      .finally(() => {});
+      .finally(() => {
+        hideLoader();
+      });
   });
 }
 
@@ -465,7 +437,7 @@ function closeAdd() {
 function getSearchMain() {
   rows.value = [];
   pagination.value.page = 1;
-  getpersonalList();
+  fetchProbationPersonalList();
 }
 
 watch([() => formProbation.page, () => formProbation.pageSize], () => {
@@ -480,8 +452,8 @@ watch(
 );
 
 /** get ค่า เมื่อโหลดหน้า */
-onMounted(async () => {
-  getpersonalList();
+onMounted(() => {
+  fetchProbationPersonalList();
 });
 </script>
 
@@ -557,7 +529,6 @@ onMounted(async () => {
           standout
           dense
           v-model="filterKeyword"
-          ref="filterRef"
           outlined
           placeholder="ค้นหา"
           @keydown.enter.prevent="getSearchMain()"
@@ -675,7 +646,7 @@ onMounted(async () => {
               boundary-links
               direction-links
               :max-pages="5"
-              @update:model-value="getpersonalList"
+              @update:model-value="fetchProbationPersonalList"
             ></q-pagination>
           </template>
         </d-table>
@@ -688,7 +659,7 @@ onMounted(async () => {
       <q-form ref="myForm">
         <DialogHeader
           tittle="เพิ่มผู้ทดลองปฏิบัติหน้าที่ราชการ "
-          :close="clickClose"
+          :close="onCloseDialog"
         />
         <q-separator />
         <q-card-section class="q-pa-md q-col-gutter-sm">
@@ -697,7 +668,6 @@ onMounted(async () => {
             standout
             dense
             v-model="formProbation.keyword"
-            ref="filterRef2"
             outlined
             placeholder="ค้นหา"
             @keydown.enter.prevent="filterKeyword2Fn(formProbation.page)"
@@ -708,7 +678,6 @@ onMounted(async () => {
                 v-if="filterKeyword2 !== ''"
                 name="clear"
                 class="cursor-pointer"
-                @click="resetFilter2"
               />
             </template>
           </q-input>
@@ -723,7 +692,6 @@ onMounted(async () => {
               :paging="true"
               dense
               class="custom-header-table"
-              v-bind="attrs"
               :pagination-label="paginationLabel2"
               v-model:pagination="pagination2"
               @update:pagination="updatePagination"
@@ -750,7 +718,7 @@ onMounted(async () => {
                       outline
                       color="primary"
                       label="เพิ่ม"
-                      @click="clickAdd(props.row)"
+                      @click="addPersonalData(props.row)"
                     >
                     </q-btn>
                   </q-td>
diff --git a/src/modules/05_placement/interface/response/Probation.ts b/src/modules/05_placement/interface/response/Probation.ts
new file mode 100644
index 000000000..acd70a9ad
--- /dev/null
+++ b/src/modules/05_placement/interface/response/Probation.ts
@@ -0,0 +1,47 @@
+interface ResListProbation {
+  firstName: string;
+  idcard: string;
+  lastName: string;
+  name: string;
+  order_number: string;
+  ordering: number;
+  organization: string;
+  personal_id: string;
+  position_level: string;
+  position_line: string;
+  position_type: string;
+  prefixName: string;
+  probation_no: number;
+  probation_status: number;
+}
+
+interface ResProfileProbation {
+  firstName: string;
+  id: string;
+  idcard: string;
+  isProbation: boolean;
+  lastName: string;
+  orgChild1: string;
+  orgChild1Name: string;
+  orgChild2: string;
+  orgChild2Name: string;
+  orgChild3: string;
+  orgChild3Name: string;
+  orgChild4: string;
+  orgChild4Name: string;
+  orgRootName: string;
+  posExecutiveName: string;
+  posLevelName: string;
+  posNo: string;
+  posTypeName: string;
+  position: string;
+  positionArea: string;
+  positionExecutiveField: string;
+  positionField: string;
+  prefix: string;
+  rank: string;
+  refCommandNo: string;
+  root: string;
+}
+
+export type { ResListProbation, ResProfileProbation };

From 73db661b34f87a8de94f383ce858a9f6c4f4641e Mon Sep 17 00:00:00 2001
From: "DESKTOP-1R2VSQH\\Lenovo ThinkPad E490" <nicey2t1096@gmail.com>
Date: Wed, 5 Feb 2025 17:47:10 +0700
Subject: [PATCH 2/9] =?UTF-8?q?layout=20=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/MainAppoint.vue      |  4 +-
 .../components/probation/MainProbation.vue    |  2 +-
 .../components/probation/MainSurvey.vue       | 60 +++++++++----------
 .../components/probation/MainTabs.vue         |  6 +-
 4 files changed, 36 insertions(+), 36 deletions(-)

diff --git a/src/modules/05_placement/components/probation/MainAppoint.vue b/src/modules/05_placement/components/probation/MainAppoint.vue
index fb50de670..ae08e5f3d 100644
--- a/src/modules/05_placement/components/probation/MainAppoint.vue
+++ b/src/modules/05_placement/components/probation/MainAppoint.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { onMounted, ref, watch } from "vue";
+import { onMounted, ref } from "vue";
 import { useQuasar, type QTableProps } from "quasar";
 import { useRouter } from "vue-router";
 
@@ -173,7 +173,7 @@ onMounted(async () => {
 </script>
 
 <template>
-  <q-card flat class="q-pa-sm">
+  <q-card flat>
     <div class="row q-col-gutter-sm">
       <div class="col-12">
         <div class="row q-col-gutter-sm">
diff --git a/src/modules/05_placement/components/probation/MainProbation.vue b/src/modules/05_placement/components/probation/MainProbation.vue
index 3cbd5c771..77c234b4e 100644
--- a/src/modules/05_placement/components/probation/MainProbation.vue
+++ b/src/modules/05_placement/components/probation/MainProbation.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { ref, useAttrs, onMounted, reactive, watch } from "vue";
+import { ref, onMounted, reactive, watch } from "vue";
 import { useQuasar } from "quasar";
 import { useRouter } from "vue-router";
 
diff --git a/src/modules/05_placement/components/probation/MainSurvey.vue b/src/modules/05_placement/components/probation/MainSurvey.vue
index 900148b20..d87412ebf 100644
--- a/src/modules/05_placement/components/probation/MainSurvey.vue
+++ b/src/modules/05_placement/components/probation/MainSurvey.vue
@@ -5,8 +5,8 @@ import { useQuasar, type QTableProps } from "quasar";
 import http from "@/plugins/http";
 import config from "@/app.config";
 import { useCounterMixin } from "@/stores/mixin";
-import { checkPermission } from "@/utils/permissions";
 
+import type { Pagination } from "@/modules/05_placement/interface/index/Main";
 import type { MainData } from "@/modules/05_placement/interface/index/Survey";
 
 const $q = useQuasar();
@@ -19,22 +19,6 @@ const rows = ref<MainData[]>([]);
 const filterKeyword = ref<string>("");
 const total = ref<number>(0);
 const totalList = ref<number>(1);
-const pagination = ref({
-  sortBy: "createdAt",
-  descending: true,
-  page: 10,
-  rowsPerPage: 10,
-});
-
-const visibleColumns = ref<string[]>([
-  "no",
-  "fullname",
-  "position",
-  "answer1",
-  "answer2",
-  "answer3",
-  "createdAt",
-]);
 /** หัวตาราง */
 const columns = ref<QTableProps["columns"]>([
   {
@@ -104,35 +88,50 @@ const columns = ref<QTableProps["columns"]>([
     },
   },
 ]);
+const visibleColumns = ref<string[]>([
+  "no",
+  "fullname",
+  "position",
+  "answer1",
+  "answer2",
+  "answer3",
+  "createdAt",
+]);
+const pagination = ref({
+  sortBy: "createdAt",
+  descending: true,
+  page: 10,
+  rowsPerPage: 10,
+});
 
 async function getData() {
   showLoader();
-  let query = {
-    year: year.value,
-    keyword: filterKeyword.value,
-    page: pagination.value.page,
-    pageSize: pagination.value.rowsPerPage,
-  };
   await http
-    .get(config.API.probationSurvey, { params: query })
+    .get(config.API.probationSurvey, {
+      params: {
+        year: year.value,
+        keyword: filterKeyword.value,
+        page: pagination.value.page,
+        pageSize: pagination.value.rowsPerPage,
+      },
+    })
     .then(async (res) => {
       const data = await res.data.result.data;
       totalList.value = Math.ceil(
         res.data.result.total / pagination.value.rowsPerPage
       );
       total.value = res.data.result.total;
-
       rows.value = data;
-      hideLoader();
     })
     .catch((e) => {
       messageError($q, e);
-      hideLoader();
     })
-    .finally(() => {});
+    .finally(() => {
+      hideLoader();
+    });
 }
 
-function updatePagination(newPagination: any) {
+function updatePagination(newPagination: Pagination) {
   pagination.value.page = 1;
   pagination.value.rowsPerPage = newPagination.rowsPerPage;
 }
@@ -153,8 +152,9 @@ onMounted(async () => {
   await getData();
 });
 </script>
+
 <template>
-  <q-card flat class="q-pa-sm">
+  <q-card flat>
     <div class="row q-col-gutter-sm">
       <div class="col-12">
         <div class="row q-col-gutter-sm">
diff --git a/src/modules/05_placement/components/probation/MainTabs.vue b/src/modules/05_placement/components/probation/MainTabs.vue
index b516fbd59..fed244ac4 100644
--- a/src/modules/05_placement/components/probation/MainTabs.vue
+++ b/src/modules/05_placement/components/probation/MainTabs.vue
@@ -39,16 +39,16 @@ const tabsManu = ref<ItemTabs[]>([
     </q-tabs>
     <q-separator />
     <q-tab-panels v-model="store.tabsMain" animated>
-      <q-tab-panel name="probation" class="q-pa-sm">
+      <q-tab-panel name="probation">
         <!-- รายการผู้ทดลองปฏิบัติหน้าที่ราชการ -->
         <ProbationPage />
       </q-tab-panel>
 
-      <q-tab-panel name="appoint" class="q-pa-none">
+      <q-tab-panel name="appoint">
         <!-- แต่งตั้งคณะกรรมการฯ -->
         <AppointPage />
       </q-tab-panel>
-      <q-tab-panel name="survey" class="q-pa-sm">
+      <q-tab-panel name="survey">
         <!-- ผลสํารวจความคิดเห็น -->
         <SurveyPage />
       </q-tab-panel>

From e3fb686d629b78704c4b323e7b19741d023c06df Mon Sep 17 00:00:00 2001
From: "DESKTOP-1R2VSQH\\Lenovo ThinkPad E490" <nicey2t1096@gmail.com>
Date: Wed, 5 Feb 2025 18:03:34 +0700
Subject: [PATCH 3/9] fix

---
 .../components/probation/MainProbation.vue          |  1 +
 .../05_placement/interface/response/Probation.ts    |  1 +
 src/modules/05_placement/views/09_reportMain.vue    | 13 ++++++++++---
 3 files changed, 12 insertions(+), 3 deletions(-)

diff --git a/src/modules/05_placement/components/probation/MainProbation.vue b/src/modules/05_placement/components/probation/MainProbation.vue
index 77c234b4e..0f872bbd6 100644
--- a/src/modules/05_placement/components/probation/MainProbation.vue
+++ b/src/modules/05_placement/components/probation/MainProbation.vue
@@ -342,6 +342,7 @@ function addPersonalData(data: ResProfileProbation) {
           child2: data.orgChild2,
           child3: data.orgChild3,
           child4: data.orgChild4,
+          rootDna: data.rootDna,
         });
 
         // ถ้าการเพิ่มข้อมูลสำเร็จ, อัปเดตสถานะของข้อมูล
diff --git a/src/modules/05_placement/interface/response/Probation.ts b/src/modules/05_placement/interface/response/Probation.ts
index acd70a9ad..2fe4c39c3 100644
--- a/src/modules/05_placement/interface/response/Probation.ts
+++ b/src/modules/05_placement/interface/response/Probation.ts
@@ -42,6 +42,7 @@ interface ResProfileProbation {
   rank: string;
   refCommandNo: string;
   root: string;
+  rootDna: string;
 }
 
 export type { ResListProbation, ResProfileProbation };
diff --git a/src/modules/05_placement/views/09_reportMain.vue b/src/modules/05_placement/views/09_reportMain.vue
index 4004a450c..2282983dc 100644
--- a/src/modules/05_placement/views/09_reportMain.vue
+++ b/src/modules/05_placement/views/09_reportMain.vue
@@ -72,6 +72,7 @@ const pdfSrc = ref<any>();
 /** tree*/
 const filterTree = ref<string>("");
 const nodeId = ref<string>("");
+const orgTreeDnaId = ref<string>("");
 const nodeLevel = ref<number>(0);
 const node = ref<DataStructureTree[]>([]);
 const expanded = ref<string[]>([]);
@@ -87,9 +88,10 @@ function onUpdateYear(val: number) {
   reportType.value && fetchDataReport();
 }
 
-function onSelectedNode(id: string, level: number) {
+function onSelectedNode(id: string, level: number, orgDnaId: string) {
   nodeId.value = id;
   nodeLevel.value = level;
+  orgTreeDnaId.value = orgDnaId;
   reportType.value && fetchDataReport();
 }
 
@@ -99,7 +101,8 @@ function fetchDataReport() {
   }
   isLoadPDF.value = true;
   const queryParams = {
-    nodeId: nodeId.value,
+    nodeId:
+      reportType.value.type === "probation" ? orgTreeDnaId.value : nodeId.value,
     node: nodeLevel.value,
     startDate: dateToISO(dateStart.value),
     endDate: dateToISO(dateEnd.value),
@@ -348,7 +351,11 @@ onMounted(() => {
               <template v-slot:default-header="prop">
                 <q-item
                   @click.stop="
-                    onSelectedNode(prop.node.orgTreeId, prop.node.orgLevel)
+                    onSelectedNode(
+                      prop.node.orgTreeId,
+                      prop.node.orgLevel,
+                      prop.node.orgTreeDnaId
+                    )
                   "
                   :active="nodeId === prop.node.orgTreeId"
                   clickable

From 4887b6ff744e7cacf432c7e459594213360aa9ea Mon Sep 17 00:00:00 2001
From: "DESKTOP-1R2VSQH\\Lenovo ThinkPad E490" <nicey2t1096@gmail.com>
Date: Thu, 6 Feb 2025 09:32:28 +0700
Subject: [PATCH 4/9] =?UTF-8?q?fix=20bug=20filter=20=E0=B8=A3=E0=B8=B2?=
 =?UTF-8?q?=E0=B8=A2=E0=B8=81=E0=B8=B2=E0=B8=A3=E0=B8=AA=E0=B8=AD=E0=B8=9A?=
 =?UTF-8?q?=E0=B9=81=E0=B8=82=E0=B9=88=E0=B8=87=E0=B8=82=E0=B8=B1=E0=B8=99?=
 =?UTF-8?q?/=E0=B8=84=E0=B8=B1=E0=B8=94=E0=B9=80=E0=B8=A5=E0=B8=B7?=
 =?UTF-8?q?=E0=B8=AD=E0=B8=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/modules/05_placement/views/01_Main.vue | 9 ++++++---
 1 file changed, 6 insertions(+), 3 deletions(-)

diff --git a/src/modules/05_placement/views/01_Main.vue b/src/modules/05_placement/views/01_Main.vue
index 1280597fc..b1ae062d8 100644
--- a/src/modules/05_placement/views/01_Main.vue
+++ b/src/modules/05_placement/views/01_Main.vue
@@ -268,6 +268,7 @@ function examTypeFilter() {
 /** ฟังก์ชันค้นหาข้อมูล ายการสอบแข่งขัน / คัดเลือก*/
 async function searchFilterTable() {
   rows.value = [];
+  rowsData.value = [];
   if (examType.value !== undefined && examType.value !== null) {
     await DataStore.DataUpdateMain(
       examTime.value == "ทั้งหมด" ? "all" : examTime.value,
@@ -289,7 +290,9 @@ async function searchFilterTable() {
         numberOfCandidates: e.numberOfCandidates,
       });
     });
-    rows.value = dataArr;
+    // rows.value = dataArr;
+    rowsData.value = dataArr;
+    onSearch();
   }
 }
 
@@ -370,8 +373,8 @@ function onSearch() {
 }
 
 /** เรียกใช้ฟังชั่น เมื่อเริ่มหน้านี้*/
-onMounted(async () => {
-  await fetchYearOptions();
+onMounted(() => {
+  fetchYearOptions();
 });
 </script>
 

From f08fb6d88662c6b18b71ae2bfca4a64b13b3a846 Mon Sep 17 00:00:00 2001
From: "DESKTOP-1R2VSQH\\Lenovo ThinkPad E490" <nicey2t1096@gmail.com>
Date: Thu, 6 Feb 2025 11:15:30 +0700
Subject: [PATCH 5/9] fix report placement

---
 src/modules/05_placement/views/09_reportMain.vue | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/modules/05_placement/views/09_reportMain.vue b/src/modules/05_placement/views/09_reportMain.vue
index 2282983dc..2caf6cd1f 100644
--- a/src/modules/05_placement/views/09_reportMain.vue
+++ b/src/modules/05_placement/views/09_reportMain.vue
@@ -100,6 +100,7 @@ function fetchDataReport() {
     return false;
   }
   isLoadPDF.value = true;
+  pdfSrc.value = null;
   const queryParams = {
     nodeId:
       reportType.value.type === "probation" ? orgTreeDnaId.value : nodeId.value,

From 9d907a71c6f035b0c0d9333a925b4ac3d39a65d2 Mon Sep 17 00:00:00 2001
From: "DESKTOP-1R2VSQH\\Lenovo ThinkPad E490" <nicey2t1096@gmail.com>
Date: Thu, 6 Feb 2025 11:30:16 +0700
Subject: [PATCH 6/9] fix Snap Display

---
 .../13_salary/components/04_salaryLists/TabMain.vue   |  3 +++
 .../components/04_salaryLists/TableTypeOther.vue      | 11 ++++++++---
 .../components/04_salaryLists/TableTypePending.vue    |  8 +++++++-
 .../components/05_salaryListsEmployee/TabMain.vue     |  3 +++
 .../05_salaryListsEmployee/TableTypeOther.vue         |  8 +++++++-
 .../05_salaryListsEmployee/TableTypePending.vue       |  9 ++++++++-
 src/modules/13_salary/views/04_salaryLists.vue        |  1 +
 .../13_salary/views/05_salaryListsEmployee.vue        |  1 +
 8 files changed, 38 insertions(+), 6 deletions(-)

diff --git a/src/modules/13_salary/components/04_salaryLists/TabMain.vue b/src/modules/13_salary/components/04_salaryLists/TabMain.vue
index b606e5192..318c2f068 100644
--- a/src/modules/13_salary/components/04_salaryLists/TabMain.vue
+++ b/src/modules/13_salary/components/04_salaryLists/TabMain.vue
@@ -34,6 +34,7 @@ const props = defineProps({
   rootId: { type: String, require: true },
   periodId: { type: String, require: true },
   roundFilter: { type: Object, require: true },
+  snapShot: { type: String, require: true },
 });
 
 const total = ref<number>();
@@ -632,6 +633,7 @@ const updateIsShowRetire = async () => {
                   v-model:formFilter="formFilter"
                   :fetchDataTable="fetchDataPeriodNew"
                   :total="total"
+                  :snap-shot="props?.snapShot"
                 />
                 <TableTabType2
                   v-else
@@ -641,6 +643,7 @@ const updateIsShowRetire = async () => {
                   :fetchDataTable="fetchDataPeriodNew"
                   :total="total"
                   :type="item.type"
+                  :snap-shot="props?.snapShot"
                 />
               </q-tab-panel>
             </q-tab-panels>
diff --git a/src/modules/13_salary/components/04_salaryLists/TableTypeOther.vue b/src/modules/13_salary/components/04_salaryLists/TableTypeOther.vue
index 234588ae6..9b6d9d27f 100644
--- a/src/modules/13_salary/components/04_salaryLists/TableTypeOther.vue
+++ b/src/modules/13_salary/components/04_salaryLists/TableTypeOther.vue
@@ -29,6 +29,8 @@ const { dialogRemove, messageError, showLoader, hideLoader, success } =
 /** props*/
 const formFilter = defineModel<DataFilter>("formFilter", { required: true });
 const maxPage = defineModel<Number>("maxPage", { required: true });
+const snapShot = defineModel<string>("snapShot");
+
 const props = defineProps({
   rows: { type: Array },
   fetchDataTable: {
@@ -295,7 +297,11 @@ watch(
 <template>
   <q-toolbar class="text-primary" style="padding: 0px">
     <q-btn
-      v-if="!store.isClosedRound && checkPermission($route)?.attrIsCreate"
+      v-if="
+        !store.isClosedRound &&
+        checkPermission($route)?.attrIsCreate &&
+        snapShot === 'SNAP1'
+      "
       flat
       round
       dense
@@ -308,7 +314,6 @@ watch(
     <q-input
       borderless
       dense
-     
       outlined
       v-model="formFilter.keyword"
       placeholder="ค้นหา"
@@ -336,7 +341,6 @@ watch(
           : []
       "
       option-value="name"
-      
       style="min-width: 140px"
       class="col-xs-12 col-sm-3 col-md-2 q-ml-sm"
     />
@@ -375,6 +379,7 @@ watch(
           <q-btn
             v-if="
               !store.isClosedRound &&
+              snapShot === 'SNAP1' &&
               (checkPermission($route)?.attrIsUpdate ||
                 checkPermission($route)?.attrIsDelete)
             "
diff --git a/src/modules/13_salary/components/04_salaryLists/TableTypePending.vue b/src/modules/13_salary/components/04_salaryLists/TableTypePending.vue
index 745bb991e..d97b35014 100644
--- a/src/modules/13_salary/components/04_salaryLists/TableTypePending.vue
+++ b/src/modules/13_salary/components/04_salaryLists/TableTypePending.vue
@@ -31,6 +31,7 @@ const { dialogRemove, messageError, showLoader, hideLoader, success } =
 /** Props*/
 const formFilter = defineModel<DataFilter>("formFilter", { required: true });
 const maxPage = defineModel<Number>("maxPage", { required: true });
+const snapShot = defineModel<string>("snapShot");
 const props = defineProps({
   rows: { type: Array },
   fetchDataTable: {
@@ -321,7 +322,11 @@ function onClickViewInfo(type: string, id: string) {
 <template>
   <q-toolbar class="text-primary" style="padding: 0px">
     <q-btn
-      v-if="!store.isClosedRound && checkPermission($route)?.attrIsCreate"
+      v-if="
+        !store.isClosedRound &&
+        checkPermission($route)?.attrIsCreate &&
+        snapShot === 'SNAP1'
+      "
       flat
       round
       dense
@@ -386,6 +391,7 @@ function onClickViewInfo(type: string, id: string) {
           <q-btn
             v-if="
               !store.isClosedRound &&
+              snapShot === 'SNAP1' &&
               (checkPermission($route)?.attrIsUpdate ||
                 checkPermission($route)?.attrIsDelete)
             "
diff --git a/src/modules/13_salary/components/05_salaryListsEmployee/TabMain.vue b/src/modules/13_salary/components/05_salaryListsEmployee/TabMain.vue
index 6f9b19402..dca54c045 100644
--- a/src/modules/13_salary/components/05_salaryListsEmployee/TabMain.vue
+++ b/src/modules/13_salary/components/05_salaryListsEmployee/TabMain.vue
@@ -34,6 +34,7 @@ const props = defineProps({
   rootId: { type: String, require: true },
   periodId: { type: String, require: true },
   roundFilter: { type: Object, require: true },
+  snapShot: { type: String, require: true },
 });
 
 const splitterModel = ref<number>(13);
@@ -509,6 +510,7 @@ onMounted(() => {
                   :fetch-data-table="fetchDataPeriodNew"
                   :rows="rows"
                   :total="total"
+                  :snap-shot="props?.snapShot"
                 />
                 <TableTabType2
                   v-else
@@ -518,6 +520,7 @@ onMounted(() => {
                   :fetch-data-table="fetchDataPeriodNew"
                   :total="total"
                   :type="item.type"
+                  :snap-shot="props?.snapShot"
                 />
               </q-tab-panel>
             </q-tab-panels>
diff --git a/src/modules/13_salary/components/05_salaryListsEmployee/TableTypeOther.vue b/src/modules/13_salary/components/05_salaryListsEmployee/TableTypeOther.vue
index 3fc89fbeb..dab17b705 100644
--- a/src/modules/13_salary/components/05_salaryListsEmployee/TableTypeOther.vue
+++ b/src/modules/13_salary/components/05_salaryListsEmployee/TableTypeOther.vue
@@ -28,6 +28,7 @@ const { dialogRemove, messageError, showLoader, hideLoader, success } =
 /** props*/
 const formFilter = defineModel<DataFilter>("formFilter", { required: true });
 const maxPage = defineModel<Number>("maxPage", { required: true });
+const snapShot = defineModel<string>("snapShot");
 const props = defineProps({
   rows: { type: Array },
   fetchDataTable: {
@@ -307,7 +308,11 @@ watch(
 <template>
   <q-toolbar class="text-primary" style="padding: 0px">
     <q-btn
-      v-if="!store.isClosedRound && checkPermission($route)?.attrIsCreate"
+      v-if="
+        !store.isClosedRound &&
+        checkPermission($route)?.attrIsCreate &&
+        snapShot === 'SNAP1'
+      "
       flat
       round
       dense
@@ -385,6 +390,7 @@ watch(
           <q-btn
             v-if="
               !store.isClosedRound &&
+              snapShot === 'SNAP1' &&
               (checkPermission($route)?.attrIsUpdate ||
                 checkPermission($route)?.attrIsDelete)
             "
diff --git a/src/modules/13_salary/components/05_salaryListsEmployee/TableTypePending.vue b/src/modules/13_salary/components/05_salaryListsEmployee/TableTypePending.vue
index 9b0563dfc..d631edcfa 100644
--- a/src/modules/13_salary/components/05_salaryListsEmployee/TableTypePending.vue
+++ b/src/modules/13_salary/components/05_salaryListsEmployee/TableTypePending.vue
@@ -30,6 +30,8 @@ const { dialogRemove, messageError, showLoader, hideLoader, success } =
 /** Props*/
 const formFilter = defineModel<DataFilter>("formFilter", { required: true });
 const maxPage = defineModel<Number>("maxPage", { required: true });
+const snapShot = defineModel<string>("snapShot");
+
 const props = defineProps({
   rows: { type: Array },
   fetchDataTable: {
@@ -335,7 +337,11 @@ watch(
 <template>
   <q-toolbar class="text-primary" style="padding: 0px">
     <q-btn
-      v-if="!store.isClosedRound && checkPermission($route)?.attrIsCreate"
+      v-if="
+        !store.isClosedRound &&
+        checkPermission($route)?.attrIsCreate &&
+        snapShot === 'SNAP1'
+      "
       flat
       round
       dense
@@ -404,6 +410,7 @@ watch(
           <q-btn
             v-if="
               !store.isClosedRound &&
+              snapShot === 'SNAP1' &&
               (checkPermission($route)?.attrIsUpdate ||
                 checkPermission($route)?.attrIsDelete)
             "
diff --git a/src/modules/13_salary/views/04_salaryLists.vue b/src/modules/13_salary/views/04_salaryLists.vue
index 360136b2f..26dd53322 100644
--- a/src/modules/13_salary/views/04_salaryLists.vue
+++ b/src/modules/13_salary/views/04_salaryLists.vue
@@ -529,6 +529,7 @@ onMounted(async () => {
         :period-id="roundFilter.id"
         :root-id="agencyFilter"
         :round-filter="roundFilter"
+        :snap-shot="snapFilter"
       />
       <q-card v-else class="q-pa-sm">
         <div class="q-pa-sm">
diff --git a/src/modules/13_salary/views/05_salaryListsEmployee.vue b/src/modules/13_salary/views/05_salaryListsEmployee.vue
index 18e375dc4..c50a33271 100644
--- a/src/modules/13_salary/views/05_salaryListsEmployee.vue
+++ b/src/modules/13_salary/views/05_salaryListsEmployee.vue
@@ -530,6 +530,7 @@ onMounted(async () => {
         :period-id="roundFilter.id"
         :root-id="agencyFilter"
         :round-filter="roundFilter"
+        :snap-shot="snapFilter"
       />
       <q-card v-else class="q-pa-sm">
         <div class="q-pa-sm">

From 09d812a1f66aaa5f07a1864e1db5fd30521a96d2 Mon Sep 17 00:00:00 2001
From: "DESKTOP-1R2VSQH\\Lenovo ThinkPad E490" <nicey2t1096@gmail.com>
Date: Thu, 6 Feb 2025 11:33:55 +0700
Subject: [PATCH 7/9] fix report orgTreeDnaId => nodeId

---
 src/modules/05_placement/views/09_reportMain.vue | 5 ++---
 1 file changed, 2 insertions(+), 3 deletions(-)

diff --git a/src/modules/05_placement/views/09_reportMain.vue b/src/modules/05_placement/views/09_reportMain.vue
index 2caf6cd1f..7684263ec 100644
--- a/src/modules/05_placement/views/09_reportMain.vue
+++ b/src/modules/05_placement/views/09_reportMain.vue
@@ -100,10 +100,9 @@ function fetchDataReport() {
     return false;
   }
   isLoadPDF.value = true;
-  pdfSrc.value = null;
+  pdfSrc.value = undefined;
   const queryParams = {
-    nodeId:
-      reportType.value.type === "probation" ? orgTreeDnaId.value : nodeId.value,
+    nodeId: nodeId.value,
     node: nodeLevel.value,
     startDate: dateToISO(dateStart.value),
     endDate: dateToISO(dateEnd.value),

From 86c6bcc4cfe9bc2d2174914eadc738280e98ff9a Mon Sep 17 00:00:00 2001
From: "DESKTOP-1R2VSQH\\Lenovo ThinkPad E490" <nicey2t1096@gmail.com>
Date: Thu, 6 Feb 2025 11:44:04 +0700
Subject: [PATCH 8/9] fix bug

---
 .../components/probation/FormAppoint/FormAppoint.vue       | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/src/modules/05_placement/components/probation/FormAppoint/FormAppoint.vue b/src/modules/05_placement/components/probation/FormAppoint/FormAppoint.vue
index 9f52fe786..87ed0f29e 100644
--- a/src/modules/05_placement/components/probation/FormAppoint/FormAppoint.vue
+++ b/src/modules/05_placement/components/probation/FormAppoint/FormAppoint.vue
@@ -258,6 +258,7 @@ function close() {
   modal.value = false;
   member.value = "";
   selected.value = [];
+  rowsDirector.value = [];
 }
 
 function updatePagination(newPagination: any) {
@@ -324,13 +325,13 @@ async function getPerson() {
       );
       totalList.value = Math.ceil(dataTotal / pagination.value.rowsPerPage);
       total.value = dataTotal;
-      hideLoader();
     })
     .catch((e) => {
       messageError($q, e);
-      hideLoader();
     })
-    .finally(() => {});
+    .finally(() => {
+      hideLoader();
+    });
 }
 
 function onDelete(id: string) {

From 4120aee9f2c89a2e8ff344e7ccb6ec1e77084a8d Mon Sep 17 00:00:00 2001
From: "DESKTOP-1R2VSQH\\Lenovo ThinkPad E490" <nicey2t1096@gmail.com>
Date: Thu, 6 Feb 2025 11:54:53 +0700
Subject: [PATCH 9/9] report placement

---
 src/modules/05_placement/views/09_reportMain.vue | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/src/modules/05_placement/views/09_reportMain.vue b/src/modules/05_placement/views/09_reportMain.vue
index 7684263ec..fc59f587f 100644
--- a/src/modules/05_placement/views/09_reportMain.vue
+++ b/src/modules/05_placement/views/09_reportMain.vue
@@ -102,7 +102,10 @@ function fetchDataReport() {
   isLoadPDF.value = true;
   pdfSrc.value = undefined;
   const queryParams = {
-    nodeId: nodeId.value,
+    nodeId:
+      reportType.value.type === "probation" && reportType.value.id === "2"
+        ? orgTreeDnaId.value
+        : nodeId.value,
     node: nodeLevel.value,
     startDate: dateToISO(dateStart.value),
     endDate: dateToISO(dateEnd.value),