Refactoring code 09_leave

src/modules/09_leave/components/2_Leave/Calendar.vue

@@ -2,28 +2,29 @@
 import { ref, watch, onMounted } from "vue";
 import { useRouter } from "vue-router";
 import { useQuasar } from "quasar";
-import type { CalendarOptions } from "@fullcalendar/core";
+import moment from "moment";
+
 import FullCalendar from "@fullcalendar/vue3";
 import dayGridPlugin from "@fullcalendar/daygrid";
 import timeGridPlugin from "@fullcalendar/timegrid";
 import interactionPlugin from "@fullcalendar/interaction";
 import allLocales from "@fullcalendar/core/locales-all";
 import listPlugin from "@fullcalendar/list";
+
 import http from "@/plugins/http";
 import config from "@/app.config";
-import moment from "moment";
+import { useCounterMixin } from "@/stores/mixin";
+import { useLeavelistDataStore } from "@/modules/09_leave/stores/LeaveStore";
 import { checkPermission } from "@/utils/permissions";
+
 /** importType*/
+import type { CalendarOptions } from "@fullcalendar/core";
 import type {
   DataDateMonthObject,
   ResCalendar,
 } from "@/modules/09_leave/interface/response/leave";
 import { tokenParsed } from "@/plugins/auth";
 
-/** importStore*/
-import { useCounterMixin } from "@/stores/mixin";
-import { useLeavelistDataStore } from "@/modules/09_leave/stores/LeaveStore";
-
 /** use*/
 const leaveStore = useLeavelistDataStore();
 const mixin = useCounterMixin(); //เรียกฟังก์ชันกลาง
@@ -51,7 +52,7 @@ const calendarOptions = ref<CalendarOptions>({
   },
   headerToolbar: false,
   initialView: "dayGridMonth",
-  initialEvents: [], // alternatively, use the `events` setting to fetch from a feed
+  initialEvents: [],
   selectable: true,
   dayMaxEvents: true,
   weekends: true,
@@ -177,6 +178,20 @@ function convertKeycloakId(id: any) {
 const filterLists = ref<any[]>([]);
 const filterVal = ref<any>([]);
 
+function redirectToDetail(id: string) {
+  router.push(`leave/detail/${id}`);
+}
+
+/** function เปลี่ยน calendar*/
+async function changCalendar() {
+  await fetchDataCalendar("chang");
+}
+
+function monthYearThai(val: DataDateMonthObject) {
+  if (val == null) return "";
+  else return monthYear2Thai(val.month, val.year);
+}
+
 watch(
   () => filterVal.value,
   async () => {
@@ -199,10 +214,6 @@ watch(
   }
 );
 
-function redirectToDetail(id: string) {
-  router.push(`leave/detail/${id}`);
-}
-
 /**
  * เรียกฟังก์ชันทั้งหมดตอนเรียกใช้ไฟล์นี้
  */
@@ -211,23 +222,12 @@ onMounted(async () => {
   keycloakId.value = user?.sub;
   await fetchDataCalendar("onMounted");
 });
-
-/** function เปลี่ยน calendar*/
-async function changCalendar() {
-  await fetchDataCalendar("chang");
-}
-
-const monthYearThai = (val: DataDateMonthObject) => {
-  if (val == null) return "";
-  else return monthYear2Thai(val.month, val.year);
-};
 </script>
 <template>
   <div class="q-mt-sm">
     <div class="row q-gutter-sm">
       <div class="col-3">
         <q-list bordered class="rounded-borders">
-          <!-- <q-item-label header>User</q-item-label> -->
           <q-item
             v-for="(item, i) in filterLists"
             :key="i"
@@ -377,13 +377,6 @@ const monthYearThai = (val: DataDateMonthObject) => {
   display: flex;
   justify-content: center;
   align-items: center;
-  /* border: 2px solid #17a259; */
-  /* border-radius: 50%;
-  height: 25px;
-  width: 25px;
-  font-weight: bold;
-  color: white !important;
-  background: #17a259; */
 }
 
 .fc-day-today .fc-daygrid-day-frame {