Refactoring code module 04_registryPerson

src/modules/04_registryPerson/views/detailView.vue

@@ -1,15 +1,19 @@
 <script setup lang="ts">
 import { ref, onMounted } from "vue";
+import { useQuasar } from "quasar";
+
+import { useRoute, useRouter } from "vue-router";
 import {
   checkPermission,
   checkPermissionCreate,
   checkPermissionList,
 } from "@/utils/permissions";
-import { useRoute, useRouter } from "vue-router";
-import { useQuasar } from "quasar";
+import { useCounterMixin } from "@/stores/mixin";
 import http from "@/plugins/http";
 import config from "@/app.config";
 import axios from "axios";
+import avatar from "@/assets/avatar_user.jpg";
+
 /**
  * importType
  */
@@ -22,16 +26,10 @@ import type { ResponseObject } from "@/modules/04_registryPerson/interface/respo
 /**
  * importComponents
  */
+import CardNotPermission from "@/components/CardNotPermission.vue";
 import DialogHeader from "@/components/DialogHeader.vue";
 import TabMain from "@/modules/04_registryPerson/components/detail/TabMain.vue";
 
-/**
- * importStore
- */
-import { useCounterMixin } from "@/stores/mixin";
-import avatar from "@/assets/avatar_user.jpg";
-import CardNotPermission from "@/components/CardNotPermission.vue";
-
 /**
  * use
  */
@@ -51,23 +49,22 @@ const {
   pathRegistryEmp,
 } = useCounterMixin();
 
-const isPermission = ref<boolean | null>(null);
-const notPermissionMsg = ref<string>("");
+const isPermission = ref<boolean | null>(null); //สิทธิการเช้าถึงข้อมูล
+const notPermissionMsg = ref<string>(""); //ข้อตวามไม่มีสิทธิ
+const profileId = ref<string>(route.params.id.toString()); //id profile
+const empType = ref<string>(pathRegistryEmp(route.name?.toString() ?? "")); //ประเภทข้าราชการ
 
 /** ถึงเเก่กรรม */
-const dialogPassaway = ref<boolean>(false);
-const placeDeathCertificate = ref("");
-const deathCertificateNo = ref("");
-const dateDeath = ref<Date>(new Date());
-const filePassaway = ref<any>(null);
-const reasonDeath = ref("");
+const dialogPassaway = ref<boolean>(false); //แสดงฟอร์มถึงเเก่กรรม
+const filePassaway = ref<any>(null); //แนบใบมรณบัตร
+const deathCertificateNo = ref(""); //เลขที่ใบมรณบัตร
+const dateDeath = ref<Date>(new Date()); //วันที่เสียชีวิต
+const placeDeathCertificate = ref(""); //สถานที่ออกใบมรณบัตร
+const reasonDeath = ref(""); //เหตุผลการเสียชีวิต
 
-const dialogImage = ref<boolean>(false);
-
-const profileId = ref<string>(route.params.id.toString());
-const empType = ref<string>(pathRegistryEmp(route.name?.toString() ?? ""));
-
-const formDetail = ref<ResponseObject>();
+const dialogImage = ref<boolean>(false); //แสดงเลือกรูปภาพ
+const formDetail = ref<ResponseObject>(); //ข้อมูลส่วนตัว
+//รายการเมนูออกคำสั่งข้าราชการ
 const itemsMenu = ref<DataOptionSys[]>([
   {
     id: "1",
@@ -100,7 +97,7 @@ const itemsMenu = ref<DataOptionSys[]>([
     system: "SYS_PLACEMENT_OTHER",
   },
 ]);
-
+//รายการเมนูออกคำสั่งลูกจ้าง
 const itemsMenuEmployee = ref<DataOptionSys[]>([
   {
     id: "1",
@@ -114,15 +111,14 @@ const itemsMenuEmployee = ref<DataOptionSys[]>([
   },
 ]);
 
-const uploadUrl = ref<string>("");
-const fileName = ref<string>("");
-const profilePicture = ref<string>("");
-const profileFile = ref();
+const uploadUrl = ref<string>(""); //URL อัปโหลดรูป
+const fileName = ref<string>(""); //ชื่อไฟล์รูป
+const profilePicture = ref<string>(""); //รูป
+const profileFile = ref(); //ไฟล์
 const input = document.createElement("input");
 const activeImage = ref<any | null>(null);
 const images = ref<any[]>([]);
 const imagesAlldata = ref<any[]>([]);
-
 input.type = "file";
 input.accept = ".jpg,.png,.tif,.pic";
 
@@ -140,6 +136,9 @@ function imageActive(n: any) {
   activeImage.value = n;
 }
 
+/**
+ * ฟังก์ชันอัปโหลด
+ */
 function uploadImg() {
   http
     .post(config.API.orgProfileAvatarbyType(empType.value), {
@@ -156,6 +155,10 @@ function uploadImg() {
     .finally(() => {});
 }
 
+/**
+ * ฟังก์ชันสร้าง path อัปโหลไฟล์
+ * @param path
+ */
 function uploadProfile(path: string) {
   http
     .post(config.API.fileByPath(path), {
@@ -179,6 +182,11 @@ function uploadProfile(path: string) {
     });
 }
 
+/**
+ * ฟังก์ชันอัปโหลด
+ * @param uploadUrl  path อัปโหลไฟล์
+ * @param file ไฟล์
+ */
 function uploadFileURL(uploadUrl: string, file: any) {
   showLoader();
   axios
@@ -199,8 +207,11 @@ function uploadFileURL(uploadUrl: string, file: any) {
     });
 }
 
+/**
+ * ฟังก์ชันดึงข้อมูลรูปโปรไฟล์
+ * @param id โปรไฟล์
+ */
 function fetchProfile(id: string) {
-  // showLoader();
   http
     .get(config.API.fileByFile("ทะเบียนประวัติ", "โปรไฟล์", id, fileName.value))
     .then(async (res) => {
@@ -209,9 +220,6 @@ function fetchProfile(id: string) {
     .catch(() => {
       profilePicture.value = avatar;
     });
-  // .finally(() => {
-  //   hideLoader();
-  // });
 }
 
 const reasonStatus = ref<boolean>(false);
@@ -251,6 +259,9 @@ const reasonOptions = ref<DataOption[]>([
   },
 ]);
 
+/**
+ * ฟังก์ชันดึงข้อมูลส่วนต้ว
+ */
 async function fetchDataPersonal() {
   showLoader();
   await http
@@ -298,6 +309,9 @@ async function fetchDataPersonal() {
     });
 }
 
+/**
+ * ฟังก์ชันดาว์นโหลดไฟล์ "ก.พ.7/ก.ก.1 หรื่อ ประวัติแบบย่อ
+ */
 function onClickDownloadKp7(type: string) {
   showLoader();
   const url =
@@ -333,7 +347,7 @@ function onClickDownloadKp7(type: string) {
 }
 
 /**
- *  ช่วยราชการ
+ *  ฟังก์ชันออกคำสั่งช่วยราชการ
  */
 function helpPost() {
   const formData = new FormData();
@@ -356,7 +370,7 @@ function helpPost() {
 }
 
 /**
- * ส่งตัวกลับ
+ * ฟังก์ชันออกคำสั่งส่งตัวกลับ
  */
 function repatriationPost() {
   const formData = new FormData();
@@ -379,7 +393,7 @@ function repatriationPost() {
 }
 
 /**
- * แต่งตังเลื่อน
+ * ฟังก์ชันออกคำสั่งแต่งตังเลื่อน
  */
 function appointPost() {
   const formData = new FormData();
@@ -402,14 +416,14 @@ function appointPost() {
 }
 
 /**
- * ถึงเเก่กรรม
+ * ฟังก์ชันออกคำสั่งถึงเเก่กรรม
  */
 function clickPassaway() {
   dialogPassaway.value = true;
 }
 
 /**
- * ให้ออกจากราชการ
+ * ฟังก์ชันออกคำสั่งให้ออกจากราชการ
  */
 function outPost() {
   const formData = new FormData();
@@ -432,7 +446,7 @@ function outPost() {
 }
 
 /**
- * อื่นๆ
+ * ฟังก์ชันออกคำสั่งอื่นๆ
  */
 function otherPost() {
   const formData = new FormData();
@@ -454,6 +468,9 @@ function otherPost() {
   });
 }
 
+/**
+ * ฟังก์ชันออกคำสั่งปรับระดับชั้นงาน - ย้าย
+ */
 function appointEmployeePost() {
   const formData = new FormData();
   formData.append("id", profileId.value);
@@ -474,12 +491,8 @@ function appointEmployeePost() {
   });
 }
 
-function closePassaway() {
-  dialogPassaway.value = false;
-}
-
 /**
- * function ยืนยันบันทึกข้อมูลถึงแก่กรรม
+ * ฟังก์ชันยืนยันบันทึกข้อมูลถึงแก่กรรม
  */
 function clickSaveDeceased() {
   dialogConfirm($q, async () => {
@@ -507,7 +520,14 @@ function clickSaveDeceased() {
 }
 
 /**
- * function เปืด popup เลือกรูปภาพ
+ * ฟังก์ชันปืด popup ถึงแก่กรรม
+ */
+function closePassaway() {
+  dialogPassaway.value = false;
+}
+
+/**
+ * ฟังก์ชันเปืด popup เลือกรูปภาพ
  */
 function openDialogImg() {
   dialogImage.value = true;
@@ -515,7 +535,7 @@ function openDialogImg() {
 }
 
 /**
- * function เรียกข้อมูลรูป
+ * ฟังก์ชันเรียกข้อมูลรูป
  */
 function getImage() {
   showLoader();
@@ -538,7 +558,7 @@ function getImage() {
 }
 
 /**
- * function เรียกข้อมูลรูป
+ * ฟังก์ชันเรียกข้อมูลรูป
  * @param dataList
  */
 function getImg(dataList: any) {
@@ -559,7 +579,7 @@ function getImg(dataList: any) {
 }
 
 /**
- * funciton ปิด Popup เลือกรูปภาพ
+ * ฟังก์ชันปิด Popup เลือกรูปภาพ
  */
 function closeImage() {
   dialogImage.value = false;
@@ -568,7 +588,7 @@ function closeImage() {
 }
 
 /**
- * funciotn ยืนยันการลบรูป
+ * ฟังก์ชันยืนยันการลบรูป
  * @param id  รูปภาพ
  */
 function deletePhoto(id: string) {
@@ -595,7 +615,7 @@ function deletePhoto(id: string) {
 }
 
 /**
- * function ยืนยันการเลือกรูป
+ * ฟังก์ชันยืนยันการเลือกรูป
  */
 function selectAvatarHistory() {
   if (activeImage.value == null) {