136 lines
3.3 KiB
Vue
136 lines
3.3 KiB
Vue
<template>
|
||
<tpx-bluetooth ref="curBlueTooth"></tpx-bluetooth>
|
||
|
||
<tpx-dialog type="type-dialog" title="打印中" :show="percentage">
|
||
<u-row custom-style="width: 500rpx;min-height: 150rpx;padding: 10rpx;">
|
||
<view>
|
||
<u-line-progress :percentage="percentage" activeColor="#B12D29" height="30"></u-line-progress>
|
||
<view class="pt-20">正在发送数据, 请勿退出页面, 如果卡住了请重连打印机重试</view>
|
||
</view>
|
||
</u-row>
|
||
</tpx-dialog>
|
||
|
||
</template>
|
||
|
||
<script>
|
||
import { showLoading, showToast, hideLoading, canvasGetImageData, getImageInfo, promiseTimeout } from "@/common/untool"
|
||
import * as canvasUtil from "@/common/canvasUtil"
|
||
import * as printJob from './print/printJob'
|
||
|
||
export default {
|
||
props:{
|
||
|
||
},
|
||
computed: {
|
||
|
||
},
|
||
data () {
|
||
return {
|
||
imgRes: {},
|
||
percentage: 0, // 打印进度
|
||
threshold: 200, // 阈值(值越大,图片打印越深)
|
||
paperWidth: 560,
|
||
}
|
||
},
|
||
mounted () {
|
||
this.initData()
|
||
},
|
||
unmounted() {
|
||
},
|
||
methods: {
|
||
async initData() {
|
||
|
||
},
|
||
// 打印
|
||
handlePrint(){
|
||
const that = this
|
||
let data = this.$refs.curBlueTooth.getConData()
|
||
console.log("打印组件选中数据：data=====", data)
|
||
let { deviceId, serviceId, characteristicId } = data
|
||
return new Promise((resolve, reject)=> {
|
||
let { bl } = that.checkPrintParam()
|
||
if(!bl) {
|
||
return reject('打印参数校验不通过')
|
||
}
|
||
const opt = {
|
||
...{ deviceId, serviceId, characteristicId },
|
||
onProgress: (percentage) => {
|
||
console.log("打印进度====", percentage)
|
||
that.percentage = percentage
|
||
},
|
||
lasterSuccess: () => {
|
||
that.percentage = 0
|
||
hideLoading()
|
||
uni.showModal({
|
||
title: '提示',
|
||
content: '数据已发送完，请检查打印的内容是否正常',
|
||
showCancel: false,
|
||
confirmText: '好的',
|
||
});
|
||
resolve()
|
||
},
|
||
onError: (e)=> {
|
||
that.percentage = 0
|
||
showToast(`打印异常`)
|
||
hideLoading()
|
||
reject(e)
|
||
}
|
||
}
|
||
|
||
//打印图片
|
||
printJob.printImage(
|
||
opt,
|
||
// 将图片数据转成位图数据
|
||
printJob.overwriteImageData({
|
||
threshold: that.threshold,
|
||
imageData: that.imgRes.imgData,
|
||
width: that.imgRes.width,
|
||
height: that.imgRes.height,
|
||
}),
|
||
);
|
||
})
|
||
},
|
||
checkPrintParam() {
|
||
let msg = '', bl = false
|
||
let { deviceId, serviceId, characteristicId } = this.$refs.curBlueTooth.getConData()
|
||
!this.imgRes.imgData && (msg = '打印内容不能为空，请重试')
|
||
if(!msg && !(deviceId && serviceId && characteristicId)) {
|
||
msg = '请选选择打印设备'
|
||
}
|
||
msg && (showToast(msg))
|
||
return {
|
||
msg,
|
||
bl: !msg
|
||
}
|
||
},
|
||
// 给外部调用api，打印自定义图
|
||
async callPrint({ paperWidth, imgRes } = {}) {
|
||
try{
|
||
this.paperWidth = paperWidth
|
||
this.imgRes = imgRes
|
||
let conSta = await this.$refs.curBlueTooth.autoConnect()
|
||
this.$emit('autoConnectCallback', conSta)
|
||
if(conSta) {
|
||
await this.handlePrint()
|
||
return true
|
||
}
|
||
} catch(e){
|
||
console.error("callPrint error=====", e)
|
||
}
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style scoped lang="scss">
|
||
.canvas-con{
|
||
width: 100%;
|
||
overflow: auto;
|
||
}
|
||
/*图片隐藏到窗口外*/
|
||
canvas {
|
||
position: absolute;
|
||
z-index: -999;
|
||
top: -999px;
|
||
}
|
||
</style> |