From 38b6eb62d4a6c3acb38157d9b2d23e5f0383b3b3 Mon Sep 17 00:00:00 2001
From: lc <15038716315@163.com>
Date: Wed, 17 Apr 2024 09:08:56 +0800
Subject: [PATCH] =?UTF-8?q?=E9=A1=B9=E7=9B=AE=E7=AE=A1=E7=90=86=E7=94=9F?=
 =?UTF-8?q?=E6=88=90=E4=BA=8C=E7=BB=B4=E7=A0=81=E6=B7=BB=E5=8A=A0=E6=89=93?=
 =?UTF-8?q?=E5=8D=B0=E5=8A=9F=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/main.js                        |  3 +-
 src/views/abuwx/wxuser/project.vue | 66 +++++++++++++++++++++++++++---
 2 files changed, 62 insertions(+), 7 deletions(-)

diff --git a/src/main.js b/src/main.js
index 13c6cf2..f68839e 100644
--- a/src/main.js
+++ b/src/main.js
@@ -37,7 +37,7 @@ import DictTag from '@/components/DictTag'
 import VueMeta from 'vue-meta'
 // 字典数据组件
 import DictData from '@/components/DictData'
-
+import Print from 'vue-print-nb'
 // 全局方法挂载
 Vue.prototype.getDicts = getDicts
 Vue.prototype.getConfigKey = getConfigKey
@@ -61,6 +61,7 @@ Vue.component('ImagePreview', ImagePreview)
 Vue.use(directive)
 Vue.use(plugins)
 Vue.use(VueMeta)
+Vue.use(Print);
 DictData.install()
 
 /**
diff --git a/src/views/abuwx/wxuser/project.vue b/src/views/abuwx/wxuser/project.vue
index d7c6f1e..5028e85 100644
--- a/src/views/abuwx/wxuser/project.vue
+++ b/src/views/abuwx/wxuser/project.vue
@@ -76,14 +76,17 @@
         </el-dialog>
         <!-- 二维码 -->
         <el-dialog :visible.sync="codeOpen" width="250px" append-to-body>
-            <div>项目名称：<span>{{ this.titles }}</span></div> 
+          <div id="printdata">
+            <div>项目名称：<span>{{ this.titles }}</span></div>
             <div>
-                <vue-qr ref="qrCode" :text="texturl" :logoSrc="logoSrc" :color-dark="randomColor"></vue-qr>
+              <vue-qr ref="qrCode" :text="texturl" :logoSrc="logoSrc" :color-dark="randomColor"></vue-qr>
             </div>
+          </div>
+
             <div slot="footer">
-                <el-button type="primary" @click="() => {
-            codeOpen = false
-        }">确定</el-button>
+                <el-button type="primary" @click="() => { codeOpen = false }">确定</el-button>
+              <el-button type="text" @click="handlePrint" v-print="'#printdata'" >下载二维码</el-button>
+
             </div>
         </el-dialog>
     </div>
@@ -91,6 +94,7 @@
 
 <script>
 import { listProject, getProject, delProject, addProject, updateProject } from "@/api/abuwx/project";
+
 import upload from '@/components/FileUpload/index.vue'
 import VueQr from 'vue-qr'
 // import { Base64 } from "js-base64";
@@ -103,6 +107,35 @@ export default {
     },
     data() {
         return {
+          printContent: {
+            id: "printdata", // 打印的区域
+            preview: false, // 预览工具是否启用
+            previewTitle: "", // 预览页面的标题
+            popTitle: "", // 打印页面的页眉
+            // extraCss: "", //css 尽量不要在此设置样式
+            previewBeforeOpenCallback(vue) {
+              console.log("正在加载预览窗口");
+            },
+            previewOpenCallback(vue) {
+              console.log("已经加载完预览窗口");
+            },
+            clickMounted: (vue) => {
+              console.log("触发点击打印回调");
+
+              vue.isShowPrint = true; //弹框显示条码
+            },
+            beforeOpenCallback(vue) {
+              console.log("打开之前", vue.barcodeNum);
+            },
+            openCallback(vue) {
+              console.log(vue);
+              vue.isShowPrint = false; // 关闭条码显示弹框
+              console.log("执行了打印", vue.barcodeNum);
+            },
+          },
+          fontSizeText: "16px",
+          lineHeightText: "16px",
+
             downLoadUrl :process.env.VUE_APP_BASE_API,
             // 遮罩层
             loading: true,
@@ -251,7 +284,28 @@ export default {
             this.download('abuwx/project/export', {
                 ...this.queryParams
             }, `project_${new Date().getTime()}.xlsx`)
-        }
+        },
+      handlePrint(qrCode,name) {
+        // refName ref名称   name下载文件名称
+          const iconUrl = this.$refs[qrCode].$el.src //currentSrc
+        console.log(this.$refs[qrCode],'=====================')
+          const a = document.createElement('a')
+          const event = new MouseEvent('click')
+          a.download = name
+          a.href = iconUrl
+          a.dispatchEvent(event)
+
+      },
     }
 };
 </script>
+<style scoped lang="scss">
+#printdata {
+  text-align: center;
+  font-weight: 700;
+  font-size: 20px;
+  .text {
+    margin-bottom: 20px;
+  }
+}
+</style>