new loader

src/modules/03_recruiting/views/01_compete/Detail.vue

@@ -134,7 +134,7 @@ const router = useRouter();
 const route = useRoute();
 const { loaderPage } = dataStore;
 const mixin = useCounterMixin();
-const { messageError } = mixin;
+const { messageError, showLoader, hideLoader } = mixin;
 const year = ref<string>("");
 const round = ref<string>("");
 const name = ref<string>("");
@@ -337,7 +337,7 @@ const pagesNumber = computed(() => {
 });
 
 onMounted(async () => {
-  loaderPage(false);
+  hideLoader();
   await fetchData();
 });
 
@@ -346,7 +346,7 @@ const clickDetail = (examID: string) => {
 };
 
 const downloadExam = async () => {
-  loaderPage(true);
+  showLoader();
   await http
     .get(config.API.exportExam(importId.value), {
       responseType: "blob",
@@ -362,12 +362,12 @@ const downloadExam = async () => {
       messageError($q, e);
     })
     .finally(() => {
-      loaderPage(false);
+      hideLoader();
     });
 };
 
 const downloadPassExam = async () => {
-  loaderPage(true);
+  showLoader();
   await http
     .get(config.API.exportPassExam(importId.value), {
       responseType: "blob",
@@ -383,12 +383,12 @@ const downloadPassExam = async () => {
       messageError($q, e);
     })
     .finally(() => {
-      loaderPage(false);
+      hideLoader();
     });
 };
 
 const downloadPassResultExam = async () => {
-  loaderPage(true);
+  showLoader();
   await http
     .get(config.API.exportPassResultExam(importId.value), {
       responseType: "blob",
@@ -404,12 +404,12 @@ const downloadPassResultExam = async () => {
       messageError($q, e);
     })
     .finally(() => {
-      loaderPage(false);
+      hideLoader();
     });
 };
 
 const fetchData = async () => {
-  loaderPage(true);
+  showLoader();
   await http
     .post(config.API.getExamResultById(importId.value), {
       examAttribute: "",
@@ -437,7 +437,7 @@ const fetchData = async () => {
       messageError($q, e);
     })
     .finally(() => {
-      loaderPage(false);
+      hideLoader();
     });
 };
 </script>

src/modules/03_recruiting/views/01_compete/DetailEx.vue

@@ -26,12 +26,16 @@
               {{ profile_id }}
             </div>
 
-            <div class="col-6 text-grey-7" v-if="prefix !== null">คำนำหน้านาม</div>
+            <div class="col-6 text-grey-7" v-if="prefix !== null">
+              คำนำหน้านาม
+            </div>
             <div class="col-6 text-black" v-if="prefix !== null">
               {{ prefix }}
             </div>
 
-            <div class="col-6 text-grey-7" v-if="fullname !== null">ชื่อ-นามสกุล</div>
+            <div class="col-6 text-grey-7" v-if="fullname !== null">
+              ชื่อ-นามสกุล
+            </div>
             <div class="col-6 text-black" v-if="fullname !== null">
               {{ fullname }}
             </div>
@@ -55,17 +59,23 @@
               {{ position_name }}
             </div>
 
-            <div class="col-6 text-grey-7" v-if="university !== null">สถานศึกษา</div>
+            <div class="col-6 text-grey-7" v-if="university !== null">
+              สถานศึกษา
+            </div>
             <div class="col-6 text-black" v-if="university !== null">
               {{ university }}
             </div>
 
-            <div class="col-6 text-grey-7" v-if="degree !== null">วุฒิการศึกษา</div>
+            <div class="col-6 text-grey-7" v-if="degree !== null">
+              วุฒิการศึกษา
+            </div>
             <div class="col-6 text-black" v-if="degree !== null">
               {{ degree }}
             </div>
 
-            <div class="col-6 text-grey-7" v-if="major !== null">สาขาวิชาเอก</div>
+            <div class="col-6 text-grey-7" v-if="major !== null">
+              สาขาวิชาเอก
+            </div>
             <div class="col-6 text-black" v-if="major !== null">
               {{ major }}
             </div>
@@ -118,7 +128,11 @@
                         >ดาวน์โหลดผลคะแนน</q-item-section
                       >
                     </q-item>
-                    <q-item clickable v-close-popup @click="downloadCertificate()">
+                    <q-item
+                      clickable
+                      v-close-popup
+                      @click="downloadCertificate()"
+                    >
                       <q-item-section class="text-blue"
                         >ดาวน์โหลดเอกสารรับรอง</q-item-section
                       >
@@ -138,12 +152,18 @@
               </q-btn>
             </div>
             <div class="row items-center q-gutter-y-sm col-12">
-              <div class="col-xs-4 col-sm-5 text-weight-medium text-grey-7">ประเภท</div>
-              <div class="col-xs-3 col-sm-2 text-primary text-weight-bold">คะแนนเต็ม</div>
+              <div class="col-xs-4 col-sm-5 text-weight-medium text-grey-7">
+                ประเภท
+              </div>
+              <div class="col-xs-3 col-sm-2 text-primary text-weight-bold">
+                คะแนนเต็ม
+              </div>
               <div class="col-xs-3 col-sm-2 text-primary text-weight-bold">
                 คะแนนที่ได้
               </div>
-              <div class="col-xs-2 col-sm-2 text-primary text-weight-bold"></div>
+              <div
+                class="col-xs-2 col-sm-2 text-primary text-weight-bold"
+              ></div>
 
               <div class="col-xs-4 col-sm-5 text-grey-7">ภาค ก</div>
               <div class="col-xs-3 col-sm-2 q-pr-xs">
@@ -181,10 +201,16 @@
               </div>
               <div class="col-xs-2 col-sm-2 q-pr-xs text-grey-7">คะแนน</div>
 
-              <div class="col-xs-4 col-sm-5 text-weight-bold q-pt-sm">ผลการสอบ</div>
-              <div class="col-xs-8 col-sm-6 q-pr-xs text-weight-bold text-subtitle1">
+              <div class="col-xs-4 col-sm-5 text-weight-bold q-pt-sm">
+                ผลการสอบ
+              </div>
+              <div
+                class="col-xs-8 col-sm-6 q-pr-xs text-weight-bold text-subtitle1"
+              >
                 <span
-                  :class="examResultinscore != 'ผ่าน' ? 'text-red' : 'text-positive'"
+                  :class="
+                    examResultinscore != 'ผ่าน' ? 'text-red' : 'text-positive'
+                  "
                   >{{ examResultinscore }}</span
                 >
               </div>
@@ -194,7 +220,9 @@
                 {{ number }}
               </div>
 
-              <div class="col-xs-6 col-sm-5 text-grey-7">วันหมดอายุบัญชีสอบแข่งขัน</div>
+              <div class="col-xs-6 col-sm-5 text-grey-7">
+                วันหมดอายุบัญชีสอบแข่งขัน
+              </div>
               <div class="col-xs-6 col-sm-7 q-pr-xs">
                 {{ score_expired }}
               </div>
@@ -241,7 +269,7 @@ const examCount = ref<string>("");
 const number = ref<string>("");
 const score_expired = ref<string>("");
 const mixin = useCounterMixin();
-const { messageError } = mixin;
+const { messageError, showLoader, hideLoader } = mixin;
 const examID = ref<string>("62150001");
 const prefix = ref<string>("นาย");
 const fullname = ref<string>("เกียรติศักดิ์ บัณฑิต");
@@ -253,7 +281,7 @@ onMounted(async () => {
 });
 
 const fetchData = async () => {
-  loaderPage(true);
+  showLoader();
   await http
     .get(config.API.getExamDetail(importId.value, examId.value))
     .then((res) => {
@@ -290,12 +318,12 @@ const fetchData = async () => {
       messageError($q, e);
     })
     .finally(() => {
-      loaderPage(false);
+      hideLoader();
     });
 };
 
 const downloadScore = async () => {
-  loaderPage(true);
+  showLoader();
   await http
     .get(config.API.downloadScoreReport(importId.value, examId.value), {
       responseType: "blob",
@@ -311,12 +339,12 @@ const downloadScore = async () => {
       messageError($q, e);
     })
     .finally(() => {
-      loaderPage(false);
+      hideLoader();
     });
 };
 
 const downloadCertificate = async () => {
-  loaderPage(true);
+  showLoader();
   await http
     .get(config.API.downloadExamReport(importId.value, examId.value, 2), {
       responseType: "blob",
@@ -332,7 +360,7 @@ const downloadCertificate = async () => {
       messageError($q, e);
     })
     .finally(() => {
-      loaderPage(false);
+      hideLoader();
     });
 };
 </script>

src/modules/03_recruiting/views/01_compete/Period.vue

@@ -316,7 +316,10 @@
   <q-dialog v-model="modalCandidate" persistent>
     <q-card style="width: 600px">
       <q-form ref="myFormScore">
-        <DialogHeader :tittle="textTittleCandidate" :close="clickCloseCandidate" />
+        <DialogHeader
+          :tittle="textTittleCandidate"
+          :close="clickCloseCandidate"
+        />
         <q-separator />
         <q-card-section>
           <div class="col-12 row items-center q-col-gutter-sm">
@@ -379,7 +382,7 @@ const name = ref<string>("");
 const year = ref<number>(new Date().getFullYear() + 543);
 const order = ref<number>(1);
 const mixin = useCounterMixin();
-const { success, dateToISO, dateText } = mixin;
+const { success, dateToISO, dateText, showLoader, hideLoader } = mixin;
 const files = ref<any>(null);
 const files_score = ref<any>(null);
 const files_candidate = ref<any>(null);
@@ -551,7 +554,7 @@ const visibleColumnsHistory = ref<String[]>([
 ]);
 
 onMounted(async () => {
-  loaderPage(false);
+  hideLoader();
   await fetchData();
 });
 
@@ -564,7 +567,7 @@ const textDate = (value: Date) => {
 };
 
 const fetchData = async () => {
-  loaderPage(true);
+  showLoader();
   await http
     .get(config.API.getCandidates)
     .then((res) => {
@@ -586,7 +589,7 @@ const fetchData = async () => {
       messageError($q, e);
     })
     .finally(() => {
-      loaderPage(false);
+      hideLoader();
     });
 };
 
@@ -620,7 +623,7 @@ const clickEditPeriod = (id: string) => {
 
 const clickHistory = async (id: string) => {
   modalHistory.value = true;
-  loaderPage(true);
+  showLoader();
   await http
     .get(config.API.getImportHistory(id))
     .then((res) => {
@@ -649,7 +652,7 @@ const clickHistory = async (id: string) => {
       statusCode.value = e.response.data.status;
     })
     .finally(async () => {
-      loaderPage(false);
+      hideLoader();
     });
 };
 
@@ -664,7 +667,7 @@ const clickDelete = (id: string) => {
     persistent: true,
   })
     .onOk(async () => {
-      loaderPage(true);
+      showLoader();
       await http
         .delete(config.API.deleteCandidates(id))
         .then((res) => {
@@ -675,7 +678,7 @@ const clickDelete = (id: string) => {
           messageError($q, e);
         })
         .finally(() => {
-          loaderPage(false);
+          hideLoader();
         });
     })
     .onCancel(() => {})
@@ -704,7 +707,7 @@ const clickCloseCandidate = async () => {
 const checkSaveCandidate = async () => {
   const fd = new FormData();
   fd.append("attachment", files_candidate.value[0]);
-  loaderPage(true);
+  showLoader();
   await http
     .post(config.API.uploadCandidates(selected_row_id.value), fd)
     .then((res) => {
@@ -717,14 +720,14 @@ const checkSaveCandidate = async () => {
       messageError($q, e);
     })
     .finally(() => {
-      loaderPage(false);
+      hideLoader();
     });
 };
 
 const checkSaveScore = async () => {
   const fd = new FormData();
   fd.append("attachment", files_score.value[0]);
-  loaderPage(true);
+  showLoader();
   await http
     .post(config.API.saveScores(selected_row_id.value), fd)
     .then((res) => {
@@ -737,7 +740,7 @@ const checkSaveScore = async () => {
       messageError($q, e);
     })
     .finally(() => {
-      loaderPage(false);
+      hideLoader();
     });
 };
 
@@ -747,7 +750,7 @@ const checkSave = async () => {
   fd.append("year", year.value.toString());
   fd.append("order", order.value.toString());
   fd.append("name", name.value);
-  loaderPage(true);
+  showLoader();
   await http
     .post(config.API.saveCandidates, fd)
     .then((res) => {
@@ -759,7 +762,7 @@ const checkSave = async () => {
       messageError($q, e);
     })
     .finally(() => {
-      loaderPage(false);
+      hideLoader();
     });
 };
 </script>

src/modules/03_recruiting/views/01_compete/PeriodAdd.vue

@@ -25,7 +25,10 @@
               label="ชื่อรอบการสอบแข่งขัน/ชื่อประกาศ"
               dense
               lazy-rules
-              :rules="[(val) => !!val || `${'กรุณากรอกชื่อรอบการสอบแข่งขัน/ชื่อประกาศ'}`]"
+              :rules="[
+                (val) =>
+                  !!val || `${'กรุณากรอกชื่อรอบการสอบแข่งขัน/ชื่อประกาศ'}`,
+              ]"
             ></q-input>
           </div>
           <div class="col-xs-12 col-sm-4 col-md-1" v-if="announcementExam">
@@ -83,7 +86,9 @@
               dense
               lazy-rules
               input-class="text-right"
-              :rules="[(val) => val >= 0 || `${'กรุณากรอกค่าธรรมเนียมให้ถูกต้อง'}`]"
+              :rules="[
+                (val) => val >= 0 || `${'กรุณากรอกค่าธรรมเนียมให้ถูกต้อง'}`,
+              ]"
             ></q-input>
           </div>
           <div class="col-xs-12 col-sm-3 col-md-3" v-if="announcementExam">
@@ -295,7 +300,9 @@
                   @removed="fileRemoveImg"
                 >
                   <template v-slot:header="scope">
-                    <div class="row no-wrap items-center q-pa-sm q-gutter-xs text-white">
+                    <div
+                      class="row no-wrap items-center q-pa-sm q-gutter-xs text-white"
+                    >
                       <q-btn
                         v-if="scope.queuedFiles.length > 0"
                         icon="clear_all"
@@ -316,7 +323,10 @@
                       >
                         <q-tooltip>ลบไฟล์ที่อัปโหลด</q-tooltip>
                       </q-btn>
-                      <q-spinner v-if="scope.isUploading" class="q-uploader__spinner" />
+                      <q-spinner
+                        v-if="scope.isUploading"
+                        class="q-uploader__spinner"
+                      />
                       <div class="col">
                         <div class="q-uploader__title">
                           {{ "[ไฟล์ jpg,png,pdf,csv,doc ขนาดไม่เกิน 10MB]" }}
@@ -360,7 +370,11 @@
                 v-if="fileImgs.length != 0"
               >
                 <q-list separator>
-                  <q-item v-for="file in fileImgs" :key="file.id" class="q-my-xs">
+                  <q-item
+                    v-for="file in fileImgs"
+                    :key="file.id"
+                    class="q-my-xs"
+                  >
                     <q-item-section>
                       <q-item-label class="full-width ellipsis">
                         {{ file.fileName }}
@@ -421,7 +435,9 @@
                   @removed="fileRemoveDoc"
                 >
                   <template v-slot:header="scope">
-                    <div class="row no-wrap items-center q-pa-sm q-gutter-xs text-white">
+                    <div
+                      class="row no-wrap items-center q-pa-sm q-gutter-xs text-white"
+                    >
                       <q-btn
                         v-if="scope.queuedFiles.length > 0"
                         icon="clear_all"
@@ -442,7 +458,10 @@
                       >
                         <q-tooltip>ลบไฟล์ที่อัปโหลด</q-tooltip>
                       </q-btn>
-                      <q-spinner v-if="scope.isUploading" class="q-uploader__spinner" />
+                      <q-spinner
+                        v-if="scope.isUploading"
+                        class="q-uploader__spinner"
+                      />
                       <div class="col">
                         <div class="q-uploader__title">
                           {{ "[ไฟล์ jpg,png,pdf,csv,doc ขนาดไม่เกิน 10MB]" }}
@@ -486,7 +505,11 @@
                 v-if="fileDocs.length != 0"
               >
                 <q-list separator>
-                  <q-item v-for="file in fileDocs" :key="file.id" class="q-my-xs">
+                  <q-item
+                    v-for="file in fileDocs"
+                    :key="file.id"
+                    class="q-my-xs"
+                  >
                     <q-item-section>
                       <q-item-label class="full-width ellipsis">
                         {{ file.fileName }}
@@ -534,7 +557,9 @@
           </div>
 
           <div class="col-12">
-            <div class="text-bold text-subtitle2 q-pb-sm q-pt-md">รายละเอียด</div>
+            <div class="text-bold text-subtitle2 q-pb-sm q-pt-md">
+              รายละเอียด
+            </div>
             <q-editor
               v-model="editor"
               :dense="$q.screen.lt.md"
@@ -544,7 +569,14 @@
               class="editor"
               :toolbar="[
                 ['left', 'center', 'right', 'justify'],
-                ['bold', 'italic', 'strike', 'underline', 'subscript', 'superscript'],
+                [
+                  'bold',
+                  'italic',
+                  'strike',
+                  'underline',
+                  'subscript',
+                  'superscript',
+                ],
                 ['token', 'hr', 'link', 'custom_btn'],
                 ['print', 'fullscreen'],
                 [
@@ -637,7 +669,8 @@ const $q = useQuasar(); // show dialog
 const mixin = useCounterMixin();
 const router = useRouter();
 const route = useRoute();
-const { date2Thai, success, dateToISO, notifyError } = mixin;
+const { date2Thai, success, dateToISO, notifyError, showLoader, hideLoader } =
+  mixin;
 const myForm = ref<QForm | null>(null); //form data input
 const name = ref<string>("");
 const note = ref<string>("");
@@ -733,7 +766,7 @@ watch(organizationName, (count: DataOption, prevCount: DataOption) => {
 });
 
 onMounted(async () => {
-  loaderPage(false);
+  hideLoader();
   if (route.params.id != undefined) {
     edit.value = true;
     id.value = route.params.id.toString();
@@ -748,7 +781,7 @@ const clickBack = () => {
 };
 
 const fetchData = async () => {
-  loaderPage(true);
+  showLoader();
   await http
     .get(config.API.getPeriodById(id.value))
     .then((res) => {
@@ -785,7 +818,7 @@ const fetchData = async () => {
       messageError($q, e);
     })
     .finally(() => {
-      loaderPage(false);
+      hideLoader();
     });
 };
 
@@ -797,7 +830,9 @@ const fileUploadDoc = async (files: any) => {
 
 const fileRemoveDoc = async (files: any) => {
   files.forEach((file: any) => {
-    const index = fileDocDataUpload.value.findIndex((x: any) => x.__key == file.__key);
+    const index = fileDocDataUpload.value.findIndex(
+      (x: any) => x.__key == file.__key
+    );
     if (index > -1) {
       fileDocDataUpload.value.splice(index, 1);
     }
@@ -810,7 +845,7 @@ const uploadDocData = async () => {
     fileDocDataUpload.value.forEach((file: any) => {
       formData.append("", file);
     });
-    loaderPage(true);
+    showLoader();
     await http
       .put(config.API.periodRecruitDoc(id.value), formData)
       .then((res) => {})
@@ -818,7 +853,7 @@ const uploadDocData = async () => {
         messageError($q, e);
       })
       .finally(async () => {
-        loaderPage(false);
+        hideLoader();
         success($q, "บันทึกข้อมูลสำเร็จ");
         clickBack();
       });
@@ -834,7 +869,7 @@ const uploadImgData = async () => {
     fileImgDataUpload.value.forEach((file: any) => {
       formData.append("", file);
     });
-    loaderPage(true);
+    showLoader();
     await http
       .put(config.API.periodRecruitImg(id.value), formData)
       .then((res) => {})
@@ -842,7 +877,7 @@ const uploadImgData = async () => {
         messageError($q, e);
       })
       .finally(async () => {
-        loaderPage(false);
+        hideLoader();
       });
   }
 };
@@ -855,7 +890,9 @@ const fileUploadImg = async (files: any) => {
 
 const fileRemoveImg = async (files: any) => {
   files.forEach((file: any) => {
-    const index = fileImgDataUpload.value.findIndex((x: any) => x.__key == file.__key);
+    const index = fileImgDataUpload.value.findIndex(
+      (x: any) => x.__key == file.__key
+    );
     if (index > -1) {
       fileImgDataUpload.value.splice(index, 1);
     }
@@ -906,7 +943,7 @@ const sendData = () => {
 };
 
 const deleteDocData = async (docId: string) => {
-  loaderPage(true);
+  showLoader();
   await http
     .delete(config.API.periodDeleteDoc(docId))
     .then(async () => {
@@ -916,12 +953,12 @@ const deleteDocData = async (docId: string) => {
       messageError($q, e);
     })
     .finally(async () => {
-      loaderPage(false);
+      hideLoader();
     });
 };
 
 const deleteImgData = async (docId: string) => {
-  loaderPage(true);
+  showLoader();
   await http
     .delete(config.API.periodDeleteImg(docId))
     .then(async () => {
@@ -931,12 +968,12 @@ const deleteImgData = async (docId: string) => {
       messageError($q, e);
     })
     .finally(async () => {
-      loaderPage(false);
+      hideLoader();
     });
 };
 
 const addData = async () => {
-  loaderPage(true);
+  showLoader();
   await http
     .post(config.API.savePeriod, sendData())
     .then(async (res) => {
@@ -949,12 +986,12 @@ const addData = async () => {
       messageError($q, e);
     })
     .finally(async () => {
-      loaderPage(false);
+      hideLoader();
     });
 };
 
 const editData = async (id: string) => {
-  loaderPage(true);
+  showLoader();
   await http
     .put(config.API.editPeriod(id), sendData())
     .then(async () => {
@@ -965,7 +1002,7 @@ const editData = async (id: string) => {
       messageError($q, e);
     })
     .finally(async () => {
-      loaderPage(false);
+      hideLoader();
     });
 };