แก้

รายงานสถิติสำหรับการสอบแข่งขัน

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

@@ -10,15 +10,19 @@ import { checkPermission } from "@/utils/permissions";
 import { useCounterMixin } from "@/stores/mixin";
 
 import type { DataOption } from "@/modules/09_leave/interface/index/Main";
-
+import genReportXLSX from "@/plugins/genreportxlsx";
 /** use*/
+const isReport = ref<boolean>(true);
 const mixin = useCounterMixin();
 const $q = useQuasar();
 const { showLoader, hideLoader, date2Thai, dateToISO, messageError } = mixin;
 
 const year = ref<number>(new Date().getFullYear());
 
-const reportSelect = ref<string>("report1");
+const reportSelect = ref<DataOption>({
+  id: "",
+  name: "",
+});
 const reportSelectMain = ref<DataOption[]>([
   {
     id: "report1",
@@ -44,12 +48,14 @@ async function getReportRecruit() {
   showLoader();
   await http
     .get(
-      config.API.reportRecruit(reportSelect.value) + `?year=${year.value + 543}`
+      config.API.reportRecruit(reportSelect.value.id) +
+        `?year=${year.value + 543}`
     )
     .then(async (res) => {
       const data = res.data.result;
       data && (await genReport(data));
       detailReport.value = data;
+      isReport.value = false;
     })
     .catch((err) => {
       messageError($q, err);
@@ -93,47 +99,6 @@ async function genReport(data: any) {
     });
 }
 
-/**
- * function เรียกไฟล์ XLSX
- * @param data ข้อมูลบัญชีวันลา
- */
-async function genReportXLSX(data: any) {
-  await axios
-    .post(`${config.API.reportTemplate}/xlsx`, data, {
-      headers: {
-        accept:
-          "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
-        "content-Type": "application/json",
-      },
-      responseType: "blob",
-    })
-    .then(async (res) => {
-      const blob = new Blob([res.data]);
-      downloadReport(blob, "xlsx");
-    })
-    .catch(async (e) => {
-      messageError($q, JSON.parse(await e.response.data.text()));
-    })
-    .finally(() => {
-      hideLoader();
-    });
-}
-
-/**
- * function Download ไฟล์
- * @param data ข้อมูลบัญชีวันลา
- * @param type นามสกุลไฟล์
- */
-async function downloadReport(data: any, type: string) {
-  const link = document.createElement("a");
-  var fileName = "บัญชีแสดงวันลา";
-  link.href = window.URL.createObjectURL(new Blob([data]));
-  link.setAttribute("download", `${fileName}.${type}`);
-  document.body.appendChild(link);
-  link.click();
-  document.body.removeChild(link);
-}
-
 const splitterModel = ref(14);
 const numOfPages = ref<number>(0);
 const page = ref<number>(1);
@@ -167,14 +132,10 @@ function filterFnOptions(val: any, update: Function) {
     );
   });
 }
-
-onMounted(() => {
-  getReportRecruit();
-});
 </script>
 <template>
   <div class="toptitle text-dark col-12 row items-center">
-    รายงานระบบการสรรหาบุคคล
+    รายงานสถิติสำหรับการสอบแข่งขัน
   </div>
 
   <q-card flat bordered class="col-12 q-mt-sm q-pa-md">
@@ -187,7 +148,6 @@ onMounted(() => {
             v-model="reportSelect"
             :options="reportSelectOption"
             label="รายงาน"
-            emit-value
             map-options
             hide-selected
             fill-input
@@ -245,14 +205,18 @@ onMounted(() => {
             round
             color="primary"
             icon="download"
-            v-if="checkPermission($route)?.attrIsGet"
+            :disable="
+              !checkPermission($route)?.attrIsGet &&
+              isReport &&
+              reportSelect.id == ''
+            "
           >
             <q-menu>
               <q-list style="min-width: 150px">
                 <q-item
                   clickable
                   v-close-popup
-                  @click="downloadReport(fileBlob, 'pdf')"
+                  @click="genReportXLSX(detailReport, reportSelect.name, 'pdf')"
                 >
                   <q-item-section avatar
                     ><q-icon color="red" name="mdi-file-pdf"
@@ -262,7 +226,7 @@ onMounted(() => {
                 <q-item
                   clickable
                   v-close-popup
-                  @click="genReportXLSX(detailReport)"
+                  @click="genReportXLSX(detailReport, reportSelect.name)"
                 >
                   <q-item-section avatar
                     ><q-icon color="green" name="mdi-file-excel"