lodop打印不显示页码_Lodop插件实现打印功能

下载lodop插件实现打印功能（element-ui框架）

一、vuejs弹窗部分

	...//其他列打印预览打印打印维护

二、methods部分

//点击打印按钮展示弹窗
showPrintDialog:function(showFlag){this.printDialog.showFlag = !!showFlag;
},//关闭打印弹窗closePrintDialog:function(){this.showPrintDialog(false);
},//打印初始化
initLodop:function(){var self = this;setTimeout(function(){self.lodop = Print.getLodop();},1000)},
//打印弹窗页码
handleCurrentChange:function(pageNo){var self = this;this.getPrintList(pageNo);
},//点击打印按钮
printFun:function(){var self = this;this.printDialog.pageNo = 1;this.getPrintBaseInfo(function(){self.getPrintList(self.printDialog.pageNo);self.showPrintDialog(true);});
},//直接打印
print: function() {this.creatPintBill();this.lodop && this.lodop.PRINT();
},
//打印维护
printSetup:function(){this.creatPintBill();this.lodop && this.lodop.PRINT_SETUP();
},
//打印预览
printPriew:function(){this.creatPintBill();this.lodop && this.lodop.PREVIEW();
},getPrintBaseInfo:function(callback){var self = this;this.getdata("/接口，返回基本信息，如背景图",{outboundId:this.outboundId},function(res){if(res.code ==200){self.printDialog.printBaseInfo = res.data;if(typeof callback=="function"){callback();}}},function(){},'get')
},getPrintList:function(pageNo, callback){var self = this;this.getdata("/接口，返回数据",{outboundId:this.outboundId,pageSize: this.printDialog.pageSize,pageNo: pageNo},function(res){if(res.code ==200){self.printDialog.printList = res.data;self.printDialog.total = res.kv && res.kv.total;if(typeof callback=="function"){callback();}}},function(){ },'get')},creatPintBill: function() {if(!this.lodop){return;}var baseInfo = this.printDialog.printBaseInfo;var arr = this.printDialog.printList;var url = "";var initListTopPosition = 128;var rowHeight = 37;var printPageSize = 5;try{eval(baseInfo.printTemplateVO.template);}catch(e){//TODO handle the exception}return;//下面这些是发给后端的打印样式规则，存到 res.data.template里面，这也是为什么前面调用它的原因//放到这里是怕忘了，前面有个return 可以防止重复执行这段天书似的代码
//下面有一张图，那里面可以生成现成的样式代码。this.lodop.PRINT_INIT(baseInfo.printTemplateVO.name);//名字this.lodop.SET_PRINT_STYLEA(0,"ContentVName","baseInfo.printTemplateVO.name");this.lodop.SET_PRINT_MODE("POS_BASEON_PAPER",true);this.lodop.ADD_PRINT_SETUP_BKIMG(url);//添加urlthis.lodop.SET_PRINT_STYLEA(0,"ContentVName","url");//这个是定义url变量this.lodop.SET_SHOW_MODE("BKIMG_LEFT",0);this.lodop.SET_SHOW_MODE("BKIMG_TOP",0);this.lodop.SET_SHOW_MODE("BKIMG_WIDTH",baseInfo.printTemplateVO.width);this.lodop.SET_PRINT_STYLEA(0,"ContentVName","baseInfo.printTemplateVO.width");this.lodop.SET_SHOW_MODE("BKIMG_HEIGHT",baseInfo.printTemplateVO.height);this.lodop.SET_PRINT_STYLEA(0,"ContentVName","baseInfo.printTemplateVO.height");this.lodop.SET_SHOW_MODE("BKIMG_IN_PREVIEW",true);this.lodop.ADD_PRINT_TEXT(71,129,194,19, baseInfo.receivingDeptName);this.lodop.SET_PRINT_STYLEA(0,"ContentVName","baseInfo.receivingDeptName");this.lodop.ADD_PRINT_TEXT(71,390,95,19,  baseInfo.outboundDate);this.lodop.SET_PRINT_STYLEA(0,"ContentVName","baseInfo.outboundDate");this.lodop.ADD_PRINT_TEXT(71,592,115,19, baseInfo.outboundNo);this.lodop.SET_PRINT_STYLEA(0,"ContentVName","baseInfo.outboundNo");this.lodop.ADD_PRINT_TEXT(306,227,258,22,baseInfo.totalAmountCN);this.lodop.SET_PRINT_STYLEA(0,"Alignment",2);this.lodop.SET_PRINT_STYLEA(0,"ContentVName","baseInfo.totalAmountCN");this.lodop.ADD_PRINT_TEXT(306,511,78,22,baseInfo.totalAmount);this.lodop.SET_PRINT_STYLEA(0,"Alignment",2);this.lodop.SET_PRINT_STYLEA(0,"ContentVName","baseInfo.totalAmount");for(var index =0; index < arr.length;index++){this.createBillRow(initListTopPosition+ rowHeight*index, arr, index);}
},createBillRow: function(initTop, arr, index) {this.lodop.ADD_PRINT_TEXT(initTop,66,135,22,arr[index].assetName);this.lodop.SET_PRINT_STYLEA(0,"Alignment",2);this.lodop.SET_PRINT_STYLEA(0,"ContentVName","arr[index].assetName");this.lodop.ADD_PRINT_TEXT(initTop,208,135,22,arr[index].model);this.lodop.SET_PRINT_STYLEA(0,"Alignment",2);this.lodop.SET_PRINT_STYLEA(0,"ContentVName","arr[index].model");this.lodop.ADD_PRINT_TEXT(initTop,350,35,22,arr[index].measurementUnit);this.lodop.SET_PRINT_STYLEA(0,"Alignment",2);this.lodop.SET_PRINT_STYLEA(0,"ContentVName","arr[index].measurementUnit");this.lodop.ADD_PRINT_TEXT(initTop,384,49,22,arr[index].inboundNumber);this.lodop.SET_PRINT_STYLEA(0,"Alignment",2);this.lodop.SET_PRINT_STYLEA(0,"ContentVName","arr[index].inboundNumber");this.lodop.ADD_PRINT_TEXT(initTop,435,74,22,arr[index].inboundPrice);this.lodop.SET_PRINT_STYLEA(0,"Alignment",2);this.lodop.SET_PRINT_STYLEA(0,"ContentVName","arr[index].inboundPrice");this.lodop.ADD_PRINT_TEXT(initTop,512,76,22,arr[index].inboundAmount);this.lodop.SET_PRINT_STYLEA(0,"Alignment",2);this.lodop.SET_PRINT_STYLEA(0,"ContentVName","arr[index].inboundAmount");this.lodop.ADD_PRINT_TEXT(initTop,594,124,22,arr[index].comments);this.lodop.SET_PRINT_STYLEA(0,"Alignment",2);this.lodop.SET_PRINT_STYLEA(0,"ContentVName","arr[index].comments");},//封装AJAX请求
getdata:function(url, postdata, sfunc, efunc, type) {var self = this;if(!postdata) {postdata = {};}$.ajax({type: type ? type : "get",url:  baseUrl + url,data: postdata,dataType: "json",traditional:true,beforeSend: function(xhr) {self.startLoading();},success: function(msg) {$(document).ajaxStop(function(){self.endLoading();});if(sfunc) {sfunc(msg);}},error: function(msg) {if(efunc) {efunc(msg);}}});},

生成代码的地方，点击图上所知位置，有一个生成代码的一项，如下图：

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！