aike/emis-app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

uu

Browse Source
This commit is contained in:
aihe 2024-05-12 11:18:44 +08:00
parent d1098f2659
commit cacea1a704
5 changed files with 101 additions and 100 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

29
common/untool.js
View File

@ -173,7 +173,32 @@ const getImageTempFilePath = (options) => {
}) })
} }
const canvasGetImageData = (params = {})=> {
return new Promise((resolve, reject)=> {
uni.canvasGetImageData({
x: 0,
y: 0,
...params,
success(res) {
console.log("img====",res);
resolve(res)
if(res.data) {
let data = res.data
resolve(res);
} else {
showToast('canvasGetImageData:失败')
reject('canvasGetImageData:失败')
}
},
fail(err){
showToast('canvasGetImageData:失败')
console.log("canvasGetImageData:失败====", err);
}
})
})
}
export { export {
reLaunch, reLaunch,
@ -190,4 +215,6 @@ export {
saveNetFile, saveNetFile,
saveFile, saveFile,
getImageTempFilePath, getImageTempFilePath,
canvasGetImageData,
getImageInfo
} }

158
components/tpx-bluetooth-print/tpx-bluetooth-print.vue
View File

@ -3,14 +3,30 @@
<template v-slot:button> <template v-slot:button>
<u-button @click="handlePrint" type="primary" :disabled="!(blueToothData.deviceId && blueToothData.serviceId && blueToothData.characteristicId)">打印</u-button> <u-button @click="handlePrint" type="primary" :disabled="!(blueToothData.deviceId && blueToothData.serviceId && blueToothData.characteristicId)">打印</u-button>
</template> </template>
<template v-slot:content>
<view class="pt-20 pb-10">打印内容</view>
<view class="canvas-con">
<canvas canvas-id="shareCanvas" :style="{width:canvasWidth + 'px', height: canvasHeight + 'px'}"></canvas>
</view>
</template>
</tpx-bluetooth> </tpx-bluetooth>
<canvas canvas-id="shareCanvas" :style="{width:canvasWidth + 'px', height: canvasHeight + 'px'}"></canvas>
<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> </template>
<script> <script>
import { showLoading, showToast, hideLoading } from "@/common/untool" import { showLoading, showToast, hideLoading, canvasGetImageData, getImageInfo } from "@/common/untool"
import * as printJob from './print/printJob' import * as printJob from './print/printJob'
export default { export default {
props:{ props:{
imageUrl: { imageUrl: {
@ -18,16 +34,11 @@ export default {
return '' return ''
} }
}, },
canvasWidth: { paperWidth: {
default () { default () {
return 320 return 320
} }
}, },
canvasHeight: {
default () {
return 0
}
},
}, },
computed: { computed: {
@ -35,6 +46,8 @@ export default {
data () { data () {
return { return {
canvasId: 'shareCanvas', canvasId: 'shareCanvas',
canvasWidth: 1,
canvasHeight: 1,
imgData: '', imgData: '',
percentage: 0, // 打印进度 percentage: 0, // 打印进度
threshold: 200, // 阈值(值越大,图片打印越深) threshold: 200, // 阈值(值越大,图片打印越深)
@ -57,15 +70,16 @@ export default {
// 打印 // 打印
async handlePrint(){ async handlePrint(){
const that = this const that = this
// showLoading('正在打印')
const opt = { const opt = {
...this.blueToothData, ...this.blueToothData,
onProgress: (percentage) => { onProgress: (percentage) => {
console.log("打印进度====", percentage) console.log("打印进度====", percentage)
that.percentage = percentage that.percentage = percentage
}, },
lasterSuccess: () => { lasterSuccess: () => {
that.percentage = 0 that.percentage = 0
hideLoading()
uni.showModal({ uni.showModal({
title: '提示', title: '提示',
content: '数据已发送完，请检查打印的内容是否正常', content: '数据已发送完，请检查打印的内容是否正常',
@ -73,8 +87,12 @@ export default {
confirmText: '好的', confirmText: '好的',
}); });
}, },
onError: ()=> {
that.percentage = 0
showToast(`打印异常`)
hideLoading()
}
} }
console.log('====this.imgData===', this.imgData) console.log('====this.imgData===', this.imgData)
//打印图片 //打印图片
printJob.printImage( printJob.printImage(
@ -93,92 +111,42 @@ export default {
// wx.chooseImage({ // wx.chooseImage({
// success: (res) => { // success: (res) => {
// const tempFilePath = res.tempFilePaths[0]; // const tempFilePath = res.tempFilePaths[0];
// wx.getImageInfo({
// src: tempFilePath,
// success: (res) => {
// // 打印宽度须是8的整数倍，这里处理掉多余的，使得宽度合适，不然有可能乱码
// const mw = this.data.paperWidth % 8;
// const w = mw === 0 ? this.data.paperWidth : this.data.paperWidth - mw;
// // 等比算出图片的高度
// const h = Math.floor((res.height * w) / res.width);
// // 设置canvas宽高
// this.setData({
// img: tempFilePath,
// canvasHeight: h,
// canvasWidth: w,
// });
// // 在canvas 画一张图片
// ctx.fillStyle = 'rgba(255,255,255,1)';
// ctx.clearRect(0, 0, w, h);
// ctx.fillRect(0, 0, w, h);
// ctx.drawImage(tempFilePath, 0, 0, w, h);
// ctx.draw(false, () => {
// wx.hideLoading();
// });
// },
// fail: (res) => {
// console.log('get info fail', res);
// wx.hideLoading();
// },
// });
// }, // },
// }); // });
// }, // },
getImageZip(params = {}) {
return new Promise((resolve, reject)=> {
uni.canvasGetImageData({
x: 0,
y: 0,
...params,
success(res) {
console.log("img====",res);
if(res.data) {
let data = res.data
console.log("image data====", data);
resolve(data);
} else {
showToast('获取图片信息异常:getImageZip')
reject('获取图片信息异常:getImageZip')
}
},
fail(err){
showToast('获取图片信息异常:getImageZip')
console.log("canvasGetImageData:失败====", err);
}
})
})
},
renderCanvasImg() { renderCanvasImg() {
let filePath = this.imageUrl let filePath = this.imageUrl
let that = this let that = this
return new Promise((resolve, reject)=> { showLoading()
const cxt = uni.createCanvasContext(that.canvasId, that); return new Promise(async (resolve, reject)=> {
let scla = 1 try{
uni.getImageInfo({ let res = await getImageInfo(filePath)
src: filePath, const ctx = uni.createCanvasContext(that.canvasId, that);
success(res) { // 打印宽度须是8的整数倍，这里处理掉多余的，使得宽度合适，不然有可能乱码
console.log("获取图片信息成功=====", res) const remainder = that.paperWidth % 8;
// 按原图比例算出 新的画图高度 const w = remainder === 0 ? that.paperWidth : that.paperWidth - remainder;
let height = that.canvasHeight // 等比算出图片的高度
if(!height) { const h = Math.floor((res.height * w) / res.width);
height = parseInt(that.canvasWidth * (res.height / res.width)) this.canvasWidth = w
that.$emit("update:canvasHeight", height) this.canvasHeight = h
} // 在canvas 画一张图片
cxt.drawImage(res.path, 0, 0, that.canvasWidth, height); // ctx.fillStyle = 'rgba(255,255,255,1)';
console.log("开始绘制图片===") ctx.clearRect(0, 0, w, h);
cxt.draw(true, ()=> { ctx.fillRect(0, 0, w, h);
console.log("绘制图片结束===") ctx.drawImage(filePath, 0, 0, w, h);
setTimeout( async ()=> { ctx.draw(false, () => {
let data = await that.getImageZip({ canvasId: that.canvasId, width: that.canvasWidth, height, }) setTimeout( async ()=> {
resolve(data) let { data } = await canvasGetImageData({ canvasId: that.canvasId, width: w, height: h, })
}, 1000) hideLoading()
}); resolve(data)
}, }, 1000)
fail(e) { });
console.log("获取图片信息失败=====", e) }catch(e){
reject(e) hideLoading()
} reject(e)
}) }
}) })
} }
} }
@ -186,10 +154,14 @@ export default {
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
.canvas-con{
width: 100%;
overflow: auto;
}
/*图片隐藏到窗口外*/ /*图片隐藏到窗口外*/
canvas { canvas {
position: absolute; // position: absolute;
z-index: -999; // z-index: -999;
top: -999px; // top: -999px;
} }
</style> </style>

5
components/tpx-bluetooth/tpx-bluetooth.vue
View File

@ -91,6 +91,7 @@
</template> </template>
</view> </view>
<slot name="content"></slot>
</view> </view>
</template> </template>
</tpx-layout> </tpx-layout>
@ -149,6 +150,8 @@ export default {
mounted () { mounted () {
// 初始化蓝牙模块 // 初始化蓝牙模块
this.openBluetoothAdapter() this.openBluetoothAdapter()
// 自动搜索设备
this.discoveryPrinter()
}, },
unmounted() { unmounted() {
this.stopDiscoveryPrinter() this.stopDiscoveryPrinter()
@ -179,7 +182,7 @@ export default {
_this.devices = [] _this.devices = []
_this.searchLoading = true _this.searchLoading = true
_this.curTab = 0 _this.curTab = 0
uni.startBluetoothDevicesDiscovery({ uni?.startBluetoothDevicesDiscovery?.({
complete (e) { complete (e) {
console.log(e) console.log(e)
if (e.errMsg == "startBluetoothDevicesDiscovery:ok") { if (e.errMsg == "startBluetoothDevicesDiscovery:ok") {

7
pages/print/bluetoothPrinter.vue
View File

@ -1,7 +1,7 @@
<template> <template>
<tpx-page> <tpx-page>
<tpx-bluetooth-print v-if="!pageLoading" :imageUrl="queryOption.imageUrl" :canvasWidth="queryOption.canvasWidth" <tpx-bluetooth-print v-if="!pageLoading"
v-model:canvasHeight="queryOption.canvasHeight" :imageUrl="queryOption.imageUrl" :paperWidth="queryOption.paperWidth"
></tpx-bluetooth-print> ></tpx-bluetooth-print>
</tpx-page> </tpx-page>
</template> </template>
@ -19,8 +19,7 @@ export default {
pageLoading: true, pageLoading: true,
queryOption: { queryOption: {
imageUrl: '', imageUrl: '',
canvasWidth: '', paperWidth: ''
canvasHeight: '',
} }
} }
}, },

2
pages/print/courierNote.vue
View File

@ -155,7 +155,7 @@
}), }),
async handleSubmit() { async handleSubmit() {
let res = await this.getRealGetWaybillPrintData() let res = await this.getRealGetWaybillPrintData()
this.goto(`print/bluetoothPrinter?imageUrl=${res.data.fileUrl}&canvasWidth=${480}`) this.goto(`print/bluetoothPrinter?imageUrl=${res.data.fileUrl}&paperWidth=${480}`)
}, },
handleSelAll() { handleSelAll() {
if(this.submitParam.subBillCodeRange.length == this.yundanList.length) { if(this.submitParam.subBillCodeRange.length == this.yundanList.length) {