vue实现二维码批量打印功能

业务需求：客户需要给每个商品贴上二维码，为了更加高效的完成这项工作需要配合热敏打印机实现批量打印二维码的需求，因为是web项目后端会部署到服务器上，因此只能通过js的方式在前端调用打印机。（技术难点js调打印机规划打印界面）

一、走过的弯路

通过先生成word文档的方式调用普通打印机实现打印功能（不能满足客户需求）。
ActiveX控件，通过调用打印机动态的函数库来规划打印页面实现批量打印功能（仅在ie浏览器中可用）。
lodop打印控件

二、使用lodop控件实现打印功能

1、在vue项目中引入lodop控件

http://note.youdao.com/s/FHKGmjlK

2、在需要调用的页面引入

    import { getLodop } from "./tools/lodop";

3、使用lodop插件规划页面

           //调用打印机getPrint(opt) {let LODOP = getLodop();for (let i=0;i<opt.length;i++){//打印初始化，LODOP.PRINT_INIT("");LODOP.SET_PRINT_PAGESIZE(1,800,600,"");//设置打印模式PRINT_NOCOLLATE非逐份打印LODOP.SET_PRINT_MODE("PRINT_NOCOLLATE",1);LODOP.ADD_PRINT_TEXTA('标题','5mm','24mm','36mm','10mm',"测试");LODOP.ADD_PRINT_BARCODE('15mm','5mm','39mm','39mm',"QRCode","goodsId="+opt[i].id);LODOP.ADD_PRINT_TEXTA('商品名称','17mm','43mm','30mm',100,"商品名称");LODOP.ADD_PRINT_TEXTA('名称内容','23mm','43mm','40mm',100,opt[i].productName);LODOP.ADD_PRINT_TEXTA('商品货号','38mm','43mm','30mm',100,"商品货号");LODOP.ADD_PRINT_TEXTA('货号内容','44mm','43mm','40mm',100,opt[i].productSn);LODOP.ADD_PRINT_RECT('13mm', '0mm', '81mm', '38mm',1, 1);LODOP.SET_PRINT_STYLEA(1,"FontSize",20);LODOP.SET_PRINT_STYLEA(2,"FontSize",13);LODOP.SET_PRINT_STYLEA(3,"FontSize",13);LODOP.SET_PRINT_STYLEA(4,"FontSize",13);LODOP.SET_PRINT_STYLEA(5,"FontSize",13);LODOP.PRINT("");// LODOP.PREVIEW();}},

lodop插件的主要功能就相当于动态函数库进行规划图像

附官网地址：http://www.lodop.net/

附参考文档下载地址：http://www.lodop.net/download.html

vue实现二维码批量打印功能相关推荐

实现简单的二维码批量下载功能
二维码批量下载二维码容器隐藏 <divid="code-box"ref="qrCodeDiv"style="position: absolu ...
vue批量生成二维码，打印生成的二维码，并批量下载生成的二维码，qrcode
通过使用 qrcode 生成二维码, 使用 jszip 打包批量二维码文件, 使用 file-saver 下载打包好的zip文件, 使用 vue-print-nb 打印生成的二维码生成二维码: 打印 ...
【实用软件】二维码批量解析软件v1.0
软件介绍二维码批量解析软件软件属于在线解析的,所以必须联网使用软件属于绿色软件,不需要安装,点击后直接运行软件功能二维码批量解析当大家有一大堆二维码,又不想拿着手机一个一个扫的时候,这样的 ...
vue生成二维码并下载
vue生成二维码图片,这里使用的是qrcode.js 这个插件 1.下载插件 npm install --save qrcodejs2 2.组件内使用 <template> <B ...
二维码批量生成下载工具
二维码批量生成下载工具 https://tooltt.com/qrcode-batch/ 通过文本列表批量生成二维码,支持打包下载,方便快捷 https://tooltt.com/qrcode-bat ...
关于扫描二维码下载app功能实现方法
关于扫描二维码下载app功能实现方法功能实现思路: Androidapk的下载本质上就是文件的下载,所以我们只需要在后台提供一个下载的方法,就能是实现apk的下载. 在实现后台代码以后,我们生成 ...
原生Vue实现二维码扫一扫，兼容PC、安卓、IOS
原生Vue实现二维码扫一扫通过使用 vue-qrcode-reader 进行实现,必须是 Https 或 Localhost 文章目录原生Vue实现二维码扫一扫 vue-qrcode-reader ...
利用VUE生成二维码（两种方式）
利用Vue生成二维码 Author:kak vue有两种生成二维码的方式,qrcode.vue-qr(有icon): 1.qrcode npm ``install` `--save qrcodejs2 ...
随机字符串解决大问题之腾讯网如何实现手机扫描二维码登录qq功能的
随机字符串解决大问题之腾讯网如何实现手机扫描二维码登录qq功能的腾讯网(www.qq.com)有一个扫码登录功能很有意思, 点击首页一键登录按钮,就会展现一个二维码,用手机qq扫描此二维码就可以使当 ...

vue实现二维码批量打印功能

vue实现二维码批量打印功能

一、走过的弯路

二、使用lodop控件实现打印功能

1、在vue项目中引入lodop控件

2、在需要调用的页面引入

3、使用lodop插件规划页面

vue实现二维码批量打印功能相关推荐

最新文章

热门文章

vue实现二维码批量打印功能

vue实现二维码批量打印功能

一、走过的弯路

二、使用lodop控件实现打印功能

1、在vue项目中引入lodop控件

2、在需要调用的页面引入

3、 使用lodop插件规划页面

vue实现二维码批量打印功能相关推荐

最新文章

热门文章

3、使用lodop插件规划页面