From d86ec51d8aa1b4bce02bf72a812e03b4d34a497b Mon Sep 17 00:00:00 2001
From: liu <2021943741@qq.com>
Date: 星期五, 16 十月 2026 17:50:46 +0800
Subject: [PATCH] feat(mes): 种子质检支持袋码/托盘码/批次码三种扫码类型
---
src/views/mes/pro/components/qr-trace-modal.vue | 132 +++++++++++--------------------------------
1 files changed, 35 insertions(+), 97 deletions(-)
diff --git a/src/views/mes/pro/components/qr-trace-modal.vue b/src/views/mes/pro/components/qr-trace-modal.vue
index 6d75a88..f701da6 100644
--- a/src/views/mes/pro/components/qr-trace-modal.vue
+++ b/src/views/mes/pro/components/qr-trace-modal.vue
@@ -52,9 +52,10 @@
/** 浜岀淮鐮佸睍绀哄唴瀹癸細閰嶇疆浜嗘函婧愬湴鍧�鍒欐嫾 H5 URL锛屽惁鍒欏洖閫�绾爜鍊硷紙涓庡悗绔� buildQrCodeContent 涓�鑷达級 */
const qrContent = computed(() => {
if (!currentCode.value) return "";
+ const code = bagTrace.value?.code || currentCode.value;
return traceBaseUrl.value
- ? `${traceBaseUrl.value}?code=${encodeURIComponent(currentCode.value)}`
- : currentCode.value;
+ ? `${traceBaseUrl.value}?code=${encodeURIComponent(code)}`
+ : code;
});
/** 浠庡畬鏁� H5 閾炬帴涓彁鍙栬拷婧爜锛堝吋瀹规壂鐮佹灙鎵弿鎵撳嵃鏍囩閾炬帴锛� */
@@ -109,12 +110,15 @@
const type = await resolveTraceType(value);
if (type === "bag") {
bagTrace.value = await getBagCodeByCode(value);
+ currentCode.value = bagTrace.value.code || value;
traceTypeLabel.value = "琚嬬爜";
} else if (type === "pallet") {
palletTrace.value = await getPalletByCode(value);
+ currentCode.value = palletTrace.value.code || palletTrace.value.tempCode || value;
traceTypeLabel.value = "鎵樼洏鐮�";
} else if (type === "batch") {
batchTrace.value = await getBatchByCode(value);
+ currentCode.value = batchTrace.value.code || batchTrace.value.tempCode || value;
traceTypeLabel.value = "鎵规鍙�";
} else {
searchError.value = true;
@@ -131,58 +135,6 @@
}
}
- /** 褰撳墠杩芥函鏁版嵁鐨勫叧閿俊鎭紙涓嬭浇/鎵撳嵃鍥剧墖鍙犲姞鏂囧瓧鐢級 */
- function buildLabelText(): { label: string; value: string }[] {
- if (traceType.value === "bag" && bagTrace.value) {
- const d = bagTrace.value;
- return [
- { label: "琚嬬爜", value: d.code || "" },
- { label: "琚嬪簭鍙�", value: d.bagNo ? String(d.bagNo) : "" },
- { label: "鎵规鍙�", value: d.batchCode || "" },
- { label: "鍝佺", value: d.itemName || "" },
- { label: "瑙勬牸", value: d.itemSpecification || "" },
- {
- label: "浜х嚎",
- value: [d.lineCode, d.lineName].filter(Boolean).join(" / "),
- },
- { label: "鐢熶骇鏃ユ湡", value: d.produceDate || "" },
- { label: "璐ｄ换浜�", value: d.ownerUserName || "" },
- ];
- }
- if (traceType.value === "pallet" && palletTrace.value) {
- const d = palletTrace.value;
- return [
- { label: "鎵樼洏鐮�", value: d.code || d.tempCode || "" },
- { label: "鎵樼洏搴忓彿", value: d.palletNo ? String(d.palletNo) : "" },
- { label: "鎵规鍙�", value: d.batchCode || "" },
- { label: "鍝佺", value: d.itemName || "" },
- { label: "瑙勬牸", value: d.itemSpecification || "" },
- {
- label: "浜х嚎",
- value: [d.lineCode, d.lineName].filter(Boolean).join(" / "),
- },
- { label: "鐢熶骇鏃ユ湡", value: d.produceDate || "" },
- { label: "璐ｄ换浜�", value: d.ownerUserName || "" },
- ];
- }
- if (batchTrace.value) {
- const d = batchTrace.value;
- return [
- { label: "鎵规鍙�", value: d.code || d.tempCode || "" },
- { label: "鍝佺", value: d.itemName || "" },
- { label: "瑙勬牸", value: d.itemSpecification || "" },
- {
- label: "浜х嚎",
- value: [d.lineCode, d.lineName].filter(Boolean).join(" / "),
- },
- { label: "鐢熶骇鏃ユ湡", value: d.produceDate || "" },
- { label: "璁″垝鏁伴噺", value: d.planQuantity ? String(d.planQuantity) : "" },
- { label: "璐ｄ换浜�", value: d.ownerUserName || "" },
- ];
- }
- return [];
- }
-
function escapeHtml(value: string) {
return value
.replaceAll("&", "&")
@@ -190,14 +142,14 @@
.replaceAll(">", ">");
}
- /** 涓嬭浇浜岀淮鐮� PNG锛堜簩缁寸爜 + 鍏抽敭淇℃伅鏂囧瓧鍚堟垚锛� */
+ /** 涓嬭浇浜岀淮鐮� PNG锛堜簩缁寸爜鍦ㄤ笂锛岀爜鍊煎湪涓嬶級 */
function handleDownload() {
const base64 = barcodeRef.value?.getImageBase64();
if (!base64) {
message.warning("浜岀淮鐮佺敓鎴愬け璐ワ紝鏃犳硶涓嬭浇");
return;
}
- const items = buildLabelText();
+ const code = currentCode.value || "";
const canvas = document.createElement("canvas");
const ctx = canvas.getContext("2d");
if (!ctx) {
@@ -206,45 +158,23 @@
}
const img = new Image();
img.onload = () => {
- const padding = 20;
- const infoX = img.width + padding * 2;
- const infoWidth = 320;
- canvas.width = infoX + infoWidth + padding;
- canvas.height = Math.max(img.height + padding * 2, 300);
+ const padding = 16;
+ const gap = 4;
+ const textHeight = 28;
+ canvas.width = img.width + padding * 2;
+ canvas.height = img.height + padding * 2 + gap + textHeight;
ctx.fillStyle = "#ffffff";
ctx.fillRect(0, 0, canvas.width, canvas.height);
ctx.drawImage(img, padding, padding);
ctx.fillStyle = "#000000";
- let y = padding + 10;
- const lineHeight = 26;
- items.forEach((item) => {
- ctx.font = "bold 14px 'Microsoft YaHei', Arial, sans-serif";
- ctx.fillText(`${item.label}:`, infoX, y);
- y += 18;
- ctx.font = "14px 'Microsoft YaHei', Arial, sans-serif";
- const text = item.value || "-";
- const maxWidth = infoWidth - 10;
- if (ctx.measureText(text).width > maxWidth) {
- let currentText = text;
- while (currentText.length > 0) {
- let line = "";
- for (let i = 0; i < currentText.length; i++) {
- const testLine = line + currentText[i];
- if (ctx.measureText(testLine).width > maxWidth) {
- break;
- }
- line = testLine;
- }
- ctx.fillText(line, infoX + 5, y);
- y += 16;
- currentText = currentText.slice(line.length);
- }
- y += 6;
- } else {
- ctx.fillText(text, infoX + 5, y);
- y += lineHeight;
- }
- });
+ let fontSize = 20;
+ ctx.font = `bold ${fontSize}px Arial, sans-serif`;
+ while (ctx.measureText(code).width > img.width && fontSize > 1) {
+ ctx.font = `bold ${--fontSize}px Arial, sans-serif`;
+ }
+ ctx.textAlign = "center";
+ ctx.textBaseline = "middle";
+ ctx.fillText(code, canvas.width / 2, padding + img.height + gap + textHeight / 2);
const link = document.createElement("a");
link.href = canvas.toDataURL("image/png");
link.download = `${currentCode.value || "qr"}_${Date.now()}.png`;
@@ -261,7 +191,7 @@
message.warning("浜岀淮鐮佺敓鎴愬け璐ワ紝鏃犳硶鎵撳嵃");
return;
}
- const items = buildLabelText();
+ const code = currentCode.value || "";
const printWindow = window.open("", "_blank");
if (!printWindow) {
message.error("鏃犳硶鎵撳紑鎵撳嵃绐楀彛锛岃妫�鏌ユ祻瑙堝櫒璁剧疆");
@@ -269,12 +199,19 @@
}
printWindow.document.write(`<!DOCTYPE html>
<html><head><meta charset="UTF-8"><title>鎵撳嵃浜岀淮鐮�</title>
-<style>*{margin:0;padding:0}body{font-family:'Microsoft YaHei',Arial,sans-serif;padding:20px}.print-container{text-align:center}.qr-img{max-width:100%;margin:20px 0}.info{margin-top:20px;text-align:left;font-size:13px}.info p{margin:4px 0}@media print{body{padding:0}.print-container{padding:20px}}</style>
+<style>
+*{margin:0;padding:0;box-sizing:border-box}
+body{font-family:Arial,sans-serif;background:#fff;color:#000}
+.print-container{width:40mm;padding:2mm;break-inside:avoid;text-align:center}
+.qr-img{display:block;width:36mm;height:36mm;object-fit:contain}
+.code{display:block;width:36mm;height:5mm;margin-top:0.5mm}
+@page{margin:0}
+</style>
</head><body><div class="print-container">
<img src="${base64}" class="qr-img" alt="浜岀淮鐮�" />
-<div class="info">
-${items.map((item) => `<p><strong>${escapeHtml(item.label)}:</strong> ${escapeHtml(item.value || "-")}</p>`).join("")}
-</div></div></body></html>`);
+<svg class="code" viewBox="0 0 200 28" xmlns="http://www.w3.org/2000/svg" aria-label="鐮佸��">
+<text x="100" y="20" text-anchor="middle" font-family="Arial,sans-serif" font-size="20" font-weight="700"${code.length > 16 ? ' textLength="196" lengthAdjust="spacingAndGlyphs"' : ''}>${escapeHtml(code)}</text>
+</svg></div></body></html>`);
printWindow.document.close();
printWindow.addEventListener("load", () => {
setTimeout(() => printWindow.print(), 500);
@@ -302,9 +239,10 @@
schema: [
{
field: "code",
- label: "琚嬬爜锛堜簩缁寸爜鍐呭锛�",
+ label: "杩芥函鐮�",
span: 2,
},
+ { field: 'businessCode', label: '涓氬姟鐮侊紙鍑哄叆搴擄級', span: 2 },
{
field: "bagNo",
label: "琚嬪簭鍙�",
--
Gitblit v1.9.3