diff --git a/src/views/chart/pages/Predict.vue b/src/views/chart/pages/Predict.vue index 3985fe8..8936bb1 100644 --- a/src/views/chart/pages/Predict.vue +++ b/src/views/chart/pages/Predict.vue @@ -175,7 +175,45 @@ export default { // const url = this.outPath + '\\' + this.queryParams.case_no + '_' + item + '_ROC.json' // const path = url.replace(/\\/g, '/') // this.$axios.get(window.CONFIG.baseUrl + '/download', { params: { path: path }}) - this.downloadFile(this.output_path, this.queryParams.case_no + '_' + item + '_ROC.json') + // this.downloadFile(this.output_path, this.queryParams.case_no + '_' + item + '_ROC.json') + this.$axios.get(window.CONFIG.baseUrl + '/download', { params: { path: this.output_path }, responseType: 'blob', }).then(res => { + // 1. 验证响应数据 + if (!res.data) { + this.$message.error('下载失败:无文件数据'); + return; + } + + // 2. 从响应头获取文件名(需要后端配合设置) + let fileName = '下载文件'; // 默认文件名 + const contentDisposition = res.headers['content-disposition']; + if (contentDisposition) { + // 解析Content-Disposition头中的文件名 + const fileNameMatch = contentDisposition.match(/filename[^;=\n]*=((['"]).*?\2|[^;\n]*)/); + if (fileNameMatch && fileNameMatch[1]) { + fileName = decodeURIComponent(fileNameMatch[1].replace(/['"]/g, '')); + } + } + + // 3. 创建下载链接 + const blob = new Blob([res.data]); + const downloadUrl = window.URL.createObjectURL(blob); + const link = document.createElement('a'); + + // 4. 设置下载属性 + link.href = downloadUrl; + link.download = fileName; // 设置文件名 + link.style.display = 'none'; + + // 5. 触发下载 + document.body.appendChild(link); + link.click(); + + // 6. 清理资源 + setTimeout(() => { + document.body.removeChild(link); + window.URL.revokeObjectURL(downloadUrl); // 释放URL对象 + }, 100); + }) }) }, chart() { diff --git a/src/views/chart/pages/Test.vue b/src/views/chart/pages/Test.vue index 6ac5525..a92bde0 100644 --- a/src/views/chart/pages/Test.vue +++ b/src/views/chart/pages/Test.vue @@ -173,10 +173,47 @@ export default { const arr = this.queryParams.model_types.split(',') arr.forEach(item => { // const url = this.outPath + '\\' + this.queryParams.case_no + '_' + item + '_ROC.json' - // const path = url.replace(/\\/g, '/') - const path = this.output_path + // const path = url.replace(/\\/g, '/') // this.$axios.get(window.CONFIG.baseUrl + '/download', { params: { path: path }}) - this.downloadFile(path, this.queryParams.case_no + '_' + item + '_ROC.json') + // this.downloadFile(path, this.queryParams.case_no + '_' + item + '_ROC.json') + this.$axios.get(window.CONFIG.baseUrl + '/download', { params: { path: this.output_path }, responseType: 'blob', }).then(res => { + // 1. 验证响应数据 + if (!res.data) { + this.$message.error('下载失败:无文件数据'); + return; + } + + // 2. 从响应头获取文件名(需要后端配合设置) + let fileName = '下载文件'; // 默认文件名 + const contentDisposition = res.headers['content-disposition']; + if (contentDisposition) { + // 解析Content-Disposition头中的文件名 + const fileNameMatch = contentDisposition.match(/filename[^;=\n]*=((['"]).*?\2|[^;\n]*)/); + if (fileNameMatch && fileNameMatch[1]) { + fileName = decodeURIComponent(fileNameMatch[1].replace(/['"]/g, '')); + } + } + + // 3. 创建下载链接 + const blob = new Blob([res.data]); + const downloadUrl = window.URL.createObjectURL(blob); + const link = document.createElement('a'); + + // 4. 设置下载属性 + link.href = downloadUrl; + link.download = fileName; // 设置文件名 + link.style.display = 'none'; + + // 5. 触发下载 + document.body.appendChild(link); + link.click(); + + // 6. 清理资源 + setTimeout(() => { + document.body.removeChild(link); + window.URL.revokeObjectURL(downloadUrl); // 释放URL对象 + }, 100); + }) }) }, chart() {