Merge branch 'nice' into develop

2024-08-19 16:17:01 +07:00 · 2024-08-19 16:17:01 +07:00 · bea93446f0
commit bea93446f0
parent f8d7496b70 34dc306288
30 changed files with 1154 additions and 1429 deletions
--- a/src/components/Dialogs/DialogOrgSelectEmployee.vue
+++ b/src/components/Dialogs/DialogOrgSelectEmployee.vue
@ -590,7 +590,7 @@ function onSubmit() {
                  :key="index"
                  :name="item"
                >
-                  <div class="column q-col-gutter-sm" style="height: 70vh">
+                  <div class="column q-col-gutter-sm">
                    <!-- เลือกตำแหน่งเลขที่ -->
                    <div class="col-7">
                      <q-card
--- a/src/modules/05_placement/components/AppointEmployee/Detail.vue
+++ b/src/modules/05_placement/components/AppointEmployee/Detail.vue
@ -4,26 +4,40 @@ import { checkPermission } from "@/utils/permissions";
 import { useQuasar } from "quasar";
 import { useRoute, useRouter } from "vue-router";
 import { useCounterMixin } from "@/stores/mixin";
+import http from "@/plugins/http";
+import config from "@/app.config";
+
+/**
+ * importType
+ */
+import type { QForm } from "quasar";
 import type { ResponseTitle } from "@/modules/05_placement/interface/response/Receive";
 import type {
  appointmentData,
  ResponseData,
  DataProfile,
 } from "@/modules/05_placement/interface/response/AppointMent";
-import type { QForm } from "quasar";
-import http from "@/plugins/http";
-import config from "@/app.config";
-import PopupPersonal from "@/components/Dialogs/PopupPersonal.vue";

-import CardProfile from "@/components/CardProfile.vue";
+/**
+ * importComponents
+ */
+import CardProfile from "@/components/CardProfile.vue"; // card ข้อมูลส่วนตัว

-const modalPersonal = ref<boolean>(false);
-const personId = ref<string>("");
 const $q = useQuasar();
 const route = useRoute();
 const router = useRouter();
 const mixin = useCounterMixin();
+const paramsId = route.params.id;
+const {
+  date2Thai,
+  messageError,
+  showLoader,
+  hideLoader,
+  success,
+  dialogConfirm,
+} = mixin;

+const modalPersonal = ref<boolean>(false);
 const dataProfile = ref<DataProfile>();

 const appointment = ref<appointmentData>({
@ -46,16 +60,6 @@ const date = ref<Date | null>(null);
 const status = ref<string>("");
 const avatar = ref<string>("");

-const paramsId = route.params.id;
-const {
-  date2Thai,
-  messageError,
-  showLoader,
-  hideLoader,
-  success,
-  dialogConfirm,
-} = mixin;
-
 const title = ref<ResponseTitle>({
  fullname: "",
  organizationPositionOld: "",
@ -63,10 +67,12 @@ const title = ref<ResponseTitle>({
  positionTypeOld: "",
 });

-//เรียกข้อมูลตาม id
-const fecthappointmentByid = async () => {
+/**
+ * fetch รายละเอียดการปรับระดับชั้นงานลูกจ้าง
+ */
+function fecthappointmentByid() {
  showLoader();
-  await http
+  http
    .get(config.API.appointEmployeeByid(paramsId.toString()))
    .then((res: ResponseData) => {
      dataProfile.value = res.data.result as unknown as DataProfile;
@ -96,58 +102,67 @@ const fecthappointmentByid = async () => {
    .finally(() => {
      hideLoader();
    });
-};
+}

-//ยืนยันการเเก้ไข
-const clickSave = async () => {
+/**
+ * ยืนยันการบันทึกข้อมูลเพื่อลงบัญชีแนบท้าย
+ */
+function clickSave() {
  if (myForm.value !== null) {
-    myForm.value.validate().then((success: any) => {
-      if (success) {
+    myForm.value.validate().then((result: any) => {
+      if (result) {
        dialogConfirm(
          $q,
-          async () => await putAppointment(),
+          async () => {
+            let data = {
+              citizenId: appointment.value.citizenId,
+              prefixId: appointment.value.prefixId,
+              firstname: appointment.value.firstname,
+              lastname: appointment.value.lastname,
+              educationOld: educationOld.value,
+              organizationPositionOld: organizationPositionOld.value,
+              positionTypeOld: positionTypeOld.value,
+              positionLevelOld: positionLevelOld.value,
+              positionNumberOld: posNo.value,
+              amountOld: salary.value.toString().replace(/,/g, ""),
+              reason: reason.value,
+              positionDate: date.value,
+            };
+            showLoader();
+            await http
+              .put(config.API.appointEmployeeByid(paramsId.toString()), data)
+              .then(async () => {
+                await fecthappointmentByid();
+                await success($q, "บันทึกข้อมูลสำเร็จ");
+                edit.value = false;
+              })
+              .catch((e) => {
+                messageError($q, e);
+              })
+              .finally(() => {
+                hideLoader();
+              });
+          },
          "ต้องการแก้ไขข้อมูลหรือไม่?",
          "แก้ไขข้อมูลเพื่อลงบัญชีแนบท้าย"
        );
      }
    });
  }
-};
-// เเก้ไขข้อมูล
-const putAppointment = async () => {
-  let data = {
-    citizenId: appointment.value.citizenId,
-    prefixId: appointment.value.prefixId,
-    firstname: appointment.value.firstname,
-    lastname: appointment.value.lastname,
-    educationOld: educationOld.value,
-    organizationPositionOld: organizationPositionOld.value,
-    positionTypeOld: positionTypeOld.value,
-    positionLevelOld: positionLevelOld.value,
-    positionNumberOld: posNo.value,
-    amountOld: salary.value.toString().replace(/,/g, ""),
-    reason: reason.value,
-    positionDate: date.value,
-  };
-  showLoader();
-  await http
-    .put(config.API.appointEmployeeByid(paramsId.toString()), data)
-    .then(() => {
-      success($q, "บันทึกข้อมูลสำเร็จ");
-    })
-    .catch((e) => {
-      messageError($q, e);
-    })
-    .finally(() => {
-      fecthappointmentByid();
-      edit.value = false;
-    });
-};
-const cancel = () => {
+}
+
+/**
+ * ยกเลิกการบันทึกข้อมูลเพื่อลงบัญชีแนบท้าย
+ */
+function cancel() {
  edit.value = false;
  fecthappointmentByid();
  myForm.value?.resetValidation();
-};
+}
+
+/**
+ * Class input
+ */
 const getClass = (val: boolean) => {
  return {
    "full-width inputgreen cursor-pointer": val,
@ -155,17 +170,8 @@ const getClass = (val: boolean) => {
  };
 };

-function onclickViewinfo(id: string) {
-  modalPersonal.value = true;
-  personId.value = id;
-}
-
-function updatemodalPersonal(modal: boolean) {
-  modalPersonal.value = modal;
-}
-
-onMounted(async () => {
-  await fecthappointmentByid();
+onMounted(() => {
+  fecthappointmentByid();
 });
 </script>
 <template>
@ -180,7 +186,7 @@ onMounted(async () => {
      class="q-mr-sm"
      @click="router.push(`/placement/appoint-employee`)"
    />
-    รายละเอียดการปรับระดับชั้นงานลูกจ้าง {{ title.fullname }}
+    รายละเอียดการปรับระดับชั้นงานลูกจ้าง{{ title.fullname }}
  </div>

  <CardProfile :data="dataProfile as DataProfile" :type="'employee'" />
@ -191,7 +197,13 @@ onMounted(async () => {
        แก้ไขข้อมูลเพื่อลงบัญชีแนบท้าย
      </div>
      <q-space />
-      <div v-if="status !== 'DONE' && status !== 'REPORT' && checkPermission($route)?.attrIsUpdate">
+      <div
+        v-if="
+          status !== 'DONE' &&
+          status !== 'REPORT' &&
+          checkPermission($route)?.attrIsUpdate
+        "
+      >
        <div class="q-gutter-sm" v-if="!edit">
          <q-btn
            outline
@ -334,7 +346,7 @@ onMounted(async () => {
                lazy-rules
                mask="###,###,###,###"
                reverse-fill-mask
-                class="inputgreen"
+                :class="getClass(edit)"
              />
            </div>
          </div>
@ -401,12 +413,6 @@ onMounted(async () => {
      </div>
    </q-form>
  </q-card>
-
-  <PopupPersonal
-    :modal="modalPersonal"
-    :id="personId"
-    @update:modal="updatemodalPersonal"
-  />
 </template>
 <style lang="scss" scope>
 .q-img {
--- a/src/modules/05_placement/components/AppointEmployee/Main.vue
+++ b/src/modules/05_placement/components/AppointEmployee/Main.vue
@ -8,7 +8,6 @@ import { useCounterMixin } from "@/stores/mixin";
 import { useTransferDataStore } from "@/modules/05_placement/store";
 import Dialogbody from "@/modules/05_placement/components/AppointEmployee/Dialogbody.vue";
 // import DialogOrgTree from "@/modules/05_placement/components/AppointEmployee/Modal.vue";
-import DialogHeader from "@/components/DialogHeader.vue";

 import type {
  listAppointType,
@ -19,7 +18,8 @@ import type { OpType } from "@/modules/05_placement/interface/response/Main";
 import http from "@/plugins/http";
 import config from "@/app.config";

-import DialogOrgSelectEmployee from "@/components/Dialogs/DialogOrgSelectEmployee.vue";
+import DialogHeader from "@/components/DialogHeader.vue";
+import DialogOrgSelectEmployee from "@/components/Dialogs/DialogOrgSelectEmployee.vue"; //เลือกหน่วยงาน

 const typeModal = ref<string>("");
 const posType = ref<string>("");
@ -39,16 +39,12 @@ const {
  messageError,
  date2Thai,
  dialogRemove,
-  dialogConfirm,
-  dialogMessageNotify,
 } = mixin;
-const rowsPosition = ref<any>([]);
 const router = useRouter();
 const rows = ref<listAppointType[]>([]);
 const rows2 = ref<listAppointType[]>([]);
 const modalTree = ref<boolean>(false);
-const ModalEmployee = ref<boolean>(false);
-const personal = ref<resData[]>([]);
+
 const personalId = ref<string>("");
 const filterKeyword = ref<string>("");
 const filterKeyword2 = ref<string>("");
@ -56,7 +52,7 @@ const filterRef = ref<any>(null);
 const listRecevice = ref<resData[]>([]);
 const optionsType = ref<OpType[]>([]);
 const type = ref<string>("");
-const selectedPosition = ref<any>([]);
+
 const visibleColumns = ref<string[]>([
  "no",
  "citizenId",
@ -66,124 +62,12 @@ const visibleColumns = ref<string[]>([
  "createdAt",
  "status",
 ]);
-const visibleColumnsPosition = ref<String[]>([
-  "organizationOrganizationName",
-  "organizationAgencyName",
-  "organizationGovernmentAgencyName",
-  "organizationShortName",
-  "organizationTypeName",
-  "organizationLevelName",
-  "positionEmployeeLineName",
-  "positionEmployeePositionName",
-  "posNo",
-]);
 const pagination = ref({
  sortBy: "createdAt",
  descending: true,
  page: 1,
  rowsPerPage: 10,
 });
-const columnsPosition = ref<QTableProps["columns"]>([
-  {
-    name: "organizationOrganizationName",
-    align: "left",
-    label: "หน่วยงาน",
-    sortable: true,
-    field: "organizationOrganizationName",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-    sort: (a: string, b: string) =>
-      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
-  },
-  {
-    name: "organizationAgencyName",
-    align: "left",
-    label: "รหัสหน่วยงาน",
-    sortable: true,
-    field: "organizationAgencyName",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-    sort: (a: string, b: string) =>
-      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
-  },
-  {
-    name: "organizationGovernmentAgencyName",
-    align: "left",
-    label: "รหัสส่วนราชการ",
-    sortable: true,
-    field: "organizationGovernmentAgencyName",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-    sort: (a: string, b: string) =>
-      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
-  },
-  {
-    name: "organizationShortName",
-    align: "left",
-    label: "ชื่อย่อหน่วยงาน",
-    sortable: true,
-    field: "organizationShortName",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-    sort: (a: string, b: string) =>
-      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
-  },
-  {
-    name: "organizationTypeName",
-    align: "left",
-    label: "ประเภทหน่วยงาน",
-    sortable: true,
-    field: "organizationTypeName",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-    sort: (a: string, b: string) =>
-      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
-  },
-  {
-    name: "organizationLevelName",
-    align: "left",
-    label: "ระดับหน่วยงาน",
-    sortable: true,
-    field: "organizationLevelName",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-    sort: (a: string, b: string) =>
-      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
-  },
-  {
-    name: "positionEmployeeLineName",
-    align: "left",
-    label: "สายงาน",
-    sortable: true,
-    field: "positionEmployeeLineName",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-    sort: (a: string, b: string) =>
-      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
-  },
-  {
-    name: "positionEmployeePositionName",
-    align: "left",
-    label: "ตำแหน่ง",
-    sortable: true,
-    field: "positionEmployeePositionName",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-    sort: (a: string, b: string) =>
-      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
-  },
-  {
-    name: "posNo",
-    align: "left",
-    label: "ตำแหน่งเลขที่",
-    sortable: true,
-    field: "posNo",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-    sort: (a: string, b: string) =>
-      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
-  },
-]);
 const columns = ref<QTableProps["columns"]>([
  {
    name: "no",
@ -249,39 +133,29 @@ const columns = ref<QTableProps["columns"]>([
    style: "font-size: 14px",
  },
 ]);
+/**
+ * รีเซ็ต input
+ */
+function resetFilter() {
+  filterKeyword.value = "";
+  filterKeyword2.value = "";
+  filterRef.value.focus();
+}

-onMounted(() => {
-  fecthlistappointment();
-});
-//ดึงข้อมูล API
-const fecthlistappointment = async () => {
+/**
+ * fetch รายการปรับระดับชั้นงานลูกจ้าง
+ */
+function fecthlistappointment() {
  showLoader();
  rows.value = [];
-  await http
+  http
    .get(config.API.appointEmployee())
    .then((res) => {
      let response = res.data.result;
      listRecevice.value = response;
      rows.value = response;
-      // rows.value = response.map((e: resData) => ({
-      //   personalId: e.id,
-      //   citizenId: e.citizenId,
-      //   fullname: e.prefix + e.firstname + "  " + e.lastname,
-      //   organizationName: e.organizationName + " " + e.organizationShortName,
-      //   orgName: e.organizationName,
-      //   organizationShortName: e.organizationShortName,
-      //   status: statusText(e.status),
-      //   createdAt: date2Thai(e.createdAt),
-      //   birthday: e.dateOfBirth == null ? "-" : date2Thai(e.dateOfBirth),
-      //   educationOld: e.educationOld,
-      //   organizationPositionOld: e.organizationPositionOld,
-      //   positionTypeOld: e.positionTypeOld,
-      //   positionLevelOld: e.positionLevelOld,
-      //   positionNumberOld: e.positionNumberOld,
-      //   salary: e.salary,
-      //   positionDate: e.positionDate,
-      // }));

+      //หารายชื่อส่งไปออกคำสั่ง
      rows2.value = rows.value.filter(
        (e: any) =>
          e.root !== null &&
@ -302,205 +176,75 @@ const fecthlistappointment = async () => {
    .finally(() => {
      hideLoader();
    });
-};
+}

-//ดึงข้อมูลประเภทคำสั่งเเต่งตั้ง
-const fecthTypeOption = async () => {
-  type.value = "";
-  await http
-    .get(config.API.typeOrder())
-    .then((res) => {
-      optionsType.value = res.data.result.filter(
-        (e: OpType) =>
-          e.commandCode === "C-PM-22" || e.commandCode === "C-PM-24"
-      );
-      type.value = optionsType.value[0].id;
-    })
-    .catch((e) => {
-      messageError($q, e);
-    });
-};
-// เปิดโครงสร้าง
-const openModalEmployee = async (id: string) => {
-  personalId.value = id;
-  await getPosition(id);
-};
-const getPosition = async (id: string) => {
-  showLoader();
-  await http
-    .get(config.API.organizationEmployee)
-    .then((res) => {
-      const { result } = res.data;
-      let data: any[] = [];
-      result.map((r: any) => {
-        data.push({
-          id: r.id,
-          agency: r.agency,
-          conditionNote: r.conditionNote,
-          department: r.department,
-          government: r.government,
-          isActive: r.isActive,
-          isCondition: r.isCondition,
-          isDirector: r.isDirector,
-          organizationUserNote: r.organizationUserNote,
-          qualification: r.qualification,
-          pile: r.pile,
-          posNo: r.posNo,
-          positionCondition: r.positionCondition,
-          positionMasterUserNote: r.positionMasterUserNote,
-          organizationOrder: r.organizationOrder,
-          organizationFaxId: r.organizationFaxId,
-          organizationLevelId: r.organizationLevelId,
-          organizationOrganizationId: r.organizationOrganizationId,
-          organizationTelExternalId: r.organizationTelExternalId,
-          organizationTelInternalId: r.organizationTelInternalId,
-          organizationTypeId: r.organizationTypeId,
-          positionEmployeeStatusId: r.positionEmployeeStatusId,
-          positionEmployeeLineId: r.positionEmployeeLineId,
-          positionEmployeePositionId: r.positionEmployeePositionId,
-          organizationAgencyId: r.organizationAgencyId,
-          organizationGovernmentAgencyId: r.organizationGovernmentAgencyId,
-          organizationShortNameId: r.organizationShortNameId,
-          organizationFaxName: r.organizationFaxName,
-          organizationLevelName: r.organizationLevel,
-          organizationOrganizationName: r.organizationOrganization,
-          organizationTelExternalName: r.organizationTelExternal,
-          organizationTelInternalName: r.organizationTelInternal,
-          organizationTypeName: r.organizationType,
-          positionEmployeeStatusName: r.positionEmployeeStatus,
-          positionEmployeeLineName: r.positionEmployeeLine,
-          positionEmployeePositionName: r.positionEmployeePosition,
-          organizationAgencyName: r.organizationAgencyCode,
-          organizationGovernmentAgencyName: r.organizationGovernmentAgencyCode,
-          organizationShortName: r.organizationShortName,
-          positionEmployeeLevels: r.positionEmployeeLevels,
-          positionEmployeePositionSides: r.positionEmployeePositionSides,
-          use: r.use,
-        });
-      });
-
-      const index = data.findIndex((r: any) => r.use == true);
-      if (index >= 0) {
-        selectedPosition.value = [data[index]];
-      }
-      rowsPosition.value = data;
-      ModalEmployee.value = true;
-    })
-    .catch((e) => {
-      messageError($q, e);
-    })
-    .finally(() => {
-      hideLoader();
-    });
-};
-//เเจ้งเตือนลบข้อมูล
+/**
+ * ยืนยันลบรายการปรับระดับชั้นงานลูกจ้าง
+ * @param id รายการปรับระดับชั้นงานลูกจ้าง
+ */
 const clickDelete = (id: string) => {
-  dialogRemove($q, () => deleteAppoint(id));
-};
-// ลบข้อมูล
-const deleteAppoint = async (id: string) => {
-  showLoader();
-  await http
-    .delete(config.API.appointEmployeeByid(id))
-    .then(() => {
-      success($q, "ลบข้อมูลสำเร็จ");
-    })
-    .catch((e) => {
-      messageError($q, e);
-    })
-    .finally(() => {
-      fecthlistappointment();
-      hideLoader();
-    });
-};
-// ปิด modal โครงส้ราง
-const closeModalTree = async () => {
-  await fecthlistappointment();
-  modalTree.value = false;
+  dialogRemove($q, () => {
+    showLoader();
+    http
+      .delete(config.API.appointEmployeeByid(id))
+      .then(async () => {
+        await fecthlistappointment();
+        await success($q, "ลบข้อมูลสำเร็จ");
+      })
+      .catch((e) => {
+        messageError($q, e);
+      })
+      .finally(() => {
+        hideLoader();
+      });
+  });
 };

-// ไปหน้ารายละเอียด
-const nextPage = (id: string) => {
+/**
+ * redialect รายละเอียดการปรับระดับชั้นงานลูกจ้าง
+ * @param id  รายการปรับระดับชั้นงานลูกจ้าง
+ */
+function nextPage(id: string) {
  router.push({
    path: `appoint-employee/detail/${id}`,
  });
-};
-//รีเซ็ต input
-const resetFilter = () => {
-  filterKeyword.value = "";
-  filterKeyword2.value = "";
-  filterRef.value.focus();
-};
-//ปิด modal
-const clickClose = () => {
-  modal.value = false;
-  ModalEmployee.value = false;
-};
-//เปิด modal
-const popup = () => {
+}
+
+/**
+ * เปิด popup  ส่งไปออกคำสั่ง
+ */
+function popup() {
  modal.value = true;
  filterKeyword2.value = "";
-  // fecthTypeOption();
-};
+}

-const checkSave = () => {
-  dialogConfirm($q, async () => await saveData());
-};
-
-// เช็คข้อมูลก่อนบันทึกการกำหนดตำแหน่ง
-const saveData = async () => {
-  if (selectedPosition.value.length == 0) {
-    dialogMessageNotify($q, "ไม่สามารถบันทึกข้อมูลได้ กรุณาเลือกตำแหน่ง");
-    return;
-  } else {
-    await savePosition();
-  }
-};
-
-// บันทึกการกำหนดตำแหน่ง
-const savePosition = async () => {
-  showLoader();
-  const data = {
-    organizationEmployeeId: selectedPosition.value[0].id,
-  };
-  await http
-    .put(config.API.appointEmployeePosition(personalId.value), data)
-    .then((res) => {
-      success($q, "บันทึกข้อมูลสำเร็จ");
-    })
-    .catch((e) => {
-      messageError($q, e);
-    })
-    .finally(async () => {
-      fecthlistappointment();
-      clickClose();
-    });
-};
-
-// // ปิด dialog กำหนดตำแหน่ง
-// const modalOpenClose = () => {
-//   modal.value = !modal.value;
-//   if (!modal.value) {
-//     selectedPosition.value = [];
-//     rowsPosition.value = [];
-//     id.value = "";
-//   }
-// };
+/**
+ * ปิด popup  ส่งไปออกคำสั่ง
+ */
+function clickClose() {
+  modal.value = false;
+}

+/**
+ * เปิด popup เลือกหน่วยงาน
+ * @param data ข้อมูลหน่วยงาน
+ * @param type ประเภท ย้าย,ปรับ
+ */
 function openModalTree(data: any, type: string) {
-  modalTree.value = true;
  typeModal.value = type;
  personalId.value = data.id;
  dataRows.value = data;
  posType.value = data.posTypeNameOld;
  posLevel.value = data.posLevelNameOld;
  position.value = data.positionOld;
+  modalTree.value = true;
 }

+/**
+ * ยืนยันการบันทึกข้อมูลเลือกตำแหน่ง
+ */
 function onSave(data: any) {
-  console.log("not save", data);
  const dataAppoint = {
-    // personalId: data.personalId,
    node: data.node,
    nodeId: data.nodeId,
    orgRevisionId: data.orgRevisionId,
@ -519,19 +263,23 @@ function onSave(data: any) {
  showLoader();
  http
    .put(config.API.appointmentPosition(personalId.value), dataAppoint)
-    .then((res) => {
+    .then(async () => {
+      await fecthlistappointment();
+      await success($q, "บันทึกสำเร็จ");
      modalTree.value = false;
-      success($q, "บันทึกสำเร็จ");
    })
    .catch((e) => {
      messageError($q, e);
    })
-    .finally(async () => {
-      fecthlistappointment();
+    .finally(() => {
      hideLoader();
    });
 }
+onMounted(() => {
+  fecthlistappointment();
+});
 </script>
+
 <template>
  <div class="toptitle text-dark col-12 row items-center">
    รายการปรับระดับชั้นงานลูกจ้าง
@ -772,86 +520,7 @@ function onSave(data: any) {
      </div>
    </div>
  </q-card>
-  <q-dialog v-model="ModalEmployee" persistent>
-    <q-card style="width: 70vw; max-width: 70vw">
-      <DialogHeader :tittle="'กำหนดตำแหน่ง'" :close="clickClose" />
-      <q-separator />
-      <q-card-section class="q-pa-sm">
-        <div class="row justify-end">
-          <div class="col-5">
-            <q-toolbar style="padding: 0">
-              <q-input
-                borderless
-                outlined
-                dense
-                ref="filterRef"
-                debounce="300"
-                v-model="filterKeyword2"
-                placeholder="ค้นหา"
-                style="width: 850px; max-width: auto"
-              >
-                <template v-slot:append>
-                  <q-icon v-if="filterKeyword2 == ''" name="search" />
-                  <q-icon
-                    v-if="filterKeyword2 !== ''"
-                    name="clear"
-                    class="cursor-pointer"
-                    @click="resetFilter"
-                  />
-                </template>
-              </q-input>
-              <q-select
-                v-model="visibleColumnsPosition"
-                multiple
-                outlined
-                dense
-                options-dense
-                :display-value="$q.lang.table.columns"
-                emit-value
-                map-options
-                :options="columnsPosition"
-                option-value="name"
-                options-cover
-                style="min-width: 150px"
-                class="gt-xs q-ml-sm"
-              />
-            </q-toolbar>
-          </div>
-        </div>

-        <d-table
-          :rows="rowsPosition"
-          :columns="columnsPosition"
-          :filter="filterKeyword2"
-          row-key="id"
-          selection="single"
-          v-model:selected="selectedPosition"
-          :visible-columns="visibleColumnsPosition"
-        >
-          <template v-slot:body-selection="scope">
-            <q-checkbox
-              keep-color
-              color="primary"
-              dense
-              v-model="scope.selected"
-            />
-          </template>
-        </d-table>
-      </q-card-section>
-      <q-separator />
-      <q-card-actions align="right">
-        <q-btn
-          dense
-          unelevated
-          label="บันทึก"
-          color="public"
-          @click="checkSave"
-          class="q-px-md"
-        >
-        </q-btn>
-      </q-card-actions>
-    </q-card>
-  </q-dialog>
  <Dialogbody
    v-model:Modal="modal"
    :clickClose="clickClose"
@ -862,12 +531,6 @@ function onSave(data: any) {
    :nextPage="nextPage"
    :fecthlistappointment="fecthlistappointment"
  />
-  <!-- <DialogOrgTree
-    v-model:modal="modalTree"
-    :close="closeModalTree"
-    :personal="personal"
-    :personalId="personalId"
-  /> -->

  <DialogOrgSelectEmployee
    :title="`เลือกหน่วยงานที่รับการปรับระดับชั้นงาน`"
--- a/src/modules/05_placement/components/AppointMent/Detail.vue
+++ b/src/modules/05_placement/components/AppointMent/Detail.vue
@ -1,23 +1,40 @@
 <script setup lang="ts">
-import { onMounted, ref, reactive } from "vue";
+import { onMounted, ref } from "vue";
 import { checkPermission } from "@/utils/permissions";
 import { useQuasar } from "quasar";
 import { useRoute, useRouter } from "vue-router";
-import { useCounterMixin } from "@/stores/mixin";
-import type { ResponseTitle } from "@/modules/05_placement/interface/response/Receive";
-import type { DataProfile } from "@/modules/05_placement/interface/response/AppointMent";
-import type { QForm } from "quasar";
 import http from "@/plugins/http";
 import config from "@/app.config";
-import PopupPersonal from "@/components/Dialogs/PopupPersonal.vue";
-import CardProfile from "@/components/CardProfile.vue";

-const modalPersonal = ref<boolean>(false);
-const personId = ref<string>("");
+/**
+ * importType
+ */
+import type { QForm } from "quasar";
+import type { ResponseTitle } from "@/modules/05_placement/interface/response/Receive";
+import type { DataProfile } from "@/modules/05_placement/interface/response/AppointMent";
+
+/**
+ * importComponents
+ */
+import CardProfile from "@/components/CardProfile.vue"; // card ข้อมูลส่วนตัว
+
+/**
+ * importStore
+ */
+import { useCounterMixin } from "@/stores/mixin";
+
 const $q = useQuasar();
 const route = useRoute();
 const router = useRouter();
-const mixin = useCounterMixin();
+const {
+  date2Thai,
+  messageError,
+  showLoader,
+  hideLoader,
+  success,
+  dialogConfirm,
+} = useCounterMixin();
+const paramsId = route.params.id;

 const dataProfile = ref<DataProfile>();

@ -35,16 +52,6 @@ const date = ref<Date | null>(null);
 const status = ref<string>("");
 const avatar = ref<string>("");

-const paramsId = route.params.id;
-const {
-  date2Thai,
-  messageError,
-  showLoader,
-  hideLoader,
-  success,
-  dialogConfirm,
-} = mixin;
-
 const title = ref<ResponseTitle>({
  fullname: "",
  organizationPositionOld: "",
@ -52,10 +59,12 @@ const title = ref<ResponseTitle>({
  positionTypeOld: "",
 });

-//เรียกข้อมูลตาม id
-const fecthappointmentByid = async () => {
+/**
+ *  fetch รายละเอียดการแต่งตั้ง-เลื่อน-ย้าย
+ */
+function fecthappointmentByid() {
  showLoader();
-  await http
+  http
    .get(config.API.appointmentByid(paramsId.toString()))
    .then((res) => {
      dataProfile.value = res.data.result as unknown as DataProfile;
@ -85,9 +94,11 @@ const fecthappointmentByid = async () => {
    .finally(() => {
      hideLoader();
    });
-};
+}

-// เเก้ไขข้อมูล
+/**
+ * ยืนยันการบับทึกข้อมูลลงบัญชีแนบท้าย
+ */
 function putAppointment() {
  dialogConfirm(
    $q,
@ -105,26 +116,35 @@ function putAppointment() {
      showLoader();
      http
        .put(config.API.appointmentByid(paramsId.toString()), data)
-        .then(() => {
-          success($q, "บันทึกข้อมูลสำเร็จ");
+        .then(async () => {
+          await fecthappointmentByid();
+          await success($q, "บันทึกข้อมูลสำเร็จ");
+          edit.value = false;
        })
        .catch((e) => {
          messageError($q, e);
        })
        .finally(() => {
-          fecthappointmentByid();
-          edit.value = false;
+          hideLoader();
        });
    },
    "ต้องการแก้ไขข้อมูลหรือไม่?",
    "แก้ไขข้อมูลเพื่อลงบัญชีแนบท้าย"
  );
 }
-const cancel = () => {
+
+/**
+ * ยกเลิกการแก้ไขลงบัญชีแนบท้าย
+ */
+function cancel() {
  edit.value = false;
-  fecthappointmentByid();
  myForm.value?.resetValidation();
-};
+  fecthappointmentByid();
+}
+
+/**
+ * classInput
+ */
 const getClass = (val: boolean) => {
  return {
    "full-width inputgreen cursor-pointer": val,
@ -132,17 +152,8 @@ const getClass = (val: boolean) => {
  };
 };

-function onclickViewinfo(id: string) {
-  modalPersonal.value = true;
-  personId.value = id;
-}
-
-function updatemodalPersonal(modal: boolean) {
-  modalPersonal.value = modal;
-}
-
-onMounted(async () => {
-  await fecthappointmentByid();
+onMounted(() => {
+  fecthappointmentByid();
 });
 </script>
 <template>
@ -157,7 +168,7 @@ onMounted(async () => {
      class="q-mr-sm"
      @click="router.push(`/placement/appoint-promote`)"
    />
-    รายละเอียดการแต่งตั้ง-เลื่อน-ย้าย {{ title.fullname }}
+    รายละเอียดการแต่งตั้ง-เลื่อน-ย้าย{{ title.fullname }}
  </div>
  <CardProfile :data="dataProfile as DataProfile" />

@ -322,7 +333,7 @@ onMounted(async () => {
                lazy-rules
                mask="###,###,###,###"
                reverse-fill-mask
-                class="inputgreen"
+                :class="getClass(edit)"
              />
            </div>
          </div>
@ -389,12 +400,6 @@ onMounted(async () => {
      </div>
    </q-form>
  </q-card>
-
-  <PopupPersonal
-    :modal="modalPersonal"
-    :id="personId"
-    @update:modal="updatemodalPersonal"
-  />
 </template>
 <style lang="scss" scope>
 .q-img {
--- a/src/modules/05_placement/components/AppointMent/Dialogbody.vue
+++ b/src/modules/05_placement/components/AppointMent/Dialogbody.vue
@ -1,20 +1,29 @@
 <script setup lang="ts">
-import { ref, computed, watchEffect } from "vue";
+import { ref, computed, watch } from "vue";
 import { useQuasar } from "quasar";
-import { useCounterMixin } from "@/stores/mixin";
-import type { QTableProps } from "quasar";
-import type { UserDataNew } from "@/modules/05_placement/interface/response/AppointMent";
-import DialogHeader from "@/components/DialogHeader.vue";
-
-import { useTransferDataStore } from "@/modules/05_placement/store";
-
 import http from "@/plugins/http";
 import config from "@/app.config";

+/**
+ * importType
+ */
+import type { QTableProps } from "quasar";
+import type { UserDataNew } from "@/modules/05_placement/interface/response/AppointMent";
+
+/**
+ * importcomponents
+ */
+import DialogHeader from "@/components/DialogHeader.vue";
+
+/**
+ * importStore
+ */
+import { useCounterMixin } from "@/stores/mixin";
+import { useTransferDataStore } from "@/modules/05_placement/store";
+
+const $q = useQuasar();
 const storeFn = useTransferDataStore();
 const { statusText } = storeFn;
-
-const mixin = useCounterMixin();
 const {
  showLoader,
  success,
@ -22,16 +31,11 @@ const {
  dialogConfirm,
  hideLoader,
  date2Thai,
-} = mixin;
-
-const $q = useQuasar();
-const selected = ref<[]>([]);
-const checkSelected = computed(() => {
-  if (selected.value.length === 0) {
-    return true;
-  }
-});
+} = useCounterMixin();

+/**
+ * props
+ */
 const props = defineProps({
  Modal: Boolean,
  clickClose: Function,
@ -42,6 +46,15 @@ const props = defineProps({
  filterKeyword2: String,
  type: String,
 });
+const emit = defineEmits([
+  "update:filterKeyword2",
+  "update:type",
+  "update:selected",
+]);
+
+/**
+ * table
+ */
 const visibleColumns2 = ref<string[]>([
  "no",
  "citizenId",
@ -117,28 +130,36 @@ const columns2 = ref<QTableProps["columns"]>([
    style: "font-size: 14px",
  },
 ]);
-const pageNext = (item: any) => {
+
+const selected = ref<[]>([]);
+const checkSelected = computed(() => {
+  if (selected.value.length === 0) {
+    return true;
+  }
+});
+
+function pageNext(item: any) {
  props.nextPage?.(item?.id);
-};
-const emit = defineEmits([
-  "update:filterKeyword2",
-  "update:type",
-  "update:selected",
-]);
-const updateInput = (value: any) => {
+}
+
+/**
+ * อัปเดท filter
+ */
+function updateInput(value: any) {
  emit("update:filterKeyword2", value);
-};
+}

-// const updateInputType = (value: string) => {
-//   emit("update:type", value);
-// };
-//รีเซ็ตค่าในช่องค้นหา
-const Reset = () => {
+/**
+ * รีเซ็ตค่าในช่องค้นหา
+ */
+function Reset() {
  emit("update:filterKeyword2", "");
-};
+}

-//ส่งไปออกคำสั่ง
-const sendToCommand = () => {
+/**
+ * ยืนยันส่งไปออกคำสั่ง
+ */
+function sendToCommand() {
  dialogConfirm($q, async () => {
    let pId: string[] = [];
    let Type = props.type as string;
@ -164,13 +185,16 @@ const sendToCommand = () => {
        hideLoader();
      });
  });
-};
+}

-watchEffect(() => {
-  if (props.Modal === true) {
-    selected.value = [];
+watch(
+  () => props.Modal,
+  () => {
+    if (props.Modal === true) {
+      selected.value = [];
+    }
  }
-});
+);
 </script>
 <template>
  <q-dialog v-model="props.Modal">
--- a/src/modules/05_placement/components/AppointMent/Main.vue
+++ b/src/modules/05_placement/components/AppointMent/Main.vue
@ -1,35 +1,34 @@
 <script setup lang="ts">
 import { ref, onMounted } from "vue";
-import type { QTableProps } from "quasar";
 import { checkPermission } from "@/utils/permissions";
 import { useQuasar } from "quasar";
 import { useRouter } from "vue-router";
-import { useCounterMixin } from "@/stores/mixin";
-import { useTransferDataStore } from "@/modules/05_placement/store";
-import Dialogbody from "@/modules/05_placement/components/AppointMent/Dialogbody.vue";
+import http from "@/plugins/http";
+import config from "@/app.config";

+/**
+ * importType
+ */
 import type {
  listAppointType,
  resData,
 } from "@/modules/05_placement/interface/response/AppointMent";
 import type { OpType } from "@/modules/05_placement/interface/response/Main";
-import http from "@/plugins/http";
-import config from "@/app.config";
+import type { QTableProps } from "quasar";

-import DialogOrgSelect from "@/components/Dialogs/DialogOrgSelect.vue";
+/**
+ * importComponents
+ */
+import Dialogbody from "@/modules/05_placement/components/AppointMent/Dialogbody.vue"; //ส่งไปออกคำสั่ง
+import DialogOrgSelect from "@/components/Dialogs/DialogOrgSelect.vue"; // เลือกหน่วยงาน

-const title = ref<string>("");
-const posType = ref<string>("");
-const posLevel = ref<string>("");
-const position = ref<string>("");
-const typeModal = ref<string | null>(null);
-const dataRows = ref<any[]>([]);
+import { useCounterMixin } from "@/stores/mixin";
+import { useTransferDataStore } from "@/modules/05_placement/store";

 const $q = useQuasar();
 const modal = ref<boolean>(false);
 const storeFn = useTransferDataStore();
 const { statusText } = storeFn;
-const mixin = useCounterMixin(); //เรียกฟังก์ชันกลาง
 const {
  showLoader,
  hideLoader,
@ -37,37 +36,31 @@ const {
  messageError,
  date2Thai,
  dialogRemove,
-} = mixin;
+} = useCounterMixin();
+
+const posType = ref<string>("");
+const posLevel = ref<string>("");
+const position = ref<string>("");
+const typeModal = ref<string | null>(null);
+const dataRows = ref<any[]>([]);

 const router = useRouter();
-const rows = ref<listAppointType[]>([]);
-const rows2 = ref<listAppointType[]>([]);
+
 const modalTree = ref<boolean>(false);
-const personal = ref<resData[]>([]);
 const personalId = ref<string>("");
-const filterKeyword = ref<string>("");
-const filterKeyword2 = ref<string>("");
+
 const filterRef = ref<any>(null);
 const listRecevice = ref<resData[]>([]);
 const optionsType = ref<OpType[]>([]);
 const type = ref<string>("");

-const visibleColumns = ref<string[]>([
-  "no",
-  "citizenId",
-  "fullname",
-  "organizationName",
-  "typeCommand",
-  "dateOfBirth",
-  "createdAt",
-  "status",
-]);
-const pagination = ref({
-  sortBy: "createdAt",
-  descending: true,
-  page: 1,
-  rowsPerPage: 10,
-});
+/**
+ * Table
+ */
+const rows = ref<listAppointType[]>([]);
+const rows2 = ref<listAppointType[]>([]);
+const filterKeyword = ref<string>("");
+const filterKeyword2 = ref<string>("");
 const columns = ref<QTableProps["columns"]>([
  {
    name: "no",
@ -151,37 +144,44 @@ const columns = ref<QTableProps["columns"]>([
    style: "font-size: 14px",
  },
 ]);
-
-//รีเซ็ต input
+const visibleColumns = ref<string[]>([
+  "no",
+  "citizenId",
+  "fullname",
+  "organizationName",
+  "typeCommand",
+  "dateOfBirth",
+  "createdAt",
+  "status",
+]);
+const pagination = ref({
+  sortBy: "createdAt",
+  descending: true,
+  page: 1,
+  rowsPerPage: 10,
+});
+/**
+ * รีเซ็ต input
+ */
 const resetFilter = () => {
  filterKeyword.value = "";
  filterKeyword2.value = "";
  filterRef.value.focus();
 };

-//ปิด modal
-const clickClose = () => {
-  modal.value = false;
-};
-
-//เปิด modal
-const sendToCommand = () => {
-  modal.value = true;
-  filterKeyword2.value = "";
-  // fecthTypeOption();
-};
-
-//ดึงข้อมูล API
-const fecthlistappointment = async () => {
+/**
+ * fetch รายการแต่งตั้ง-เลื่อน-ย้าย
+ */
+function fecthlistappointment() {
  showLoader();
  rows.value = [];
-  await http
+  http
    .get(config.API.appointmentMain())
    .then((res) => {
      let response = res.data.result;
      listRecevice.value = response;
      rows.value = response;
-
+      // รายชื่อ ส่งไปออกคำสั่ง
      rows2.value = rows.value.filter(
        (e: any) =>
          e.root !== null &&
@ -202,48 +202,58 @@ const fecthlistappointment = async () => {
    .finally(() => {
      hideLoader();
    });
-};
+}

-// เปิดโครงสร้าง
-const openModalTree = (data: any, type: string) => {
-  personalId.value = data.id;
-  modalTree.value = true;
-  typeModal.value = type;
-  dataRows.value = data;
-  posType.value = data.posTypeOldId;
-  posLevel.value = data.posLevelOldId;
-  position.value = data.positionOld;
-};
-//เบข้อมูล
-const clickDelete = (id: string) => {
+/**
+ * ยืนยันการลบรายการแต่งตั้ง-เลื่อน-ย้าย
+ * @param id รายการแต่งตั้ง-เลื่อน-ย้าย
+ */
+function clickDelete(id: string) {
  dialogRemove($q, () => {
    showLoader();
    http
      .delete(config.API.appointmentDelete(id))
-      .then(() => {
-        success($q, "ลบข้อมูลสำเร็จ");
+      .then(async () => {
+        await fecthlistappointment();
+        await success($q, "ลบข้อมูลสำเร็จ");
      })
      .catch((e) => {
        messageError($q, e);
      })
      .finally(() => {
-        fecthlistappointment();
        hideLoader();
      });
  });
-};
+}

-// ไปหน้ารายละเอียด
-const nextPage = (id: string) => {
+/**
+ * redirect ไปหน้ารายละเอียด
+ * @param id
+ */
+function nextPage(id: string) {
  router.push({
    path: `appoint-promote/detail/${id}`,
  });
-};
+}

+/**
+ * เปิด popup เลือกหน่วยงาน
+ */
+function openModalTree(data: any, type: string) {
+  personalId.value = data.id;
+  typeModal.value = type;
+  dataRows.value = data;
+  posType.value = data.posTypeOldId;
+  posLevel.value = data.posLevelOldId;
+  position.value = data.positionOld;
+  modalTree.value = true;
+}
+
+/**
+ * ยืนยันการเลือกหน่วยงานที่แต่งตั้ง
+ */
 function onSave(data: any) {
-  console.log("not save", data);
  const dataAppoint = {
-    // personalId: data.personalId,
    node: data.node,
    nodeId: data.nodeId,
    orgRevisionId: data.orgRevisionId,
@ -262,19 +272,34 @@ function onSave(data: any) {
  showLoader();
  http
    .put(config.API.appointmentPosition(personalId.value), dataAppoint)
-    .then((res) => {
+    .then(async () => {
+      await fecthlistappointment();
+      await success($q, "บันทึกข้อมูลสำเร็จ");
      modalTree.value = false;
-      success($q, "บันทึกสำเร็จ");
    })
    .catch((e) => {
      messageError($q, e);
    })
    .finally(async () => {
-      fecthlistappointment();
      hideLoader();
    });
 }

+/**
+ * เปิด popup ส่งไปออกคำสั่ง
+ */
+function sendToCommand() {
+  modal.value = true;
+  filterKeyword2.value = "";
+}
+
+/**
+ * ปิด popup ส่งไปออกคำสั่ง
+ */
+function clickClose() {
+  modal.value = false;
+}
+
 onMounted(() => {
  fecthlistappointment();
 });
--- a/src/modules/05_placement/components/Other/Detail.vue
+++ b/src/modules/05_placement/components/Other/Detail.vue
@ -7,13 +7,16 @@ import http from "@/plugins/http";
 import config from "@/app.config";
 import keycloak from "@/plugins/keycloak";

+/**
+ * impotyType
+ */
 import type { resApiData } from "@/modules/05_placement/interface/response/OhterMain";
 import type { QForm } from "quasar";
 import type { DataProfile } from "@/modules/05_placement/interface/index/Main";

 /** importComponents*/
-
 import CardProfile from "@/components/CardProfile.vue";
+
 /** importStore*/
 import { useCounterMixin } from "@/stores/mixin";

@ -50,10 +53,12 @@ const date = ref<Date | null>(null);
 const militaryDate = ref<Date | null>(null);
 const reason = ref<string>("");

-//-----(fetch data by id)-----//
-const fetchData = async () => {
+/**
+ * fetch รายละเอียดรายการอื่นๆ
+ */
+function fetchData() {
  showLoader();
-  await http
+  http
    .get(config.API.otherByid(paramsId.toString()))
    .then((res: resApiData) => {
      const data = res.data.result;
@ -83,10 +88,12 @@ const fetchData = async () => {
      hideLoader();
      edit.value = false;
    });
-};
+}

-//-----(update)-----//
-const onSubmit = async () => {
+/**
+ * ยืนยันการบันทึกข้อมูลเพื่อลงบัญชีแนบท้าย
+ */
+function onSubmit() {
  dialogConfirm(
    $q,
    async () => {
@ -117,13 +124,16 @@ const onSubmit = async () => {
    "ต้องการแก้ไขข้อมูลหรือไม่?",
    "แก้ไขข้อมูลเพื่อลงบัญชีแนบท้าย"
  );
-};
+}

-const cancel = () => {
+/**
+ * ยกเลิกการแก้ไขข้อมูลเพื่อลงบัญชีแนบท้าย
+ */
+function cancel() {
  edit.value = false;
  fetchData();
  myForm.value?.resetValidation();
-};
+}

 const getClass = (val: boolean) => {
  return {
@ -136,7 +146,7 @@ onMounted(async () => {
  if (keycloak.tokenParsed != null) {
    roleAdmin.value = await keycloak.tokenParsed.role.includes("placement1");
  }
-  await fetchData();
+  fetchData();
 });
 </script>

@ -310,7 +320,7 @@ onMounted(async () => {
                :outlined="edit"
                dense
                :readonly="!edit"
-                class="inputgreen"
+                :class="getClass(edit)"
                hide-bottom-space
                :borderless="!edit"
                :label="`${'เงินเดือน'}`"
--- a/src/modules/05_placement/components/Other/Dialogbody.vue
+++ b/src/modules/05_placement/components/Other/Dialogbody.vue
@ -1,35 +1,30 @@
 <script setup lang="ts">
-import { ref, computed, watchEffect } from "vue";
+import { ref, computed, watchEffect, watch } from "vue";
 import { useQuasar } from "quasar";
 import type { QTableProps } from "quasar";
+import http from "@/plugins/http";
+import config from "@/app.config";
+
+/**
+ * importComponents
+ */
 import DialogHeader from "@/components/DialogHeader.vue";

+/**
+ * importStore
+ */
 import { useTransferDataStore } from "@/modules/05_placement/store";
 import { useCounterMixin } from "@/stores/mixin";

-import http from "@/plugins/http";
-import config from "@/app.config";
-const storeFn = useTransferDataStore();
-
-const { statusText } = storeFn;
-const mixin = useCounterMixin();
-const {
-  showLoader,
-  success,
-  messageError,
-  dialogConfirm,
-  findOrgName,
-  date2Thai,
-} = mixin;
-
 const $q = useQuasar();
-const selected = ref<any>([]);
-const checkSelected = computed(() => {
-  if (selected.value.length === 0 || props.type === "") {
-    return true;
-  }
-});
+const storeFn = useTransferDataStore();
+const { statusText } = storeFn;
+const { showLoader, success, messageError, dialogConfirm, date2Thai } =
+  useCounterMixin();

+/**
+ * props
+ */
 const props = defineProps({
  Modal: Boolean,
  clickClose: Function,
@ -40,6 +35,22 @@ const props = defineProps({
  filterKeyword2: String,
  type: String,
 });
+const emit = defineEmits([
+  "update:filterKeyword2",
+  "update:type",
+  "update:selected",
+]);
+
+const selected = ref<any>([]);
+const checkSelected = computed(() => {
+  if (selected.value.length === 0 || props.type === "") {
+    return true;
+  }
+});
+
+/**
+ * Table
+ */
 const visibleColumns2 = ref<string[]>([
  "no",
  "fullname",
@ -120,57 +131,67 @@ const columns2 = ref<QTableProps["columns"]>([
    format: (val) => statusText(val),
  },
 ]);
-const emit = defineEmits([
-  "update:filterKeyword2",
-  "update:type",
-  "update:selected",
-]);
-const updateInput = (value: any) => {
+
+/**
+ * update filter
+ */
+function updateInput(value: any) {
  emit("update:filterKeyword2", value);
-};
+}

-const updateInputType = (value: any) => {
+/**
+ * update ประเภทคำสั่ง
+ */
+function updateInputType(value: any) {
  emit("update:type", value);
-};
-//รีเซ็ตค่าในช่องค้นหา
-const Reset = () => {
-  emit("update:filterKeyword2", "");
-};
-//เปิด modal ยืนยัน
-const clickAddlist = () => {
-  dialogConfirm($q, () => addOther());
-};
+}

-//อัพเดต ส่งไปออกคำสั่ง
-const addOther = async () => {
-  let pId: string[] = [];
-  let Type = props.type as string;
-  selected.value.forEach((e: any) => {
-    pId.push(e.id);
-  });
-  let data = {
-    id: pId,
-  };
-  showLoader();
-  await http
-    .put(config.API.otherReport(Type), data)
-    .then(() => {
-      success($q, "บันทึกสำเร็จ");
-    })
-    .catch((e) => {
-      messageError($q, e);
-    })
-    .finally(() => {
-      props.fecthlistOthet?.();
-      selected.value = [];
-      props.clickClose?.();
+/**
+ * รีเซ็ตค่าในช่องค้นหา
+ */
+function Reset() {
+  emit("update:filterKeyword2", "");
+}
+
+/**
+ * ยืนยันการส่งไปออกคำสั่ง
+ */
+function clickAddlist() {
+  dialogConfirm($q, async () => {
+    let pId: string[] = [];
+    let Type = props.type as string;
+    selected.value.forEach((e: any) => {
+      pId.push(e.id);
    });
-};
-watchEffect(() => {
-  if (props.Modal === true) {
-    selected.value = [];
+    let data = {
+      id: pId,
+    };
+    showLoader();
+    await http
+      .put(config.API.otherReport(Type), data)
+      .then(() => {
+        success($q, "บันทึกสำเร็จ");
+      })
+      .catch((e) => {
+        messageError($q, e);
+      })
+      .finally(() => {
+        props.fecthlistOthet?.();
+        selected.value = [];
+        props.clickClose?.();
+      });
+  });
+}
+
+watch(
+  () => props.Modal,
+  () => {
+    if (props.Modal === true) {
+      selected.value = [];
+    }
  }
-});
+);
+
 // filter OptionsType
 const OptionsTypeFn = ref<any>([]);
 function filterFnOptionsType(val: string, update: any) {
--- a/src/modules/05_placement/components/Other/Main.vue
+++ b/src/modules/05_placement/components/Other/Main.vue
@ -23,7 +23,6 @@ import { useCounterMixin } from "@/stores/mixin";
 const $q = useQuasar();
 const router = useRouter();
 const storeFn = useTransferDataStore();
-const mixin = useCounterMixin();
 const { statusText } = storeFn;
 const {
  showLoader,
@ -32,19 +31,20 @@ const {
  messageError,
  date2Thai,
  dialogRemove,
-  findOrgName,
-} = mixin;
+} = useCounterMixin();

 const modal = ref<boolean>(false);
 const type = ref<string>("");
 const optionsType = ref<OpType[]>([]);
+
+/**
+ * Table
+ */
 const rows = ref<listMain[]>([]);
 const rows2 = ref<listMain[]>([]);
-
 const filterKeyword = ref<string>("");
 const filterKeyword2 = ref<string>("");
 const filterRef = ref<any>(null);
-
 const visibleColumns = ref<string[]>([
  "no",
  "fullname",
@ -127,15 +127,24 @@ const columns = ref<QTableProps["columns"]>([
    format: (val) => statusText(val),
  },
 ]);
+const pagination = ref({
+  sortBy: "createdAt",
+  descending: true,
+  page: 1,
+  rowsPerPage: 10,
+});

-//----(ดึงข้อมูลจาก API)------//
-const fecthlistOthet = async () => {
+/**
+ * fetch รายการอื่นๆ
+ */
+function fecthlistOthet() {
  showLoader();
-  await http
+  http
    .get(config.API.otherMain())
    .then((res) => {
      let response = res.data.result;
      rows.value = response;
+      // หารายชื่อส่งไปออกคำสั่งอื่นๆ
      rows2.value = rows.value.filter(
        (e: listMain) =>
          e.status !== "REPORT" &&
@ -155,14 +164,18 @@ const fecthlistOthet = async () => {
    .finally(() => {
      hideLoader();
    });
-};
-//----(ดึงข้อมูลประเภทคำสั่ง)------//
-const fecthTypeOption = async () => {
+}
+
+/**
+ * fetch รายการข้อมูลประเภทคำสั่ง
+ */
+function fecthTypeOption() {
  showLoader();
  type.value = "";
-  await http
+  http
    .get(config.API.typeOrder())
    .then((res) => {
+      // หาคำสั่ง เฉพาะ  C-PM-08 และ C-PM-09
      optionsType.value = res.data.result.filter(
        (e: OpType) =>
          e.commandCode === "C-PM-08" || e.commandCode === "C-PM-09"
@ -174,33 +187,43 @@ const fecthTypeOption = async () => {
    .finally(() => {
      hideLoader();
    });
-};
+}

-//----(รีเซ็ตข้อมูลในช่อง input)------//
-const resetFilter = () => {
+/**
+ * รีเซ็ตข้อมูลในช่อง input
+ */
+function resetFilter() {
  filterKeyword.value = "";
  filterKeyword2.value = "";
  filterRef.value.focus();
-};
+}

-//----(เปิด Dialog)------//
-const popup = () => {
+/**
+ * เปิด popup ส่งไปออกคำสั่งอื่นๆ
+ */
+function popup() {
  modal.value = true;
  filterKeyword2.value = "";
-  fecthTypeOption();
  type.value = "";
-};
+  // fetch รายการข้อมูลประเภทคำสั่ง
+  fecthTypeOption();
+}

-//----(ปิด modal)------//
-const clickClose = () => {
+/**
+ * ปิด popup ส่งไปออกคำสั่งอื่นๆ
+ */
+function clickClose() {
  modal.value = false;
-};
+}

-//----(เปิด Dialog ลบข้อมูล)------//
-const clickDelete = (id: string) => {
-  dialogRemove($q, async () => {
+/**
+ * ยืนยันการลบรายการอื่นๆ
+ * @param id รายการอื่นๆ
+ */
+function clickDelete(id: string) {
+  dialogRemove($q, () => {
    showLoader();
-    await http
+    http
      .delete(config.API.otherByid(id))
      .then(async () => {
        await fecthlistOthet();
@ -213,21 +236,17 @@ const clickDelete = (id: string) => {
        hideLoader();
      });
  });
-};
+}

-//----(เปิดหน้ารายละเอียด)------//
-const nextPage = (id: string) => {
+/**
+ * redialect รายละเอียดรายการอื่นๆ
+ * @param id รายการอื่นๆ
+ */
+function nextPage(id: string) {
  router.push({
    path: `/placement/other/detail/${id}`,
  });
-};
-
-const pagination = ref({
-  sortBy: "createdAt",
-  descending: true,
-  page: 1,
-  rowsPerPage: 10,
-});
+}

 onMounted(() => {
  fecthlistOthet();
@ -361,6 +380,7 @@ onMounted(() => {
      </div>
    </div>
  </q-card>
+
  <Dialogbody
    v-model:Modal="modal"
    :clickClose="clickClose"
--- a/src/modules/05_placement/components/PersonalDetail/Education.vue
+++ b/src/modules/05_placement/components/PersonalDetail/Education.vue
@ -3,7 +3,7 @@ import { onMounted, ref, watch } from "vue";
 import { useRoute } from "vue-router";
 import { useProfileDataStore } from "@/modules/05_placement/store";
 import { useCounterMixin } from "@/stores/mixin";
-import { useDataStore } from "@/stores/data";
+
 import ProfileTable from "@/modules/05_placement/components/PersonalDetail/Table.vue";
 import DialogHeader from "@/modules/05_placement/components/PersonalDetail/DialogHeader.vue";
 import DialogFooter from "@/modules/05_placement/components/PersonalDetail/DialogFooter.vue";
@ -12,14 +12,12 @@ import type {
  RequestItemsObject,
  DataProps,
 } from "@/modules/05_placement/interface/request/Education";
-import type { ResponseObject } from "@/modules/05_placement/interface/response/Education";
-import HistoryTable from "@/components/TableHistory.vue";
+
 import http from "@/plugins/http";
 import config from "@/app.config";
 import type {
  EduOps,
  Education,
-  DataOption,
  optionData,
 } from "@/modules/05_placement/interface/index/Main";
 import type { QTableProps } from "quasar";
@ -284,7 +282,6 @@ watch(visibleColumns, async (count: String[], prevCount: String[]) => {
 onMounted(async () => {
  await fetchLevel();
  await fetchPositionPath();
-  // await props.fetch();
  rows.value = props.data;
 });

@ -315,25 +312,6 @@ const fetchPositionPath = async () => {
  option.push({ id: false, name: "ไม่ใช่" });
  Ops.value.positionPathOptions = option;
  OpsFilter.value.positionPathOptions = option;
-  /////////////////////////////////
-  //   showLoader();
-  //   await http
-  //     .get(config.API.positionPath)
-  //     .then((res) => {
-  //       const data = res.data.result;
-  //       let option: optionData[] = [];
-  //       data.map((r: optionData) => {
-  //         option.push({ id: r.id.toString(), name: r.name.toString() });
-  //       });
-  //       Ops.value.positionPathOptions = option;
-  //       OpsFilter.value.positionPathOptions = option;
-  //     })
-  //     .catch((e) => {
-  //       messageError($q, e);
-  //     })
-  //     .finally(() => {
-  //       hideLoader();
-  //     });
 };

 const filterSelector = (val: any, update: Function, refData: string) => {
@ -489,16 +467,15 @@ const saveData = async () => {
          : new Date(`${endDate.value}-01-01`),
      isDate: isDate.value == "true",
    })
-    .then((res) => {
+    .then(async () => {
+      await props.fetch("Education");
+      rows.value = props.data;
      success($q, "บันทึกข้อมูลสำเร็จ");
      modal.value = false;
    })
    .catch((e) => {
      messageError($q, e);
-    })
-    .finally(async () => {
-      await props.fetch("Education");
-      rows.value = props.data;
+      hideLoader();
    });
 };

@ -533,16 +510,15 @@ const editData = async () => {
          : new Date(`${endDate.value}-01-01`),
      isDate: isDate.value == "true",
    })
-    .then((res) => {
+    .then(async () => {
+      await props.fetch("Education");
      success($q, "บันทึกข้อมูลสำเร็จ");
+      rows.value = props.data;
      modal.value = false;
    })
    .catch((e) => {
      messageError($q, e);
-    })
-    .finally(async () => {
-      await props.fetch("Education");
-      rows.value = props.data;
+      hideLoader();
    });
 };

@ -557,15 +533,15 @@ const deletePlacementEducation = async () => {
  await http
    .delete(config.API.placementEducationId(id.value))
    .then(async (res) => {
-      success($q, "ลบข้อมูลสำเร็จ");
-      modal.value = false;
      await props.fetch("Education");
+      await success($q, "ลบข้อมูลสำเร็จ");
+      modal.value = false;
      rows.value = props.data;
    })
    .catch((e) => {
      messageError($q, e);
-    })
-    .finally(async () => {});
+      hideLoader();
+    });
 };

 /**
--- a/src/modules/05_placement/components/PersonalDetail/ExamResult.vue
+++ b/src/modules/05_placement/components/PersonalDetail/ExamResult.vue
@ -32,39 +32,6 @@ const props = defineProps({
    <span class="text-bold text-subtitle2">ผลการสอบ</span>
  </div>
  <div class="row q-px-md">
-    <!-- <div class="col-7">
-      <q-card class="card-exam">
-        <div class="row q-px-md q-py-sm">
-          <div class="col q-pa-xs header-sub-text-exam">
-            <div class="q-pb-xs">ประเภท</div>
-            <div class="q-pb-xs">ภาค ก</div>
-            <div class="q-pb-xs">ภาค ข</div>
-            <div class="q-pb-xs">ภาค ค</div>
-            <div>รวมทั้งหมด</div>
-          </div>
-          <div class="col q-pa-xs">
-            <div class="header-sub-text-exam-2 q-pb-xs">คะแนนเต็ม</div>
-            <div class="sub-text-exam q-pb-xs">
-              {{ props.data.pointTotalA }}
-            </div>
-            <div class="sub-text-exam q-pb-xs">
-              {{ props.data.pointTotalB }}
-            </div>
-            <div class="sub-text-exam q-pb-xs">
-              {{ props.data.pointTotalC }}
-            </div>
-            <div class="sub-text-exam">{{ props.data.pointTotal }}</div>
-          </div>
-          <div class="col q-pa-xs header-sub-text-exam-2">
-            <div class="header-sub-text-exam-2 q-pb-xs">คะแนนที่ได้</div>
-            <div class="sub-text-exam q-pb-xs">{{ props.data.pointA }}</div>
-            <div class="sub-text-exam q-pb-xs">{{ props.data.pointB }}</div>
-            <div class="sub-text-exam q-pb-xs">{{ props.data.pointC }}</div>
-            <div class="sub-text-exam q-pb-xs">{{ props.data.point }}</div>
-          </div>
-        </div>
-      </q-card>
-    </div> -->
    <div class="col q-pl-xl">
      <q-card class="q-pt-xs">
        <div class="row">
--- a/src/modules/05_placement/components/PersonalDetail/Information/Address.vue
+++ b/src/modules/05_placement/components/PersonalDetail/Information/Address.vue
@ -153,7 +153,6 @@ const refreshData = async () => {
 };

 const getNewData = async () => {
-  // await props.fetch();
  await fetchProvince();
 };

@ -194,17 +193,15 @@ const editData = async () => {
        config.API.placementAddressId(route.params.personalId.toString()),
        body
      )
-      .then(() => {
+      .then(async () => {
+        emit("update:statusEdit", false);
+        await props.fetch("Address");
        success($q, "แก้ไขข้อมูลสำเร็จ");
+        edit.value = false;
      })
      .catch((e) => {
        messageError($q, e);
-      })
-      .finally(async () => {
-        edit.value = false;
-        emit("update:statusEdit", false);
-        await props.fetch("Address");
-        // await fetchProvince();
+        hideLoader();
      });
  });
 };
--- a/src/modules/05_placement/components/PersonalDetail/Information/Certicate.vue
+++ b/src/modules/05_placement/components/PersonalDetail/Information/Certicate.vue
@ -341,16 +341,15 @@ const saveData = async () => {
      expireDate: new Date(expireDate.value),
      certificateType: certificateType.value,
    })
-    .then((res) => {
-      success($q, "บันทึกข้อมูลสำเร็จ");
+    .then(async () => {
+      await props.fetch("Certificate");
+      await success($q, "บันทึกข้อมูลสำเร็จ");
+      rows.value = props.data;
      modal.value = false;
    })
    .catch((e) => {
      messageError($q, e);
-    })
-    .finally(async () => {
-      await props.fetch("Certificate");
-      rows.value = props.data;
+      hideLoader();
    });
 };

@ -368,16 +367,15 @@ const editData = async () => {
      expireDate: new Date(expireDate.value),
      certificateType: certificateType.value,
    })
-    .then((res) => {
-      success($q, "บันทึกข้อมูลสำเร็จ");
+    .then(async () => {
+      await props.fetch("Certificate");
+      await success($q, "บันทึกข้อมูลสำเร็จ");
+      rows.value = props.data;
      modal.value = false;
    })
    .catch((e) => {
      messageError($q, e);
-    })
-    .finally(async () => {
-      await props.fetch("Certificate");
-      rows.value = props.data;
+      hideLoader();
    });
 };

@ -394,16 +392,15 @@ const clickDelete = async () => {
          id.value
        )
      )
-      .then((res) => {
-        success($q, "ลบข้อมูลสำเร็จ");
+      .then(async () => {
+        await props.fetch("Certificate");
+        await success($q, "ลบข้อมูลสำเร็จ");
+        rows.value = props.data;
        modal.value = false;
      })
      .catch((e) => {
        messageError($q, e);
-      })
-      .finally(async () => {
-        await props.fetch("Certificate");
-        rows.value = props.data;
+        hideLoader();
      });
  });
 };
--- a/src/modules/05_placement/components/PersonalDetail/Information/Document.vue
+++ b/src/modules/05_placement/components/PersonalDetail/Information/Document.vue
@ -169,12 +169,13 @@ const changeBtn = async () => {
 };

 /** ฟังชั่นใหม่ */
-async function clickUpload(file: any) {
+function clickUpload(file: any) {
  const fileName = { fileName: file.name };

  dialogConfirm(
    $q,
    async () => {
+      showLoader();
      const selectedFile = file;
      const formdata = new FormData();
      formdata.append("file", selectedFile);
@ -197,10 +198,14 @@ async function clickUpload(file: any) {
              res.data[key]?.fileName !== ""
          );
          foundKey &&
-            uploadFileDoc(res.data[foundKey]?.uploadUrl, documentFile.value);
+            (await uploadFileDoc(
+              res.data[foundKey]?.uploadUrl,
+              documentFile.value
+            ));
        })
        .catch((err) => {
          messageError($q, err);
+          hideLoader();
        });
    },
    "ยืนยันการอัปโหลดไฟล์",
@ -211,26 +216,26 @@ async function clickUpload(file: any) {
 /**
 * ฟังก์ชั่นสำหรับอัพโหลดไฟล์เอกสารหลักฐาน
 */
-async function uploadFileDoc(uploadUrl: string, file: any) {
+function uploadFileDoc(uploadUrl: string, file: any) {
  const Data = new FormData();
  Data.append("file", documentFile.value);
  showLoader();
-  await axios
+  axios
    .put(uploadUrl, file, {
      headers: {
        "Content-Type": file.type,
      },
    })
-    .then((res) => {
-      success($q, "อัปโหลดไฟล์สำเร็จ");
-      getData();
+    .then(async () => {
+      await getData();
+      await success($q, "อัปโหลดไฟล์สำเร็จ");
+      documentFile.value = null;
    })
    .catch((e) => {
      messageError($q, e);
    })
    .finally(() => {
      hideLoader();
-      documentFile.value = null;
    });
 }

@ -256,7 +261,7 @@ function downloadFile(fileName: string) {
    .catch((e) => {
      messageError($q, e);
    })
-    .finally(async () => {
+    .finally(() => {
      hideLoader();
    });
 }
@ -277,17 +282,14 @@ function deleteFile(fileName: string) {
          fileName
        )
      )
-      .then((res) => {
-        setTimeout(() => {
-          getData();
-          success($q, `ลบไฟล์สำเร็จ`);
-          hideLoader();
-        }, 1000);
+      .then(async () => {
+        setTimeout(async () => {
+          await getData();
+          await success($q, `ลบไฟล์สำเร็จ`);
+        }, 1500);
      })
      .catch((e) => {
        messageError($q, e);
-      })
-      .finally(() => {
        hideLoader();
      });
  });
--- a/src/modules/05_placement/components/PersonalDetail/Information/Family.vue
+++ b/src/modules/05_placement/components/PersonalDetail/Information/Family.vue
@ -56,21 +56,19 @@ const onEdit = ref<boolean>(false);
 const myform = ref<QForm | null>(null);
 const familyData = ref<Family>(props.data);

-
-
 function checkEdit() {
  onEdit.value = true;
 }

-function filterSelector(val: any, update: Function, refData: string){
+function filterSelector(val: any, update: Function, refData: string) {
  update(() => {
    props.Ops[`${refData}`] = props.OpsFilter[`${refData}`].filter(
      (v: DataOption) => v.name.indexOf(val) > -1
    );
  });
-};
+}

-async function refreshData(){
+async function refreshData() {
  if (myform.value != null) {
    myform.value.reset();
  }
@ -89,31 +87,11 @@ async function refreshData(){
  } else {
    edit.value = false;
  }
-};
+}

-async function editData(){
+async function editData() {
  dialogConfirm($q, async () => {
    showLoader();
-    //   const body: ResponseObject = {
-    //     couple: familyData.value.couple == "1",
-    //     couplePrefixId: familyData.value.marryPrefixId,
-    //     coupleFirstName: familyData.value.marryFirstName,
-    //     coupleLastName: familyData.value.marryLastName,
-    //     coupleLastNameOld: familyData.value.lastnameCOld,
-    //     coupleCareer: familyData.value.marryOccupation,
-    //     fatherPrefixId: familyData.value.fatherPrefixId,
-    //     fatherFirstName: familyData.value.fatherFirstName,
-    //     fatherLastName: familyData.value.fatherLastName,
-    //     fatherCareer: familyData.value.fatherOccupation,
-    //     motherPrefixId: familyData.value.motherPrefixId,
-    //     motherFirstName: familyData.value.motherFirstName,
-    //     motherLastName: familyData.value.motherLastName,
-    //     motherCareer: familyData.value.motherOccupation,
-    //     // childrens: familyData.value.childrens,
-    //     createdFullName: "-",
-    //     createdAt: new Date(),
-    //   };
-
    const body = {
      couple: familyData.value.couple == "1",
      couplePrefix: familyData.value.marryPrefixId,
@ -135,31 +113,30 @@ async function editData(){
        config.API.placementFamilyId(route.params.personalId.toString()),
        body
      )
-      .then(() => {
-        success($q, "บันทึกข้อมูลสำเร็จ");
+      .then(async () => {
+        emit("update:statusEdit", false);
+        await props.fetch("Family");
+        await success($q, "บันทึกข้อมูลสำเร็จ");
+        edit.value = false;
      })
      .catch((e) => {
        messageError($q, e);
-      })
-      .finally(async () => {
        hideLoader();
-        edit.value = false;
-        emit("update:statusEdit", false);
-        await props.fetch("Family");
-      });
+      })
+      .finally(async () => {});
  });
-};
+}

-async function saveData(){
+async function saveData() {
  await myform.value?.validate().then(async (success: boolean) => {
    if (success) {
      await editData();
    } else {
    }
  });
-};
+}

-function selectRadio(e: boolean, i: any){
+function selectRadio(e: boolean, i: any) {
  onEdit.value = true;
  if (e) {
    familyData.value.marryPrefixId = "";
@ -168,9 +145,9 @@ function selectRadio(e: boolean, i: any){
    // familyData.value.lastnameCOld = "";
    familyData.value.marryOccupation = "";
  }
-};
+}

-async function changeBtn(){
+async function changeBtn() {
  if (edit.value == true) {
    if (props.statusEdit === true) {
      props.notiNoEdit();
@ -180,14 +157,14 @@ async function changeBtn(){
  } else {
    emit("update:statusEdit", false);
  }
-};
+}

-function getClass(val: boolean){
+function getClass(val: boolean) {
  return {
    "full-width inputgreen cursor-pointer": val,
    "full-width cursor-pointer": !val,
  };
-};
+}

 onMounted(async () => {
  emit("update:statusEdit", false);
--- a/src/modules/05_placement/components/PersonalDetail/Information/Information.vue
+++ b/src/modules/05_placement/components/PersonalDetail/Information/Information.vue
@ -206,31 +206,20 @@ const editData = async () => {
        config.API.placementInformationId(route.params.personalId.toString()),
        body
      )
-      .then((res) => {
-        success($q, "บันทึกข้อมูลสำเร็จ");
-      })
-      .catch((e) => {
-        messageError($q, e);
-      })
-      .finally(async () => {
+      .then(async () => {
        edit.value = false;
        emit("update:statusEdit", false);
        await props.fetch("Information");
        await changeBirth(informaData.value.dateOfBirth ?? new Date());
+        success($q, "บันทึกข้อมูลสำเร็จ");
+      })
+      .catch((e) => {
+        messageError($q, e);
+        hideLoader();
      });
  });
 };

-const saveData = async () => {
-  if (myform.value != null) {
-    await myform.value.validate().then(async (success: boolean) => {
-      if (success) {
-        await editData();
-      }
-    });
-  }
-};
-
 const changeBtn = async () => {
  if (edit.value == true) {
    if (props.statusEdit === true) {
--- a/src/modules/05_placement/components/PersonalDetail/Qualification.vue
+++ b/src/modules/05_placement/components/PersonalDetail/Qualification.vue
@ -48,18 +48,16 @@ const saveData = async () => {
        config.API.placementPropertyId(route.params.personalId.toString()),
        props.data
      )
-      .then((res: any) => {
-        success($q, "แก้ไขข้อมูลสำเร็จ");
+      .then(async () => {
+        await props.fetch("Qualification");
+        await success($q, "แก้ไขข้อมูลสำเร็จ");
+        changeBtn();
        onEdit.value = false;
+        edit.value = false;
      })
      .catch((e: any) => {
        messageError($q, e);
-      })
-      .finally(async () => {
-        await props.fetch("Qualification");
-        edit.value = false;
        hideLoader();
-        changeBtn();
      });
  });
 };
--- a/src/modules/05_placement/components/PersonalList/DialogSelectOrg.vue
+++ b/src/modules/05_placement/components/PersonalList/DialogSelectOrg.vue
@ -256,10 +256,9 @@ async function onClickSubmit() {

      await http
        .post(config.API.placementPass(), body)
-        .then(() => {
-          success($q, "บันทึกข้อมูลสำเร็จ");
-          props.fetchStatCard?.();
-          props.fetchTable?.();
+        .then(async () => {
+          await Promise.all([props.fetchTable?.(), props.fetchStatCard?.()]);
+          await success($q, "บันทึกข้อมูลสำเร็จ");
          closePopup();
        })
        .catch((err) => {
--- a/src/modules/05_placement/components/PersonalList/Table.vue
+++ b/src/modules/05_placement/components/PersonalList/Table.vue
@ -389,32 +389,6 @@ async function getTable() {
    });
 }

-// function insertAvatar(items: any) {
-//   items.map((x: any, index: number) => {
-//     http
-//       .get(
-//         config.API.fileByFile(
-//           "ทะเบียนประวัติ",
-//           "โปรไฟล์",
-//           x.personalId,
-//           "profile-" + x.personalId
-//         )
-//       )
-//       .then((img) => {
-//         rows.value[index] = {
-//           ...x,
-//           avatar: img.data.downloadUrl,
-//         };
-//       })
-//       .catch(() => {
-//         rows.value[index] = {
-//           ...x,
-//           avatar: avatar,
-//         };
-//       });
-//   });
-// }
-
 /**ยืนยันการผ่อนผัน */
 async function saveDeferment() {
  myForm.value.validate().then(async (result: boolean) => {
@ -430,24 +404,23 @@ async function saveDeferment() {
 }
 /**post ผ่อนผัน */
 async function postDeferment() {
+  showLoader();
  const formData = new FormData();
  formData.append("personalId", personalId.value);
  formData.append("note", userNote.value);
  formData.append("files", files.value[0]);
-  showLoader();
  await http
    .post(config.API.deferment(), formData)
-    .then(() => {
-      success($q, "บันทึกสำเร็จ");
+    .then(async () => {
+      await Promise.all([getTable(), props.statCard()]);
+      await success($q, "บันทึกสำเร็จ");
+      userNote.value = "";
+      modalDefermentDisclaim.value = false;
    })
    .catch((e) => {
      messageError($q, e);
    })
-    .finally(async () => {
-      await getTable();
-      props.statCard();
-      userNote.value = "";
-      modalDefermentDisclaim.value = false;
+    .finally(() => {
      hideLoader();
    });
 }
@ -468,24 +441,23 @@ async function saveDisclaim() {

 /**post การสละสิทธิ์ */
 async function postDisclaimf() {
+  showLoader();
  const dataPost = {
    note: userNote.value,
    personId: personalId.value,
  };
-  showLoader();
  await http
    .post(config.API.disclaimF(), {
      note: dataPost.note,
      personalId: dataPost.personId,
    })
-    .then(() => {
-      success($q, "บันทึกสำเร็จ");
-    })
-    .finally(async () => {
-      await getTable();
-      props.statCard();
+    .then(async () => {
+      await Promise.all([getTable(), props.statCard()]);
+      await success($q, "บันทึกสำเร็จ");
      userNote.value = "";
      modalDefermentDisclaim.value = false;
+    })
+    .finally(() => {
      hideLoader();
    });
 }
@ -650,15 +622,15 @@ function savelist() {
        showLoader();
        await http
          .put(config.API.putPosition(examId), personal_selected.value)
-          .then(() => {
+          .then(async () => {
+            await getTable();
+            await success($q, "ส่งรายชื่อไปยังหน่วยงานสำเร็จ");
            modaladdlist.value = false;
-            success($q, "ส่งรายชื่อไปยังหน่วยงานสำเร็จ");
          })
          .catch((e: any) => {
            messageError($q, e);
          })
-          .finally(async () => {
-            await getTable();
+          .finally(() => {
            hideLoader();
          });
      },
@ -697,10 +669,9 @@ function onRestorePos(id: string) {
      showLoader();
      await http
        .post(config.API.clearPosition(id), {})
-        .then(() => {
-          success($q, "คืนตำแหน่งสำเร็จ");
-          getTable();
-          props.statCard();
+        .then(async () => {
+          await Promise.all([getTable(), props.statCard()]);
+          await success($q, "คืนตำแหน่งสำเร็จ");
        })
        .catch((e) => {
          messageError($q, e);
@ -728,10 +699,9 @@ function onSubmitDate() {
    showLoader();
    http
      .put(config.API.clearDate(rowId.value), { date: reportingDate.value })
-      .then(() => {
-        getTable();
-        props.statCard();
-        success($q, "บันทึกข้อมูลสำเร็จ");
+      .then(async () => {
+        await Promise.all([getTable(), props.statCard()]);
+        await success($q, "บันทึกข้อมูลสำเร็จ");
        modalDate.value = false;
      })
      .catch((e) => {
@ -1577,6 +1547,7 @@ onMounted(async () => {
            </template>
            <template #trigger>
              <q-input
+                class="inputgreen"
                ref="dateRef"
                outlined
                dense
--- a/src/modules/05_placement/components/Receive/AddEmployee/Main.vue
+++ b/src/modules/05_placement/components/Receive/AddEmployee/Main.vue
@ -30,7 +30,7 @@ const {
  success,
  dateToISO,
  messageError,
-  dialogMessage,
+  dialogMessageNotify,
  showLoader,
  hideLoader,
  dialogConfirm,
@ -39,7 +39,6 @@ const {
 const profileStore = useProfileDataStore();
 const { changeRetireText } = profileStore;

-const prefixOps = ref<DataOption[]>([]);
 const age = ref<string | null>("");

 const informaData = ref<FormAddPerson>({
@ -61,7 +60,6 @@ const informaData = ref<FormAddPerson>({
  profileType: null,
 });

-const myform = ref<QForm | null>(null);
 const dateBefore = ref<Date>(new Date());
 // รายการข้อมูลทั้งหมด
 const Ops = ref<InformationOps>({
@ -142,7 +140,9 @@ const fetchPerson = async () => {
      Ops.value.religionOps = optionreligions;
      OpsFilter.value.religionOps = optionreligions;
    })
-    .catch((e: any) => {})
+    .catch((e) => {
+      messageError($q, e);
+    })
    .finally(() => {
      hideLoader();
    });
@ -176,30 +176,23 @@ const changeCardID = async (value: string | number | null) => {
  }
 };

+/**
+ * function  เช็คเลขประจำตัวประชาชนช้ำ
+ * @param id เลขประจำตัวประชาชน
+ */
 const checkCitizen = async (id: string) => {
  showLoader();
  await http
-    .get(config.API.profileCitizenId(id))
-    .then((res) => {
-      const data = res.data.result.citizen;
-
-      if (!data) {
-        dialogMessage(
-          $q,
-          "ข้อความแจ้งเตือน",
-          "เลขประจำตัวประชาชนนี้มีการใช้งานแล้ว",
-          "warning",
-          undefined,
-          "orange",
-          undefined,
-          undefined,
-          true
-        );
-        informaData.value.citizenId = defaultCitizenData.value;
-      }
+    .put(config.API.profileNewCitizenId(id), {
+      citizenId: id,
    })
-    .catch((e) => {
-      messageError($q, e);
+    .then(() => {})
+    .catch((err) => {
+      if (err.response.data.status === 500) {
+        dialogMessageNotify($q, err.response.data.message);
+      } else {
+        messageError($q, err);
+      }
    })
    .finally(() => {
      hideLoader();
@ -257,37 +250,6 @@ const calculateMaxDate = () => {
  return today;
 };

-// เช็คเรื่องการเกษียณ
-const handleDate = async (modelData: Date) => {
-  informaData.value.birthDate = modelData;
-  await calRetire(modelData);
-};
-
-const calRetire = async (birth: Date) => {
-  const body = {
-    birthDate: dateToISO(birth),
-  };
-  if (dateToISO(dateBefore.value) != dateToISO(birth)) {
-    showLoader();
-    await http
-      .post(config.API.profileCalRetire, body)
-      .then((res: any) => {
-        const data = res.data.result;
-        informaData.value.age = data.age;
-        changeRetireText(data.retireDate);
-        dateBefore.value = birth;
-      })
-      .catch((e: any) => {
-        messageError($q, e);
-        informaData.value.birthDate = null;
-        informaData.value.age = "";
-      })
-      .finally(() => {
-        hideLoader();
-      });
-  }
-};
-
 // post เพิ่มข้อมูลทะเบียนประวัติไปที่ api
 const onSubmit = async () => {
  const formData = new FormData();
@ -330,7 +292,6 @@ const onSubmit = async () => {
      .post(config.API.receiveData(), formData)
      .then(async (res) => {
        success($q, "บันทึกข้อมูลสำเร็จ");
-        // await changeBirth(informaData.value.birthDate ?? new Date());
        await clickBack();
      })
      .catch((e) => {
--- a/src/modules/05_placement/components/Receive/receiveDetail2.vue
+++ b/src/modules/05_placement/components/Receive/receiveDetail2.vue
@ -1,10 +1,9 @@
 <script setup lang="ts">
-import { onMounted, ref } from "vue";
+import { onMounted, ref, watch } from "vue";
 import { checkPermission } from "@/utils/permissions";
 import { useQuasar } from "quasar";
 import { useRoute, useRouter } from "vue-router";
 import { useCounterMixin } from "@/stores/mixin";
-import { useProfileDataStore } from "@/modules/08_registryEmployee/store";
 import type { QTableProps, QForm } from "quasar";
 import type {
  ResponseTitle,
@ -42,9 +41,6 @@ const {
  dialogConfirm,
 } = mixin;

-// const profileStore = useProfileDataStore();
-// const { changeRetireText } = profileStore;
-
 const title = ref<ResponseTitle>({
  fullname: "",
  organizationPositionOld: "",
@ -189,7 +185,9 @@ const fetchPerson = async () => {
      Ops.value.religionOps = optionreligions;
      OpsFilter.value.religionOps = optionreligions;
    })
-    .catch((e: any) => {})
+    .catch((e) => {
+      messageError($q, e);
+    })
    .finally(() => {
      hideLoader();
    });
@ -223,7 +221,7 @@ const getData = async () => {
      defaultCitizenData.value = data.citizenId == null ? "" : data.citizenId;
      informaData.value = {
        cardid: data.citizenId ?? "",
-        age: "",
+        age: calculateAge(data.dateOfBirth),
        prefix: "",
        prefixId:
          (data.prefix == "00000000-0000-0000-0000-000000000000"
@ -265,7 +263,8 @@ const getData = async () => {
      reason.value = data.reason ?? "";
      status.value = data.status ?? "";

-      await calRetire(new Date(dateToISO(new Date(data.dateOfBirth))));
+      calculateAge(data.dateOfBirth);
+
      dateBefore.value = new Date(data.dateOfBirth);
    })
    .catch((e) => {
@ -281,6 +280,7 @@ const cancel = async () => {
  if (myForm.value !== null) {
    await getData();
    myForm.value?.resetValidation();
+  } else {
  }
 };

@ -379,36 +379,6 @@ const filterSelector = (val: any, update: Function, refData: string) => {
  }
 };

-const handleDate = async (modelData: Date) => {
-  informaData.value.birthDate = modelData;
-  await calRetire(modelData);
-};
-
-const calRetire = async (birth: Date) => {
-  const body = {
-    birthDate: dateToISO(birth),
-  };
-  showLoader();
-  await http
-    .post(config.API.profileCalRetire, body)
-    .then((res: any) => {
-      const data = res.data.result;
-      informaData.value.age = data.age;
-      // changeRetireText(data.retireDate);
-      dateBefore.value = birth;
-    })
-    .catch((e: any) => {
-      messageError($q, e);
-      const retire = new Date(`${birth.getFullYear() + 60}-09-30`);
-      informaData.value.birthDate = dateBefore.value;
-      // changeRetireText(date2Thai(retire));
-    })
-    .finally(() => {
-      hideLoader();
-    });
-  //   }
-};
-
 function saveData() {
  dialogConfirm(
    $q,
@ -441,10 +411,10 @@ function saveData() {
      showLoader();
      http
        .put(config.API.receiveDataId(route.params.id.toString()), body)
-        .then((res: any) => {
-          success($q, "แก้ไขข้อมูลเพื่อลงบัญชีแนบท้ายสำเร็จ");
+        .then(async () => {
+          await getData();
+          await success($q, "แก้ไขข้อมูลเพื่อลงบัญชีแนบท้ายสำเร็จ");
          edit.value = false;
-          getData();
        })
        .catch((e) => {
          messageError($q, e);
@ -465,6 +435,44 @@ const getClass = (val: boolean) => {
  };
 };

+/**
+ * function เช็คอายุไม่เกิน 18 ปี
+ */
+function calculateMaxDate() {
+  const today = new Date();
+  today.setFullYear(today.getFullYear() - 18);
+  return today;
+}
+
+function calculateAge(birthDate: Date | null) {
+  if (!birthDate) return null;
+  const birthDateTimeStamp = new Date(birthDate).getTime();
+  const now = new Date();
+  const diff = now.getTime() - birthDateTimeStamp;
+
+  const ageDate = new Date(diff);
+  const years = ageDate.getUTCFullYear() - 1970;
+  const months = ageDate.getUTCMonth();
+  const days = ageDate.getUTCDate() - 1;
+  const retire = new Date(birthDate);
+  retire.setFullYear(retire.getFullYear() + 60);
+
+  if (years > 60) {
+    return "อายุเกิน 60 ปี";
+  }
+
+  return `${years} ปี ${months} เดือน ${days} วัน`;
+}
+
+watch(
+  () => informaData.value.birthDate,
+  (v) => {
+    if (v) {
+      informaData.value.age = calculateAge(v);
+    }
+  }
+);
+
 onMounted(async () => {
  await fetchPerson();
  await getData();
@ -483,7 +491,7 @@ onMounted(async () => {
      class="q-mr-sm"
      @click="router.push(`/placement/receive`)"
    />
-    รายละเอียดการรับโอนของ {{ title.fullname }}
+    รายละเอียดการรับโอนของ{{ title.fullname }}
  </div>
  <CardProfile :data="dataProfile as DataProfile" />

@ -610,9 +618,8 @@ onMounted(async () => {
                autoApply
                :enableTimePicker="false"
                week-start="0"
-                :max-date="new Date()"
+                :max-date="calculateMaxDate()"
                :disabled="!edit"
-                @update:model-value="handleDate"
              >
                <template #year="{ year }">
                  {{ year + 543 }}
@ -928,6 +935,7 @@ onMounted(async () => {
            </div>
            <div class="col-xs-6 col-sm-3">
              <q-input
+                :class="getClass(edit)"
                v-model="salary"
                :outlined="edit"
                dense
@ -938,7 +946,6 @@ onMounted(async () => {
                :rules="[(val:number) => !!val || `${'กรุณากรอกเงินเดือน'}`]"
                lazy-rules
                mask="###,###,###,###"
-                class="inputgreen"
                reverse-fill-mask
              />
            </div>
--- a/src/modules/05_placement/components/Receive/receiveMain.vue
+++ b/src/modules/05_placement/components/Receive/receiveMain.vue
@ -172,14 +172,14 @@ const SaveData = async () => {
      showLoader();
      http
        .put(config.API.receiveFile(personalId.value), formData)
-        .then(() => {
-          success($q, "บันทึกข้อมูลสำเร็จ");
+        .then(async () => {
+          await success($q, "บันทึกข้อมูลสำเร็จ");
+          await clickCloseUpload();
        })
        .catch((e) => {
          messageError($q, e);
        })
-        .finally(async () => {
-          await clickCloseUpload();
+        .finally(() => {
          hideLoader();
        });
    }
@ -245,31 +245,21 @@ const openUpload = (id: string) => {
  personalId.value = id;
  modalupload.value = true;
 };
-// ยินยันลบ
+// ยินยันลบข้อมูล
 const openDelete = (id: string) => {
-  dialogRemove($q, async () => await fetchDataDelete(id));
-};
-// ลบข้อมูล
-const fetchDataDelete = async (id: string) => {
-  showLoader();
-  await http
-    .delete(config.API.receiveDataId(id))
-    .then((res) => {
-      success($q, "ลบข้อมูลสำเร็จ");
-    })
-    .catch((e) => {
-      messageError($q, e);
-    })
-    .finally(() => {
-      fecthlistRecevice();
-      hideLoader();
-    });
-};
-
-// เปิดโมเดล โครงสร้าง
-const closeModalTree = async () => {
-  await fecthlistRecevice();
-  modalTree.value = false;
+  dialogRemove($q, async () => {
+    showLoader();
+    await http
+      .delete(config.API.receiveDataId(id))
+      .then(async () => {
+        await fecthlistRecevice();
+        await success($q, "ลบข้อมูลสำเร็จ");
+      })
+      .catch((e) => {
+        messageError($q, e);
+        hideLoader();
+      });
+  });
 };

 // ไปหน้ารายละเอียด
@ -282,8 +272,7 @@ const nextPage = (id: string) => {
 function onSave(data: any) {
  console.log("not save", data);
  const dataAppoint = {
-    // personalId: data.personalId,
-    node: data.node,
+    node: data.node, 
    nodeId: data.nodeId,
    orgRevisionId: data.orgRevisionId,
    positionId: data.positionId,
@ -301,15 +290,15 @@ function onSave(data: any) {
  showLoader();
  http
    .put(config.API.receivePosition(personalId.value), dataAppoint)
-    .then((res) => {
+    .then(async () => {
+      await fecthlistRecevice();
+      await success($q, "บันทึกข้อมูลสำเร็จ");
      modalTree.value = false;
-      success($q, "บันทึกสำเร็จ");
    })
    .catch((e) => {
      messageError($q, e);
    })
-    .finally(async () => {
-      fecthlistRecevice();
+    .finally(() => {
      hideLoader();
    });
 }
@ -561,6 +550,7 @@ onMounted(() => {
    </div>
  </q-card>

+  <!-- ออกคำสั่ง -->
  <Dialogbody
    v-model:Modal="modal"
    :clickClose="clickClose"
@ -569,6 +559,8 @@ onMounted(() => {
    :fecthlistRecevice="fecthlistRecevice"
    :nextPage="nextPage"
  />
+
+  <!-- อัปโหลดเอกสาร -->
  <q-dialog v-model="modalupload">
    <q-card style="width: 600px">
      <DialogHeader title="อัปโหลดเอกสาร" :close="clickCloseUpload" />
@ -605,14 +597,7 @@ onMounted(() => {
    </q-card>
  </q-dialog>

-  <!-- <DialogOrgTree
-    v-model:modal="modalTree"
-    :close="closeModalTree"
-    :personal="personal"
-    :personalId="personalId"
-    :dataRows="dataRows"
-  /> -->
-
+  <!-- เลือกหน่วยงานที่รับโอน -->
  <DialogOrgSelect
    :title="`เลือกหน่วยงานที่รับโอน`"
    v-model:modal="modalTree"
--- a/src/modules/05_placement/components/Repatriate/Dialogbody.vue
+++ b/src/modules/05_placement/components/Repatriate/Dialogbody.vue
@ -1,22 +1,28 @@
 <script setup lang="ts">
-import { ref, computed, watchEffect } from "vue";
+import { ref, computed, watch } from "vue";
 import { useQuasar } from "quasar";
-import { useCounterMixin } from "@/stores/mixin";
-import { useTransferDataStore } from "@/modules/05_placement/store";
-
-import type { QTableProps } from "quasar";
-import type { officerType } from "@/modules/05_placement/interface/response/officer";
-
-import DialogHeader from "@/components/DialogHeader.vue";
-
 import http from "@/plugins/http";
 import config from "@/app.config";

-const $q = useQuasar();
-const selected = ref<officerType[]>([]);
-const transferStore = useTransferDataStore();
+/**
+ * impportType
+ */
+import type { QTableProps } from "quasar";
+import type { officerType } from "@/modules/05_placement/interface/response/officer";

-const { statusText } = transferStore;
+/**
+ * importComponents
+ */
+import DialogHeader from "@/components/DialogHeader.vue";
+
+/**
+ * importStore
+ */
+import { useCounterMixin } from "@/stores/mixin";
+import { useTransferDataStore } from "@/modules/05_placement/store";
+
+const $q = useQuasar();
+const { statusText } = useTransferDataStore();
 const mixin = useCounterMixin();
 const {
  showLoader,
@ -28,6 +34,22 @@ const {
  date2Thai,
 } = mixin;

+/**
+ * props
+ */
+const props = defineProps({
+  Modal: Boolean,
+  closeModal: Function,
+  getData: Function,
+  rows2: Array,
+  filterKeyword2: String,
+});
+const emit = defineEmits(["update:filterKeyword2", "update:selected"]);
+
+/**
+ * table
+ */
+const selected = ref<officerType[]>([]);
 const columns2 = ref<QTableProps["columns"]>([
  {
    name: "no",
@ -132,65 +154,70 @@ const visibleColumns2 = ref<string[]>([
  "status",
 ]);

-const props = defineProps({
-  Modal: Boolean,
-  closeModal: Function,
-  getData: Function,
-  rows2: Array,
-  filterKeyword2: String,
-});
-
+/**
+ * chech การเลือกรายชื่อส่งตัวกลับ
+ */
 const checkSelected = computed(() => {
  if (selected.value.length === 0) {
    return true;
  }
 });

-//popup ยืนยันส่งัว
-const saveOrder = () => {
+/**
+ * ยืนยันการส่งออกคำสั่งส่งตัวกลับ
+ */
+function saveOrder() {
  dialogConfirm(
    $q,
-    () => Ordersave(),
+    async () => {
+      const id = selected.value.map((item) => item.id);
+      const body = {
+        id,
+      };
+
+      showLoader();
+      await http
+        .post(config.API.repatriationMainReport(), body)
+        .then(async () => {
+          await props.getData?.();
+          await success($q, "ส่งไปออกคำสั่งส่งตัวกลับสำเร็จ");
+          props.closeModal?.();
+        })
+        .catch((e) => {
+          messageError($q, e);
+        })
+        .finally(() => {
+          hideLoader();
+        });
+    },
    "ยืนยันส่งไปออกคำสั่ง",
    "ต้องการยืนยันส่งไปออกคำสั่งใช่หรือไม่?"
  );
-};
-//ส่งไปออกคำสั่ง
-const Ordersave = async () => {
-  const id = selected.value.map((item) => item.id);
-  const body = {
-    id,
-  };
+}

-  showLoader();
-  await http
-    .post(config.API.repatriationMainReport(), body)
-    .then((res: any) => {
-      success($q, "ส่งไปออกคำสั่งส่งตัวกลับสำเร็จ");
-      props.closeModal?.();
-    })
-    .catch((e) => {
-      messageError($q, e);
-    })
-    .finally(async () => {
-      props.getData?.();
-      hideLoader();
-    });
-};
-
-const emit = defineEmits(["update:filterKeyword2", "update:selected"]);
-const updateInput = (value: any) => {
+/**
+ * อัปเดทค่า filter
+ * @param value คำค้นหา
+ */
+function updateInput(value: string | number | null) {
  emit("update:filterKeyword2", value);
-};
-//รีเซ็ตค่าในช่องค้นหา
-const Reset = () => {
+}
+
+/**
+ * รีเซ็ตค่าในช่องค้นหา
+ */
+function Reset() {
  emit("update:filterKeyword2", "");
-};
-watchEffect(() => {
-  if (props.Modal === true) {
-    selected.value = [];
+}
+
+watch(
+  () => props.Modal,
+  () => {
+    if (props.Modal === true) {
+      selected.value = [];
+    }
  }
-});
+);
 </script>
 <template>
  <q-dialog v-model="props.Modal">
--- a/src/modules/05_placement/components/Repatriate/RepatriateMain.vue
+++ b/src/modules/05_placement/components/Repatriate/RepatriateMain.vue
@ -1,29 +1,30 @@
 <script setup lang="ts">
-import { ref, computed, onMounted } from "vue";
+import { ref, onMounted } from "vue";
 import { checkPermission } from "@/utils/permissions";
 import { useQuasar } from "quasar";
 import { useRouter } from "vue-router";
-import { useCounterMixin } from "@/stores/mixin";
-import { useTransferDataStore } from "@/modules/05_placement/store";
+import http from "@/plugins/http";
+import config from "@/app.config";
+
+/**
+ * importType
+ */
 import type { QTableProps } from "quasar";
 import type { officerType } from "@/modules/05_placement/interface/response/officer";

-import http from "@/plugins/http";
-import config from "@/app.config";
-import Dialogbody from "@/modules/05_placement/components/Repatriate/Dialogbody.vue";
+/**
+ * importComponents
+ */
+import Dialogbody from "@/modules/05_placement/components/Repatriate/Dialogbody.vue"; //popup ส่งไปออกคำสั่งส่งตัวกลับ

+/**
+ * importStore
+ */
+import { useCounterMixin } from "@/stores/mixin";
+import { useTransferDataStore } from "@/modules/05_placement/store";
+
+const { statusText } = useTransferDataStore();
 const $q = useQuasar();
-const filterKeyword = ref<string>("");
-const filterKeyword2 = ref<string>("");
-const filterRef = ref<any>(null);
-const router = useRouter();
-const rows = ref<officerType[]>([]);
-const rows2 = ref<officerType[]>([]);
-const modal = ref<boolean>(false);
-
-const mixin = useCounterMixin();
-const transferStore = useTransferDataStore();
-const { statusText } = transferStore;
 const {
  date2Thai,
  messageError,
@ -32,8 +33,17 @@ const {
  success,
  dialogRemove,
  findPosMasterNoOld,
-} = mixin;
+} = useCounterMixin();

+/**
+ * Table
+ */
+const filterKeyword = ref<string>("");
+const filterKeyword2 = ref<string>("");
+const filterRef = ref<any>(null);
+const router = useRouter();
+const rows = ref<officerType[]>([]);
+const rows2 = ref<officerType[]>([]);
 // หัวตาราง
 const columns = ref<QTableProps["columns"]>([
  {
@ -139,28 +149,59 @@ const visibleColumns = ref<string[]>([
  "status",
 ]);

-// รีเซ้ตค่าในช่อง ฟิลเตอร์
-const resetFilter = () => {
-  filterKeyword.value = "";
-  filterKeyword2.value = "";
-  filterRef.value.focus();
-};
+const modal = ref<boolean>(false); //  ส่งไปออกคำสั่งส่งตัวกลับ

-//เปิดรายละเอียด
-const openDetail = (id: string) => {
+/**
+ * rediarect ไปหน้ารายละเอียด
+ */
+function openDetail(id: string) {
  router.push(`/placement/repatriate/detail/${id}`);
-};
-// เปิด modal
-const openModal = () => (modal.value = true);
-// ปิด modal
-const closeModal = () => {
-  modal.value = false;
-  filterKeyword2.value = "";
-};
+}

-// เปิด modal และกรอก status
-const openModalOrder = () => {
-  openModal();
+/**
+ * fetch รายการส่งตัวกลับ
+ */
+function getData() {
+  showLoader();
+  http
+    .get(config.API.repatriationMain())
+    .then((res) => {
+      const data = res.data.result;
+      rows.value = data;
+    })
+    .catch((e) => {
+      messageError($q, e);
+    })
+    .finally(() => {
+      hideLoader();
+    });
+}
+/**
+ * ยืนยันการลบรายการ
+ */
+function clickDelete(id: string) {
+  dialogRemove($q, () => {
+    showLoader();
+    http
+      .delete(config.API.repatriationMainDelete(id))
+      .then(async () => {
+        await getData();
+        await success($q, "ลบข้อมูลสำเร็จ");
+      })
+      .catch((e) => {
+        messageError($q, e);
+      })
+      .finally(() => {
+        hideLoader();
+      });
+  });
+}
+
+/**
+ * เปิด popup ส่งไปออกคำสั่งส่งตัวกลับ
+ */
+function openModalOrder() {
+  // filter หา status
  const row = rows.value.filter(
    (item: officerType) =>
      (item.status == "WAITTING" ||
@ -177,43 +218,25 @@ const openModalOrder = () => {
  );

  rows2.value = row;
-};
+  modal.value = true;
+}

-// ดึงข้อมูลจาก API
-const getData = async () => {
-  showLoader();
-  await http
-    .get(config.API.repatriationMain())
-    .then((res: any) => {
-      const data = res.data.result;
-      rows.value = data;
-    })
-    .catch((e) => {
-      messageError($q, e);
-    })
-    .finally(() => {
-      hideLoader();
-    });
-};
-// เปิดpop up ยืนยันลบข้อมูล
-const clickDelete = async (name: string, id: string) => {
-  dialogRemove($q, async () => await deleteData(id), `ลบข้อมูลของ ${name}`);
-};
+/**
+ * ปิด popup ส่งไปออกคำสั่งส่งตัวกลับ
+ */
+function closeModal() {
+  modal.value = false;
+  filterKeyword2.value = "";
+}

-// ลบข้อมูล
-const deleteData = async (id: string) => {
-  await http
-    .delete(config.API.repatriationMainDelete(id))
-    .then((res) => {
-      success($q, "ลบข้อมูลสำเร็จ");
-    })
-    .catch((e) => {
-      messageError($q, e);
-    })
-    .finally(async () => {
-      await getData();
-    });
-};
+/**
+ * รีเซ้ตค่าในช่อง ฟิลเตอร์
+ */
+function resetFilter() {
+  filterKeyword.value = "";
+  filterKeyword2.value = "";
+  filterRef.value.focus();
+}

 onMounted(async () => {
  await getData();
@ -317,9 +340,7 @@ onMounted(async () => {
                    round
                    dense
                    color="red"
-                    @click.stop.prevent="
-                      clickDelete(props.row.fullname, props.row.id)
-                    "
+                    @click.stop.prevent="clickDelete(props.row.id)"
                  >
                    <q-tooltip>ลบข้อมูล</q-tooltip>
                  </q-btn>
--- a/src/modules/05_placement/components/Repatriate/RepatriatebyId.vue
+++ b/src/modules/05_placement/components/Repatriate/RepatriatebyId.vue
@ -19,7 +19,6 @@ import CardProfile from "@/components/CardProfile.vue";
 const $q = useQuasar();
 const route = useRoute();
 const router = useRouter();
-const mixin = useCounterMixin();
 const edit = ref<boolean>(false);
 const dataId = route.params.id as string;
 const {
@ -30,12 +29,10 @@ const {
  success,
  dialogConfirm,
  findOrgName,
-} = mixin;
+} = useCounterMixin();

 const myForm = ref<QForm | null>(null);
-
 const dataProfile = ref<DataProfile>();
-
 const fullname = ref<string>("");

 /** form แก้ไขข้อมูลเพื่อลงบัญชีแนบท้าย*/
@ -50,8 +47,10 @@ const dateRepatriation = ref<Date | null>(null);
 const reason = ref<string>("");
 const status = ref<string>("");

-/** fetch ข้อมูลรายละเอียด*/
-const getData = () => {
+/**
+ * fetch ข้อมูลรายละเอียด*
+ */
+function getData() {
  showLoader();
  http
    .get(config.API.repatriationDetail(dataId))
@ -79,9 +78,12 @@ const getData = () => {
    .finally(() => {
      hideLoader();
    });
-};
+}

-const onSubmit = () => {
+/**
+ * ยืนยีนการบันทึกข้อมูลการแก้ไขข้อมูลเพื่อลงบัญชีแนบท้ายสำเร็จ
+ */
+function onSubmit() {
  dialogConfirm(
    $q,
    () => {
@ -99,10 +101,10 @@ const onSubmit = () => {
      showLoader();
      http
        .put(config.API.repatriationMainEdit(dataId), body)
-        .then(() => {
-          success($q, "แก้ไขข้อมูลเพื่อลงบัญชีแนบท้ายสำเร็จ");
+        .then(async () => {
+          await getData();
+          await success($q, "แก้ไขข้อมูลเพื่อลงบัญชีแนบท้ายสำเร็จ");
          edit.value = false;
-          getData();
        })
        .catch((e) => {
          messageError($q, e);
@ -114,14 +116,20 @@ const onSubmit = () => {
    "ต้องการแก้ไขข้อมูลหรือไม่?",
    "แก้ไขข้อมูลเพื่อลงบัญชีแนบท้าย"
  );
-};
+}

-const cancelBtn = () => {
+/**
+ * ยกเลิกการแก้ไขข้อมูลเพื่อลงบัญชีแนบท้ายสำเร็จ
+ */
+function cancelBtn() {
  edit.value = !edit;
-  getData();
  myForm.value?.resetValidation();
-};
+  getData();
+}

+/**
+ * class Input
+ */
 const getClass = (val: boolean) => {
  return {
    "full-width inputgreen cursor-pointer": val,
@ -146,7 +154,7 @@ onMounted(() => {
      class="q-mr-sm"
      @click="router.push(`/placement/repatriate`)"
    />
-    รายละเอียดการส่งตัวกลับ {{ fullname }}
+    รายละเอียดการส่งตัวกลับ{{ fullname }}
  </div>

  <CardProfile :data="dataProfile as DataProfile" />
@ -283,7 +291,7 @@ onMounted(() => {
                hide-bottom-space
                :borderless="!edit"
                :label="`${'เงินเดือน'}`"
-                class="inputgreen"
+                :class="getClass(edit)"
                :rules="[(val:number) => !!val || `${'กรุณากรอกเงินเดือน'}`]"
                lazy-rules
                mask="###,###,###,###"
--- a/src/modules/05_placement/components/Transfer/Dialogbody.vue
+++ b/src/modules/05_placement/components/Transfer/Dialogbody.vue
@ -152,15 +152,15 @@ const Ordersave = async () => {
  showLoader();
  await http
    .post(config.API.transferReport, body)
-    .then((res: any) => {
-      success($q, "ส่งไปออกคำสั่งสำเร็จ");
+    .then(async () => {
+      await props.getData?.();
+      await success($q, "ส่งไปออกคำสั่งสำเร็จ");
      props.closeModal?.();
    })
    .catch((e) => {
      messageError($q, e);
    })
-    .finally(async () => {
-      props.getData?.();
+    .finally(() => {
      hideLoader();
    });
 };
--- a/src/modules/05_placement/components/Transfer/transferRegistry.vue
+++ b/src/modules/05_placement/components/Transfer/transferRegistry.vue
@ -257,6 +257,7 @@ const conditionSave = async () => {
 };

 const saveData = async () => {
+  showLoader();
  const body = {
    organization: organization.value,
    reason: reason.value,
@ -267,18 +268,17 @@ const saveData = async () => {
    positionNumberOld: posNo.value,
    amountOld: salary.value,
  };
-  showLoader();
  await http
    .put(config.API.transferId(dataId.toString()), body)
-    .then((res: any) => {
-      success($q, "แก้ไขข้อมูลเพื่อลงบัญชีแนบท้ายสำเร็จ");
+    .then(async () => {
+      await getData();
+      await success($q, "แก้ไขข้อมูลเพื่อลงบัญชีแนบท้ายสำเร็จ");
      edit.value = false;
    })
    .catch((e) => {
      messageError($q, e);
    })
-    .finally(async () => {
-      await getData();
+    .finally(() => {
      hideLoader();
    });
 };
@ -322,7 +322,7 @@ onMounted(async () => {
      class="q-mr-sm"
      @click="router.push(`/placement/transfer`)"
    />
-    รายละเอียดการขอโอนของ {{ responseData.fullname }}
+    รายละเอียดการขอโอนของ{{ responseData.fullname }}
  </div>
  <CardProfile :data="dataProfile as DataProfile" />
  <!-- <q-card bordered class="row col-12 text-dark">
--- a/src/modules/05_placement/components/helpgovernment/Dialogbody.vue
+++ b/src/modules/05_placement/components/helpgovernment/Dialogbody.vue
@ -1,21 +1,31 @@
 <script setup lang="ts">
-import { ref, computed, watchEffect } from "vue";
+import { ref, computed, watch } from "vue";
 import { useQuasar } from "quasar";
-import { useCounterMixin } from "@/stores/mixin";
 import http from "@/plugins/http";
 import config from "@/app.config";

+/**
+ * importType
+ */
 import type { QTableProps } from "quasar";
 import type { officerType } from "@/modules/05_placement/interface/response/officer";

+/**
+ * importComponents
+ */
 import DialogHeader from "@/components/DialogHeader.vue";

+/**
+ * importStore
+ */
+import { useCounterMixin } from "@/stores/mixin";
 import { useTransferDataStore } from "@/modules/05_placement/store";

+/**
+ * use
+ */
 const $q = useQuasar();
 const { statusText } = useTransferDataStore();
-const selected = ref<officerType[]>([]);
-const mixin = useCounterMixin();
 const {
  showLoader,
  success,
@ -25,9 +35,23 @@ const {
  findOrgNameOld,
  findPosMasterNoOld,
  date2Thai,
-} = mixin;
+} = useCounterMixin();

-//หัวตาราง
+/**
+ * props
+ */
+const props = defineProps({
+  Modal: Boolean,
+  closeModal: Function,
+  getData: Function,
+  rows2: Array,
+  filterKeyword2: String,
+});
+const emit = defineEmits(["update:filterKeyword2", "update:selected"]);
+
+/**
+ * Table
+ */
 const columns2 = ref<QTableProps["columns"]>([
  {
    name: "no",
@ -164,14 +188,7 @@ const visibleColumns2 = ref<string[]>([
  "createdAt",
  "status",
 ]);
-
-const props = defineProps({
-  Modal: Boolean,
-  closeModal: Function,
-  getData: Function,
-  rows2: Array,
-  filterKeyword2: String,
-});
+const selected = ref<officerType[]>([]);

 const checkSelected = computed(() => {
  if (selected.value.length === 0) {
@ -179,50 +196,60 @@ const checkSelected = computed(() => {
  }
 });

-//popup ยืนยันส่งัว
-const saveOrder = () => {
+/**
+ * ยืนยันการส่งไปออกคำสั่ง
+ */
+function saveOrder() {
  dialogConfirm(
    $q,
-    () => Ordersave(),
+    () => {
+      const id = selected.value.map((item) => item.id);
+      const body = {
+        id,
+      };
+      showLoader();
+      http
+        .post(config.API.officerMainReport(), body)
+        .then(async () => {
+          await props.getData?.();
+          await success($q, "ส่งไปออกคำสั่งช่วยราชการสำเร็จ");
+          props.closeModal?.();
+        })
+        .catch((e) => {
+          messageError($q, e);
+        })
+        .finally(() => {
+          hideLoader();
+        });
+    },
    "ยืนยันส่งไปออกคำสั่ง",
    "ต้องการยืนยันส่งไปออกคำสั่งใช่หรือไม่?"
  );
-};
-//ส่งไปออกคำสั่ง
-const Ordersave = async () => {
-  const id = selected.value.map((item) => item.id);
-  const body = {
-    id,
-  };
-  showLoader();
-  await http
-    .post(config.API.officerMainReport(), body)
-    .then(() => {
-      props.closeModal?.();
-      success($q, "ส่งไปออกคำสั่งช่วยราชการสำเร็จ");
-    })
-    .catch((e) => {
-      messageError($q, e);
-    })
-    .finally(async () => {
-      props.getData?.();
-      hideLoader();
-    });
-};
+}

-const emit = defineEmits(["update:filterKeyword2", "update:selected"]);
-const updateInput = (value: any) => {
+/**
+ * อัปเดทคค้นหา
+ * @param value ตำค้นหา
+ */
+function updateInput(value: any) {
  emit("update:filterKeyword2", value);
-};
-//รีเซ็ตค่าในช่องค้นหา
-const Reset = () => {
+}
+
+/**
+ * รีเซ็ตค่าในช่องค้นหา
+ */
+function Reset() {
  emit("update:filterKeyword2", "");
-};
-watchEffect(() => {
-  if (props.Modal === true) {
-    selected.value = [];
+}
+
+watch(
+  () => props.Modal,
+  () => {
+    if (props.Modal === true) {
+      selected.value = [];
+    }
  }
-});
+);
 </script>
 <template>
  <q-dialog v-model="props.Modal">
--- a/src/modules/05_placement/components/helpgovernment/governmentDetail.vue
+++ b/src/modules/05_placement/components/helpgovernment/governmentDetail.vue
@ -47,8 +47,10 @@ const dateEnd = ref<Date | null>(null); // ถึงวันที่
 const reason = ref<string>(""); //หมายเหตุ
 const status = ref<string>("");

-/** fetch ข้อมูลรายละเอียด*/
-const getData = () => {
+/**
+ * fetch ข้อมูลรายละเอียด
+ */
+function getData() {
  showLoader();
  http
    .get(config.API.officerDetail(dataId))
@ -71,10 +73,12 @@ const getData = () => {
    .finally(() => {
      hideLoader();
    });
-};
+}

-/** บันทึกข้อมูล*/
-const onSubmit = () => {
+/**
+ * ยืนยันการบันทึกข้อมูล
+ */
+function onSubmit() {
  dialogConfirm(
    $q,
    () => {
@ -84,37 +88,39 @@ const onSubmit = () => {
        dateStart: dateStart.value,
        dateEnd: dateEnd.value,
        reason: reason.value,
-        // positionTypeOld: positionTypeOld.value,
-        // positionLevelOld: positionLevelOld.value,
-        // positionNumberOld: posNo.value,
-        // amountOld: salary.value,
      };
      showLoader();
      http
        .put(config.API.officerMainEdit(dataId), body)
-        .then(() => {
-          success($q, "แก้ไขข้อมูลเพื่อลงบัญชีแนบท้ายสำเร็จ");
+        .then(async () => {
+          await getData();
+          await success($q, "แก้ไขข้อมูลเพื่อลงบัญชีแนบท้ายสำเร็จ");
          edit.value = false;
        })
        .catch((e) => {
          messageError($q, e);
        })
        .finally(() => {
-          getData();
          hideLoader();
        });
    },
    "ต้องการแก้ไขข้อมูลหรือไม่?",
    "แก้ไขข้อมูลเพื่อลงบัญชีแนบท้าย"
  );
-};
+}

-const cancelBtn = () => {
+/**
+ * ยกเลิกการแก้ไขข้อมูลเพื่อลงบัญชีแนบท้าย
+ */
+function cancelBtn() {
  edit.value = !edit;
  myForm.value?.resetValidation();
  getData();
-};
+}

+/**
+ * class Input
+ */
 const getClass = (val: boolean) => {
  return {
    "full-width inputgreen cursor-pointer": val,
@ -139,7 +145,7 @@ onMounted(() => {
      class="q-mr-sm"
      @click="router.push(`/placement/help-government`)"
    />
-    รายละเอียดการช่วยราชการ {{ fullname }}
+    รายละเอียดการช่วยราชการ{{ fullname }}
  </div>

  <CardProfile :data="dataProfile as DataProfile" />
--- a/src/modules/05_placement/components/helpgovernment/mainHelp.vue
+++ b/src/modules/05_placement/components/helpgovernment/mainHelp.vue
@ -3,27 +3,31 @@ import { ref, onMounted } from "vue";
 import { checkPermission } from "@/utils/permissions";
 import { useQuasar } from "quasar";
 import { useRouter } from "vue-router";
-import { useCounterMixin } from "@/stores/mixin";
-import { useTransferDataStore } from "@/modules/05_placement/store";
+
+/**
+ * importType
+ */
 import type { QTableProps } from "quasar";
 import type { officerType } from "@/modules/05_placement/interface/response/officer";

+/**
+ * importComponents
+ */
 import Dialogbody from "@/modules/05_placement/components/helpgovernment/Dialogbody.vue";
 import http from "@/plugins/http";
 import config from "@/app.config";

+/**
+ * importStore
+ */
+import { useTransferDataStore } from "@/modules/05_placement/store";
+import { useCounterMixin } from "@/stores/mixin";
+
 const transferStore = useTransferDataStore();
 const { statusText } = transferStore;

 const $q = useQuasar();
-const filterKeyword = ref<string>("");
-const filterKeyword2 = ref<string>("");
-const filterRef = ref<any>(null);
 const router = useRouter();
-
-const rows = ref<officerType[]>([]);
-const rows2 = ref<officerType[]>([]);
-const modal = ref<boolean>(false);
 const mixin = useCounterMixin();
 const {
  date2Thai,
@ -36,6 +40,16 @@ const {
  findPosMasterNoOld,
 } = mixin;

+/**
+ * Table
+ */
+const filterKeyword = ref<string>("");
+const filterKeyword2 = ref<string>("");
+const filterRef = ref<any>(null);
+const rows = ref<officerType[]>([]);
+const rows2 = ref<officerType[]>([]);
+const modal = ref<boolean>(false);
+
 //หัวตาราง
 const columns = ref<QTableProps["columns"]>([
  {
@ -174,38 +188,12 @@ const visibleColumns = ref<string[]>([
  "status",
 ]);

-//รีเซ็ตข้อมูลในช่องฟิลเตอร์
-const resetFilter = () => {
-  filterKeyword.value = "";
-  filterKeyword2.value = "";
-  filterRef.value.focus();
-};
-
-const openDetail = (id: string) => {
-  router.push(`/placement/help-government/detail/${id}`);
-};
-const openModal = () => (modal.value = true);
-const closeModal = () => {
-  modal.value = false;
-  filterKeyword2.value = "";
-};
-const openModalOrder = () => {
-  openModal();
-  const row = rows.value.filter(
-    (item: officerType) =>
-      (item.status == "WAITTING" ||
-        item.status == "PENDING" ||
-        item.status == "APPROVE") &&
-      item.organizationPositionOld &&
-      item.organization &&
-      item.dateStart &&
-      item.dateEnd
-  );
-  rows2.value = row;
-};
-const getData = async () => {
+/**
+ * fetch รายการช่วยราชการ
+ */
+function getData() {
  showLoader();
-  await http
+  http
    .get(config.API.officerMain())
    .then((res: any) => {
      const data = res.data.result;
@ -217,9 +205,13 @@ const getData = async () => {
    .finally(() => {
      hideLoader();
    });
-};
+}

-const clickDelete = async (id: string) => {
+/**
+ * ยืนยันการลบรายการช่วยราชการ
+ * @param id
+ */
+function clickDelete(id: string) {
  dialogRemove($q, () => {
    showLoader();
    http
@ -235,9 +227,53 @@ const clickDelete = async (id: string) => {
        hideLoader();
      });
  });
-};
-onMounted(async () => {
-  await getData();
+}
+
+/**
+ * rediarect หน้ารายละเอียดข้อมูล
+ * @param id รายการช่วยราชการ
+ */
+function openDetail(id: string) {
+  router.push(`/placement/help-government/detail/${id}`);
+}
+
+/**
+ * เปิด popup ส่งไปออกคำสั่งช่วยราชการ
+ */
+function openModalOrder() {
+  const row = rows.value.filter(
+    (item: officerType) =>
+      (item.status == "WAITTING" ||
+        item.status == "PENDING" ||
+        item.status == "APPROVE") &&
+      item.organizationPositionOld &&
+      item.organization &&
+      item.dateStart &&
+      item.dateEnd
+  );
+  rows2.value = row;
+  modal.value = true;
+}
+
+/**
+ * ปิด popup ส่งไปออกคำสั่งช่วยราชการ
+ */
+function closeModal() {
+  modal.value = false;
+  filterKeyword2.value = "";
+}
+
+/**
+ * รีเซ็ตข้อมูลในช่องฟิลเตอร์
+ */
+function resetFilter() {
+  filterKeyword.value = "";
+  filterKeyword2.value = "";
+  filterRef.value.focus();
+}
+
+onMounted(() => {
+  getData();
 });
 </script>