From 61084b90caca675fc3ecfd9a3d791a35b07c6901 Mon Sep 17 00:00:00 2001 From: zhang_li <2235006734@qqq.com> Date: Tue, 30 Apr 2024 16:40:00 +0800 Subject: [PATCH] =?UTF-8?q?=E5=A4=9A=E6=9D=A1=E6=89=93=E5=8D=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/hybrid/html/point.html | 203 +++++++++++++------------------------ src/pages/point/index.vue | 177 +++++++++++++++++++++----------- 2 files changed, 191 insertions(+), 189 deletions(-) diff --git a/src/hybrid/html/point.html b/src/hybrid/html/point.html index c1b53b2b..bd147d80 100644 --- a/src/hybrid/html/point.html +++ b/src/hybrid/html/point.html @@ -1,133 +1,76 @@ - - - - - - + - - - -
-
-
-
-
物品代码
-
replaceItemNumber
-
-
-
物品名称
-
replaceItemName
-
-
-
供应商
-
replaceSupplierCode
-
-
-
包装号
-
replacePackageCode
-
-
-
订单行
-
replaceReferenceOrderRow
-
-
-
-
- -
-
-
订单号
-
replaceReferenceOrderCode
-
-
-
数量
-
replaceAmount
-
-
-
-
- - + + + + + mainBody + + \ No newline at end of file diff --git a/src/pages/point/index.vue b/src/pages/point/index.vue index db4a8f97..87236005 100644 --- a/src/pages/point/index.vue +++ b/src/pages/point/index.vue @@ -1,48 +1,48 @@ @@ -60,8 +60,8 @@ data() { return { data: {}, - newHtmlContent: '' //打印传入的html - + newHtmlContent: '', //打印传入的html + isLoadFinish: false, } }, @@ -89,59 +89,118 @@ } // #endif }, + watch: { + isLoadFinish(newVal, oldVal) { + if (newVal == true) { + // 读取html文件将文件中的内容图换成当前页面的数据 + let str = '' + this.readFile(htmlFileUrl, (htmlContent) => { + this.newHtmlContent = htmlContent + this.data.forEach(item => { + str += `

+
+
+
物品代码
+
${item.itemNumber}
+
+
+
物品名称
+
${item.itemName}
+
+
+
供应商
+
${item.supplierCode}
+
+
+
包装号
+
${item.packageCode}
+
+
+
订单行
+
${item.referenceOrderRow}
+
+
+
+
+ +
+
+
订单号
+
${item.referenceOrderRow}
+
+
+
数量
+
${item.amount}
+
+
+
` + }) + this.newHtmlContent = this.newHtmlContent.replace( + "mainBody", str); //替换物品代码 + console.log(this.newHtmlContent) + }); + + } + } + }, + async onShow() { // 获取数据 - this.data = { + this.data = [{ itemNumber: '555555', itemName: 'hahah', - referenceOrderRow: '60', - referenceOrderCode: '6000', - supplierCode: '888', + referenceOrderRow: '55', + referenceOrderCode: '55', + supplierCode: '555', packageCode: '9999-8888', - amount: '6000', - barcodeString: 'HMQ;V1.0;Dwork1-line1;F;R2024-04-03T08:28:41;B20240403;PPN0403-000005;I399.960-12;Q5.000000;UEA;' - } - this.$nextTick(() => { + 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'] - el.canvasToTempFilePath({ - success: async (res) => { - // 将临时路径转换成base64 - await pathToBase64(res.tempFilePath).then(base64 => { - // 读取html文件将文件中的内容图换成当前页面的数据 - this.readFile(htmlFileUrl, (htmlContent) => { - this.newHtmlContent = htmlContent - this.newHtmlContent = this.newHtmlContent.replace( - "replaceItemNumber", this.data - .itemNumber); //替换物品代码 - this.newHtmlContent = this.newHtmlContent.replace( - "replaceItemName", this.data.itemName - ); //替换物品名称 - this.newHtmlContent = this.newHtmlContent.replace( - "replaceSupplierCode", this.data - .supplierCode); //替换供应商 - this.newHtmlContent = this.newHtmlContent.replace( - "replacePackageCode", this.data - .packageCode); //替换包装号 - this.newHtmlContent = this.newHtmlContent.replace( - "replaceReferenceOrderRow", this.data - .referenceOrderRow); //替换订单行 - this.newHtmlContent = this.newHtmlContent.replace( - "replaceReferenceOrderCode", this.data - .referenceOrderCode); //替换订单号 - this.newHtmlContent = this.newHtmlContent.replace( - "amount", this.data.amount); //替换数量 - this.newHtmlContent = this.newHtmlContent.replace( - "replaceBase", base64); //替换二维码 - }); - }).catch(err => { - console.log(err); - }) - }, - fail(err) { - console.log('err:::', err) - } + 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) + } + }) + }) + }) },