首页 > 其他分享 >报表导出和文件下载前端部分

报表导出和文件下载前端部分

时间:2022-10-12 09:58:51浏览次数:62  
标签:报表 true 前端 导出 link corresSuffix let data suffix

报表导出

@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('暂无下载内容');
          }
        });
      },

 文件下载

如果后端没有返回文件名
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);
    })
}

  

 

标签:报表,true,前端,导出,link,corresSuffix,let,data,suffix
From: https://www.cnblogs.com/Ao-min/p/16783450.html

相关文章