【新增】1.temu条码组件 2.添加SKU

src/components/AiDialog.vue

@@ -1,6 +1,6 @@
 <template>
   <section class="ai-dialog__wrapper">
-    <el-dialog custom-class="ai-dialog" v-on="$listeners" v-bind="$attrs" :visible.sync="dialog">
+    <el-dialog custom-class="ai-dialog" v-on="$listeners" v-bind="$attrs" :visible.sync="dialog" :close-on-click-modal="false">
       <div class="ai-dialog__header fill" slot="title" v-text="title"/>
       <div class="ai-dialog__content">
         <div class="ai-dialog__content--wrapper">

src/components/print/Print.vue

@@ -21,10 +21,6 @@
               <i class="iconfont">&#xea3f;</i>
               <span>表格</span>
             </div>
-            <div class="ep-draggable-item item" tid="defaultModule.html">
-              <i class="iconfont">&#xe633;</i>
-              <span>html</span>
-            </div>
           </div>
           <div class="title">辅助元素</div>
           <div class="left-item__wrapper">
@@ -171,8 +167,8 @@
           }
         },
         paperPopVisible: false,
-        paperWidth: '80',
-        paperHeight: '60'
+        paperWidth: 200,
+        paperHeight: 200
       }
     },
 
@@ -202,24 +198,30 @@
 
     methods: {
       buildLeftElement() {
+        // eslint-disable-next-line no-undef
         hiprint.PrintElementTypeManager.buildByHtml($('.ep-draggable-item'))
+        // eslint-disable-next-line no-undef
         $('#custom-provider').empty()
+        // eslint-disable-next-line no-undef
         hiprint.PrintElementTypeManager.build($('#custom-provider'), 'customProvider')
       },
 
       buildDesigner() {
+        // eslint-disable-next-line no-undef
         $('#hiprint-printTemplate').empty()
-        console.log(template)
         this.hiprintTemplate = newHiprintPrintTemplate('temulables', {
           template: template,
           settingContainer: '#PrintElementOptionSetting',
+          fields: [{
+            field: 'html',
+
+          }],
           onImageChooseClick: (target) => {
             let input = document.createElement('input')
             input.setAttribute('type', 'file')
             input.click()
             input.onchange = function () {
               var file = this.files[0]
-              var reader = new FileReader()
               if (file) {
                 var reader = new FileReader()
                 reader.readAsDataURL(file)
@@ -274,7 +276,7 @@
         }
 
         const list = this.labels
-        this.hiprintTemplate.print(list)
+        this.hiprintTemplate.print(printData)
       },
 
       elementToString(el) {
@@ -286,12 +288,14 @@
 
       savePdf() {
         const list = this.labels
-        this.hiprintTemplate.toPdf(printData, '测试导出pdf')
+        this.hiprintTemplate.toPdf(printData, '测试导出pdf').then(v => {
+          console.log(v)
+        })
       },
 
       getHtml() {
         const list = this.labels
-        this.html = this.elementToString(this.hiprintTemplate.getHtml(list)[0])
+        this.html = this.elementToString(this.hiprintTemplate.getHtml(printData))
 
         console.log(this.html)
 

src/components/print/customProvider.js

@@ -5,19 +5,42 @@ export const customProvider = function (options) {
     context.addPrintElementTypes('customProvider', [
       new hiprint.PrintElementTypeGroup('', [
         {
-          tid: 'providerModule1.date',
-          title: '业务日期',
-          data: '2020-01-01',
-          type: 'text',
+          tid: 'providerModule1.html',
+          title: 'temu条码',
+          data: 'XS888888888',
+          type: 'html',
+          formatter: function (title, options, templateData) {
+            console.log(options, templateData)
+
+            setTimeout(() => {
+              // eslint-disable-next-line no-undef
+              JsBarcode("#barcode", "1234567890", {
+                format: "code128", // 条形码类型
+                width: 2, // 条的宽度
+                height: 50, // 条形码的高度
+              });
+            })
+            return `
+              <div class="temuBarCode">
+                <div class="temuBarCode-top">
+                  <div class="hiprint-printElement-text-content hiprint-printElement-content">(AA+AAA)*20PCS</div>
+                  <div class="hiprint-printElement-text-content hiprint-printElement-content">AA 20PCS+AAA 20PCS</div>
+                </div>
+                <div class="temuBarCode-middle">
+                  <div class="hiprint-printElement-text-content hiprint-printElement-content temuBarCode-code">
+                    <svg id="barcode"></svg>
+                  </div>
+                </div>
+                <div class="temuBarCode-bottom">
+                  <div class="hiprint-printElement-text-content hiprint-printElement-content">1034130097</div>
+                  <div class="hiprint-printElement-text-content hiprint-printElement-content">Made in China</div>
+                </div>
+              </div>
+            `
+          },
           options: {
-            field: 'date',
-            testData: '2020-01-01',
-            height: 16,
-            fontSize: 6.75,
-            fontWeight: '700',
-            textAlign: 'left',
-            textContentVerticalAlign: 'middle',
-            hideTitle: true
+            width: 316,
+            height: 120
           }
         },
         {