From e3179b9da9ed718bb8240ee8a45b3f8c2ad479cb Mon Sep 17 00:00:00 2001
From: gaoluyang <2820782392@qq.com>
Date: 星期二, 18 十一月 2025 14:48:29 +0800
Subject: [PATCH] 1.设备台帐二维码上加上设备名称 2.设备保养和保修加上每次的保养保修金额 3.加一个汇总页面，可以看到每个设备的每个月的金额，也可以选择看每年的金额
---
src/views/equipmentManagement/ledger/index.vue | 55 ++++++++++++++++++++++++++++++++++++++++++-------------
1 files changed, 42 insertions(+), 13 deletions(-)
diff --git a/src/views/equipmentManagement/ledger/index.vue b/src/views/equipmentManagement/ledger/index.vue
index 331cb37..1119f60 100644
--- a/src/views/equipmentManagement/ledger/index.vue
+++ b/src/views/equipmentManagement/ledger/index.vue
@@ -85,6 +85,7 @@
<el-dialog v-model="qrDialogVisible" title="浜岀淮鐮�" width="300px">
<div style="text-align:center;">
<img :src="qrCodeUrl" alt="浜岀淮鐮�" style="width:200px;height:200px;" />
+ <div style="margin-top:6px;font-size:14px;color:#333;">{{ qrRowData?.deviceName }}</div>
<div style="margin:10px 0;">
<el-button type="primary" @click="downloadQRCode">涓嬭浇浜岀淮鐮佸浘鐗�</el-button>
</div>
@@ -211,7 +212,7 @@
label: "鎿嶄綔",
align: "center",
fixed: 'right',
- width: 140,
+ width: 150,
operation: [
{
name: "缂栬緫",
@@ -291,27 +292,55 @@
};
const showQRCode = async (row) => {
- // 浣犲彲浠ヨ嚜瀹氫箟浜岀淮鐮佸唴瀹癸紝姣斿 row.id 鎴� row.deviceName
- const qrContent = JSON.stringify(row); // 鎴� `${row.id}`
+ // 鐩存帴浣跨敤URL锛屼笉瑕佺敤JSON.stringify鍖呰
+ const qrContent = proxy.javaApi + '/device-info?deviceId=' + row.id;
qrCodeUrl.value = await QRCode.toDataURL(qrContent);
qrRowData.value = row;
qrDialogVisible.value = true;
};
const downloadQRCode = () => {
- const a = document.createElement("a");
- a.href = qrCodeUrl.value;
- a.download = `${qrRowData.value.deviceName || "浜岀淮鐮�"}.png`;
- a.click();
+ const name = qrRowData.value?.deviceName || "浜岀淮鐮�";
+ const img = new Image();
+ img.src = qrCodeUrl.value;
+ img.onload = () => {
+ const padding = 10;
+ const qrSize = 200;
+ const textHeight = 24; // space for text
+ const width = qrSize + padding * 2;
+ const height = qrSize + padding * 2 + textHeight;
+ const canvas = document.createElement("canvas");
+ canvas.width = width;
+ canvas.height = height;
+ const ctx = canvas.getContext("2d");
+ // background
+ ctx.fillStyle = "#ffffff";
+ ctx.fillRect(0, 0, width, height);
+ // draw QR centered
+ ctx.drawImage(img, padding, padding, qrSize, qrSize);
+ // draw name centered below
+ ctx.fillStyle = "#333";
+ ctx.font = "14px Arial";
+ ctx.textAlign = "center";
+ ctx.textBaseline = "middle";
+ const maxTextWidth = width - padding * 2;
+ let displayName = name;
+ // ellipsis if too long
+ while (ctx.measureText(displayName).width > maxTextWidth && displayName.length > 0) {
+ displayName = displayName.slice(0, -1);
+ }
+ if (displayName !== name) displayName = displayName + "鈥�";
+ ctx.fillText(displayName, width / 2, qrSize + padding + textHeight / 2);
+
+ const dataUrl = canvas.toDataURL("image/png");
+ const a = document.createElement("a");
+ a.href = dataUrl;
+ a.download = `${name}.png`;
+ a.click();
+ };
};
onMounted(() => {
- filters.entryDate = [
- dayjs().format("YYYY-MM-DD"),
- dayjs().add(1, "day").format("YYYY-MM-DD"),
- ]
- filters.entryDateStart = dayjs().format("YYYY-MM-DD")
- filters.entryDateEnd = dayjs().add(1, "day").format("YYYY-MM-DD")
getTableData();
});
</script>
--
Gitblit v1.9.3