Refactoring code module 05_leave

src/modules/05_leave/views/EditPage.vue

@@ -1,7 +1,15 @@
 <script setup lang="ts">
 import { ref, onMounted, reactive, computed } from "vue";
+import { useQuasar } from "quasar";
+import { useRoute, useRouter } from "vue-router";
+
+import http from "@/plugins/http";
+import config from "@/app.config";
+import { useCounterMixin } from "@/stores/mixin";
+import { useLeaveStore } from "@/modules/05_leave/store";
+
+import type { FormData } from "@/modules/05_leave/interface/index/main";
 
-//import form
 import FormPart2 from "@/modules/05_leave/components/FormLeave/Form.vue";
 import SickForm from "@/modules/05_leave/components/FormLeave/01_SickForm.vue";
 import FormBirth from "@/modules/05_leave/components/FormLeave/03_Birth.vue";
@@ -16,23 +24,11 @@ import WorkInternationalForm from "@/modules/05_leave/components/FormLeave/11_Wo
 import FollowSpouseForm from "@/modules/05_leave/components/FormLeave/12_FollowSpouseForm.vue";
 import RehabilitationForm from "@/modules/05_leave/components/FormLeave/13_RehabilitationForm.vue";
 
-import { useCounterMixin } from "@/stores/mixin";
-import { useQuasar } from "quasar";
-import { useRoute, useRouter } from "vue-router";
-import http from "@/plugins/http";
-import config from "@/app.config";
-import { useLeaveStore } from "@/modules/05_leave/store";
-
+const $q = useQuasar();
 const route = useRoute();
 const router = useRouter();
-
-/**
- * ตัวแปรที่ใช้
- */
 const personalId = ref<string>(route.params.id as string);
-const leaveId = ref<string>("");
 const dataStore = useLeaveStore();
-const $q = useQuasar();
 const mixin = useCounterMixin();
 const {
   messageError,
@@ -41,21 +37,19 @@ const {
   dialogConfirm,
   success,
   date2Thai,
-  dateToISO,
   dialogRemove,
 } = mixin;
 
 const titleName = ref<string>("");
-/** Form รายละเอียดข้อมูล*/
-const formData = reactive<any>({
+const formData = reactive<FormData>({
   id: "", //Id การยื่นขอลา
   leaveTypeName: "", // Name ประเภทการลา
   leaveTypeId: "", //Id ประเภทการลา
   fullname: "", //คำนำหน้า ชื่อ นามสกุล คนขอลา
   dateSendLeave: null, // วันที่ยืนใบลา
   status: "", //สถานะการของลา
-  leaveDateStart: null, //วันเริ่มการลา
-  leaveDateEnd: null, //วันสิ้นสุดการลา
+  leaveStartDate: null, //วันเริ่มการลา
+  leaveEndDate: null, //วันสิ้นสุดการลา
   leaveCount: 0, //จำนวนวันลา
   leaveWrote: "", //เขียนที่
   leaveAddress: "", //สถานที่ติดต่อขณะลา
@@ -110,6 +104,29 @@ const formData = reactive<any>({
   leaveRange: "",
 });
 
+const model = computed(() => {
+  return (
+    dataStore.options.find((x) => x.id == formData.leaveTypeId)?.code ?? ""
+  );
+});
+const modelSpecific = computed(() => {
+  const code = dataStore.options.find(
+    (x) => x.id == formData.leaveTypeId
+  )?.code;
+
+  if (code == "LV-006" && formData.ordainDayLocationName != "") {
+    return "b1";
+  } else if (code == "LV-006" && formData.ordainDayLocationName == "") {
+    return "b2";
+  } else if (code == "LV-008" && formData.studyDayTrainingSubject == "") {
+    return "s1";
+  } else if (code == "LV-008" && formData.studyDayTrainingSubject != "") {
+    return "s2";
+  } else {
+    return "";
+  }
+});
+
 /**
  * function เรียกข้อมูลการลา
  * @param id การลา
@@ -120,9 +137,7 @@ async function fetchDataDetail(id: string) {
     .get(config.API.leaveUserId(id), {})
     .then(async (res) => {
       const data = await res.data.result;
-
       dataStore.typeId = data.leaveTypeId;
-
       titleName.value = data.fullName ?? "-";
       formData.id = data.id ?? "-";
       formData.leaveTypeName = data.leaveTypeName ?? "-";
@@ -193,9 +208,6 @@ async function fetchDataDetail(id: string) {
       formData.dear = data.dear ?? "-";
       formData.leaveLast = data.leaveLast ?? "-";
       formData.leaveRange = data.leaveRange;
-
-      // checkLeaveType(formData.leaveTypeId, formData.leaveTypeName)
-
       dataStore.fetchProfileOld(data);
     })
     .catch((err) => {
@@ -206,30 +218,6 @@ async function fetchDataDetail(id: string) {
     });
 }
 
-/**modal */
-const model = computed(() => {
-  return (
-    dataStore.options.find((x) => x.id == formData.leaveTypeId)?.code ?? ""
-  );
-});
-const modelSpecific = computed(() => {
-  const code = dataStore.options.find(
-    (x) => x.id == formData.leaveTypeId
-  )?.code;
-
-  if (code == "LV-006" && formData.ordainDayLocationName != "") {
-    return "b1";
-  } else if (code == "LV-006" && formData.ordainDayLocationName == "") {
-    return "b2";
-  } else if (code == "LV-008" && formData.studyDayTrainingSubject == "") {
-    return "s1";
-  } else if (code == "LV-008" && formData.studyDayTrainingSubject != "") {
-    return "s2";
-  } else {
-    return "";
-  }
-});
-
 /**
  * function บันทึกข้อมูล
  * @param formData  ข้อมูลใน formdata
@@ -259,9 +247,8 @@ function onSubmit(formData: FormData, isLeave: boolean = true) {
 
 /**
  * funciotn ยื่นใบลา
- * @param id id ของใบลา
  */
-function onConfirm(id: string) {
+function onConfirm() {
   dialogConfirm(
     $q,
     async () => {
@@ -277,7 +264,6 @@ function onConfirm(id: string) {
         })
         .finally(() => {
           hideLoader();
-          // fetchDataDetail(personalId.value);
         });
     },
     "ยืนยันการยื่นใบลา",
@@ -286,15 +272,15 @@ function onConfirm(id: string) {
 }
 
 //เเจ้งเตือนลบข้อมูล
-const clickDelete = (id: string, docId: string) => {
+function clickDelete(id: string, docId: string) {
   dialogRemove($q, () => onClickDelete(id, docId));
-};
+}
 
 /**
  * function ลบรายการ
  * @param id
  */
-const onClickDelete = async (id: string, docId: string) => {
+async function onClickDelete(id: string, docId: string) {
   await http
     .delete(config.API.leaveDocumentId(id, docId))
     .then(async (res) => {
@@ -307,7 +293,7 @@ const onClickDelete = async (id: string, docId: string) => {
       fetchDataDetail(personalId.value);
       hideLoader();
     });
-};
+}
 
 /**เมื่อเริ่มโหลดหน้า
  * เรียกใช้งาน fetchData เพื่อดึงข้อมูล
@@ -407,7 +393,7 @@ onMounted(() => {
                 <FormPart2
                   :model="model"
                   :data="formData"
-                  :leaveTypeId="formData.leaveTypeId"
+                  :leave-type-id="formData.leaveTypeId"
                 />
               </div>
             </div>