lodop转到其他html页⾯,vue项⽬中使⽤Lodop实现批量打印
html页⾯和pdf⽂件
1.Lodop是什么？
Lodop(标⾳：劳道谱，俗称：露肚⽪)是专业WEB控件,⽤它既可裁剪输出页⾯内容，⼜可⽤程序代码直接实现复杂打印。控件功能强⼤，却简单易⽤，所有调⽤如同JavaScript扩展语句，主要接⼝函数如下：
●PRINT_INIT(strPrintTaskName)打印初始化
●SET_PRINT_PAGESIZE(intOrient,intPageWidth,intPageHeight,strPageName)设定纸张⼤⼩
参数说明：
intOrient：打印⽅向及纸张类型
1---纵向打印，固定纸张；
2---横向打印，固定纸张；
3---纵向打印，宽度固定，⾼度按打印内容的⾼度⾃适应(见样例18)；
0---⽅向不定，由操作者⾃⾏选择或按打印机缺省设置。
intPageWidth：
纸张宽，单位为0.1mm 譬如该参数值为45，则表⽰4.5mm，计量精度是0.1mm。
intPageHeight：
固定纸张时该参数是纸张⾼；⾼度⾃适应时该参数是纸张底边的空⽩⾼，计量单位与纸张宽⼀样。
strPageName：
纸张类型名
●ADD_PRINT_HTM(intTop,intLeft,intWidth,intHeight,strHtml)增加超⽂本项
●ADD_PRINT_TEXT(intTop,intLeft,intWidth,intHeight,strContent)增加纯⽂本项
●ADD_PRINT_TABLE(intTop,intLeft,intWidth,intHeight,strHtml)增加表格项
●ADD_PRINT_SHAPE(intShapeType,intTop,intLeft,intWidth,intHeight,intLineStyle,intLineWidth,intColor)画图形
●SET_PRINT_STYLE(strStyleName, varStyleValue)设置对象风格
●PREVIEW打印预览
●PRINT直接打印
●PRINT_SETUP打印维护
●PRINT_DESIGN打印设计
最基本的打印过程⾄少有初始化语句、添内容语句和打印语句三部分组成，例如：
LODOP.PRINT_INIT("打印任务名"); //⾸先⼀个初始化语句
LODOP.ADD_PRINT_TEXT(0,0,100,20,"⽂本内容⼀");//然后多个ADD语句及SET语句
LODOP.PRINT(); //最后⼀个打印(或预览、维护、设计)语句
2.在vue项⽬中如何实现批量打印功能？
1.在index页⾯中引⼊js⽂件
2.在批量打印时我们得先区分是html标签打印还是pdf打印
// 批量打印lazada国内⾯单(html标签)
printingClick() {
const tableInfo = this.multipleSelection.map(item =>
window.decodeURIComponent(escape(window.atob(item.shippingPdfUrl))))
console.log(tableInfo)
LODOP = getLodop()
LODOP.PRINT_INIT('打印')
LODOP.SET_PRINT_PAGESIZE(3, 1000, 1500, '')// 3代表纵向打印，宽度固定，⾼度按打印内容的⾼度⾃适应，纸张10*15
for (let i = 0; i < tableInfo.length; i++) {
}
LODOP.SET_PREVIEW_WINDOW(0, 0, 0, 0, 0, '')
if (LODOP.SET_PRINTER_INDEXA(0)) { LODOP.PRINT() } // 这⾥实现的是选择打印机，数字代表打印机的型号，如果不需要预览，将LODOP.PREVIEW()改为LODOP.PRINT()
},
creatOneRage(table) {
LODOP.NewPage()
LODOP.ADD_PRINT_IMAGE(12, 12, '95%', '95%', table)
LODOP.SET_PRINT_STYLEA(0, 'Stretch', 2)
},
SET_PRINTER_INDEX(oIndexOrName)；按序号或名称指定打印机，选定后禁⽌⼿⼯重选；
SET_PRINTER_INDEXA(IndexorName)；按序号或名称指定打印机，选定后允许⼿⼯重选；
// 批量打印pdf⽂件
// 批量打印pdf⽂件
printingShopee() {
const strURL = ['QzpcVXNlcnNcYWRtaW5cRG93bmxvYWRzXDE5MDkxOTA1MzU0S0QzRy5wZGY=',
'QzpcVXNlcnNcYWRtaW5cRG93bmxvYWRzXDE5MTAyMzIwMjUxQVdUSCAoMSkucGRm']// 线上地址有跨越问题，本地路径模拟打印，路径不能直接识别，所以先加密了
const strURLorContent = strURL.map(item => window.atob(item))
LODOP = getLodop()
LODOP.PRINT_INIT('打印')
LODOP.SET_PRINT_PAGESIZE(3, 1000, 1500, '')
for (let j = 0; j < strURLorContent.length; j++) {
}
LODOP.SET_PREVIEW_WINDOW(0, 0, 0, 0, 0, '')
if (LODOP.SET_PRINTER_INDEXA(1)) { LODOP.PREVIEW() } //上⾯的例⼦选择的打印机序号为0，这⾥为1，上⾯的直接打印，这⾥的是预览，可以根据需求选择
LODOP.PREVIEW()
},
creatPdfRage(pdf) {
LODOP.NewPage()
LODOP.ADD_PRINT_PDF(0, 0, '100%', '100%', pdf)
},
3.部分⾯单信息返回的html标签我们需要进⾏过滤
demo:
⼀个很长的html标签字符串，我们需要过滤掉`
`标签后⾯的所有内容：
var str = '
'
console.log(str)
var arr = str.split('
')
console.log(arr[0])bootstrap项目
注：打印机的安装，先去打印机官⽹下对应的驱动，然后在控制⾯板中添加打印机
vue项⽬中使⽤ts(typescript)⼊门教程
最近项⽬需要将原vue项⽬结合ts的使⽤进⾏改造，这个后⾯应该是中⼤型项⽬的发展趋势，看到⼀篇不错的⼊门教程，结合它并进⾏了⼀点拓展记录之.本⽂从安装到vue组件编写进⾏了说明，适合⼊门. 1.引⼊T ...
vue项⽬中导出PDF的两种⽅式
参考⼤家导出的⽅式，基本上是如下两种: 1.使⽤ html2Canvas + jsPDF 导出PDF, 这种⽅式什么都好，就是下载的pdf太模糊了.对要求好的pdf这种⽅式真是不⾏啊! 2.调⽤浏览器 ...
在vue项⽬中设置BASE_URL
在vue项⽬中设置BASE_URL 1.在config⽂件夹中新建global.js⽂件 const BASE_URL = '192.168.1.62:8080/rest/' expor ...
vue项⽬中使⽤bpmn-流程图xml⽂件中节点属性转json结构
内容概述 本系列“vue项⽬中使⽤bpmn-xxxx”分为七篇，均为⾃⼰使⽤过程中⽤到的实例,⼿⼯原创,⽬前陆续更新中.主要包括vue项⽬中bpmn使⽤实例.应⽤技巧.基本知识点总结和需要注意事项，具 ...
vue 项⽬中实⽤的⼩技巧
# 在Vue 项⽬中引⼊Bootstrap 有时在vue项⽬中会根据需求引⼊Bootstrap,⽽Bootstrap⼜是依赖于jQuery的，在使⽤npm按照时，可能会出现⼀系列的错误 1.安装jQu ...
如何在VUE项⽬中添加ESLint
在vue项⽬中, mock数据
1. 在根⽬录下创建 test ⽬录, ⽤来存放模拟的 json 数据, 在 test ⽬录下创建模拟的数据 data.json ⽂件
2.在build⽬录下的 dev-server.js的⽂件作如下 ...
浅谈 Axios 在 Vue 项⽬中的使⽤
介绍 Axios 是⼀个基于 promise 的 HTTP 库，可以⽤在浏览器和 node.js 中. 特性 它主要有如下特性: 浏览器端发起XMLHttpRequests 请求 Node端发起http ...
去除vue项⽬中的&num；及其ie9兼容性
⼀.如何去除vue项⽬中访问地址的# vue2中在路由配置中添加mode(vue-cli创建的项⽬在src/router/ind
ex.js) export default new Router({ m ...
随机推荐
Gitblit中采⽤Ticket模式进⾏协作开发
Git⽬前的代码分⽀管理模型中,⽐较主要的有Git-Flow.Github Pull Request.⼤家⽇常或多或少都在⽤着. 在不想安装Gitlab这种重量级的环境的情况下，如果是利⽤git⼀步步 ...
⽤⾃⼰的话描述wcf中的传输安全与消息安全的区别(三)
消息交换安全模式 PS：很多书上把transfer security和transport security都翻译成“传输安全”，这样易混淆.我这⾥把transfer说成消息交换安全. 安全的含义分为验 ...
Apache⽇志配置详解(rotatelogs LogFormat)
logs/error_logCustomLog logs/access_log common--默认为以上部分 修改为如下: ErrorLog "|/usr/sbin/rotatelogs ...
使⽤react native for android⽣成app
CSDN⾸页>; 移动开发 直接拿来⽤！最⽕的Android开源项⽬(完结篇)
此前,CSDN移动频道推出的GitHub平台上“最受欢迎的开源项⽬”系列⽂章引发了许多读者的热议，在“直接拿来⽤!最⽕的Android开源项⽬”系列⽂章(⼀).(⼆)中，我们也相继盘点了40个GitH ...
关于使⽤阿⾥OSS服务搭建图床和使⽤PicGO上传图⽚到图床
最近喜欢上了使⽤markdown来写博客，可是markdown的图⽚却是本地的，如果我要发博客，那么⼜要重复截图了.于是⼲脆弄了个图床，本地截图的时候上传到图床,markdown中的代码结果也是图床⾥ ...
java获取真实的IP地址⼯具类
在实际项⽬中，有调⽤⽀付完成⽀付功能，在⽀付的请求参数中需要传递⼀个本机的ip地址,java代码运⾏环境⽬前为windows10以及centos7. 以下为获取ip地址⼯具类: package ...
Kali-linux使⽤Metasploit基础
Metasploit是⼀款开源的安全漏洞检测⼯具.它可以帮助⽤户识别安全问题，验证漏洞的缓解措施，并对某些软件进⾏安全性评估，提供真正的安全风险情报.当⽤户第⼀次接触Metasploit渗透测试框架软 ...
linux 查并kill进程
以php以关键字查进程 $ ps aux | grep php root 32957 0.0 0.1 2470904 8908 s002 S+ 4:53下 ...
mysql查询今⽇、本周、本⽉记录
SELECT * FROM table_name WHERE to_days(createtime) = to_days(now()); SELECT * FROM table_name WHERE ...
版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。
发表评论