แก้โหลดไฟล์ เป็น id

src/modules/11_discipline/components/1_Complaint/Form.vue

@@ -46,6 +46,7 @@ const {
   messageError,
   hideLoader,
   showLoader,
+  downloadRenameFileByLink
 } = mixin;
 const { filterSelector } = complainstStore; // function จาก store complainstStore
 
@@ -140,13 +141,6 @@ function onSubmit() {
   });
 }
 
-/**
- * เปิดลิงค์ไฟล์
- * @param link รับมาเป็น https ลิงค์
- */
-function downloadFile(link: string) {
-  window.open(link, "_blank");
-}
 
 /**
  * ลบไฟล์
@@ -434,7 +428,7 @@ function filterOptionFnAgency(val: string, update: Function) {
                   ref="respondentTypeRef"
                   dense
                   outlined
-                  :readonly="isReadonly ||checkRoutePermisson"
+                  :readonly="isReadonly || checkRoutePermisson"
                   label="ผู้ถูกร้องเรียน"
                   option-value="id"
                   option-label="name"
@@ -674,7 +668,7 @@ function filterOptionFnAgency(val: string, update: Function) {
                   ref="descriptionRef"
                   dense
                   outlined
-                  :readonly="isReadonly|| checkRoutePermisson"
+                  :readonly="isReadonly || checkRoutePermisson"
                   hide-bottom-space
                   v-model="formData.description"
                   label="รายละเอียดเรื่องร้องเรียน"
@@ -691,7 +685,7 @@ function filterOptionFnAgency(val: string, update: Function) {
                   :locale="'th'"
                   autoApply
                   borderless
-                  :readonly="isReadonly|| checkRoutePermisson"
+                  :readonly="isReadonly || checkRoutePermisson"
                   :enableTimePicker="false"
                   week-start="0"
                   @update:model-value="changeFormData()"
@@ -709,7 +703,7 @@ function filterOptionFnAgency(val: string, update: Function) {
                       outlined
                       dense
                       :class="inputEdit(isReadonly)"
-                      :readonly="isReadonly|| checkRoutePermisson"
+                      :readonly="isReadonly || checkRoutePermisson"
                       hide-bottom-space
                       :model-value="
                         formData.dateReceived != null
@@ -741,7 +735,7 @@ function filterOptionFnAgency(val: string, update: Function) {
                   ref="levelConsiderationRef"
                   dense
                   outlined
-                  :readonly="isReadonly|| checkRoutePermisson"
+                  :readonly="isReadonly || checkRoutePermisson"
                   v-model="formData.levelConsideration"
                   :options="complainstStore.levelConsiderationtOptions"
                   label="ระดับการพิจารณา"
@@ -764,7 +758,7 @@ function filterOptionFnAgency(val: string, update: Function) {
                   v-model="formData.dateConsideration"
                   @update:model-value="changeFormData()"
                   :locale="'th'"
-                  :readonly="isReadonly|| checkRoutePermisson"
+                  :readonly="isReadonly || checkRoutePermisson"
                   autoApply
                   borderless
                   :enableTimePicker="false"
@@ -788,7 +782,7 @@ function filterOptionFnAgency(val: string, update: Function) {
                           ? date2Thai(formData.dateConsideration)
                           : null
                       "
-                      :readonly="isReadonly|| checkRoutePermisson"
+                      :readonly="isReadonly || checkRoutePermisson"
                       label="วันที่กำหนดพิจารณา"
                       hide-bottom-space
                     >
@@ -801,7 +795,11 @@ function filterOptionFnAgency(val: string, update: Function) {
                         </q-icon>
                       </template>
                       <template
-                        v-if="formData.dateConsideration && !isReadonly && !checkRoutePermisson"
+                        v-if="
+                          formData.dateConsideration &&
+                          !isReadonly &&
+                          !checkRoutePermisson
+                        "
                         v-slot:append
                       >
                         <q-icon
@@ -824,7 +822,7 @@ function filterOptionFnAgency(val: string, update: Function) {
                   ref="offenseDetailsRef"
                   dense
                   outlined
-                  :readonly="isReadonly|| checkRoutePermisson"
+                  :readonly="isReadonly || checkRoutePermisson"
                   v-model="formData.offenseDetails"
                   :options="mainStore.offenseDetailstOptions"
                   label="ลักษณะความผิด"
@@ -844,7 +842,7 @@ function filterOptionFnAgency(val: string, update: Function) {
                   v-model="formData.dateNotification"
                   :locale="'th'"
                   autoApply
-                  :readonly="isReadonly||checkRoutePermisson"
+                  :readonly="isReadonly || checkRoutePermisson"
                   borderless
                   :enableTimePicker="false"
                   week-start="0"
@@ -863,7 +861,7 @@ function filterOptionFnAgency(val: string, update: Function) {
                       outlined
                       :class="inputEdit(isReadonly)"
                       dense
-                      :readonly="isReadonly||checkRoutePermisson"
+                      :readonly="isReadonly || checkRoutePermisson"
                       hide-bottom-space
                       :model-value="
                         formData.dateNotification != null
@@ -881,7 +879,11 @@ function filterOptionFnAgency(val: string, update: Function) {
                         </q-icon>
                       </template>
                       <template
-                        v-if="formData.dateNotification && !isReadonly && !checkRoutePermisson"
+                        v-if="
+                          formData.dateNotification &&
+                          !isReadonly &&
+                          !checkRoutePermisson
+                        "
                         v-slot:append
                       >
                         <q-icon
@@ -924,7 +926,7 @@ function filterOptionFnAgency(val: string, update: Function) {
                   dense
                   outlined
                   v-model="formData.appellant"
-                  :readonly="isReadonly ||checkRoutePermisson"
+                  :readonly="isReadonly || checkRoutePermisson"
                   label="ผู้ร้องเรียน"
                   hide-bottom-space
                   type="textarea"
@@ -975,7 +977,11 @@ function filterOptionFnAgency(val: string, update: Function) {
                   <div class="col-12"><q-separator /></div>
                   <div class="row col-12 q-col-gutter-y-sm q-pa-sm">
                     <div
-                      v-if="!checkRoutePermisson && !isReadonly && formData.id !== ''"
+                      v-if="
+                        !checkRoutePermisson &&
+                        !isReadonly &&
+                        formData.id !== ''
+                      "
                       class="col-12 row"
                     >
                       <q-file
@@ -1034,7 +1040,9 @@ function filterOptionFnAgency(val: string, update: Function) {
                               dense
                               color="blue"
                               icon="mdi-download"
-                              @click="downloadFile(data.pathName)"
+                              @click="
+                                downloadRenameFileByLink(data.pathName, data.fileName)
+                              "
                               ><q-tooltip>ดาวน์โหลดไฟล์</q-tooltip></q-btn
                             >
                             <q-btn
@@ -1067,7 +1075,10 @@ function filterOptionFnAgency(val: string, update: Function) {
         </div>
 
         <div class="col-12" v-if="!checkRoutePermisson"><q-separator /></div>
-        <div class="row col-12 q-pa-sm" v-if="!isReadonly && !checkRoutePermisson">
+        <div
+          class="row col-12 q-pa-sm"
+          v-if="!isReadonly && !checkRoutePermisson"
+        >
           <q-space />
           <q-btn
             for="ButtonOnSubmit"

src/modules/11_discipline/components/2_InvestigateFacts/Form.vue

@@ -49,6 +49,7 @@ const {
   success,
   messageError,
   dialogRemove,
+  downloadRenameFileByLink
 } = mixin;
 const investigateDis = useInvestigateDisStore();
 const countNum = ref<number>(1);
@@ -1553,7 +1554,7 @@ onMounted(async () => {
                                 round
                                 color="blue"
                                 icon="mdi-download-outline"
-                                @click="downloadFileRelevant(file.pathName)"
+                                @click="downloadRenameFileByLink(file.pathName, file.fileName)"
                               >
                                 <q-tooltip>ดาวน์โหลดไฟล์</q-tooltip>
                               </q-btn>
@@ -1657,7 +1658,7 @@ onMounted(async () => {
                                 round
                                 color="blue"
                                 icon="mdi-download-outline"
-                                @click="downloadFile(file.pathName)"
+                                @click="downloadRenameFileByLink(file.pathName, file.fileName)"
                               >
                                 <q-tooltip>ดาวน์โหลดไฟล์</q-tooltip>
                               </q-btn>

src/modules/11_discipline/components/4_Result/Form.vue

@@ -34,6 +34,7 @@ const {
   messageError,
   showLoader,
   dialogRemove,
+  downloadRenameFileByLink
 } = mixin;
 const router = useRouter();
 const route = useRoute();
@@ -600,7 +601,7 @@ function updatemodalPersonal(modal: boolean) {
                     dense
                     color="blue"
                     icon="mdi-download"
-                    @click="downloadFile(data.pathName)"
+                    @click="downloadRenameFileByLink(data.pathName,data.fileName)"
                     ><q-tooltip>ดาวน์โหลดไฟล์</q-tooltip></q-btn
                   >
                   <q-btn

src/modules/11_discipline/components/UploadFile.vue

@@ -11,7 +11,7 @@ import { useCounterMixin } from "@/stores/mixin";
 const $q = useQuasar();
 
 const mixin = useCounterMixin();
-const { showLoader, hideLoader, success, messageError, dialogRemove } = mixin;
+const { showLoader, hideLoader, success, messageError, dialogRemove ,downloadRenameFileByLink} = mixin;
 
 const fileRef = ref<Object | null>(null);
 const file = ref<any>();
@@ -186,7 +186,7 @@ function downloadFile(link: string) {
                     round
                     color="blue"
                     icon="mdi-download-outline"
-                    @click="downloadFile(f.pathName)"
+                    @click="downloadRenameFileByLink(f.pathName,f.fileName)"
                   >
                     <q-tooltip>ดาวน์โหลดเอกสาร</q-tooltip>
                   </q-btn>

src/stores/mixin.ts

@@ -1058,6 +1058,22 @@ export const useCounterMixin = defineStore("mixin", () => {
     }
   }
 
+  function downloadRenameFileByLink(link: string, fileName: string) {
+    fetch(link)
+      .then(response => response.blob())
+      .then(blob => {
+        const url = window.URL.createObjectURL(blob);
+        const a = document.createElement("a");
+        a.href = url;
+        a.download = fileName; // ชื่อไฟล์
+        document.body.appendChild(a);
+        a.click();
+        window.URL.revokeObjectURL(url);
+        document.body.removeChild(a);
+      })
+      .catch(error => console.error('ดาวน์โหลดไฟล์ไม่สำเร็จ:', error));
+  }
+
   return {
     calAge,
     date2Thai,
@@ -1099,5 +1115,6 @@ export const useCounterMixin = defineStore("mixin", () => {
     findOrgNameOld,
     findPosMasterNo,
     findPosMasterNoOld,
+    downloadRenameFileByLink
   };
 });