下载中心，修改下载文件方式；

src/api/download.js

@@ -1,9 +1,10 @@
 import request from '@/utils/request'
+import download from '@/utils/downloadBlob'
 
 /* 下载中心列表 */
 export function getDownloadList(sn, module, params) {
   return request({
-    url: `/console/surveys/${sn}/download_center/${module}`,
+    url: `/console/surveys/${ sn }/download_center/${ module }`,
     method: 'GET',
     params
   })
@@ -12,18 +13,27 @@ export function getDownloadList(sn, module, params) {
 /* 下载中心添加 */
 export function addDownloadCenter(sn, data) {
   return request({
-    method: "POST",
-    url: `/console/surveys/${sn}/download_center`,
-    data,
-  });
+    method: 'POST',
+    url: `/console/surveys/${ sn }/download_center`,
+    data
+  })
 }
 
-/* 下载中心添加 */
+/* 下载中心查看日志 */
 export function getDownloadRecords(sn, params) {
   return request({
-    method: "GET",
-    url: `/console/surveys/${sn}/download_center_log`,
-    params,
-  });
+    method: 'GET',
+    url: `/console/surveys/${ sn }/download_center_log`,
+    params
+  })
+}
+
+/* 下载中心 - 下载文件 */
+export function downloadFile(sn, id) {
+  return download({
+    method: 'GET',
+    url: `/console/surveys/${ sn }/download_center/download/${ id }`,
+    responseType: 'blob'
+  })
 }
 

src/utils/downloadBlob.js

@@ -0,0 +1,63 @@
+import axios from 'axios'
+import store from '@/store'
+import { message, Modal } from 'ant-design-vue'
+import { A_COMMON_CLEAR_TOKEN } from '@store/constance/constance.common'
+import fileDownload from 'js-file-download'
+
+const { proxyUrl } = require('@/config')
+export const baseURL = process.env.NODE_ENV === 'production' ? proxyUrl : '/api'
+
+
+// create an axios instance
+const service = axios.create({
+  baseURL: `${ baseURL }`, // url = base url + request url
+  withCredentials: true, // send cookies when cross-domain requests
+  timeout: 0 // request timeout
+})
+
+// request interceptor
+service.interceptors.request.use(
+  (config) => {
+    if(!config.headers) {
+      config.headers = {}
+    }
+    config.headers.Accept = config.headers.Accept || 'application/json'
+    config.headers.Authorization = `${ localStorage.getItem('plantToken') }`
+    if(!config.headers.remoteIp) {
+      config.baseURL += '/api'
+    }
+    config.headers.remoteIp = localStorage.getItem('plantIp') || '127.0.0.1'
+    return config
+  },
+  (error) => Promise.reject(error)
+)
+
+// response interceptor
+service.interceptors.response.use(
+  (response) => {
+    if([200, 201, 202, 204].includes(response.status)) {
+      const content = response?.request?.getResponseHeader?.('Content-Disposition') || ''
+      const contentParts = content.replace(/["']/g, '').match(/filename\*?=([^;]+)/)
+      const extractedName = contentParts[1] || `file_${ Date.now() }`
+      const fileName = decodeURIComponent(extractedName)
+
+      fileDownload(response.data, fileName)
+
+      return Promise.resolve(response)
+    }
+    return Promise.reject(new Error(response.message || 'Error'))
+  },
+  (error) => {
+    if(error.response.status === 401) {
+      Modal.destroyAll()
+      store.dispatch(A_COMMON_CLEAR_TOKEN)
+      window.parent.postMessage({ code: '301', params: {} }, '*')
+      store.commit('common/M_COMMON_SET_TOKEN_UNAUTHORIZED', false)
+    } else {
+      message.error(error.response.data?.message || '服务器错误')
+    }
+    return Promise.reject(error.response)
+  }
+)
+
+export default service

src/views/DownloadCenter/TableList.vue

@@ -19,7 +19,9 @@
         <div>{{ !record.file_size?'-':record.file_size }}</div>
       </template>
       <template #status_str="{ record }">
-        <div v-if="record.status===2" @click="clickDownload(record)" class="blue">{{ record.status_str }}</div>
+        <a-spin v-if="record.status===2" :spinning="downloading" style="width: 50px;">
+          <div @click="clickDownload(record)" class="blue">{{ record.status_str }}</div>
+        </a-spin>
         <div v-else class="status-text"
           :class="
             record.status === 0 || record.status === 1 ? 'green' : record.status === 3 ? 'red' : record.status === 4 ? 'gray' : ''
@@ -45,7 +47,8 @@
 <script>
 import { defineComponent, ref, watch, getCurrentInstance, computed, onMounted, onUnmounted, } from "vue";
 import { useRouter, useRoute } from "vue-router";
-import { getDownloadList } from "@/api/download.js";
+import { message } from 'ant-design-vue';
+import { getDownloadList, downloadFile } from "@/api/download.js";
 import { useStore } from "vuex";
 import DownloadRecordModal from './DownloadRecordModal.vue';
 
@@ -100,6 +103,7 @@ export default defineComponent({
     const { proxy } = getCurrentInstance();
     const route = useRoute();
     const sn = route.query.sn || props.questionSn;
+    const downloading = ref(false); // 是否正在调用下载接口
     const downloadRecordVisible = ref(false);
     const tableData = ref([]);
     const page = ref(1);
@@ -216,18 +220,17 @@ export default defineComponent({
     }
     // 下载
     const clickDownload = (record) => {
-      console.log('record',record);
-        // let url = record.file_url;
-        // let a = document.createElement("a"); // 生成一个a元素
-        // let event = new MouseEvent("click"); // 创建一个单击事件
-        // a.href = url; // 将生成的URL设置为a.href属性
-        // a.dispatchEvent(event); // 触发a的单击事件
-      // const subdata = {
-      //     fileURL:record.file_url,
-      //     fileName:record.file_name
-      //   }
-      // store.dispatch('common/fileDown',subdata)
-      window.open(record.file_url, '_self');
+      if(downloading.value) {
+        return
+      }
+      downloading.value = true
+      downloadFile(sn, record.id).then(() => {
+        message.success('下载成功')
+      }).catch(() => {
+        message.error('下载失败')
+      }).finally(() => {
+        downloading.value = false
+      })
     }
 
     onMounted(() => {
@@ -244,6 +247,7 @@ export default defineComponent({
       }
     })
     return {
+      downloading,
       sn,
       downloadRecordVisible,
       onPaginationChange,