From 7d6648fa018339a1fe9b562db6ac3c45c0e15fd2 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=A4=9C=E7=AC=99=E6=AD=8C?= <2277317060@qq.com>
Date: Wed, 11 Jun 2025 18:02:15 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E7=9C=8B=E7=89=88=E9=85=8D?=
 =?UTF-8?q?=E7=BD=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 package.json              |  2 ++
 src/views/print/index.vue | 19 ++++++++++++++++---
 2 files changed, 18 insertions(+), 3 deletions(-)

diff --git a/package.json b/package.json
index 383bd74..c4867ab 100644
--- a/package.json
+++ b/package.json
@@ -39,11 +39,13 @@
     "file-saver": "2.0.5",
     "fuse.js": "7.0.0",
     "highlight.js": "11.9.0",
+    "html2canvas": "^1.4.1",
     "image-conversion": "^2.1.1",
     "js-beautify": "1.14.11",
     "js-cookie": "3.0.5",
     "jsbarcode": "^3.11.6",
     "jsencrypt": "3.3.2",
+    "jspdf": "^3.0.1",
     "nprogress": "0.2.0",
     "pinia": "2.1.7",
     "qrcode": "^1.5.4",
diff --git a/src/views/print/index.vue b/src/views/print/index.vue
index d368a62..4e07774 100644
--- a/src/views/print/index.vue
+++ b/src/views/print/index.vue
@@ -98,18 +98,22 @@
     </div>
   </div>
   <el-dialog v-model="isView" title="预览">
-    <div id="printInfo" v-if="isView">
+    <div id="printInfo" v-if="isView" ref="printRef">
       <View />
     </div>
     <template #footer>
       <span class="dialog-footer">
-        <el-button type="primary" v-print="printInfoObj">打印</el-button>
+        <el-button type="primary" @click="printFun">打印</el-button>
+        <!--        <el-button type="primary" v-print="printInfoObj">打印</el-button>-->
         <el-button @click="isView = false">关闭</el-button>
       </span>
     </template>
   </el-dialog>
 </template>
 <script setup lang="ts">
+
+import html2canvas from 'html2canvas';
+import jsPDF from 'jspdf';
 import { v4 as uuidv4 } from 'uuid';
 import { useRouter } from 'vue-router';
 import { VueFlow, useVueFlow } from '@vue-flow/core';
@@ -129,6 +133,7 @@ const router = useRouter();
 const { onDragStart, onDrop, onDragOver } = tool();
 const { cmToPx } = options;
 
+const printRef = ref();
 const isView = ref(false);
 const flowRef = ref();
 const isSnapToGrid = ref(true);
@@ -254,7 +259,15 @@ const printInfoObj = {
     console.log('触发预览的回调');
   }
 };
-
+const printFun = () => {
+  const element = printRef.value;
+  html2canvas(element).then(canvas => {
+    const imgData = canvas.toDataURL('image/png');
+    const pdf = new jsPDF();
+    pdf.addImage(imgData, 'PNG', 0, 0);
+    pdf.save(`${new Date().getTime()}.pdf`);
+  });
+};
 </script>
 <style lang="less" scoped>
 :deep(.vue-flow__node-area) {