调样式

public/index.html

@@ -17,7 +17,7 @@
       width: 100%;
       height: 100%;
       padding: 10pt 10pt;
-      border: 1pt solid #000;
+      border: 2pt solid #000;
     }
 
     .temuBarCode-code {
@@ -30,11 +30,11 @@
       display: flex;
       align-items: center;
       justify-content: space-between;
-      width: 90%;
+      width: 93%;
     }
 
     .temuBarCode-middle {
-      width: 80%;
+      width: 85%;
       height: 60%;
     }
   </style>

src/components/print/Print.vue

@@ -274,8 +274,6 @@
             return '<style></style>'
           }
         }
-
-        const list = this.labels
         this.hiprintTemplate.print(printData)
       },
 
@@ -284,23 +282,20 @@
         node.innerHTML = el.html()
 
         document.querySelector('body').appendChild(node)
-        return node.innerHTML
+        const html = node.innerHTML
+
+        document.querySelector('body').removeChild(node)
+        return html
       },
 
       savePdf() {
-        const list = this.labels
         this.hiprintTemplate.toPdf(printData, '测试导出pdf').then(v => {
           console.log(v)
         })
       },
 
       getHtml() {
-        const list = this.labels
-        console.log(printData)
         this.html = this.elementToString(this.hiprintTemplate.getHtml(printData))
-
-        console.log(this.html)
-
         this.isShowPreview = true
       },
 

src/components/print/customProvider.js

@@ -12,20 +12,26 @@ export const customProvider = function (options) {
           formatter: function (title, options, templateData) {
             console.log(options, templateData)
             var elId = 'barCode-' + new Date().getTime()
-            $('body').append('<svg id="' + elId + '" width="100%" display="block" height="100%" class="hibarcode_imgcode" preserveAspectRatio="none slice"></svg>')
+            // eslint-disable-next-line no-undef
+            $('body').append('<svg id="' + elId + '"></svg>')
 
-            console.log(options.width * 0.8)
+            // eslint-disable-next-line no-undef
             JsBarcode('#'+ elId, '96778555251', {
-              format: "CODE128",
+              format: "CODE128B",
               width: 2,
-              height: options.height * 0.6,
+              height: options.height * 0.6 + 4,
               margin: 0,
               displayValue: false
             })
 
+            // eslint-disable-next-line no-undef
             const codeHtml = $(`#${elId}`).html()
+            // eslint-disable-next-line no-undef
             $(`#${elId}`).remove()
-
+            // eslint-disable-next-line no-undef
+            $('document').on('resize', `#${elId}`, e => {
+              console.log(e)
+            });
             var html = `
               <div class="temuBarCode">
                 <div class="temuBarCode-top">
@@ -34,7 +40,7 @@ export const customProvider = function (options) {
                 </div>
                 <div class="temuBarCode-middle">
                   <div class="hiprint-printElement-text-content hiprint-printElement-content temuBarCode-code">
-                    <svg id="${elId}" style="display: block; width="100%" display="block" height="100%" class="hibarcode_imgcode" preserveAspectRatio="none slice">
+                    <svg id="${elId}" style="display: block" width="100%" display="block" height="100%" class="hibarcode_imgcode" preserveAspectRatio="none slice">
                       ${codeHtml}
                     </svg>
                   </div>