记录一下 ,在此感谢精臣打印机的程序员,二次开发有人指导会顺畅很多
<template>
<view>
<button @click="goToConnectPage()">连接打印机</button>
<button @click="previewEvent()">预览</button>
<button @click="printLabel()">打印</button>
<canvas
:style="{
width: canvasWidthResponsive + 'px',
height: canvasHeightResponsive + 'px',
}"
canvas-id="myCanvas"
></canvas>
</view>
</template>
<script>
import { usePrint } from "@/utils/print";
const {
startJob,
startDrawLabel,
drawText,
drawBarcode,
drawQRCode,
drawRectangle,
drawLine,
drawImage,
endDrawLabel,
print,
didReadPrintCountInfo,
didReadPrintErrorInfo,
getMultiple,
} = usePrint();
export default {
data() {
return {
canvasWidth: 200,
canvasHeight: 200,
};
},
computed: {
// 响应式宽高
canvasWidthResponsive() {
return this.canvasWidth;
},
canvasHeightResponsive() {
return this.canvasHeight;
},
},
methods: {
goToConnectPage() {
uni.navigateTo({
url: "./index",
});
},
//预览
previewEvent() {
//标签尺寸
const labelWidth = 50;
const labelHeight = 70;
//B3S/B1/B21/B203/K3/K3W的multiple传8,B32/Z401/M2的multiple传11.81
const multiple = 11.81;
this.canvasWidth = labelWidth * multiple;
this.canvasHeight = labelHeight * multiple;
startDrawLabel("myCanvas", this, labelWidth, labelHeight, 0);
drawText("固定资产标识卡", 4, 6, 3.5, 0, { bold: true });
drawText("资产名称:饮水机", 4, 16, 3, 0);
drawText("部门名称:综合管理部", 4, 26, 3, 0);
drawText("资产编号:KCKA20220001", 4, 36, 3, 0);
drawText("入库日期:2018-05-16", 4, 46, 3, 0);
drawText("使用人:潘小晨", 4, 56, 3, 0);
drawText("备注:", 4, 66, 3, 0);
drawLine(0, 10, labelWidth, 0.1, 0);
drawLine(0, 20, labelWidth, 0.1, 0);
drawLine(0, 30, labelWidth, 0.1, 0);
drawLine(0, 40, labelWidth, 0.1, 0);
drawLine(0, 50, labelWidth, 0.1, 0);
drawLine(0, 60, 29.5, 0.1, 0);
drawLine(30, 50, 0.1, 20, 0);
drawQRCode(
"https://u.wechat.com/EohZr2D1c]s1rDRmQ7MQUEW?s=8",
32,
52.5,
15,
15,
0,
2
);
endDrawLabel(() => {
console.log("预览");
});
},
//打印
printLabel() {
uni.showToast({
title: "开始打印",
});
didReadPrintCountInfo((res) => {
console.log(res.count);
});
didReadPrintErrorInfo((res) => {
console.log(res.errCode);
});
startJob(1, 3, 1, () => {
//标签尺寸
this.previewEvent();
setTimeout(() => {
print(1, () => {});
console.log("打印");
}, 500);
});
},
},
};
</script>
<style>
/* canvas {
display: flex;
left: 100%;
} */
canvas {
background-color: antiquewhite;
}
</style>