Refactoring code module 06_retirement

src/modules/06_retirement/components/resign/ResignOrder.vue

@@ -1,12 +1,15 @@
 <script setup lang="ts">
 import { onMounted, reactive, ref, useAttrs, computed } from "vue";
 import type { QTableProps } from "quasar";
+
+import { useQuasar } from "quasar";
+import router from "@/router";
+import { useCounterMixin } from "@/stores/mixin";
+
 import type { FormOrderPlacementMainData } from "@/modules/05_placement/interface/request/Main";
 import type { DataOption } from "@/modules/05_placement/interface/index/Main";
-import { useCounterMixin } from "@/stores/mixin";
+
 import { useOrderPlacementDataStore } from "@/modules/05_placement/store";
-import router from "@/router";
-import { useQuasar } from "quasar";
 
 /** Use */
 const $q = useQuasar(); //ใช้ noti quasar
@@ -264,34 +267,25 @@ const rows = ref<FormOrderPlacementMainData[]>([
 let OriginalData = ref<FormOrderPlacementMainData[]>([]);
 let UpdataData = ref<FormOrderPlacementMainData[]>([]);
 
-/**Hook */
-onMounted(async () => {
-  await OriginalDataFetch();
-  fiscalYearFilter();
-  searchFilterTable();
-  OrderStatusFilter();
-  OrderTypeFilter();
-});
-
 /**
  * ดึงค่าข้อมูลจาก store
  */
-const OriginalDataFetch = async () => {
+async function OriginalDataFetch() {
   await DataStore.DataMainOrder(rows.value);
   OriginalData.value = await DataStore.DataMainOrigOrder;
   UpdataData.value = OriginalData.value;
-};
+}
 
 // ดูรายการหน้าต่อไป
-const redirectToPage = (id?: number) => {
+function redirectToPage(id?: number) {
   router.push(`/placement/order/detail`);
-};
+}
 
 /**
  * function delete
  * @param id id delete
  */
-const clickDelete = (id: string) => {
+function clickDelete(id: string) {
   $q.dialog({
     title: "ยืนยันการลบข้อมูล",
     message: "ต้องการลบข้อมูลนี้ใช่หรือไม่?",
@@ -304,18 +298,18 @@ const clickDelete = (id: string) => {
     .onOk(async () => {})
     .onCancel(() => {})
     .onDismiss(() => {});
-};
+}
 
 //route ไปหน้า OrderplacementDetail
-const clickAdd = () => {
+function clickAdd() {
   router.push({ name: "OrderplacementDetail" });
-};
+}
 
 // เลือกปีงบประมาณ
 const fiscalyear = ref<number | null>(0);
 const fiscalyearOP = reactive<DataOption[]>([{ id: 0, name: "ทั้งหมด" }]);
 const addedfiscalYearValues: number[] = [];
-const fiscalYearFilter = async () => {
+async function fiscalYearFilter() {
   for (let data of OriginalData.value) {
     const year = data.fiscalYear;
 
@@ -328,7 +322,7 @@ const fiscalYearFilter = async () => {
       addedfiscalYearValues.push(year);
     }
   }
-};
+}
 
 /**
  * เลือกประเภทคำสั่ง
@@ -336,7 +330,7 @@ const fiscalYearFilter = async () => {
 const OrderType = ref<string>("");
 const OrderTypeOption = reactive<DataOption[]>([{ id: 0, name: "ทั้งหมด" }]);
 const addedOrderTypeValues: string[] = [];
-const OrderTypeFilter = async () => {
+async function OrderTypeFilter() {
   for (let data of OriginalData.value) {
     const OrderTypeValue = data.OrderType;
     if (!addedOrderTypeValues.includes(OrderTypeValue)) {
@@ -347,7 +341,7 @@ const OrderTypeFilter = async () => {
       addedOrderTypeValues.push(OrderTypeValue);
     }
   }
-};
+}
 
 /**
  * เลือกStatus คำสั่ง
@@ -355,7 +349,7 @@ const OrderTypeFilter = async () => {
 const OrderStatus = ref<string>("");
 const OrderStatusOption = reactive<DataOption[]>([{ id: 1, name: "ทั้งหมด" }]);
 const addedOrderStatusValues: string[] = [];
-const OrderStatusFilter = async () => {
+async function OrderStatusFilter() {
   for (let data of OriginalData.value) {
     const OrderStatusValue = data.OrderStatus;
 
@@ -374,31 +368,42 @@ const OrderStatusFilter = async () => {
       addedOrderStatusValues.push(OrderStatusValue);
     }
   }
-};
+}
 
 // ค้นหาในตาราง
 const filterKeyword = ref<string>("");
 const filterRef = ref<any>(null);
-const resetFilter = () => {
+
+/** ล้างค่าในฟิลเตอร์ */
+function resetFilter() {
   filterKeyword.value = "";
   filterRef.value.focus();
-};
+}
 const attrs = ref<any>(useAttrs());
-const searchFilterTable = async () => {
+async function searchFilterTable() {
   await DataStore.DataUpdateOrder(
     OrderType.value,
     OrderStatus.value,
     fiscalyear.value
   );
   UpdataData.value = DataStore.DataMainUpdateOrder;
-};
+}
 
 /**Setting pagination */
 const paging = ref<boolean>(true);
-const paginationLabel = (start: string, end: string, total: string) => {
+function paginationLabel(start: string, end: string, total: string) {
   if (paging.value == true) return " " + start + "-" + end + " ใน " + total;
   else return start + "-" + end + " ใน " + total;
-};
+}
+
+/**Hook */
+onMounted(async () => {
+  await OriginalDataFetch();
+  fiscalYearFilter();
+  searchFilterTable();
+  OrderStatusFilter();
+  OrderTypeFilter();
+});
 </script>
 <template>
   <div class="toptitle text-dark col-12 row items-center">คำสั่งลาออก</div>