前端使用lodop如何获取打印状态
前面已经说过,如何简单使用lodop了,今天说一下如何获得lodop的打印状态?
在教程里面找了半天,摸索出来了一套。
template:
<!-- 实验代码 -->
<div>job码</div>
<input type="text" v-model="jobCode">
<div id="printarea" v-html="bb" v-show="false"></div>
<el-button @click="print()">打印</el-button>
<el-button @click="preview()">预览</el-button>
data:
bb:`<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<style> </style>
<body>
<div style="text-align:center;font-family:'楷体';">
<div style="font-size:24px;font-weight:600;">交通会</div>
<div style="font-size:24px;font-weight:500;margin-top:70px;">大萨达所大所大萨达所大所所大萨达所大所</div>
</div> </body>
</html>`,
jobCode:'1',//job码
printStatus:0,//打印状态
createPrintCode(){
LODOP = getLodop();
// 打印初始化
LODOP.PRINT_INIT("打印任务名称");
// 设置字体
LODOP.SET_PRINT_STYLE("FontSize",18);
// 设置加粗
LODOP.SET_PRINT_STYLE("Bold",1);
// 设置纸张大小 打印方向/width/height
LODOP.SET_PRINT_PAGESIZE(0,"100mm","100mm","商品标签");
//在指定位置加文本
// LODOP.ADD_PRINT_TEXT(50,"20%",260,39,"打印页面部分内容");
// 增加超文本项top/left/width/height(高度自适应,设小了有效,大了无效)
LODOP.ADD_PRINT_HTM("20mm","10mm","80mm","600mm",document.getElementById("printarea").innerHTML);
},
print(){//打印
var self=this;
this.createPrintCode();
LODOP.SET_PRINT_MODE("CATCH_PRINT_STATUS",true);//执行该语句之后,PRINT指令不再返回那个所谓“打印成功”
if (LODOP.CVERSION) {//判断c_lodop是否存在,安装了c-lodop就会存在
LODOP.On_Return=function(TaskID,Value){
console.log("TaskID:"+TaskID);
console.log("Value:"+Value);//job代码
self.jobCode=Value;
var timer = setInterval(function(){
console.log("每次轮询的状态:"+self.printStatus);
if(self.printStatus!=0||self.printStatus!=false){
clearInterval(timer);
return;
}
self.getStatusValue(Value);
},300);
};
LODOP.PRINT();
return;
} else{
console.log("c-lodop出错了");
}
},
getStatusValue(job){//根据job代码,获取是否打印成功
var self=this;
LODOP.On_Return=function(TaskID,Value){
console.log("TaskID:"+TaskID);
console.log("打印成功状态:"+Value);//打印成功状态
self.printStatus=Value;
};
LODOP.GET_VALUE("PRINT_STATUS_OK",job);
},
preview(){//预览
this.createPrintCode();
// 预览
LODOP.PREVIEW();
// 直接打印
// LODOP.PRINT();
},
下面来简单说一下,lodop插件可以实现静默打印,免费的时候,静默打印会带水印。
调起静默打印很简单,但是如何知道打印机打印成功呢?
看了看,lodop的例子,我们可以获得打印状态,如果想更智能点,需要去循环查询此状态,一旦返回成功的状态,我们就可以进行下一步处理了!!
第一次调用: LODOP.On_Return=function(TaskID,Value){},就是给lodop加了个回调函数,TaskID:代表任务id,value是job代码,我也不大理解job代码,不过用它可以去查询,打印状态!! 那么,这个job代码在哪用呢?
看上面代码可以知道,在getStatusValue(job)方法中用到了它,这个方法里又一次给lodop加了个回调函数,参数和第一次调用名字完全一样,但是加完这个回调函数后,下面还写了一句代码:
LODOP.GET_VALUE("PRINT_STATUS_OK",job);
这句代码是 根据job代码 查询打印状态的,调用完这句后,就会触发那个回调函数了,嗯此时的回调内 反回来的value值,就是打印的状态(成功:1或true 失败:0或false),这个值可以用一个全局变量接住,当我们点击打印时,就循环查询这个状态,一旦,返回的状态时成功状态,那么终止循环查询。
具体可以参考,教程的45讲
判断本地c-lodop服务是否启动,可以在
LODOP = getLodop();后加一个判断
如果c-lodop服务没启动,这个值就会是undefined
如果启动了,会有值!!!
判断打印机是否忙碌:“PRINT_STATUS_BUSY”
getStatusValue(valueName,job){//根据job代码,获取是否打印成功
var self=this;
LODOP.On_Return=function(TaskID,Value){
console.log("TaskID:"+TaskID);
console.log(valueName+":"+Value);
self.printStatus=Value;
};
LODOP.GET_VALUE(“PRINT_STATUS_BUSY”,job);
},
下面,再上一个完整的demo,在vue中使用:
<template>
<div class="dashboard-container">
<!-- 实验代码 -->
<div>job码</div>
<div id="printarea" v-html="bb" v-show="false"></div>
<el-button @click="print(1,bb)" :disabled="Boolean(printStatus)">打印</el-button>
<el-button @click="preview()">预览</el-button>
<el-button @click="print(count,bb)" :disabled="Boolean(printStatus)">重复打印</el-button>
<input type="text" v-model.number="count">
<!-- <el-button @click="reqeatPrint()">分任务连续打印</el-button> -->
<el-button @click="breakPagetPrint(printList)">分页连续打印</el-button>
<!-- 遮罩层 -->
<div class="dayinShadow" v-show="shadowShow">
<i class="el-icon-close" @click="closeShadow()" style="cursor:pointer;float:right;font-size:30px;margin:30px;"></i>
正在打印中...
</div>
<!-- 实验代码 -->
</div>
</template> <script>
var LODOP; export default {// 实验代码
watch:{
},
data(){
return {
// 实验代码
bb:`<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<style> </style>
<body>
<div style="text-align:center;font-family:'微软雅黑';">
<div style="font-size:24px;font-weight:600;">xx</div>
<div style="font-size:20px;font-weight:500;margin-top:50px;">xx市</div>
<!-- <img src="http://cmsppt.hoohui.cn/qrCode/1564626553.png" /> -->
</div>
</body>
</html>`,
cc:`<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<style> </style>
<body>
<div style="text-align:center;font-family:'微软雅黑';">
<div style="font-size:24px;font-weight:600;">xx</div>
<div style="font-size:20px;font-weight:500;margin-top:50px;">xx市</div>
</div>
</body>
</html>`,
printList:[],//打印数组
printStatus:0,//打印状态
shadowShow:false,//遮罩显示与否
count:1,//打印份数
// 实验代码
}
},
created(){
this.printList.push(this.bb);
this.printList.push(this.cc);
console.log(this.printList)
},
mounted(){ },
methods:{
createPrintCode(count,htmlStr){
var self=this;
LODOP = getLodop();
return new Promise(function(resolve,reject){
if (LODOP.CVERSION) {//是否能检测到c-lodop的版本号
if(!LODOP){//c-lodop如果没启动,则不能打印
alert("请启动c-lodop服务");
return;
}
// 打印初始化
LODOP.PRINT_INIT("打印任务名称");
if(count){//设置重复打印要放在初始化后面
LODOP.SET_PRINT_COPIES(count);
}
// 设置纸张大小 打印方向/width/height
LODOP.SET_PRINT_PAGESIZE(0,"100mm","100mm","商品标签");
// 增加超文本项top/left/width/height(高度自适应,设小了有效,大了无效)
LODOP.ADD_PRINT_HTM("40mm","10mm","80mm","600mm",htmlStr);
resolve();
} else{
alert("请下载c-lodop");
}
})
}, breakPagetPrint(htmlList=[]){//分页连续打印
var self=this;
if(htmlList.length==0){return};
self.shadowShow=true;
LODOP = getLodop();
if (LODOP.CVERSION) {//是否能检测到c-lodop的版本号
if(!LODOP){//c-lodop如果没启动,则不能打印
alert("请启动c-lodop服务");
return;
}
LODOP.PRINT_INIT("分页打印任务");//初始化在循环中
// 设置纸张大小 打印方向/width/height
LODOP.SET_PRINT_PAGESIZE(0,"100mm","100mm","商品标签");
// 增加超文本项top/left/width/height(高度自适应,设小了有效,大了无效)
for(let i=0,len=htmlList.length;i<len;i++){
LODOP.ADD_PRINT_HTM("40mm","10mm","80mm","600mm",htmlList[i]);
LODOP.NewPage();
}
self.carryPrint();//执行打印命令
} else{
alert("请下载c-lodop");
}
},
print(count,htmlStr){//打印
var self=this;
if(!htmlStr){alert("没有要打印的内容"); return;};
self.shadowShow=true;
this.createPrintCode(count,htmlStr).then(function(){
self.carryPrint();
})
},
carryPrint(){//执行打印命令
var self=this;
LODOP.SET_PRINT_MODE("CATCH_PRINT_STATUS",true);//执行该语句之后,PRINT指令不再返回那个所谓“打印成功”,才能获取到打印状态
LODOP.On_Return=function(TaskID,Value){//TaskID:任务id,Value:job代码
var timer = setInterval(function(){
if(self.printStatus!=0 || self.printStatus!=false){
clearInterval(timer);
self.printStatus=0;
self.shadowShow=false;
return;
}
// PRINT_STATUS_BUSY
self.getStatusValue("PRINT_STATUS_OK",Value);//查询打印任务完成状态
},500);
};
LODOP.PRINT();
},
getStatusValue(valueName,job){//根据job代码,获取是否打印成功
var self=this;
LODOP.On_Return=function(TaskID,Value){//TaskID:任务id,Value:打印成功状态
//弹出层弹出时,而打印机没正常打印,此时为了能关闭弹窗,需要强行把打印状态改成1(完成状态)
self.printStatus = self.shadowShow ? Value : 1;
console.log("打印成功状态:"+self.printStatus);
};
LODOP.GET_VALUE(valueName,job);
},
preview(){//预览
this.createPrintCode().then(function(){
LODOP.PREVIEW();
})
},
closeShadow(){//强制关闭遮罩层
this.printStatus=1;//强制打印状态变为1
this.shadowShow=false;//强制遮罩成关闭
},
reqeatPrint(){//分任务连续打印
var self=this;
LODOP = getLodop();
for(let i=0,len=self.printList.length;i<len;i++){
LODOP.PRINT_INIT("循环打印任务");//初始化在循环中
// 设置字体
LODOP.SET_PRINT_STYLE("FontSize",18);
// 设置加粗
LODOP.SET_PRINT_STYLE("Bold",1);
// 设置纸张大小 打印方向/width/height
LODOP.SET_PRINT_PAGESIZE(0,"100mm","100mm","商品标签");
// 增加超文本项top/left/width/height(高度自适应,设小了有效,大了无效)
LODOP.ADD_PRINT_HTM("40mm","10mm","80mm","600mm",self.printList[i]);
LODOP.PRINT();
}
},
}
}
</script> <style lang="scss" scoped>
.dashboard {
.dayinShadow{
position: fixed;
top:0;
left:0;
right:0;
bottom:0;
background:rgba(0,0,0,.5);
z-index: 1200;
color:#ffffff;
font-size:20px;
text-align:center;
line-height:800px;
}
</style>
前端使用lodop如何获取打印状态的更多相关文章
- LODOP获取打印状态码和时间列表
之前有博文介绍获取打印状态码和打印状态码的含义,相关博文:LODOP获取打印机状态码和状态码含义测试.此外 ,也有获取状态码及其变化的方法,可以获取打印状态码的列表,列表包含每个状态和每个状态的时间. ...
- 前端使用lodop插件进行打印设置
先前梳理了后台打印导出参考:https://www.cnblogs.com/yyk1226/p/9856032.html,但是没有显示出来打印预览页面. 本章使用Lodop插件进行打印设置,实现打印机 ...
- LODOP获取打印机状态码和状态码含义测试
由于打印机千差万别,打印机执行的标准也不一样,LODOP获取的打印状态码也可能不同,安装了个打印机驱动实际测试一下,测试的打印机驱动是Brother Color Type3 Class Driver. ...
- lodop和c-lodop通过打印状态和任务不在队列获取打印成功
之前的博文有通过判断pirnt的返回值,判断加入队列算打印成功,建议使用这种简单的判断方法.此外还有其他判断方法,例如通过PRINT_STATUS_OK判断,但是这个状态不是所有打印机能支持这种判断成 ...
- LODOP获取打印成功,是否加入队列
之前博文介绍过获取打印机状态码 LODOP获取打印机状态码和状态码含义测试,但是打印机种类千差万别,状态码不一定准确,特别是打印成功的状态码,获取任务不在队列,可以判断打印成功,删除任务也是任务不在队 ...
- asp.net Lodop实现批量打印
1.列表(前台) <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="w_stu ...
- 如何在使用 RemoteWebDriver 打开网页的同时获取 Http 状态码
最近一直在用Selenium这个开源项目写一些web 自动化的小玩意.本来一直运行的挺好,直到有一天突然发现资源抓取失败了,翻看日志才发现,原来本该正常打开的页面返回了504错误所以自然失败了.如何避 ...
- lodop判断是否打印成功
需要引用js <script src="js/jquery-3.3.1.js"></script> <script src="js/Lodo ...
- iOS 获取网络状态
在iOS开发者,获取网络状态比较常用 -(NSString *)getNetWorkStates{ UIApplication *app = [UIApplication sharedApplicat ...
随机推荐
- Abandoning Roads CodeForces - 1149D (最小生成树)
大意: 给定无向图, 边权只有两种, 对于每个点$x$, 输出所有最小生成树中, 点$1$到$x$的最短距离. 先将边权为$a$的边合并, 考虑添加边权为$b$的边. 每条路径只能经过每个连通块一次, ...
- mysql存储emoji表情报错的处理方法【更改编码为utf8mb4】
utf-8编码可能2个字节.3个字节.4个字节的字符,但是MySQL的utf8编码只支持3字节的数据,而移动端的表情数据是4个字节的字符.如果直接往采用utf-8编码的数据库中插入表情数据,Java程 ...
- Unity场景间数据传递方法
在游戏开发中,会常用到场景间传递数据的方法(比如关卡选择,过关后自动回到关卡选择界面,以动画方式解锁下一关),目前研究了三种: 1. 使用DontDestroyOnLoad方法: (1)在场景A中做个 ...
- stm32 按键操作
抖动时间的长短由按键的机械特性决定,一般为5ms-10ms void key() { static u8 flag = 1; if(flag == 1 && KEY_UP == 1) ...
- ulimit用法
ulimit -a:显示当前所有的资源限制 -c:core文件大小 -f:设置创建文件的最大值 -n:设置内核可以同时打开的文件描述符的最大值 -p:设置管道缓冲区的最大值 -s:设置堆栈的最大值 - ...
- MMU简介
MMU(Memory Management Unit)内存管理单元 负责虚拟地址到物理地址的映射,并提供硬件机制的内存访问权限检查.内存访问权限的检查可以保护每个进程所用的内存不会被其他进程所破坏 地 ...
- 配置Hadoop,hive,spark,hbase ————待整理
五一一天在家搭建好了集群,要上班了来不及整理,待下周周末有时间好好整理整理一个完整的搭建hadoop生态圈的集群的系列 若出现license information(license not accep ...
- vue axios传参报错的解决方法
今天有人问同一套后台系统为什么jquery可以正常使用,axios却报错呢,下面总结如下: 总的来说是jquery和axios传参类型不同,那为什么jquery和axios请求时传参类型不同? 1)j ...
- 阿里高级架构师教你如何使用Spring Cloud Ribbon重试请求
在微服务调用中,一些微服务圈可能调用失败,通过再次调用以达到系统稳定性效果,本文展示如何使用Ribbon和Spring Retry进行请求再次重试调用. 在Spring Cloud中,使用load b ...
- SRX550路由器缓存满了无法在web页面操作解决方法
SRX550路由器缓存满了无法在web页面操作解决方法 首页出现下图为满的标志,我这个文档就是解决这中情况,让web页面可以操作的 1. 打开命令行,输入用户密码,进入路由器 注意:这里使用te ...