From 02cc675c520179c4d4ed124cca2fbea5c98c0157 Mon Sep 17 00:00:00 2001
From: "DESKTOP-1R2VSQH\\Lenovo ThinkPad E490" <nicey2t1096@gmail.com>
Date: Mon, 16 Sep 2024 10:54:40 +0700
Subject: [PATCH] =?UTF-8?q?=E0=B8=AD=E0=B8=AD=E0=B8=81=E0=B8=84=E0=B8=B3?=
 =?UTF-8?q?=E0=B8=AA=E0=B8=B1=E0=B9=88=E0=B8=87=20=3D=3D>=20PDF?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/Step/Dialog1_Perview.vue       | 23 +++++++++++--------
 1 file changed, 14 insertions(+), 9 deletions(-)

diff --git a/src/modules/18_command/components/Step/Dialog1_Perview.vue b/src/modules/18_command/components/Step/Dialog1_Perview.vue
index 7d0520a57..5c3ec89d2 100644
--- a/src/modules/18_command/components/Step/Dialog1_Perview.vue
+++ b/src/modules/18_command/components/Step/Dialog1_Perview.vue
@@ -14,7 +14,7 @@ import DialogHeader from "@/components/DialogHeader.vue";
 import { useCounterMixin } from "@/stores/mixin";
 
 const $q = useQuasar();
-const { dialogConfirm } = useCounterMixin();
+const { showLoader, hideLoader, messageError } = useCounterMixin();
 
 const modal = defineModel<boolean>("modal", { required: true });
 const dataTemplateDetail = defineModel<any>("dataTemplateDetail", {
@@ -27,6 +27,7 @@ const page = ref<number>(1);
 const vuePDFRef = ref<any>(null);
 
 async function fetchPDF(type: string = "docx") {
+  showLoader();
   await axios
     .post(
       config.API.reportTemplate + `/${type}`,
@@ -61,23 +62,27 @@ async function fetchPDF(type: string = "docx") {
       setTimeout(() => {
         pdfSrc.value = pdfData.pdf.value;
         numOfPages.value = pdfData.pages.value;
+        hideLoader();
       }, 1500);
     })
-    .catch(async (e) => {
-      //   messageError($q, e);
-      //   hideLoader();
+    .catch((e) => {
+      messageError($q, e);
+      hideLoader();
     });
 }
 
 function onClose() {
   modal.value = false;
+  pdfSrc.value = undefined;
 }
 
-onMounted(() => {
-  setTimeout(() => {
-    fetchPDF();
-  }, 1000);
+watch(modal, () => {
+  modal.value && fetchPDF();
 });
+
+// onMounted(() => {
+//   setTimeout(() => {}, 1000);
+// });
 </script>
 
 <template>
@@ -86,7 +91,7 @@ onMounted(() => {
       <DialogHeader :tittle="'ตัวอย่างคำสั่ง'" :close="onClose" />
       <q-separator />
 
-      <q-card-section bordered class="card-pdf q-ma-md q-pa-md">
+      <q-card-section bordered class="scroll q-ma-md q-pa-md" style="height: 90%;">
         <div class="justify-between items-center align-center q-pb-sm row">
           <q-btn
             class="text-dark bg-grey-4"