装配收货--打印功能

4 months ago · c41602a2b5
5 changed files with 394 additions and 1 deletions
--- a/src/api/request2.js
+++ b/src/api/request2.js
@ -3888,6 +3888,16 @@ export function getManagementPrecision(params) {
 	});
 }

+// 装配收货详情--打印功能
+export function getPrintProductReceiptList(params) {
+	return request({
+		url: baseApi + "/wms/barbasic/getBarbasicByPackingNumber",
+		method: "get",
+		data: params,
+	});
+}
+
+

 /**
 * 查询库存通过多种条件 高级筛选
--- a/src/pages.json
+++ b/src/pages.json
@ -2037,6 +2037,18 @@
 				"navigationBarTitleText": "打印",
 				"enablePullDownRefresh": false
 			}
+		},{
+			"path": "pages/pointProductReceipt/index",
+			"style": {
+				"navigationBarTitleText": "打印",
+				"enablePullDownRefresh": false
+			}
+		},{
+			"path": "pages/pointProductReceipt/webview",
+			"style": {
+				"navigationBarTitleText": "打印",
+				"enablePullDownRefresh": false
+			}
 		},
 		{
 			"path": "pages/print/index",
--- a/src/pages/pointProductReceipt/index.vue
+++ b/src/pages/pointProductReceipt/index.vue
@ -0,0 +1,287 @@
+<template>
+	<view class="content" style="padding:30rpx 20rpx 100rpx;min-height: calc(100vh - 120rpx);">
+		<!-- 只用于展示页面 -->
+		<view class="box" v-for="(item,index) in data" :key='index' style="margin-bottom: 20rpx;">
+			<view class="left">
+				<view class="left-item">
+					<view class="label">物品代码</view>
+					<view class="value" id="name1">{{item.itemCode}}</view>
+				</view>
+				<view class="left-item">
+					<view class="label">物品名称</view>
+					<view class="value" id="name2">{{item.itemName}}</view>
+				</view>
+				<view class="left-item">
+					<view class="label">物料描述</view>
+					<view class="value">{{item.itemDesc1}}</view>
+				</view>
+				<view class="left-item">
+					<view class="label">包装号</view>
+					<view class="value">{{item.relateNumber}}</view>
+				</view>
+				<view class="left-item">
+					<view class="label">生产线</view>
+					<view class="value">{{item.productionLineCode}}</view>
+				</view>
+				<view class="left-item">
+					<view class="label">数量</view>
+					<view class="value">{{item.qty}}</view>
+				</view>
+			</view>
+			<view class="right">
+				<view class="image">
+					<l-qrcode ref="qrcodeRef" :value="item.barcodeString" size="300rpx"></l-qrcode>
+				</view>
+				<view class="left-item">
+					<view class="label">批次</view>
+					<view class="value">{{item.batch}}</view>
+				</view>
+				<view class="left-item">
+					<view class="label">班次</view>
+					<view class="value">{{item.shiftCode}}</view>
+				</view>
+				<view class="left-item" >
+					<view class="label">打印时间</view>
+					<view class="value">{{item.printTimes}}</view>
+				</view>
+			</view>
+		</view>
+		<view class="" style="position: fixed;width: 100%;bottom: 0rpx;left: 0px;">
+			<button @click="printImage"
+				style='background:rgb(60, 156, 255) !important ;color: white;margin-top: 80rpx;'> 打印</button>
+		</view>
+
+	</view>
+</template>
+
+<script>
+	// 打印页面的模板
+	const htmlFileUrl = '/hybrid/html/point.html';
+	import {
+		pathToBase64
+	} from "../../api/img-to-base64.js" //引入解压后的js文件，这里我重新命名了文件名
+	// #ifdef APP
+	var testModule = uni.requireNativePlugin("TestModule")
+	// #endif
+
+	export default {
+		name: 'pointProductReceipt',
+		data() {
+			return {
+				data: {},
+				newHtmlContent: '', //打印传入的html
+				isLoadFinish: false,
+			}
+		},
+
+		methods: {
+			// #ifdef APP
+			// 打印
+			printImage() {
+				testModule.doHTMLPrint(this.newHtmlContent)
+			},
+			// 读取html文件
+			readFile(path, callback) {
+				plus.io.resolveLocalFileSystemURL(path, function(entry) {
+					entry.file(function(file) {
+						var reader = new plus.io.FileReader();
+						reader.onloadend = function(e) {
+							callback(e.target.result);
+						};
+						reader.readAsText(file);
+					}, function(e) {
+						console.log("读取文件失败：" + e.message);
+					});
+				}, function(e) {
+					console.log("获取图片资源失败：" + e.message);
+				});
+			}
+			// #endif
+		},
+		watch: {
+			isLoadFinish(newVal, oldVal) {
+				if (newVal == true) {
+					// 读取html文件将文件中的内容图换成当前页面的数据
+					let str = ''
+					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" id="name1">${item.itemCode}</div>
+											</div>
+											<div class="left-item">
+												<div class="label">物品名称</div>
+												<div class="value" id="name2">${item.itemName}</div>
+											</div>
+											<view class="left-item">
+												<view class="label">物料描述</view>
+												<view class="value">{{item.itemDesc1}}</view>
+											</view>
+											<view class="left-item">
+												<view class="label">包装号</view>
+												<view class="value">{{item.relateNumber}}</view>
+											</view>
+											<view class="left-item">
+												<view class="label">生产线</view>
+												<view class="value">{{item.productionLineCode}}</view>
+											</view>
+											<view class="left-item">
+												<view class="label">数量</view>
+												<view class="value">{{item.qty}}</view>
+											</view>
+										</div>
+										<div class="right">
+											<div class="image">
+												<img id='image1' src="${item.barcodeBase64}" alt="" />
+											</div>
+											<view class="left-item">
+												<view class="label">批次</view>
+												<view class="value">{{item.batch}}</view>
+											</view>
+											<view class="left-item">
+												<view class="label">班次</view>
+												<view class="value">{{item.shiftCode}}</view>
+											</view>
+											<view class="left-item">
+												<view class="label">打印时间</view>
+												<view class="value">{{item.printTimes}}</view>
+											</view>
+										</div>
+									</div>`
+						})
+						this.newHtmlContent = this.newHtmlContent.replace(
+							"mainBody", str); //替换物品代码
+						console.log(this.newHtmlContent)
+					});
+
+				}
+			}
+		},
+		onLoad(option) {
+			if (option.points) {
+				this.data = JSON.parse(option.points);
+			}
+		},
+		async onShow() {
+			// 获取数据
+			// this.data = [{
+			// 	itemNumber: '555555',
+			// 	itemName: 'hahah',
+			// 	referenceOrderRow: '55',
+			// 	referenceOrderCode: '55',
+			// 	supplierCode: '555',
+			// 	packageCode: '9999-8888',
+			// 	amount: '55',
+			// 	barcodeString: 'HMQ;V1.0;Dwork1-line1;F;R2024-04-03T08:28:41;B20240403;PPN0403-000005;I399.960-12;Q5.000000;UEA;',
+			// 	barcodeBase64: ''
+			// }, {
+			// 	itemNumber: '66',
+			// 	itemName: 'hahah',
+			// 	referenceOrderRow: '66',
+			// 	referenceOrderCode: '666',
+			// 	supplierCode: '66',
+			// 	packageCode: '66666',
+			// 	amount: '666666',
+			// 	barcodeString: 'HMQ;V1.0;Dwork1-line1;F;R2024-04-03T08:28:41;B20240403;PPN0403-000005;I399.960-12;Q5.000000;UEA;',
+			// 	barcodeBase64: ''
+			// }, {
+			// 	itemNumber: '66',
+			// 	itemName: 'hahah',
+			// 	referenceOrderRow: '66',
+			// 	referenceOrderCode: '666',
+			// 	supplierCode: '66',
+			// 	packageCode: '66666',
+			// 	amount: '666666',
+			// 	barcodeString: 'HMQ;V1.0;Dwork1-line1;F;R2024-04-03T08:28:41;',
+			// 	barcodeBase64: ''
+			// }]
+			this.$nextTick(async () => {
+				// 获取二维码图片临时路径
+				const el = this.$refs['qrcodeRef']
+				let str = ''
+				el.forEach(async (item, index) => {
+					await item.canvasToTempFilePath({
+						success: async (res) => {
+							// 将临时路径转换成base64
+							await pathToBase64(res.tempFilePath).then(base64 => {
+								this.data[index].barcodeBase64 = base64
+								if (index == el.length - 1) {
+									this.isLoadFinish = true
+								}
+							}).catch(err => {
+								console.log(err);
+							})
+						},
+						fail(err) {
+							console.log('err:::', err)
+						}
+					})
+
+				})
+
+			})
+
+		},
+	}
+</script>
+
+<style>
+	.box {
+		font-size: 24rpx;
+		display: flex;
+
+	}
+
+	.left {
+		border-top: 1px solid #b1b1b1;
+		border-left: 1px solid #b1b1b1;
+		flex: 1;
+	}
+
+	.left-item {
+		display: flex;
+		
+	}
+
+	.label {
+		border-bottom: 1px solid #b1b1b1;
+		border-right: 1px solid #b1b1b1;
+		width: 140rpx;
+		padding: 0px 10rpx;
+		height: 100rpx;
+		line-height: 100rpx;
+	}
+
+	.value {
+		border-bottom: 1px solid #b1b1b1;
+		border-right: 1px solid #b1b1b1;
+		padding: 0px 5px;
+		height: 100rpx;
+		flex: 1;
+		width: 0px;
+		display: flex;
+		align-items: center;
+		word-wrap: break-word;
+	}
+
+	.right {
+		width: 300rpx;
+	}
+
+	.image {
+		width: 100%;
+		height: 301rpx;
+		border-bottom: 1px solid #b1b1b1;
+		border-top: 1px solid #b1b1b1;
+		border-right: 1px solid #b1b1b1;
+	}
+
+	.image img {
+		width: calc(100% - 4px);
+		height: calc(100% - 4px);
+		margin: 4rpx;
+	}
+</style>
--- a/src/pages/pointProductReceipt/webview.vue
+++ b/src/pages/pointProductReceipt/webview.vue
@ -0,0 +1,29 @@
+<template>
+  <view v-if="webUrl">
+    <web-view :webview-styles="webviewStyles" :src="`${webUrl}`"></web-view>
+  </view>
+</template>
+
+<script>
+  export default {
+    data() {
+      return {
+        webUrl: '',
+        webviewStyles: {
+          progress: {
+            color: "#FF3333"
+          }
+        }
+      }
+    },
+    props: {
+      src: {
+        type: [String],
+        default: null
+      }
+    },
+    onLoad(event) {
+      this.webUrl = event.url
+    }
+  }
+</script>
--- a/src/pages/productReceipt/job/fgProductReceiptDetail.vue
+++ b/src/pages/productReceipt/job/fgProductReceiptDetail.vue
@ -109,6 +109,7 @@
 	import comDetailCard from "@/mycomponents/detail/comDetailCard.vue"
 	import jobTop from '@/mycomponents/job/jobTop.vue'
 	import comProductDetailCard from "@/pages/productReceipt/coms/comProductDetailCard.vue"
+	import storage from '@/common/utils/storage.js'

 	export default {
 		name: 'receipt_detail',
@ -338,6 +339,59 @@
 					}
 				});
 			},
+			//打印功能
+			print() {
+				let packingNumber = []
+				this.detailSource.forEach(item => {
+					item.subList.forEach(detail => {
+						if (detail.scaned) {
+							// var info = getPackingNumberAndBatch(this.managementList, detail.itemCode,
+							// 	detail.packingNumber, detail.batch);
+							// detail.toPackingNumber = info.packingNumber;
+							packingNumber.push(detail.packingNumber)
+						}
+					})
+				})
+				// #ifdef APP			
+				getPrintProductReceiptList({
+					packingNumber: packingNumber.join(','),
+					type: 'MakeLabel'
+				}).then(res => {
+					console.log('打印', res)
+					let pointData = []
+					res.data.forEach(item => {
+						pointData.push({
+							barcodeString: item.barcodeString, //标签
+							itemCode: item.itemCode || '', //物品代码
+							itemName: item.itemName || '', //物品名称
+							itemDesc1: item.itemDesc1 || '', //物品描述
+							relateNumber: item.relateNumber || '', //relateNumber包装号
+							batch: item.batch || '', //批次
+							productionLineCode: item.productionLineCode || '', //生产线
+							shiftCode: item.shiftCode || '', //班次
+							qty: item.qty || '', //数量
+							printTimes: item.printTimes || '' //打印时间
+						})
+					})
+					console.log('pointData', pointData)
+			
+					uni.navigateTo({
+						url: `/pages/pointProductReceipt/index?points=${JSON.stringify(pointData)}`
+					});
+			
+				}).catch(error => {
+					this.showErrorMessage(error)
+				})
+				// #endif
+				// #ifdef H5
+				const webUrl =
+					`${import.meta.env.VITE_JMREPORT_BASE_URL}/jmreport/view/922734157577715712?token=${storage.getStorage(storage.constant.token)}&asn_number=PN0521-000012`
+				uni.navigateTo({
+					url: `/pages/pointProductReceipt/webview?url=${webUrl}`
+				});
+				// #endif
+			
+			},

 			commit() {
 				// this.scanCount = getScanCount(this.subList);
@ -466,7 +520,8 @@

 			showCommitSuccessMessage(hint) {
 				this.$refs.comMessage.showSuccessMessage(hint, res => {
-					navigateBack(1)
+					// navigateBack(1)
+					this.print()
 				})
 			},