Browse Source

feat 打印二维码

Funny 3 years ago
parent
commit
c186efc5df
2 changed files with 26 additions and 11 deletions
  1. 21 6
      src/common/UsbAutoPrint.vue
  2. 5 5
      src/components/downloadCenter.vue

+ 21 - 6
src/common/UsbAutoPrint.vue

@@ -1,7 +1,9 @@
 <template>
+  <div ref="qrcode" id="qrcode" style="display:none;"></div>
 </template>
 
 <script>
+import QRCode from "qrcodejs2";
 import { getLodop } from "./LodopFuncs.js";
 import { mapGetters } from "vuex";
 export default {
@@ -29,14 +31,25 @@ export default {
       handler() {
         if (JSON.stringify(this.printData) !== "{}") {
           this.printInfo = this.printData;
-          this.usbPrinterList.forEach((e) => {
-            if (this.deviceName) {
-              if (e.deviceName === this.deviceName) {
+          if (this.printData.openQrCode) {
+            this.$refs.qrcode.innerHTML = "";
+            let qrcode = new QRCode("qrcode", {
+              width: 100,
+              height: 100, // 高度
+              text: this.printData.orderidView, // 二维码内容
+            });
+          }
+
+          this.$nextTick(() => {
+            this.usbPrinterList.forEach((e) => {
+              if (this.deviceName) {
+                if (e.deviceName === this.deviceName) {
+                  this.pringPdf(e);
+                }
+              } else {
                 this.pringPdf(e);
               }
-            } else {
-              this.pringPdf(e);
-            }
+            });
           });
         }
       },
@@ -235,6 +248,8 @@ export default {
         pageWidth === 1
           ? "---------------#" + printInfo.daySeq + "完-------------"
           : "------------------#" + printInfo.daySeq + "完----------------"
+      }</div><div style="display:flex;justify-content: center;align-items: center;">${
+        num === 1 ? this.$refs.qrcode.innerHTML : ""
       }</div>    </div>`;
       return html1 + html2 + html3;
     },

+ 5 - 5
src/components/downloadCenter.vue

@@ -34,7 +34,7 @@
         <div class="b_line"></div>
         <div class="triangle"></div>
       </div>
-      <div class="label">打印机插件<span>(请依据打印机品牌安装对应的插件)</span></div>
+      <div class="label">打印机驱动<span>(请依据打印机品牌安装对应的驱动)</span></div>
     </div>
     <div class="plug-list">
       <div class="plug" v-for="(v,i) in printerPlug" :key="i">
@@ -77,7 +77,7 @@ export default {
         {
           img: require("../../static/image/download.png"),
           name: "Iphone手机版",
-          tips: "应用市场搜索[猎豹AI聚合运力配送]",
+          tips: "应用市场搜索[AI聚合配送]",
           download: false,
           src: "",
         },
@@ -113,17 +113,17 @@ export default {
       ],
       printerPlug: [
         {
-          name: "佳博打印机插件",
+          name: "佳博打印机驱动",
           tips: "进入驱动下载页面,选择对应打印机驱动进行下载",
           src: "http://cn.gainscha.com/qudong.html",
         },
         {
           name: "佳博IP修改工具",
-          tips: "C-Lodop打印服务插件,该插件只支持64位Windows操作系统",
+          tips: "点击下载IP修改工具,安装后进行相关操作",
           src: "https://pc.liebaoai.cn/download/GP_printer.exe",
         },
         {
-          name: "芯烨打印机插件",
+          name: "芯烨打印机驱动",
           tips: "进入驱动下载页面,根据打印机小票宽度,选择对应驱动",
           src: "https://www.xprinter.net/companyfile/6/",
         },