1.设备台帐二维码上加上设备名称 2.设备保养和保修加上每次的保养保修金额 3.加一个汇总页面，可以看到每个设备的每个月的金额，也可以选择看每年的金额

gaoluyang

2025-11-18 e3179b9da9ed718bb8240ee8a45b3f8c2ad479cb

 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>
@@ -146,6 +147,11 @@
      prop: "deviceModel",
    },
    {
      label: "设备品牌",
      align: "center",
      prop: "deviceBrand",
    },
    {
      label: "供应商",
      align: "center",
      prop: "supplierName",
@@ -154,6 +160,11 @@
      label: "单位",
      align: "center",
      prop: "unit",
    },
    {
      label: "存放位置",
      align: "center",
      prop: "storageLocation",
    },
    {
      label: "数量",
@@ -181,6 +192,12 @@
      prop: "unTaxIncludingPriceTotal",
    },
    {
      label: "启用折旧",
      align: "center",
      prop: "enableDepreciation",
      formatData: (v) => (v ? "是" : "否"),
    },
    {
      label: "录入人",
      align: "center",
      prop: "createUser",
@@ -195,7 +212,7 @@
         label: "操作",
         align: "center",
         fixed: 'right',
         width: 140,
         width: 150,
         operation: [
            {
               name: "编辑",
@@ -283,19 +300,47 @@
};

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>