add example of download file

frontend/src/pages/user/requests/Home.vue

@@ -49,7 +49,8 @@
                 </button>
                 <div class="request-description-content" v-html="request.content"></div>
                 <div v-for="(file, index) in request.attached_files" :key="index">
-                  <button @click="previewAttachedFile(request.id, file.document_id)">{{ file.file_name }}</button>
+                  <button @click="previewAttachedFile(request.id, file.document_id)">Preview{{ file.file_name }}</button>
+                  <button @click="downloadAttachedFile(request.id, file.document_id)">Download{{ file.file_name }}</button>
                 </div>
               </div>
               <div class="issuer-profile-container">
@@ -147,6 +148,28 @@ export default {
         this.mnx_backendErrorHandler(error)
       }
       )
+    },
+    downloadAttachedFile(request_id, document_id) {
+      WorksapceApi.fetchAttachedFileAsDownload(request_id, document_id).then(response => {
+        // create file link in browser's memory
+        const href = URL.createObjectURL(response.data);
+
+        // create "a" HTML element with href to file & click
+        const link = document.createElement('a');
+        link.href = href;
+        link.setAttribute('download', 'file.pdf'); //or any other extension
+        document.body.appendChild(link);
+        link.click();
+
+        // clean up "a" element & remove ObjectURL
+        document.body.removeChild(link);
+        URL.revokeObjectURL(href);        //TODO: navigate to the preview page
+      }).catch((error) => {
+        this.mnx_backendErrorHandler(error)
+      }
+      )
+
+
     }
   }
 }

frontend/src/utils/backend/workspace.js

@@ -311,7 +311,10 @@ class WorksapceApi {
     formData.append('request_id', request_id)
     formData.append('file', file)
 
-    const request = backendAxios.post('/api/workspace/request/attach-file-for-request', formData, {
+    const request = backendAxios.post(
+      '/api/workspace/request/attach-file-for-request',
+      formData,
+      {
         headers: {
           'Content-Type': 'multipart/form-data',
           Authorization: `Bearer ${jwt}`
@@ -334,6 +337,22 @@ class WorksapceApi {
     return request
 
   }
+  static fetchAttachedFileAsDownload(request_id, document_id) {
+    let jwt = userUtils.getJwtToken()
+    const request = backendAxios.get(
+      '/api/workspace/request/fetch-attached-file-as-download',
+      {
+        params: {
+          request_id: request_id,
+          document_id: document_id,
+        },
+        responseType: 'blob',
+        headers: { Authorization: `Bearer ${jwt}` }
+      }
+    )
+    return request
+
+  }
 }
 
 export { WorksapceApi }