Refactoring code module 05_placement

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

@@ -1,6 +1,6 @@
 <script setup lang="ts">
-import { onMounted, computed, ref, watch } from "vue";
-import { useQuasar, QForm } from "quasar";
+import { onMounted, ref } from "vue";
+import { useQuasar } from "quasar";
 import { useCounterMixin } from "@/stores/mixin";
 import { useRoute } from "vue-router";
 import axios from "axios";
@@ -15,6 +15,18 @@ interface ArrayFileList {
   fileName: string;
 }
 
+const $q = useQuasar(); // show dialog
+const mixin = useCounterMixin();
+const route = useRoute();
+const {
+  success,
+  messageError,
+  showLoader,
+  dialogConfirm,
+  hideLoader,
+  dialogRemove,
+} = mixin;
+
 const props = defineProps({
   statusEdit: {
     type: Boolean,
@@ -41,72 +53,13 @@ const emit = defineEmits(["update:statusEdit"]);
 const documentFile = ref<any>(null);
 const fileList = ref<ArrayFileList[]>([]);
 
-const $q = useQuasar(); // show dialog
-const mixin = useCounterMixin();
-const route = useRoute();
-const {
-  success,
-  messageError,
-  showLoader,
-  dialogConfirm,
-  hideLoader,
-  dialogRemove,
-} = mixin;
 const profileId = ref<string>(
   route.params.personalId ? route.params.personalId.toString() : ""
 );
-const edit = ref<boolean>(false);
-const uploader = ref<any>();
-const files = ref<any>([]);
-const file = ref<any>([]);
+const edit = ref<boolean>(false); //การแก้ไขข้อมูล
+const uploader = ref<any>(); //
+const file = ref<any>([]); //ไฟล์์
 const name = ref<string>("");
-const dataMain = ref<any>([]);
-
-// const getData = async () => {
-//   if (props.datainformation) {
-//     dataMain.value = props.datainformation;
-//     files.value = dataMain.value.docs;
-//   }
-
-// โค้ดเก่ายังไม่ได้ใช้
-// if (profileId.value) {
-//   showLoader();
-//   await http
-//     .get(config.API.profilePaperId(profileId.value))
-//     .then((res) => {
-//       const data = res.data.result;
-//       files.value = data;
-//     })
-//     .catch((e) => {
-//       messageError($q, e);
-//     })
-//     .finally(() => {
-//       hideLoader();
-//     });
-// }
-// };
-
-const deleteData = async (id: string) => {
-  dialogConfirm(
-    $q,
-    async () => {
-      showLoader();
-      await http
-        .delete(config.API.documentDelid(profileId.value, id))
-        .then(() => {
-          success($q, "ลบไฟล์เอกสารสำเร็จ");
-        })
-        .catch((e) => {
-          messageError($q, e);
-        })
-        .finally(async () => {
-          await props.fetch();
-        });
-    },
-    "ยืนยันการลบเอกสารหลักฐาน",
-    "ต้องการยืนยันการลบเอกสารหลักฐานนี้หรือไม่ ?"
-  );
-};
 
 const uploadData = async () => {
   if (profileId.value) {
@@ -117,7 +70,6 @@ const uploadData = async () => {
       });
       const formData = new FormData();
       formData.append("file", newFile);
-      // formData.append("moss", "newFile");
       showLoader();
       await http
         .put(config.API.documentByid(profileId.value), formData)
@@ -134,26 +86,10 @@ const uploadData = async () => {
           edit.value = false;
           emit("update:statusEdit", false);
         });
-      // } else {
-      //   // modalError(
-      //   //   $q,
-      //   //   "ไม่สามารถอัปโหลดไฟล์ได้",
-      //   //   "กรุณาเลือกไฟล์ที่ต้องการอัปโหลด"
-      //   // );
-      //   getData();
     }
   }
 };
 
-const fileAdd = async (val: any) => {
-  name.value = val[0].name;
-  file.value = val;
-};
-
-const downloadData = async (path: string) => {
-  window.open(path);
-};
-
 const changeBtn = async () => {
   name.value = "";
   if (edit.value == true) {
@@ -171,7 +107,6 @@ const changeBtn = async () => {
 /** ฟังชั่นใหม่ */
 function clickUpload(file: any) {
   const fileName = { fileName: file.name };
-
   dialogConfirm(
     $q,
     async () => {
@@ -295,6 +230,9 @@ function deleteFile(fileName: string) {
   });
 }
 
+/**
+ * ฟังก์ชันดึงข้อมูลรายการไฟล์
+ */
 async function getData() {
   showLoader();
   await http
@@ -312,6 +250,9 @@ async function getData() {
     });
 }
 
+/**
+ * ทำงานเมื่อมีการเรียกใช้ Components
+ */
 onMounted(async () => {
   await getData();
 });