From 554314d308e624b6dcc8c344410f7559b7c857b8 Mon Sep 17 00:00:00 2001 From: "han\\hanst" Date: Tue, 12 Aug 2025 14:12:12 +0800 Subject: [PATCH] =?UTF-8?q?=E9=A2=84=E8=A7=88=E5=B0=BA=E5=AF=B8=E5=92=8C?= =?UTF-8?q?=E7=BA=B8=E5=BC=A0=E5=B0=BA=E5=AF=B8=E4=B8=8D=E4=B8=80=E8=87=B4?= =?UTF-8?q?=E9=97=AE=E9=A2=98?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../labelSetting/components/ZPLPreview.vue | 132 ++++++------------ 1 file changed, 42 insertions(+), 90 deletions(-) diff --git a/src/views/modules/labelSetting/components/ZPLPreview.vue b/src/views/modules/labelSetting/components/ZPLPreview.vue index 5d2f44a..714a354 100644 --- a/src/views/modules/labelSetting/components/ZPLPreview.vue +++ b/src/views/modules/labelSetting/components/ZPLPreview.vue @@ -124,7 +124,7 @@ export default { if (typeof this.selectedPaper === 'number') { return new ZPLGenerator(this.orientation, null, null, this.selectedPaper) } - + // 兼容旧格式 const customSize = this.selectedPaper === 'custom' ? this.canvasSize : null return new ZPLGenerator(this.orientation, this.selectedPaper, customSize) @@ -144,10 +144,16 @@ export default { }, // 转换为Labelary API需要的dpmm值 labelaryDpmm() { - // DPI转换为dpmm (dots per millimeter) - // 1英寸 = 25.4毫米，所以 dpmm = dpi / 25.4 - const dpmm = Math.round(this.selectedDPI / 25.4) - return dpmm + // Labelary API 支持的标准 dpmm 值，确保使用正确的映射 + const dpiToDpmm = { + 152: 6, // 152 DPI = 6 dpmm + 203: 8, // 203 DPI = 8 dpmm (最常用) + 300: 12, // 300 DPI = 12 dpmm + 600: 24 // 600 DPI = 24 dpmm + } + + // 直接使用标准映射，避免计算误差 + return dpiToDpmm[this.selectedDPI] || 8 // 默认使用8dpmm (203 DPI) } }, watch: { @@ -201,89 +207,45 @@ export default { methods: { /** * 根据纸张类型和方向计算Labelary API需要的尺寸格式 - * Labelary API格式: {width}x{height} (单位: 英寸，保留1位小数) + * 关键：确保尺寸计算的精确性，避免预览图尺寸不匹配 */ getLabelarySize() { - let size + let widthMm, heightMm, paperName = '未知纸张' - // 优先使用纸张ID + // 优先使用纸张ID获取精确的毫米尺寸 if (typeof this.selectedPaper === 'number') { const paper = dynamicPaperConfig.getPaperById(this.selectedPaper) if (paper) { - // 从毫米转换为英寸 - size = { - width: Math.round((paper.widthMm / 25.4) * 10) / 10, - height: Math.round((paper.heightMm / 25.4) * 10) / 10 - } + widthMm = paper.widthMm + heightMm = paper.heightMm + paperName = paper.name } } - // 降级处理 - if (!size) { - // 纸张尺寸映射表（兼容旧格式） - const paperSizeMap = { - // 毫米制纸张 (毫米 -> 英寸) - '40x30': { width: 1.6, height: 1.2 }, // 40mm x 30mm - '50x30': { width: 2.0, height: 1.2 }, // 50mm x 30mm - '60x40': { width: 2.4, height: 1.6 }, // 60mm x 40mm - '80x60': { width: 3.1, height: 2.4 }, // 80mm x 60mm - '100x80': { width: 3.9, height: 3.1 }, // 100mm x 80mm - '100x25': { width: 3.9, height: 1.0 }, // 100mm x 25mm (条码标签) - '80x25': { width: 3.1, height: 1.0 }, // 80mm x 25mm (条码标签) - '57x30': { width: 2.2, height: 1.2 }, // 57mm x 30mm (热敏纸) - '80x50': { width: 3.1, height: 2.0 }, // 80mm x 50mm (热敏纸) - - // 英寸制纸张 (直接使用英寸值) - '4x6': { width: 4.0, height: 6.0 }, // 4×6英寸 - '4x4': { width: 4.0, height: 4.0 }, // 4×4英寸 - '4x2': { width: 4.0, height: 2.0 }, // 4×2英寸 - '3x2': { width: 3.0, height: 2.0 }, // 3×2英寸 - '2x4': { width: 2.0, height: 4.0 }, // 2×4英寸 - '2x3': { width: 2.0, height: 3.0 }, // 2×3英寸 - '2x1': { width: 2.0, height: 1.0 }, // 2×1英寸 - '6x4': { width: 6.0, height: 4.0 } // 6×4英寸 - } - - if (this.selectedPaper === 'custom') { - // 自定义尺寸：从画布尺寸的物理信息获取英寸值 - if (this.canvasSize.widthMm && this.canvasSize.heightMm) { - // 从毫米转换为英寸 - size = { - width: Math.round((this.canvasSize.widthMm / 25.4) * 10) / 10, - height: Math.round((this.canvasSize.heightMm / 25.4) * 10) / 10 - } - } else { - // 降级：使用像素转英寸 (203DPI) - const dpi = 203 - size = { - width: Math.round((this.canvasSize.width / dpi) * 10) / 10, - height: Math.round((this.canvasSize.height / dpi) * 10) / 10 - } - } + // 降级处理：从画布尺寸获取物理尺寸 + if (!widthMm || !heightMm) { + if (this.canvasSize.widthMm && this.canvasSize.heightMm) { + widthMm = this.canvasSize.widthMm + heightMm = this.canvasSize.heightMm + paperName = this.canvasSize.name || '画布尺寸' } else { - // 标准纸张尺寸 - size = paperSizeMap[this.selectedPaper] || paperSizeMap['4x2'] + // 最后降级：使用像素转换（基于203 DPI） + widthMm = Math.round((this.canvasSize.width / 203 * 25.4) * 100) / 100 + heightMm = Math.round((this.canvasSize.height / 203 * 25.4) * 100) / 100 + paperName = '像素转换' } } // 横向打印时交换宽高 if (this.orientation === 'landscape') { - const temp = size.width - size.width = size.height - size.height = temp + [widthMm, heightMm] = [heightMm, widthMm] } + // 精确转换为英寸（保留2位小数） + const widthInch = Math.round((widthMm / 25.4) * 100) / 100 + const heightInch = Math.round((heightMm / 25.4) * 100) / 100 // 格式化为Labelary API需要的格式 - const labelarySize = `${size.width}x${size.height}` - - console.log('Labelary尺寸计算:', { - paperType: this.selectedPaper, - orientation: this.orientation, - canvasSize: this.canvasSize, - calculatedSize: size, - labelaryFormat: labelarySize - }) - + const labelarySize = `${widthInch}x${heightInch}` return labelarySize }, @@ -302,32 +264,22 @@ export default { try { const labelSize = this.getLabelarySize() - const response = await axios.post( - `https://api.labelary.com/v1/printers/${this.labelaryDpmm}dpmm/labels/${labelSize}/0/`, - this.zplCode, - { - responseType: 'blob', - timeout: 10000 + const apiUrl = `https://api.labelary.com/v1/printers/${this.labelaryDpmm}dpmm/labels/${labelSize}/0/` + const response = await axios.post(apiUrl, this.zplCode, { + responseType: 'blob', + timeout: 15000, // 增加超时时间 + headers: { + 'Content-Type': 'application/x-www-form-urlencoded' } - ) - + }) // 清理旧的预览图片URL if (this.previewImage) { URL.revokeObjectURL(this.previewImage) } - this.previewImage = URL.createObjectURL(response.data) - - console.log('预览生成成功:', { - orientation: this.orientation, - paperType: this.selectedPaper, - paperId: typeof this.selectedPaper === 'number' ? this.selectedPaper : null, - canvasSize: this.canvasSize, - elementsCount: this.elements.length - }) } catch (error) { - console.error('预览生成失败:', error) - this.$message.error('预览生成失败，请检查网络连接') + let errorMessage = '预览生成失败' + this.$message.error(errorMessage) } finally { this.previewLoading = false } @@ -352,7 +304,7 @@ export default { handlePrintSuccess(result) { console.log('打印成功:', result) // 可以在这里添加打印成功后的逻辑，比如更新状态等 - } + }, }, beforeDestroy() {