jquery中pdf的上传、下载及excel导出

news/2024/7/10 23:33:27 标签: jquery, pdf, excel

jquerypdf的上传、下载及excel导出

  • 1.PDF上传 pdfUpload
  • 2. pdf下载和excel导出用的一种方法,并且需要引入utils.js
    • 2.1PDF下载 pdfDownload
    • 2.2导出Excel excelExport

pdfUpload_1">1.PDF上传 pdfUpload

//PDF上传  pdfUpload
window.pdfUpload=function (obj){
   layer.open({
       type: 1,
       title: "PDF上传",
       shade: 0.1,
       area: ['250px', '155px'],
       // btn: ['确认','取消'],
       content:
           `
           <div class="uploadDialog">
                 <button type="button" class="layui-btn demo-class-accept" lay-options="{accept: 'file'}">
                   <i class="layui-icon layui-icon-upload"></i>
                   上传文件
                 </button>
           </div>
           `
       , success: function (layero, index) {
           $(':focus').blur();
           upload.render({
               elem: '.demo-class-accept'
               , url: rootPath + '/xxxxxx'
               , accept: 'file'
               , data: {schedulingId: obj.data.id}
               , exts: 'pdf'
               , done: function (res) {
                   console.log(res,' upload.render--res')
                   if (res) {
                       if (res.code == "200") {
                           layer.msg('上传成功',{time:2000});
                           setTimeout(function (){
                               layer.close(index)
                           },2000)

                       } else {
                           layer.msg(res.msg, {icon: 2, time: 3000});
                       }
                   }
               }
           });
       }
   });
}

pdfexcelutilsjs_47">2. pdf下载和excel导出用的一种方法,并且需要引入utils.js

<script th:src="@{/static/utils.js}"></script>
// utils.js
const download = (res, type, filename) => {
    // 创建blob对象,解析流数据
    const blob = new Blob([res], {
        // 如何后端没返回下载文件类型,则需要手动设置:type: 'application/pdf;chartset=UTF-8' 表示下载文档为pdf,如果是word则设置为msword,excelexcel
        type: type
    })
    const a = document.createElement('a')
    // 兼容webkix浏览器,处理webkit浏览器中href自动添加blob前缀,默认在浏览器打开而不是下载
    const URL = window.URL || window.webkitURL
    // 根据解析后的blob对象创建URL 对象
    const herf = URL.createObjectURL(blob)
    // 下载链接
    a.href = herf
    // 下载文件名,如果后端没有返回,可以自己写a.download = '文件.pdf'
    a.download = filename
    document.body.appendChild(a)
    a.click()
    document.body.removeChild(a)
    // 在内存中移除URL 对象
    window.URL.revokeObjectURL(herf)
}

pdfDownload_79">2.1PDF下载 pdfDownload

//PDF下载  pdfDownload
window.pdfDownload=function (obj){
   $.ajax({
       url: rootPath + '/xxxx?schedulingId='+obj.data.id,
       type: 'get',
       success: function (res) {
           if (res.code == 200) {
               var pdfUrl = res.data ? (res.data.pdfUrl ? res.data.pdfUrl : null) : null
               if (pdfUrl) {//有返回pdf地址
                   let type=pdfUrl.split('.').pop();
                   let fileExtName = "";

                   if(type=='pdf'){
                       fileExtName=".pdf"
                   }else {
                       layer.msg("请导入的非Excel文件!")
                   }

                   let randfile = new Date().getTime() + fileExtName;

                   var oReq = new XMLHttpRequest();
                   oReq.open("GET", pdfUrl, true,);
                   oReq.responseType = "blob";
                   oReq.onload = function () {
                       var file = new Blob([oReq.response], {
                           type: 'application/pdf'
                       });
                       saveAs(file, randfile);
                   };
                   oReq.send();
               }
               else{
                   layer.msg("请先上传pdf数据!")
               }
           }
       }
   })
}

function saveAs(data, name) {
   var urlObject = window.URL || window.webkitURL || window;
   var export_blob = new Blob([data]);
   var save_link = document.createElementNS('http://www.w3.org/1999/xhtml', 'a')
   save_link.href = urlObject.createObjectURL(export_blob);
   save_link.download = name;
   save_link.click();
}

//function getFileName(url)
//{
//   var num = url.lastIndexOf('/')+1
//   var fileName = url.substring(num)
//   //把参数和文件名分割开
//   fileName = decodeURI(fileName.split("?")[0]);
//   return fileName;
//}

excelExport_140">2.2导出Excel excelExport

//导出Excel  excelExport
window.excelExport=function (obj){
   $.ajax({
       url: rootPath + '/xxxx?schedulingId='+obj.data.id,
       type: 'get',
       success: function (res) {
           if (res.code == 200) {
               var excelUrl=res.data ? res.data : null
               if (excelUrl) {//有返回pdf地址
                   let type=excelUrl.split('.').pop();
                   let fileExtName = "";
                   let blobType=""
                   if(type==''){//空
                       layer.msg("请导入的非Excel文件!")
                       return false
                   }else if(type=='xls'){
                       fileExtName=".xls"
                       blobType="application/vnd.ms-excel"
                   }else if(type=='xlsx'){
                       fileExtName=".xlsx"
                       blobType="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"
                   }

                   var randfile = new Date().getTime() + fileExtName;

                   var oReq = new XMLHttpRequest();
                   oReq.open("GET", excelUrl, true,);
                   oReq.responseType = "blob";
                   oReq.onload = function () {
                       var file = new Blob([oReq.response], {
                           type: blobType
                       });
                       // saveAs(file, "excelFile.xls");
                       saveAs(file, randfile);
                   };
                   oReq.send();
               }
               else{
                   layer.msg("请先上传Excel数据!")
               }
           }
       }
   })
}

function saveAs(data, name) {
   var urlObject = window.URL || window.webkitURL || window;
   var export_blob = new Blob([data]);
   var save_link = document.createElementNS('http://www.w3.org/1999/xhtml', 'a')
   save_link.href = urlObject.createObjectURL(export_blob);
   save_link.download = name;
   save_link.click();
}

参考:
https://blog.csdn.net/qq_27179087/article/details/129204759

https://blog.csdn.net/weixin_46186815/article/details/131514151?spm=1001.2101.3001.6650.1&utm_medium=distribute.pc_relevant.none-task-blog-2%7Edefault%7ECTRLIST%7ERate-1-131514151-blog-123522384.235%5Ev38%5Epc_relevant_anti_vip_base&depth_1-utm_source=distribute.pc_relevant.none-task-blog-2%7Edefault%7ECTRLIST%7ERate-1-131514151-blog-123522384.235%5Ev38%5Epc_relevant_anti_vip_base&utm_relevant_index=2

https://blog.csdn.net/qq_40636998/article/details/107239922?utm_medium=distribute.pc_relevant.none-task-blog-2defaultbaidujs_baidulandingword~default-9-107239922-blog-130881581.235v38pc_relevant_anti_vip_base&spm=1001.2101.3001.4242.6&utm_relevant_index=12


http://www.niftyadmin.cn/n/4948408.html

相关文章

pvt corner / rc corner

我正在「拾陆楼」和朋友们讨论有趣的话题&#xff0c;你⼀起来吧&#xff1f;拾陆楼知识星球入口 PVT wc&#xff1a;worst case slow&#xff0c;低电压&#xff0c;高温度&#xff0c;慢工艺 -> 一般情况下delay最大&#xff0c;setup 差。 wcl&#xff1a;worst case lo…

配资平台app(正规股票配资软件)架构是怎么搭建的?

随着股票市场的发展&#xff0c;越来越多的投资者开始尝试使用股票配资平台进行杠杆炒股&#xff0c;因此&#xff0c;搭建一套稳定、可靠的配资平台app架构显得尤为重要。本文将介绍配资平台app架构设计的关键要素&#xff0c;以及建立一个正规的配资平台app所需考虑的问题。 …

没有放入回收站的文件如何找回?这个方法可以帮你

在我们平常使用电脑时&#xff0c;经常需要删除一些文件或文件夹。通常情况下&#xff0c;这些文件会被移动到回收站&#xff0c;以便我们在需要时可以轻松恢复。然而&#xff0c;有时候我们希望直接永久删除文件&#xff0c;而不经过回收站。不过&#xff0c;在使用这些方法之…

食品行业案例 | 燕千云助力头部食品企业搭建数智化 IT服务管理体系及平台

随着数字化时代的到来&#xff0c;食品行业呈现出多个发展趋势。首先&#xff0c;消费者对健康食品和功能性食品的关注度提高&#xff0c;推动了市场需求的增长。其次&#xff0c;便利食品和物流行业迅速发展&#xff0c;满足了快节奏生活的需求。再者&#xff0c;电商渠道和网…

Flowable监听器

在Flowable中&#xff0c;有以下常用的监听器&#xff1a; ExecutionListener&#xff08;执行监听器&#xff09;&#xff1a;在流程执行过程中&#xff0c;监听流程实例的生命周期事件&#xff0c;如创建、启动、完成等。可以在这些事件发生时执行自定义的逻辑操作。 TaskLi…

如何使用 ChatGPT 将文本转换为 PowerPoint 演示文稿

推荐&#xff1a;使用 NSDT场景编辑器 助你快速搭建可二次编辑的3D应用场景 步骤 1&#xff1a;将文本转换为幻灯片演示文稿 第一步涉及指示 ChatGPT 根据给定的文本生成具有特定数量幻灯片的演示文稿。首先&#xff0c;您必须向 ChatGPT 提供要转换的文本。 使用以下提示指示…

基于百度地图与echarts的飞线数据图

<html xmlns"http://www.w3.org/1999/xhtml"><head><meta http-equiv"Content-Type" content"text/html; charsetutf-8" /><title>飞线</title><style type"text/css">body {margin: 0;border: 0…

【3Ds Max】挤出命令的简单使用(实现二维变三维)

简介 在3ds Max中&#xff0c;"挤出"&#xff08;Extrude&#xff09;是一种常用的建模操作&#xff0c;用于在平面或曲面上创建立体几何形状。以下是使用3ds Max中的挤出命令的基本步骤&#xff1a; 创建基本几何形状&#xff1a; 在3ds Max中创建一个基本的几何形…