บรรจุ แต่งตั้ง ย้าย โอน => ปรับ code และ load

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>