From 7d90f443a00d9f2140f839856814e22559f199a0 Mon Sep 17 00:00:00 2001
From: AnandaTon <ananda@frappet.com>
Date: Wed, 20 Dec 2023 17:00:45 +0700
Subject: [PATCH] =?UTF-8?q?=E0=B9=81=E0=B8=81=E0=B9=89=E0=B9=84=E0=B8=82?=
 =?UTF-8?q?=20itemlist=20download=20=E0=B9=84=E0=B8=9F=E0=B8=A5=E0=B9=8C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- รายละเอียดการขอยกเลิกการลา
- รายละเอียดการลา
---
 .../components/2_Leave/DetailLeave.vue        | 48 +++++++++++++++++--
 .../components/2_Leave/DetailLeaveReject.vue  | 47 ++++++++++++++++--
 src/plugins/genreport.ts                      |  2 +-
 3 files changed, 88 insertions(+), 9 deletions(-)

diff --git a/src/modules/09_leave/components/2_Leave/DetailLeave.vue b/src/modules/09_leave/components/2_Leave/DetailLeave.vue
index 487fae021..c1dea856f 100644
--- a/src/modules/09_leave/components/2_Leave/DetailLeave.vue
+++ b/src/modules/09_leave/components/2_Leave/DetailLeave.vue
@@ -48,6 +48,8 @@ const route = useRoute();
 const paramsId = route.params.id.toString();
 
 const modalApprove = ref(false);
+const typeDocx = ref<string>("docx");
+const typePdf = ref<string>("pdf");
 const dialogTitleUnapprove = ref<string>("ไม่อนุมัติ");
 const dialogTitle = ref<string>("อนุมัติ");
 const dialogLabel = ref<string>("เหตุผล");
@@ -462,14 +464,15 @@ function clickSave(reason: string) {
   }
 }
 
-async function onClickDownloadFile(id: string, fileName: string) {
+async function onClickDownloadFile(id: string, fileName: string, type: string) {
   showLoader();
   await http
     .get(config.API.leaveReport(id))
     .then(async (res) => {
       console.log(res);
       const data = res.data.result;
-      await genReport(data, fileName);
+      await genReport(data, fileName, type);
+      console.log(type);
     })
     .catch((err) => {
       messageError($q, err);
@@ -496,7 +499,7 @@ async function onClickDownloadFile(id: string, fileName: string) {
         รายละเอียดการลาของ {{ formData.fullName }}
       </div>
       <div>
-        <q-btn
+        <!-- <q-btn
           icon="mdi-download"
           unelevated
           round
@@ -506,7 +509,44 @@ async function onClickDownloadFile(id: string, fileName: string) {
           class="q-mr-sm"
           @click="onClickDownloadFile(formData.id, formData.leaveTypeName)"
           ><q-tooltip>ดาวน์โหลดไฟล์</q-tooltip></q-btn
-        >
+        > -->
+        <q-btn class="q-mr-sm" icon="mdi-download" round color="primary" flat>
+          <q-tooltip>ดาวน์โหลดไฟล์</q-tooltip>
+          <q-menu>
+            <q-list style="min-width: 100px">
+              <q-item
+                clickable
+                v-close-popup
+                @click="
+                  onClickDownloadFile(
+                    formData.id,
+                    formData.leaveTypeName,
+                    typeDocx
+                  )
+                "
+              >
+                <q-item-section class="text-blue"
+                  >ดาวน์โหลดไฟล์ .docx</q-item-section
+                >
+              </q-item>
+              <q-item
+                clickable
+                v-close-popup
+                @click="
+                  onClickDownloadFile(
+                    formData.id,
+                    formData.leaveTypeName,
+                    typePdf
+                  )
+                "
+              >
+                <q-item-section class="text-red"
+                  >ดาวน์โหลดไฟล์ .pdf</q-item-section
+                >
+              </q-item>
+            </q-list>
+          </q-menu>
+        </q-btn>
       </div>
       <q-space />
       <!-- <q-file
diff --git a/src/modules/09_leave/components/2_Leave/DetailLeaveReject.vue b/src/modules/09_leave/components/2_Leave/DetailLeaveReject.vue
index adb3312e4..efe5ed3af 100644
--- a/src/modules/09_leave/components/2_Leave/DetailLeaveReject.vue
+++ b/src/modules/09_leave/components/2_Leave/DetailLeaveReject.vue
@@ -47,6 +47,8 @@ const router = useRouter();
 const route = useRoute();
 const paramsId = route.params.id.toString();
 
+const typeDocx = ref<string>("docx");
+const typePdf = ref<string>("pdf");
 const modalApprove = ref(false);
 const dialogTitleUnapprove = ref<string>("ไม่อนุมัติ");
 const dialogTitle = ref<string>("อนุมัติ");
@@ -405,14 +407,14 @@ function clickSave(reason: string) {
   }
 }
 
-async function onClickDownloadFile(id: string, fileName: string) {
+async function onClickDownloadFile(id: string, fileName: string, type: string) {
   showLoader();
   await http
     .get(config.API.leaveReportReject(id))
     .then(async (res) => {
       console.log(res);
       const data = res.data.result;
-      await genReport(data, fileName);
+      await genReport(data, fileName, type);
     })
     .catch((err) => {
       messageError($q, err);
@@ -439,7 +441,7 @@ async function onClickDownloadFile(id: string, fileName: string) {
         รายละเอียดการขอยกเลิกของ {{ formData.fullName }}
       </div>
       <div>
-        <q-btn
+        <!-- <q-btn
           icon="mdi-download"
           unelevated
           round
@@ -449,7 +451,44 @@ async function onClickDownloadFile(id: string, fileName: string) {
           class="q-mr-sm"
           @click="onClickDownloadFile(formData.id, formData.leaveTypeName)"
           ><q-tooltip>ดาวน์โหลดไฟล์</q-tooltip></q-btn
-        >
+        > -->
+        <q-btn class="q-mr-sm" icon="mdi-download" round color="primary" flat>
+          <q-tooltip>ดาวน์โหลดไฟล์</q-tooltip>
+          <q-menu>
+            <q-list style="min-width: 100px">
+              <q-item
+                clickable
+                v-close-popup
+                @click="
+                  onClickDownloadFile(
+                    formData.id,
+                    formData.leaveTypeName,
+                    typeDocx
+                  )
+                "
+              >
+                <q-item-section class="text-blue"
+                  >ดาวน์โหลดไฟล์ .docx</q-item-section
+                >
+              </q-item>
+              <q-item
+                clickable
+                v-close-popup
+                @click="
+                  onClickDownloadFile(
+                    formData.id,
+                    formData.leaveTypeName,
+                    typePdf
+                  )
+                "
+              >
+                <q-item-section class="text-red"
+                  >ดาวน์โหลดไฟล์ .pdf</q-item-section
+                >
+              </q-item>
+            </q-list>
+          </q-menu>
+        </q-btn>
       </div>
       <q-space />
       <!-- <q-file
diff --git a/src/plugins/genreport.ts b/src/plugins/genreport.ts
index 09851d2a7..7b39dcc63 100644
--- a/src/plugins/genreport.ts
+++ b/src/plugins/genreport.ts
@@ -41,7 +41,7 @@ async function genReport(data: any, fileName: string, type: string = "docx") {
         // สร้างลิงก์เพื่อดาวน์โหลดไฟล์
         const link = document.createElement("a");
         link.href = url;
-        link.download = `${fileName}.docx`; // กำหนดชื่อไฟล์ที่จะดาวน์โหลด
+        link.download = `${fileName}.${type === "docx" ? "docx" : "pdf"}`; // กำหนดชื่อไฟล์ที่จะดาวน์โหลด
         document.body.appendChild(link);
         link.click();