Refactoring code module 05_placement

src/modules/05_placement/components/PersonalDetail/Information/Family.vue

@@ -1,16 +1,24 @@
 <script setup lang="ts">
 import { ref, onMounted } from "vue";
-import type { QForm } from "quasar";
-import { useCounterMixin } from "@/stores/mixin";
 import { useQuasar } from "quasar";
-import type { DataOption } from "@/modules/05_placement/components/PersonalDetail/profileType";
-import HeaderTop from "@/modules/05_placement/components/PersonalDetail/Information/top.vue";
+
+import { useRoute } from "vue-router";
+import { useCounterMixin } from "@/stores/mixin";
 import http from "@/plugins/http";
 import config from "@/app.config";
-import { useRoute } from "vue-router";
+
+import { FamilyDataDefualt } from "@/modules/05_placement/interface/index/Main";
+import type { QForm } from "quasar";
 import type { PropType } from "vue";
 import type { Family } from "@/modules/05_placement/interface/index/Main";
-import { FamilyDataDefualt } from "@/modules/05_placement/interface/index/Main";
+import type { DataOption } from "@/modules/05_placement/components/PersonalDetail/profileType";
+
+import HeaderTop from "@/modules/05_placement/components/PersonalDetail/Information/top.vue";
+
+const $q = useQuasar();
+const route = useRoute();
+const mixin = useCounterMixin();
+const { success, messageError, showLoader, hideLoader, dialogConfirm } = mixin;
 
 const props = defineProps({
   statusEdit: {
@@ -38,29 +46,25 @@ const props = defineProps({
 });
 const emit = defineEmits(["update:statusEdit"]);
 
-const route = useRoute();
-const $q = useQuasar();
-
-const mixin = useCounterMixin();
-const {
-  date2Thai,
-  success,
-  messageError,
-  showLoader,
-  hideLoader,
-  dialogConfirm,
-} = mixin;
-const edit = ref<boolean>(false);
-const onEdit = ref<boolean>(false);
-
 const myform = ref<QForm | null>(null);
-const familyData = ref<Family>(props.data);
+const edit = ref<boolean>(false); //การแก้ไขข้อมูล
+const onEdit = ref<boolean>(false); //การแก้ไขข้อมูล
+const familyData = ref<Family>(props.data); //ข้อมูลครอบครัว
 
+/**
+ * ฟังก์ชันแก้ไขข้อมูล
+ */
 function checkEdit() {
   onEdit.value = true;
 }
 
-function filterSelector(val: any, update: Function, refData: string) {
+/**
+ * ฟังก์ชันค้นหาข้อมูลในรายการตัวเลือก
+ * @param val คำค้นหา
+ * @param update ฟังก์ชัน
+ * @param refData ประเภทของตัวเลือก
+ */
+function filterSelector(val: string, update: Function, refData: string) {
   update(() => {
     props.Ops[`${refData}`] = props.OpsFilter[`${refData}`].filter(
       (v: DataOption) => v.name.indexOf(val) > -1
@@ -121,32 +125,30 @@ async function editData() {
       })
       .catch((e) => {
         messageError($q, e);
-        hideLoader();
       })
-      .finally(async () => {});
+      .finally(() => {
+        hideLoader();
+      });
   });
 }
 
-async function saveData() {
-  await myform.value?.validate().then(async (success: boolean) => {
-    if (success) {
-      await editData();
-    } else {
-    }
-  });
-}
-
-function selectRadio(e: boolean, i: any) {
+/**
+ * ฟังก์ชันเลือกคู่สมรส
+ * @param e มี, ไม่มีคู่สมรส
+ */
+function selectRadio(e: boolean) {
   onEdit.value = true;
   if (e) {
     familyData.value.marryPrefixId = "";
     familyData.value.marryFirstName = "";
     familyData.value.marryLastName = "";
-    // familyData.value.lastnameCOld = "";
     familyData.value.marryOccupation = "";
   }
 }
 
+/**
+ * ฟังก์ชันการแก้ไขข้อมูล
+ */
 async function changeBtn() {
   if (edit.value == true) {
     if (props.statusEdit === true) {
@@ -159,6 +161,10 @@ async function changeBtn() {
   }
 }
 
+/**
+ * ฟังก์ชันสำหรับคืนค่าชื่อคลาสตามค่าที่กำหนด
+ * @param val ค่าที่ใช้กำหนดคลาส
+ */
 function getClass(val: boolean) {
   return {
     "full-width inputgreen cursor-pointer": val,
@@ -166,6 +172,9 @@ function getClass(val: boolean) {
   };
 }
 
+/**
+ * ทำงานเมื่อมีการเรียกใช้ Components
+ */
 onMounted(async () => {
   emit("update:statusEdit", false);
 });