当前位置: 首页 > news >正文

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

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

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

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});}}}});}});
}

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,excel为exceltype: 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 = filenamedocument.body.appendChild(a)a.click()document.body.removeChild(a)// 在内存中移除URL 对象window.URL.revokeObjectURL(herf)
}

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) : nullif (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;
//}

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 : nullif (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

相关文章:

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

jquery中pdf的上传、下载及excel导出 1.PDF上传 pdfUpload2. pdf下载和excel导出用的一种方法&#xff0c;并且需要引入utils.js2.1PDF下载 pdfDownload2.2导出Excel excelExport 1.PDF上传 pdfUpload //PDF上传 pdfUpload window.pdfUploadfunction (obj){layer.open({type:…...

【MyBatis】:PageHelper分页插件与特殊字符处理

目录 一、PageHelper介绍 二、PageHelper使用 1. 导入pom依赖 2. Mybatis.cfg.xml 配置拦截器 3. 配置 Mapper.xml 4. 编写测试 三、特殊字符处理 1. 使用转义字符 2. 使用CDATA 区段 一、PageHelper介绍 PageHelper 是 Mybatis 的一个插件&#xff0c;这里就不扯了&a…...

C语言练习1(巩固提升)

C语言练习1 选择题 前言 “人生在勤&#xff0c;勤则不匮。”幸福不会从天降&#xff0c;美好生活靠劳动创造。全面建成小康社会的奋斗目标&#xff0c;为广大劳动群众指明了光明的未来&#xff1b;全面建成小康社会的历史任务&#xff0c;为广大劳动群众赋予了光荣的使命&…...

eCharts热力图Y轴左上角少一块

问题&#xff1a; 如图 在图例的左上角 Y轴会少一块 官方demo https://echarts.apache.org/examples/zh/editor.html?cheatmap-cartesian 事实上 把官方demo的左上角坐标 [ 6, 0, 1 ] 修改为 [ 6, 0, 0 ] 后 依旧会出现该问题 查遍文档 并无解释 也没有任何配置项可解决…...

RabbitMQ介绍

RabbitMQ的概念 RabbitMQ 是一个消息中间件&#xff1a;它接受并转发消息。你可以把它当做一个快递站点&#xff0c;当你要发送一个包裹时&#xff0c;你把你的包裹放到快递站&#xff0c;快递员最终会把你的快递送到收件人那里&#xff0c;按照这种逻辑 RabbitMQ 是 一个快递…...

玩转软件|钉钉个人版内测启动:AI探索未来的工作方式

目录 前言 正文 AI为核心&#xff0c;个人效率为王&#xff01; 指令中心&#xff0c;解锁AI技巧&#xff01; 灵感Store&#xff0c;探索更多可能&#xff01; 未来的AI&#xff0c;即将问世&#xff01; 个人内测体验 前言 重磅消息&#xff1a;钉钉个人版在8月16日正…...

【Linux】一张图了解系统文件

首先先认识磁盘结构 系统文件分布图 文件查找 文件删除 文件的增删改查都是围绕inode来完成的&#xff0c;所以当我们要进行文件删除的时候&#xff0c;只需要通过inode来获取到它对应的block bitmap和inode bitmap数据块容器和保存文件属性的位置置为 0即可 &#xff0c;如果想…...

自动化测试平台seldom-platform部署及使用

介绍 seldom-platform是一个基于seldom测试框架的测试平台 项目地址&#xff1a;https://github.com/SeldomQA 文档&#xff1a;seldom 语雀 首先&#xff0c;专门为seldom测试框架提供平台化支持。其次&#xff0c;只负责自动化测试项目的解析、执行用例&#xff0c;当然…...

2023年8月第3周大模型荟萃

2023年8月第3周大模型荟萃 2023.8.22版权声明&#xff1a;本文为博主chszs的原创文章&#xff0c;未经博主允许不得转载。 1、LLM-Adapters&#xff1a;可将多种适配器集成到大语言模型 来自新加坡科技设计大学和新加坡管理大学的研究人员发布了一篇题为《LLM-Adapters: An …...

win11 设置小任务栏

设置后效果 以下两种工具均可 1、StartAllBack 2、Start11...

在 React 中获取数据的6种方法

一、前言 数据获取是任何 react 应用程序的核心方面。对于 React 开发人员来说&#xff0c;了解不同的数据获取方法以及哪些用例最适合他们很重要。 但首先&#xff0c;让我们了解 JavaScript Promises。 简而言之&#xff0c;promise 是一个 JavaScript 对象&#xff0c;它将…...

Docker基础入门:常规软件安装与镜像加载原理

Docker基础入门&#xff1a;常规软件安装与镜像加载原理 一、Docker常规软件安装1.1、部署nginx1.2、部署tomcat1.3、部署elasticsearch1.4、如何部署kibana-->连接elasticsearch1.5、部署可视化工具 二、 镜像加载原理2.1、镜像是什么2.2、Docker镜像加速原理2.3、分层理解…...

redis初识

目录 前言&#xff1a; 核心全局命令 key过期实现方式 定时器实现方式 基于优先级队列/堆 redis特性 redis优点 redis单线程模型 redis单线程为什么效率这么高&#xff1f; 核心五种数据类型内部编码方式 前言&#xff1a; redis作为当前主流的内存数据库&#xff08…...

死锁的典型情况、产生的必要条件和解决方案

前言 死锁&#xff1a;多个线程同时被阻塞&#xff0c;他们中的一个或全部都在等待某个资源被释放。由于线程被无限期地阻塞&#xff0c;因此程序不可能正常终止。 目录 前言 一、死锁的三种典型情况 &#xff08;一&#xff09;一个线程一把锁 &#xff08;二&#xff09;…...

日志搞不定?手把手教你如何使用Log4j2

系列文章目录 从零开始&#xff0c;手把手教你搭建Spring Boot后台工程并说明 Spring框架与SpringBoot的关联与区别 SpringBean生成流程详解 —— 由浅入深(附超精细流程图) Spring监听器用法与原理详解 Spring事务畅谈 —— 由浅入深彻底弄懂 Transactional注解 面试热点详解…...

基于Googlenet深度学习网络的交通工具种类识别matlab仿真

目录 1.算法运行效果图预览 2.算法运行软件版本 3.部分核心程序 4.算法理论概述 5.算法完整程序工程 1.算法运行效果图预览 2.算法运行软件版本 matlab2022a 3.部分核心程序 ....................................................................................% 获…...

R语言04-R语言中的列表

概念 在R语言中&#xff0c;列表&#xff08;List&#xff09;是一种复杂的数据结构&#xff0c;用于存储不同类型的元素&#xff0c;包括向量、矩阵、数据框、函数等。列表是一种非常灵活的数据结构&#xff0c;可以将不同类型的数据组合在一起&#xff0c;类似于Python中的字…...

[Linux]进程概念

[Linux]进程概念 文章目录 [Linux]进程概念进程的定义进程和程序的关系Linux下查看进程Linux下通过系统调用获取进程标示符Linux下通过系统调用创建进程-fork函数使用 进程的定义 进程是程序的一个执行实例&#xff0c;是担当分配系统资源&#xff08;CPU时间&#xff0c;内存…...

GEE/PIE遥感大数据处理与应用

随着航空、航天、近地空间等多个遥感平台的不断发展&#xff0c;近年来遥感技术突飞猛进。由此&#xff0c;遥感数据的空间、时间、光谱分辨率不断提高&#xff0c;数据量也大幅增长&#xff0c;使其越来越具有大数据特征。对于相关研究而言&#xff0c;遥感大数据的出现为其提…...

● 647. 回文子串 ● 516.最长回文子序列

647. 回文子串 class Solution { public:int countSubstrings(string s) {vector<vector<bool>>dp(s.size(),vector<bool>(s.size(),false));int res0;for(int is.size()-1;i>0;i--){for(int ji;j<s.size();j){if(s[i]s[j]){if(j-i<1){res;dp[i][…...

C++:std::is_convertible

C++标志库中提供is_convertible,可以测试一种类型是否可以转换为另一只类型: template <class From, class To> struct is_convertible; 使用举例: #include <iostream> #include <string>using namespace std;struct A { }; struct B : A { };int main…...

【网络安全产品大调研系列】2. 体验漏洞扫描

前言 2023 年漏洞扫描服务市场规模预计为 3.06&#xff08;十亿美元&#xff09;。漏洞扫描服务市场行业预计将从 2024 年的 3.48&#xff08;十亿美元&#xff09;增长到 2032 年的 9.54&#xff08;十亿美元&#xff09;。预测期内漏洞扫描服务市场 CAGR&#xff08;增长率&…...

鸿蒙中用HarmonyOS SDK应用服务 HarmonyOS5开发一个医院查看报告小程序

一、开发环境准备 ​​工具安装​​&#xff1a; 下载安装DevEco Studio 4.0&#xff08;支持HarmonyOS 5&#xff09;配置HarmonyOS SDK 5.0确保Node.js版本≥14 ​​项目初始化​​&#xff1a; ohpm init harmony/hospital-report-app 二、核心功能模块实现 1. 报告列表…...

零基础设计模式——行为型模式 - 责任链模式

第四部分&#xff1a;行为型模式 - 责任链模式 (Chain of Responsibility Pattern) 欢迎来到行为型模式的学习&#xff01;行为型模式关注对象之间的职责分配、算法封装和对象间的交互。我们将学习的第一个行为型模式是责任链模式。 核心思想&#xff1a;使多个对象都有机会处…...

用docker来安装部署freeswitch记录

今天刚才测试一个callcenter的项目&#xff0c;所以尝试安装freeswitch 1、使用轩辕镜像 - 中国开发者首选的专业 Docker 镜像加速服务平台 编辑下面/etc/docker/daemon.json文件为 {"registry-mirrors": ["https://docker.xuanyuan.me"] }同时可以进入轩…...

dify打造数据可视化图表

一、概述 在日常工作和学习中&#xff0c;我们经常需要和数据打交道。无论是分析报告、项目展示&#xff0c;还是简单的数据洞察&#xff0c;一个清晰直观的图表&#xff0c;往往能胜过千言万语。 一款能让数据可视化变得超级简单的 MCP Server&#xff0c;由蚂蚁集团 AntV 团队…...

IP如何挑?2025年海外专线IP如何购买?

你花了时间和预算买了IP&#xff0c;结果IP质量不佳&#xff0c;项目效率低下不说&#xff0c;还可能带来莫名的网络问题&#xff0c;是不是太闹心了&#xff1f;尤其是在面对海外专线IP时&#xff0c;到底怎么才能买到适合自己的呢&#xff1f;所以&#xff0c;挑IP绝对是个技…...

处理vxe-table 表尾数据是单独一个接口,表格tableData数据更新后,需要点击两下,表尾才是正确的

修改bug思路&#xff1a; 分别把 tabledata 和 表尾相关数据 console.log() 发现 更新数据先后顺序不对 settimeout延迟查询表格接口 ——测试可行 升级↑&#xff1a;async await 等接口返回后再开始下一个接口查询 ________________________________________________________…...

在鸿蒙HarmonyOS 5中使用DevEco Studio实现企业微信功能

1. 开发环境准备 ​​安装DevEco Studio 3.1​​&#xff1a; 从华为开发者官网下载最新版DevEco Studio安装HarmonyOS 5.0 SDK ​​项目配置​​&#xff1a; // module.json5 {"module": {"requestPermissions": [{"name": "ohos.permis…...

(一)单例模式

一、前言 单例模式属于六大创建型模式,即在软件设计过程中,主要关注创建对象的结果,并不关心创建对象的过程及细节。创建型设计模式将类对象的实例化过程进行抽象化接口设计,从而隐藏了类对象的实例是如何被创建的,封装了软件系统使用的具体对象类型。 六大创建型模式包括…...