报表导出和文件下载前端部分
报表导出
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 | @click= "exportAllItem" identity1: false , //导出 exportAllItem() { if ( this .identity1 == true ) { this .$message.warning( '正在下载,请稍后...' ); return false ; } this .identity1 = true ; exportTaskDetailsList({ ... this .where, startDate: this .startDate, endDate: this .endDate }).then((res) => { this .identity1 = false ; if (res.data.size != 0) { const filename = '报表.xlsx' ; let blob = new Blob([res.data], { // type: 'application/vnd.ms-excel' }); if (window.navigator && window.navigator.msSaveBlob) { window.navigator.msSaveBlob(blob, filename); } else { //其他浏览器 let link = document.createElement( 'a' ); // 创建a标签 link.style.display = 'none' ; let objectUrl = URL.createObjectURL(blob); link.href = objectUrl; link.setAttribute( 'download' , filename); link.click(); URL.revokeObjectURL(objectUrl); } } else { res.data.message.error( '暂无下载内容' ); } }); }, |
文件下载
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 | 如果后端没有返回文件名 queryStageReport() { if ( this .data.detailList) { let suffix = this .data.detailList[0].substring( this .data.detailList[0].lastIndexOf( '.' ) ); //截取链接带点 let flag = true ; // let flag = false; // let corresSuffix; // for (let item in urldata.urls) { // if ( // suffix.toUpperCase() == urldata.urls[item].oldSuffix.toUpperCase() // ) { // flag = true; // corresSuffix = urldata.urls[item].corresSuffix; // } // } console.log(suffix); if (flag == true ) { downloadFile({ name: '模版' + suffix, path: this .data.detailList[0] // suffix: corresSuffix }); } else { this .$message.error( '该文件属于未知的文件类型' ); } } }, 如果后端返回文件名 // 点击 godetail(data) { if (data) { //前端不用指定类型的做法 // downloadFileParts({ // name: data.itemRemark, // path: data.itemDetail, // isWater: true, // historyId: data.historyId, // businessTypeId: '1' // }); //前端需要指定类型 let suffix = data.itemDetail.substring( data.itemDetail.lastIndexOf( '.' ) ); //截取链接带点 let flag = false ; let corresSuffix; for ( let item in urldata.urls) { if ( suffix.toUpperCase() == urldata.urls[item].oldSuffix.toUpperCase() ) { flag = true ; corresSuffix = urldata.urls[item].corresSuffix; } } if (flag == true ) { downloadFileParts({ name: data.itemRemark, path: data.itemDetail, suffix: corresSuffix, isWater: true , historyId: data.historyId, businessTypeId: '1' }); } else { this .$message.error( '该文件属于未知的文件类型' ); } } }, 接口部分 //下载文件 export async function downloadFileParts(params) { axios({ url: '/Approve/downloadFile?path=' + params.path + '&isWater=' + params.isWater + '&historyId=' +params.historyId + '&businessTypeId=' + params.businessTypeId, method: 'get' , data: {}, responseType: 'blob' }).then(res => { if (res.data.size != 0) { const filename = params.name let blob = new Blob([res.data], { // type: params.suffix }); if (window.navigator && window.navigator.msSaveBlob) { window.navigator.msSaveBlob(blob, filename); } else { //其他浏览器 let link = document.createElement( 'a' ); // 创建a标签 link.style.display = 'none' ; let objectUrl = URL.createObjectURL(blob); link.href = objectUrl; link.setAttribute( 'download' , filename); link.click(); URL.revokeObjectURL(objectUrl); } } else { Message.error( '暂无下载内容' ); } }, err => { console.log( 'err:' , err); }) } |
分类:
VUE
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 分享一个免费、快速、无限量使用的满血 DeepSeek R1 模型,支持深度思考和联网搜索!
· 基于 Docker 搭建 FRP 内网穿透开源项目(很简单哒)
· 25岁的心里话
· ollama系列01:轻松3步本地部署deepseek,普通电脑可用
· 按钮权限的设计及实现
2020-10-12 数组对象相同的key值合并,并且把对应的ID放到一个数组
2020-10-12 JS 求 2个对象数组的差值
2020-10-12 对象根据里面的某一个属性合并