ปรับ โค้ด รายละเอียดงานที่ได้รับมอบหมาย(ยังเก็บไม่หมด)

src/modules/05_placement/components/probation/ProbationDetail.vue

@@ -8,7 +8,6 @@ import { useQuasar } from "quasar";
 import http from "@/plugins/http";
 import config from "@/app.config";
 
-
 const router = useRouter();
 const route = useRoute();
 const personalId = ref<string>(route.params.id as string);
@@ -26,7 +25,12 @@ const position_line = ref<string>("");
 const position_level = ref<string>("");
 const probation_status = ref<any>();
 const probation_statusold = ref<string>("");
-
+const pagination = ref({
+  sortBy: "desc",
+  descending: false,
+  page: 1,
+  rowsPerPage: 10,
+});
 const mixin = useCounterMixin();
 const {
   messageError,
@@ -36,6 +40,8 @@ const {
   date2Thai,
   dialogConfirm,
 } = mixin;
+
+/** ข้อมูลที่เเสดงในตาราง */
 const visibleColumns = ref<string[]>([
   "no",
   "date_start",
@@ -43,6 +49,8 @@ const visibleColumns = ref<string[]>([
   "mentors",
   "commander",
 ]);
+
+/** หัวตาราง */
 const columns = ref<QTableProps["columns"]>([
   {
     name: "no",
@@ -91,6 +99,7 @@ const columns = ref<QTableProps["columns"]>([
   },
 ]);
 
+/** option */
 const probation_statusOP = ref<any>([
   {
     id: 1,
@@ -99,12 +108,12 @@ const probation_statusOP = ref<any>([
   {
     id: 2,
     label: "พ้นการทดลองปฏิบัติหน้าที่ราชการ",
-    disable: true
+    disable: true,
   },
   {
     id: 3,
     label: "ไม่พ้นการทดลองปฏิบัติหน้าที่ราชการ",
-    disable: true
+    disable: true,
   },
   {
     id: 4,
@@ -121,17 +130,17 @@ const probation_statusOP = ref<any>([
   {
     id: 7,
     label: "ขยายระยะเวลาทดลองปฏิบัติหน้าที่ราชการ",
-    disable: true
+    disable: true,
   },
   {
     id: 8,
     label: "ดึงรายชื่อไปออกคำสั่งแล้ว",
-    disable: true
+    disable: true,
   },
 ]);
 
-
-const getAssignList = async () => {
+/** get ข้อมูล งานที่ได้รับมอบหมาย */
+async function getAssignList() {
   showLoader();
   await http
     .get(config.API.probationGetAssignList(personalId.value))
@@ -151,8 +160,10 @@ const getAssignList = async () => {
     .finally(() => {
       hideLoader();
     });
-};
-const getpersonalList = async () => {
+}
+
+/** รายละเอียด ตาม id */
+async function getpersonalList() {
   showLoader();
   await http
     .get(config.API.personal(personalId.value))
@@ -170,8 +181,10 @@ const getpersonalList = async () => {
     .finally(() => {
       hideLoader();
     });
-};
-const selectStatus = async () => {
+}
+
+/** เปลี่ยนสถานะ */
+async function selectStatus() {
   dialogConfirm(
     $q,
     async () => {
@@ -198,29 +211,28 @@ const selectStatus = async () => {
       probation_status.value = probation_statusold.value;
     }
   );
-};
-// เปิดหน้ารายละเอียด
-const clickSelect = (id: string) => {
-  router.push(`${route.fullPath}/${id}`);
-};
+}
 
-// รีเซ็ตค่าในช่อง input 
-const resetFilter = () => {
+/**
+ * เปิดหน้ารายละเอียด
+ * @param id personal id
+ */
+function clickSelect(id: string) {
+  router.push(`${route.fullPath}/${id}`);
+}
+
+/** รีเซ็ตค่าในช่อง input */
+function resetFilter() {
   filterKeyword.value = "";
   filterRef.value.focus();
-};
+}
 
-const pagination = ref({
-  sortBy: "desc",
-  descending: false,
-  page: 1,
-  rowsPerPage: 10,
-});
-
-const paginationLabel = (start: string, end: string, total: string) => {
+function paginationLabel(start: string, end: string, total: string){
   if (paging.value == true) return " " + start + "-" + end + " ใน " + total;
   else return start + "-" + end + " ใน " + total;
 };
+
+/** get ค่า เมื่อโหลดหน้า */
 onMounted(async () => {
   await getpersonalList();
   await getAssignList();
@@ -262,30 +274,39 @@ onMounted(async () => {
           <q-img :src="avatarprofile" v-if="avatarprofile !== null" />
           <q-img src="@/assets/avatar_user.jpg" v-else />
         </div>
+
         <div class="col-xs-6 col-sm-3 row items-center">
           <div class="col-12 q-pl-md">
             <div class="col-12 text-top">ตำแหน่งในสายงาน</div>
             <div class="col-12 text-detail">{{ position_line }}</div>
           </div>
         </div>
+
         <div class="col-xs-6 col-sm-2 row items-center">
           <div class="col-12">
             <div class="col-12 text-top">ระดับ</div>
             <div class="col-12 text-detail">{{ position_level }}</div>
           </div>
         </div>
+
         <div class="col-xs-6 col-sm-3 row items-center">
           <div class="col-12">
             <div class="col-12 text-top">สังกัด</div>
             <div class="col-12 text-detail">{{ organization }}</div>
           </div>
         </div>
+
         <div class="col-xs-6 col-sm-3 row items-center">
           <div class="col-12">
             <div class="col-12 text-top">สถานะการทดลองปฏิบัติหน้าที่ราชการ</div>
             <div class="col-12 text-detail">
               <q-select
-                :disable="probation_status==2 || probation_status==3 || probation_status==7 || probation_status==8"
+                :disable="
+                  probation_status == 2 ||
+                  probation_status == 3 ||
+                  probation_status == 7 ||
+                  probation_status == 8
+                "
                 dense
                 borderless
                 v-model="probation_status"
@@ -316,6 +337,7 @@ onMounted(async () => {
           >
             <q-tooltip>เพิ่มงานที่ได้รับมอบหมาย</q-tooltip>
           </q-btn>
+          
         </div>
         <q-space />
         <q-input
@@ -394,8 +416,7 @@ onMounted(async () => {
                   {{ col.value }}
                 </div>
               </q-td>
-              <q-td auto-width>
-							</q-td>
+              <q-td auto-width> </q-td>
             </q-tr>
           </template>
           <template v-slot:pagination="scope">