uu

components/tpx-bluetooth-print/render-template.vue

@@ -1,11 +1,5 @@
 <template>
-	<tpx-bluetooth ref="curBlueTooth">
-		<template v-slot:content>
-			<view class="canvas-con">
-				<canvas :canvas-id="canvasId" :style="{width:canvasWidth + 'px', height: canvasHeight + 'px'}"></canvas>
-			</view>			
-		</template>
-	</tpx-bluetooth>
+	<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;">
@@ -32,13 +26,9 @@ export default {
 	},
 	data () {
 		return {
-			canvasId: uni.$u.guid(20),
-			canvasWidth: 1,
-			canvasHeight: 1,
-			imgData: '',
+			imgRes: {},
 			percentage: 0, // 打印进度 
 			threshold: 200, // 阈值(值越大,图片打印越深)
-			imageUrl: '',
 			paperWidth: 560,
 		}
 	},
@@ -49,7 +39,7 @@ export default {
 	},
 	methods: {
 		async initData() {
-			await this.renderCanvasImg(this.imageUrl);
+			
 		},
 		// 打印
 		handlePrint(){
@@ -86,65 +76,24 @@ export default {
 						reject(e)
 					}
 				}
-				console.log('====that.imgData===', that.imgData)
+				
 				//打印图片
 				printJob.printImage(
 				    opt,
 				    // 将图片数据转成位图数据
 				    printJob.overwriteImageData({
 				        threshold: that.threshold,
-				        imageData: that.imgData,
-				        width: that.canvasWidth,
-				        height: that.canvasHeight,
+				        imageData: that.imgRes.imgData,
+				        width: that.imgRes.width,
+				        height: that.imgRes.height,
 				    }),
 				);
 			})
 		},
-		renderCanvasImg(filePath) {
-			let that = this
-			// showLoading() 
-			console.log("===renderCanvasImg:filePath=====", filePath)
-			return new Promise(async (resolve, reject)=> {
-				try{
-					// 多次渲染，createCanvasContext，必须使用新的才可以
-					that.canvasId = uni.$u.guid(20)
-					await promiseTimeout(500)
-					let res = await getImageInfo(filePath)
-					console.log("getImageInfo res====", res)
-					const ctx = uni.createCanvasContext(that.canvasId, that);
-					// 打印宽度须是8的整数倍，这里处理掉多余的，使得宽度合适，不然有可能乱码
-					const remainder = that.paperWidth % 8;
-					const w = remainder === 0 ? that.paperWidth : that.paperWidth - remainder;
-					// 等比算出图片的高度
-					const h = Math.floor((res.height * w) / res.width);
-					that.canvasWidth = w
-					that.canvasHeight = h
-					// 在canvas 画一张图片
-					let imgRect = canvasUtil.containImg(0, 0, w, h, res.width, res.height)
-					let ctData = [imgRect.dx, imgRect.dy, imgRect.dWidth, imgRect.dHeight]
-					ctx.fillStyle = 'rgba(255,255,255,1)';
-					ctx.clearRect(...ctData);
-					ctx.fillRect(...ctData);
-					// 把原图缩放到 打印宽度的比例 绘制
-					ctx.drawImage(filePath, ...ctData); 
-					
-					ctx.draw(false, async() => {
-						await promiseTimeout(1000)
-						let { data } = await canvasGetImageData({ canvasId: that.canvasId, width: w, height: h, })
-						hideLoading()
-						that.imgData = data
-						resolve(data)
-					});
-				}catch(e){
-					hideLoading()
-					reject(e)
-				}
-			})
-		},
 		checkPrintParam() {
 			let msg = '', bl = false
 			let { deviceId, serviceId, characteristicId } = this.$refs.curBlueTooth.getConData()
-			!this.imgData && (msg = '打印内容不能为空，请重试')
+			!this.imgRes.imgData && (msg = '打印内容不能为空，请重试')
 			if(!msg && !(deviceId && serviceId && characteristicId)) {
 				msg = '请选选择打印设备'
 			}
@@ -155,13 +104,10 @@ export default {
 			}
 		},
 		// 给外部调用api，打印自定义图
-		async callPrint({ paperWidth, imageUrl } = {}) {
+		async callPrint({ paperWidth, imgRes } = {}) {
 			try{
 				this.paperWidth = paperWidth
-				if(this.imageUrl != imageUrl || !this.imgData) {
-					this.imageUrl = imageUrl
-					await this.renderCanvasImg(this.imageUrl);
-				}
+				this.imgRes = imgRes
 				let conSta = await this.$refs.curBlueTooth.autoConnect()
 				this.$emit('autoConnectCallback', conSta)
 				if(conSta) {

components/tpx-bluetooth/tpx-bluetooth.vue

@@ -169,7 +169,7 @@ export default {
 			// 连接不成功，打开蓝牙配置页面
 			if(!conSta) {
 				this.showConnectPage = true
-				// this.discoveryPrinter()
+				this.discoveryPrinter()
 			} else {
 				this.stopDiscoveryPrinter()
 			}