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

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/46061.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

【RabbitMQ】消息队列-RabbitMQ篇章

文章目录 1、RabbitMQ是什么1.1、RabbitMQ---使用场景一般场景解耦削峰异步 2、Dokcer安装RabbitMQ2.1安装Dokcer2.2安装rabbitmq 3、RabbitMQ入门案例 - Simple 简单模式4、RabbitMQ的核心组成部分4.1 RabbitMQ整体架构4.2RabbitMQ的运行流程 5、RabbitMQ的模式5.1 发布订阅模…

python实现对Android系统手机亮度的调节

要实现对手机亮度的调节&#xff0c;需要使用Android系统的API。以下是一个简单的Python代码示例&#xff0c;演示如何使用ADB工具和Python脚本来控制Android设备的亮度&#xff1a; from adb.client import Client as AdbClient import os# 连接设备 client AdbClient(host&…

大数据-玩转数据-Flink App市场推广统计

一、说明 电商网站中已经有越来越多的用户来自移动端&#xff0c;相比起传统浏览器的登录方式&#xff0c;手机APP成为了更多用户访问电商网站的首选。对于电商企业来说&#xff0c;一般会通过各种不同的渠道对自己的APP进行市场推广&#xff0c;而这些渠道的统计数据&#xf…

[Android Framework] 系统 ANR 问题排查实践小结

文章目录 背景卡顿的定义:卡顿分类:卡顿原因汇总ANR 出现的原理应用层导致ANR系统导致ANR日志抓取traces.txt 是如何生成的分析思路与验证相关日志分析data/anr/traces.txt其他分析思路如何分析生成的 trace.html 文件呢?最后解决参考:背景 本文记录了工作中遇到的Andorid …

正则表达式整理(BRE、ERE、PCRE)

学完正则表达式后&#xff0c;发现vscode的查找替换功能支持正则表达式&#xff0c;经常在vscode上实践&#xff0c;用得也越来越顺手&#xff0c;一度觉得自己的正则表达式玩的挺溜的。 但每每在grep&#xff0c;find&#xff0c;vim这些工具中使用正则表达式时&#xff0c;却…

iOS自定义下拉刷新控件

自定义下拉刷新控件 概述 用了很多的别人的下拉刷新控件&#xff0c;想写一个玩玩&#xff0c;自定义一个在使用的时候也会比较有意思。使应用更加的灵动一些&#xff0c;毕竟谁不喜欢各种动画恰到好处的应用呢。 使用方式如下&#xff1a; tableview.refreshControl XRef…

小程序多图片组合

目录 子组件 index.js 子组件 index.wxml 子组件 index.wxss 父组件引用&#xff1a; 子组件&#xff1a;preview-image 子组件 index.js Component({properties: {previewData: {type: Array,default: [],observer: function (newVal, oldVal) {console.log(newVal, ol…

回归预测 | MATLAB实现GWO-SVM灰狼优化算法优化支持向量机多输入单输出回归预测(多指标,多图)

回归预测 | MATLAB实现GWO-SVM灰狼优化算法优化支持向量机多输入单输出回归预测&#xff08;多指标&#xff0c;多图&#xff09; 目录 回归预测 | MATLAB实现GWO-SVM灰狼优化算法优化支持向量机多输入单输出回归预测&#xff08;多指标&#xff0c;多图&#xff09;效果一览基…

Python 编程快速入门

参考引用 Python编程&#xff1a;从入门到实践&#xff08;第2版&#xff09; 1. 环境配置 VSCode 中配置 Python 运行环境 2. 变量和简单数据类型 2.1 变量 添加了一个名为 message 的变量。每个变量都指向一个值&#xff1a;与该变量相关联的信息为指向的值为文本 “Hell…

图论基础和表示(Java 实例代码)

目录 图论基础和表示 一、概念及其介绍 二、适用说明 三、图的表达形式 Java 实例代码 src/runoob/graph/DenseGraph.java 文件代码&#xff1a; src/runoob/graph/SparseGraph.java 文件代码&#xff1a; 图论基础和表示 一、概念及其介绍 图论(Graph Theory)是离散数…

MySQL基础篇(二)

DML 定义&#xff1a;Data Manipulation Language、数据操作语言&#xff08;增删改&#xff09; 添加数据&#xff08;INSERT&#xff09;修改数据&#xff08;UPDATE&#xff09;删除数据&#xff08;DELETE&#xff09; 添加数据&#xff08;INSERT&#xff09; 给指定的…

【SA8295P 源码分析】33 - Android GVM USB 透传配置

【SA8295P 源码分析】33 - Android GVM USB 透传配置 1. QNX 侧配置 USB1 为 GVM 使用2. Android 端配置 dts:以配置 USB1 为例3. QNX 端配置 linux-la.config:以配置 USB1 为例4. 在Android shell 中配置USB0 / USB1 的 Host/device 模式切换系列文章汇总见:《【SA8295P 源…

Nginx:网站服务

nginx&#xff1a;一个高性能、轻量级的web服务软件 1、稳定性高&#xff08;没有apache稳&#xff09; 2、系统资源消耗低&#xff08;处理http请求的并发能力很高&#xff0c;单台物理服务器可以处理3万到5万个并发请求&#xff09; 稳定&#xff1a;一般在企业中&#xff…

系统架构设计专业技能 · 信息安全技术

系列文章目录 系统架构设计专业技能 网络技术&#xff08;三&#xff09; 系统架构设计专业技能 系统安全分析与设计&#xff08;四&#xff09;【系统架构设计师】 系统架构设计高级技能 软件架构设计&#xff08;一&#xff09;【系统架构设计师】 系统架构设计高级技能 …

<数据结构与算法>堆的应用二叉树的链式实现

目录 前言 一、堆的应用 1. 堆排序 1.1 排升序&#xff0c;建大堆 1.2 时间复杂度计算 2. Top k问题 二、 二叉树的链式实现 1. 二叉树的遍历 2. 二叉树基础OJ 2.2 100. 相同的树 总结 前言 学习完堆的数据结构&#xff0c;我们要清楚&#xff0c;它虽然实现了排序功能&am…

售后服务管理软件怎么选择?售后服务管理系统有什么用?

随着企业信息化发展&#xff0c;越来越多的企业纷纷选择售后服务管理软件来服务客户和进行内部人员管理。借助这款软件&#xff0c;企业能够高效地满足客户提出的需求&#xff0c;并提高客户对售后服务的满意度。售后服务通常涉及客户、客服、维修师傅和服务管理人员等各种角色…

用C++/JS/Python/Java代码描述秋天的味道

前言 秋天是一个充满诗意和浪漫的季节&#xff0c;它带来了清新、芬芳和美食的味道。让我们一起探索如何用编程语言来写出秋天味道的代码吧&#xff01;无论是C、JavaScript、Python还是Java&#xff0c;以下是几个简单的步骤来帮助你创造出充满秋天味道的代码&#xff1a; …

Redis缓存问题(穿透, 击穿, 雪崩, 污染, 一致性)

目录 1.什么是Redis缓存问题&#xff1f; 2.缓存穿透 3.缓存击穿 4.缓存雪崩 5.缓存污染&#xff08;或满了&#xff09; 5.1 最大缓存设置多大 5.2 缓存淘汰策略 6.数据库和缓存一致性 6.1 4种相关模式 6.2 方案&#xff1a;队列重试机制 6.3 方案&#xff1a;异步更新缓…

thinkphp 5 实现UNION ALL 3个联表查询,并且带上搜索条件,名称,时间,手机号

在ThinkPHP 5中实现带有搜索条件、名称、时间和手机号的3个联表查询&#xff08;UNION ALL&#xff09;&#xff0c;您可以按照以下步骤进行操作&#xff1a; 确保已经配置好数据库连接信息和相关的模型。 使用union()方法来构建3个联表查询&#xff0c;同时在每个查询中添加所…

[C++11]

文章目录 1. 自动类型推导1.1 auto1.1.1 推导规则1.1.2 auto的限制1.1.3 auto的应用1.1.4 范围for 1.2 decltype1.2.1 推导规则1.2.2 decltype的应用 1.3 返回类型后置 2.可调用对象包装器、绑定器2.1 可调用对象包装器2.1.1 基本用法2.1.2 作为回调函数使用 2.2 绑定器 3. usi…