sfms3.0
/
sfms3.0-uniapp
3
1
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

修改打印

hella_online_20240829
lijuncheng 4 months ago
parent
d4a2cc2d8b
commit
60f6f7e2f8
1 changed files with 139 additions and 245 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 374
      src/pages/point/index.vue

374
src/pages/point/index.vue
View File

@ -39,7 +39,8 @@
</view> </view>
<view class="right"> <view class="right">
<view class="image"> <view class="image">
<l-qrcode ref="qrcodeRef" :value="item.barcodeString" size="300rpx"></l-qrcode> <l-qrcode ref="qrcodeRef" useCanvasToTempFilePath @success="success" :value="item.barcodeString"
size="300rpx"></l-qrcode>
</view> </view>
<view class="left-item"> <view class="left-item">
<view class="label">批次</view> <view class="label">批次</view>
@ -81,153 +82,151 @@
name: 'point', name: 'point',
data() { data() {
return { return {
timer:null, timer: null,
originData:[], originData: [],
data: [], data: [],
newHtmlContent: '', //打印传入的html newHtmlContent: '', //打印传入的html
isLoadFinish: false, isLoadFinish: false,
picIndex: 0,
picUrl: []
} }
}, },
methods: { methods: {
success(img) {
// 递归循环 qrcodeRef 组件集合 this.picUrl.push(img)
forEachQrcodeRef(el,index,elLength,wait) { this.picIndex++
let _this = this if (this.picIndex == this.data.length) {
console.log('11111111111111'); this.isLoadFinish = true;
console.log(index); uni.hideLoading()
if (index == elLength) {
console.log('99999999');
return;
} }
const item = el[index];
setTimeout(() => {
console.log(el[index]);
console.log(item.canvasToTempFilePath);
// try{
item.canvasToTempFilePath({
success: (res) => {
console.log(res);
// 将临时路径转换成base64
pathToBase64(res.tempFilePath).then(base64 => {
console.log(res.tempFilePath);
_this.data[index].barcodeBase64 = base64
if (index == elLength - 1) {
_this.isLoadFinish = true
uni.hideLoading();
}else {
console.log(index);
}
this.forEachQrcodeRef(el,index+1,el.length,100)
}).catch(err => {
console.log(err);
this.forEachQrcodeRef(el,index+1,el.length,100)
})
},
fail(err) {
console.log(err)
}
})
// }catch(e){
// console.log(e)
// //TODO handle the exception
// // this.forEachQrcodeRef(el,index,el.length)
// }
},wait);
}, },
// stringToBase64(str) { setHtmlData() {
// console.log('999999999999999'); let str = ''
// console.log(str); this.readFile(htmlFileUrl, (htmlContent) => {
// // 对中文字符进行编码 this.newHtmlContent = htmlContent
// // var encodeUTF8 = uni.getSystemInfoSync().platform === 'android' ? 'utf-8' : 'utf8'; this.data.forEach(item => {
// // console.log('8888888888888'); str += `<div class="box" style="page-break-before:always;"><br />
// // var utf8Str = uni.encode(str, encodeUTF8); <div class="left">
// // console.log(utf8Str); data： <div class="left-item">
// // 将utf8字符串转为base64 <div class="label">物品代码</div>
// var base64Str = btoa(str); <div class="value bold-font" id="name1">${item.itemCode}</div>
// console.log(base64Str); </div>
// return base64Str; <div class="left-item">
// }, <div class="label">物品名称</div>
// getQrCodeBase64(index) { <div class="value" id="name2">${item.itemName}</div>
// let _this = this </div>
// // 使用setTimeout确保DOM更新完成后再获取canvas <div class="left-item">
// setTimeout(() => { <div class="label">包装名称</div>
// const qrcodeCanvas = this.$refs.qrcodeRef.$el.querySelector('canvas'); <div class="value">${item.packName}</div>
// if (qrcodeCanvas) { </div>
// // 将canvas转换为Base64编码的图片URL <div class="left-item">
// _this.data[index].barcodeBase64 = qrcodeCanvas.toDataURL('image/png'); <div class="label">包装号</div>
// } else { <div class="value">${item.packageCode}</div>
// console.log('xxxxxxxxxxxxxxxxx') </div>`
// } if (item.productionLineCode && item.productionLineCode.length > 0) {
// }, 0); str += `
// }, <div class="left-item">
getListData(){ <div class="label">生产线</div>
// 获取数据 <div class="value">${item.productionLineCode}</div>
// 大哥：后端添加了 制造标签 生产线 ，可根据 生产线是否有值 来判断打印的是制造标签 </div>
// this.data = [{ `
// itemCode:'065.051-01M', // 物品代码 } else {
// itemName: 'PCCLARNATEA1225BLACK9999', // 物品名称 str += `
// packName: '包装名称',// 包装名称 <div class="left-item">
// packageCode: 'PS0513-000003', // 包装号 <div class="label">父包装号</div>
// batch:'20240514',//批次 <div class="value">${item.parentNumber}</div>
// parentNumber:'PS0513-000003',//父包装号 </div>
// itemType:'物料类型',//物料类型 <div class="left-item">
// asnNumber:'123232',//ASN <div class="label">ASN</div>
// supplierCode: 'Fewewq', // 供应商 <div class="value">${item.asnNumber}</div>
// qty: '100', // 数量 </div>
// printTimes:'2019-09-09 09:09:00', // 打印时间 `
// barcodeString: 'HMQ;V1.0;Dwork1-line1;F;R2024-04-03T08:28:41;B20240403;PPN0403-000005;I399.960-12;Q5.000000;UEA;', }
// barcodeBase64: '', str += `
// productionLineCode:''//生产线 <div class="left-item">
// }] <div class="label">数量</div>
<div class="value bold-font">${item.qty}</div>
let _this = this </div>
// this.$nextTick(async () => { </div>
// 获取二维码图片临时路径 <div class="right">
const el = _this.$refs['qrcodeRef'] <div class="image">
_this.forEachQrcodeRef(el,0,el.length,5000); <img id='image1' src="${item.barcodeBase64}" alt="" />
// // }) </div>
<div class="left-item">
<div class="label">批次</div>
// let _this = this <div class="value">${item.batch}</div>
// this.$nextTick(async () => { </div>
// // 获取二维码图片临时路径 <div class="left-item">
// const el = _this.$refs['qrcodeRef'] <div class="label">物料类型</div>
// let str = '' <div class="value">${item.itemType}</div>
// el.forEach(async (item, index) => { </div>`
// await item.canvasToTempFilePath({ if (!(item.productionLineCode && item.productionLineCode.length > 0)) {
// success: async (res) => { str += `
// // 将临时路径转换成base64 <div class="left-item">
// await pathToBase64(res.tempFilePath).then(base64 => { <div class="label">供应商</div>
// _this.data[index].barcodeBase64 = base64 <div class="value">${item.supplierCode}</div>
// if (index == el.length - 1) { </div>
// _this.isLoadFinish = true `
// uni.hideLoading(); }
str += `
// }else {
// console.log(index);
// }
// }).catch(err => {
// console.log(err);
// })
// },
// fail(err) {
// console.log('err:::', err)
// }
// })
// }) <div class="left-item">
<div class="label">打印时间</div>
<div class="value">${item.printTimes}</div>
</div>
</div>
</div>`
})
this.newHtmlContent = this.newHtmlContent.replace(
"mainBody", str); //替换物品代码
});
},
// }) generateBase64(index) {
// }) //完成，调用打印
if (index == this.picUrl.length) {
this.setHtmlData()
let clearInt = setInterval(() => {
if (!this.newHtmlContent.mainBody) {
// #ifdef APP
testModule.doHTMLPrint(this.newHtmlContent)
// #endif
clearInterval(clearInt)
uni.hideLoading()
}
}, 1000)
} else {
var url = this.picUrl[index]
// #ifdef APP
plus.io.resolveLocalFileSystemURL(url, (entry) => {
// 可通过entry对象操作test.html文件
entry.file((file) => {
let fileReader = new plus.io.FileReader();
fileReader.onloadend = (evt) => {
console.log("文件路径" + evt.target.result)
this.data[index].barcodeBase64 = evt.target.result
this.generateBase64(index + 1)
}
fileReader.readAsDataURL(file);
});
}, (e) => {
console.log("失败" + e)
});
// #endif
}
}, },
// #ifdef APP
// 打印
printImage() { printImage() {
testModule.doHTMLPrint(this.newHtmlContent) uni.showLoading({
title: "加载中",
mask: true
})
this.generateBase64(0)
}, },
// #ifdef APP
// 读取html文件 // 读取html文件
readFile(path, callback) { readFile(path, callback) {
plus.io.resolveLocalFileSystemURL(path, function(entry) { plus.io.resolveLocalFileSystemURL(path, function(entry) {
@ -246,95 +245,7 @@
} }
// #endif // #endif
}, },
watch: {
isLoadFinish(newVal, oldVal) {
if (newVal == true) {
// 读取html文件将文件中的内容图换成当前页面的数据
let str = ''
// #ifdef APP
this.readFile(htmlFileUrl, (htmlContent) => {
this.newHtmlContent = htmlContent
this.data.forEach(item => {
str += `<div class="box" style="page-break-before:always;"><br />
<div class="left">
<div class="left-item">
<div class="label">物品代码</div>
<div class="value bold-font" id="name1">${item.itemCode}</div>
</div>
<div class="left-item">
<div class="label">物品名称</div>
<div class="value" id="name2">${item.itemName}</div>
</div>
<div class="left-item">
<div class="label">包装名称</div>
<div class="value">${item.packName}</div>
</div>
<div class="left-item">
<div class="label">包装号</div>
<div class="value">${item.packageCode}</div>
</div>`
if(item.productionLineCode&&item.productionLineCode.length>0){
str += `
<div class="left-item">
<div class="label">生产线</div>
<div class="value">${item.productionLineCode}</div>
</div>
`
}else{
str += `
<div class="left-item">
<div class="label">父包装号</div>
<div class="value">${item.parentNumber}</div>
</div>
<div class="left-item">
<div class="label">ASN</div>
<div class="value">${item.asnNumber}</div>
</div>
`
}
str += `
<div class="left-item">
<div class="label">数量</div>
<div class="value bold-font">${item.qty}</div>
</div>
</div>
<div class="right">
<div class="image">
<img id='image1' src="${item.barcodeBase64}" alt="" />
</div>
<div class="left-item">
<div class="label">批次</div>
<div class="value">${item.batch}</div>
</div>
<div class="left-item">
<div class="label">物料类型</div>
<div class="value">${item.itemType}</div>
</div>`
if(!(item.productionLineCode&&item.productionLineCode.length>0)){
str += `
<div class="left-item">
<div class="label">供应商</div>
<div class="value">${item.supplierCode}</div>
</div>
`
}
str += `
<div class="left-item">
<div class="label">打印时间</div>
<div class="value">${item.printTimes}</div>
</div>
</div>
</div>`
})
this.newHtmlContent = this.newHtmlContent.replace(
"mainBody", str); //替换物品代码
// console.log(this.newHtmlContent)
});
// #endif
}
}
},
onLoad(option) { onLoad(option) {
uni.showLoading({ uni.showLoading({
title: '加载中...', title: '加载中...',
@ -343,25 +254,7 @@
if (option.points) { if (option.points) {
this.originData = JSON.parse(option.points); this.originData = JSON.parse(option.points);
} }
}, this.data = this.originData
unmounted() {
if(this.timer){
clearTimeout(this.timer)
this.timer = null
}
},
onShow() {
this.timer = setTimeout(()=>{
if(this.timer){
clearTimeout(this.timer)
this.timer = null
}
this.data = this.originData
console.log(287,'11111111')
this.$nextTick(()=> {
this.getListData()
})
},1000)
}, },
} }
</script> </script>
@ -391,7 +284,8 @@
height: 100rpx; height: 100rpx;
line-height: 100rpx; line-height: 100rpx;
} }
.bold-font{
.bold-font {
font-weight: bold; font-weight: bold;
font-size: 28rpx; font-size: 28rpx;
} }

Write Preview
Loading…
Cancel
Save