我要评论import {getlodop} from '@/utils/lodopfuncs.js'
//打印表格
export default{
// num 打印还是打印预览 condata 对象形式 传入需要的值 自定义 (自己添加的属性要在下面备注)
// condata title 标题 orgname科室名字
lodoptable:function(num,condata){
//原始table
var table = document.getelementsbyclassname("tableprin")[0]
var thead = table.getelementsbytagname("thead")[0]
var tbody = table.getelementsbytagname("tbody")[0]
var clnthead = thead.clonenode(true)
var clntbody = tbody.clonenode(true)
document.getelementsbyclassname("colnetable")[0].appendchild(clnthead)
document.getelementsbyclassname("colnetable")[0].appendchild(clntbody)
var printtable = document.getelementsbyclassname("printtable")[0]
var printtabletbody = printtable.getelementsbytagname("tbody")[0]
var tbodychild = printtabletbody.children
// 循环tbody的子元素
for (let i = 0; i < tbodychild.length; i++) {
var tbodytrchild = tbodychild[i].children
//循环tbody子元素的子元素
for (let a = 0; a < tbodytrchild.length; a++) {
// let tbodytrchildspan = tbodytrchild[a].getelementsbytagname("span")
let text
text = this.xhtbodyspan(tbodytrchild[a])
tbodytrchild[a].innerhtml = text
tbodytrchild[a].style = "text-align:center;width:80px;word-break: break-all;padding:5px 0;font-size:15px;font-style:normal"
}
}
lodop = getlodop()
lodop.print_init("");
lodop.set_print_pagesize(2, 0, 0, "a4"); //1竖版 2横版
lodop.set_print_mode("full_width_for_overflow", true); //宽度溢出缩放
//创建表格打印 表头自动每页都有
lodop.add_print_table(40,10,"rightmargin:0.9cm",600,document.getelementsbyclassname("printtable")[0].innerhtml);
//创建页码 每页都有
lodop.add_print_text("98%", "90%", 200, 22, "第#页/共&页");
lodop.set_print_stylea(0,"fontsize",10);
//2代表页码类型 1代表其他类型 每页都显示必须函数
//标题
lodop.set_print_stylea(0, "itemtype", 2);
lodop.add_print_text(10, 400, 300, 100, `${condata.title}`);
lodop.set_print_stylea(0,"fontsize",16);
lodop.set_print_stylea(0, "itemtype", 1);
//科室
lodop.add_print_text(10, 10, 300, 100, `科室:${condata.orgname}`);
lodop.set_print_stylea(0,"fontsize",16);
lodop.set_print_stylea(0, "itemtype", 1);
// lodop.add_print_text('97%', 10, '100%', 100, `病区护士长:${this.noteform.headnursename} 灭火:${this.noteform.firefight} 报告:${this.noteform.presentation} 疏散:${this.noteform.evacuate}`);
lodop.set_print_stylea(0,"fontsize",14);
lodop.set_print_stylea(0, "itemtype", 1);
if(num){
lodop.preview();
}else{
lodop.print();
}
location.reload();
},
//遍历子元素直到最后一个子元素
xhtbodyspan:function (ele) {
let con
let elechild = ele.children
if (elechild.length > 0) {
return this.xhtbodyspan(elechild[0])
} else {
con = ele.innerhtml
}
return con
}
}
lodoptable.js
官网下载lodop.js
import lodoptable from './utils/lodoptable'
vue.prototype.$lodoptable = lodoptable
<div class="printtable" hidden>
<table class="colnetable" border="1" width="100%" cellspacing="0" cellpadding="0" style="border-collapse:collapse" bordercolor="#000000"></table>
</div>
5.在methods中加上这段代码 title自己定义 orgname更加实际情况改变 num 0代表打印 1代表打印预览
lodoptable(num){
this.$lodoptable.lodoptable(num,{
"title":"工作量日报",
"orgname":this.$cookies.get("orginfo").orgname
})
},
如对本文有疑问， 点击进行留言回复！！
网友评论