【新增】temu标签组件

src/components/print/customProvider.js

@@ -11,16 +11,22 @@ export const customProvider = function (options) {
           type: 'html',
           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>')
 
-            setTimeout(() => {
-              // eslint-disable-next-line no-undef
-              JsBarcode("#barcode", "1234567890", {
-                format: "code128", // 条形码类型
-                width: 2, // 条的宽度
-                height: 50, // 条形码的高度
-              });
+            console.log(options.width * 0.8)
+            JsBarcode('#'+ elId, '1234567890', {
+              format: "code128",
+              width: 2,
+              height: options.height * 0.6,
+              margin: 0,
+              displayValue: false
             })
-            return `
+
+            const codeHtml = $(`#${elId}`).html()
+            $(`#${elId}`).remove()
+
+            var html = `
               <div class="temuBarCode">
                 <div class="temuBarCode-top">
                   <div class="hiprint-printElement-text-content hiprint-printElement-content">(AA+AAA)*20PCS</div>
@@ -28,7 +34,9 @@ export const customProvider = function (options) {
                 </div>
                 <div class="temuBarCode-middle">
                   <div class="hiprint-printElement-text-content hiprint-printElement-content temuBarCode-code">
-                    <svg id="barcode"></svg>
+                    <svg id="${elId}" style="display: block; width="100%" display="block" height="100%" class="hibarcode_imgcode" preserveAspectRatio="none slice">
+                      ${codeHtml}
+                    </svg>
                   </div>
                 </div>
                 <div class="temuBarCode-bottom">
@@ -37,6 +45,7 @@ export const customProvider = function (options) {
                 </div>
               </div>
             `
+            return html
           },
           options: {
             width: 316,