แก้ แสดง error

src/modules/05_command/components/ViewPdf.vue

@@ -17,12 +17,9 @@ const { dialogConfirm, success, showLoader, hideLoader, messageError } = mixin;
 const commandId = defineModel<string>("commandId", { required: true }); // id คำสั่ง
 const type = defineModel<string>("type", { required: true }); // แยก tab
 // รายละเอียดคำสั่ง
-const dataTemplateDetail = defineModel<DataTemplateDetail>(
-  "dataTemplateDetail",
-  {
+const dataTemplate = defineModel<DataTemplateDetail>("dataTemplateDetail", {
   required: true,
-  }
-);
+});
 
 const documentFile = ref<File | null>(null); // file อัปโหลด
 const isLoadPDF = ref<boolean>(false); // Loading display pdf
@@ -57,11 +54,12 @@ const { fetchDataTemplate } = defineProps({
  * @param dataTemple รายละเอียดคำสั่ง
  */
 async function fetchDocumentTemplate(dataTemple: DataTemplateDetail) {
+  if (dataTemple) {
     showLoader();
     isLoadPDF.value = false;
     pdfSrc.value = undefined;
     page.value = 1;
-  const reportName = await `${dataTemplateDetail.value.code}_${type.value}`;
+    const reportName = `${dataTemple.code}_${type.value}`;
     const body = {
       template: reportName,
       reportName: `${typeFile.value}-report`,
@@ -120,6 +118,7 @@ async function fetchDocumentTemplate(dataTemple: DataTemplateDetail) {
         isLoadPDF.value = false;
         hideLoader();
       });
+  }
 }
 
 /**
@@ -130,7 +129,7 @@ async function uploadTemplate() {
     $q,
     async () => {
       showLoader();
-      const reportName = await `${dataTemplateDetail.value.code}_${type.value}`;
+      const reportName = await `${dataTemplate.value.code}_${type.value}`;
       await axios
         .post(
           config.API.reportTemplate +
@@ -150,7 +149,7 @@ async function uploadTemplate() {
           hideLoader();
 
           // โหลดไฟล์ Template ที่แสดงในหน้า UI ใหม่
-          fetchDocumentTemplate(dataTemplateDetail.value);
+          fetchDocumentTemplate(dataTemplate.value);
           fetchDataTemplate(commandId.value);
         })
         .catch(async (e) => {
@@ -170,8 +169,8 @@ async function uploadTemplate() {
  */
 async function downloadTemplate() {
   const check = await (type.value == "cover"
-    ? dataTemplateDetail.value.fileCover
-    : dataTemplateDetail.value.fileAttachment);
+    ? dataTemplate.value.fileCover
+    : dataTemplate.value.fileAttachment);
   await axios
     .post(
       config.API.reportTemplate + `/${typeFile.value}/download?folder=command`,
@@ -189,7 +188,7 @@ async function downloadTemplate() {
     .then(async (res) => {
       var a = document.createElement("a");
       a.href = URL.createObjectURL(res.data);
-      a.download = `${dataTemplateDetail.value.code}_${type.value}.${typeFile.value}`;
+      a.download = `${dataTemplate.value.code}_${type.value}.${typeFile.value}`;
       a.click();
       hideLoader();
     })
@@ -217,17 +216,16 @@ async function updateReportName(name: string) {
 }
 
 // working on click command list
-watch(dataTemplateDetail, () => {
-  fetchDocumentTemplate(dataTemplateDetail.value);
-});
+watch(
+  () => dataTemplate.value,
+  async (newValue, oldValue) => {
+    await fetchDocumentTemplate(newValue);
+  }
+);
 
 // working on change tab
 onMounted(() => {
-  fetchDocumentTemplate(dataTemplateDetail.value);
-});
-
-defineExpose({
-  fetchDocumentTemplate,
+  fetchDocumentTemplate(dataTemplate.value);
 });
 </script>