【新增】模板接口对接

src/components/print/Print.vue

@@ -68,7 +68,7 @@
                 <div>文字素材</div>
               </div>
               <div class="print-images">
-                <p v-for="(item, index) in 20" @click="addText(`EVATOST CONSULTING LTD CONSULTING CONSULTING CONSULTING CONSULTING`)" :key="index">EVATOST CONSULTING LTD</p>
+                <p v-for="(item, index) in 20" @click="addText(`EVATOST CONSULTING LTD CONSULTING CONSULTING CONSULTING CONSULTING`, false)" :key="index">EVATOST CONSULTING LTD</p>
               </div>
             </el-popover>
           </div>
@@ -279,6 +279,8 @@
         this.buildLeftElement()
         this.buildDesigner()
       }
+
+      this.getConfig()
     },
 
     methods: {
@@ -287,6 +289,12 @@
         this.isShowDynamicForm = true
       },
 
+      getConfig() {
+        this.$http.post(`/api/material/getPage`).then(res => {
+
+        })
+      },
+
       addImage(src) {
         this.panel.addPrintImage({
           options: {
@@ -303,12 +311,12 @@
         el.design(void 0, designPaper)
       },
 
-      addText(text) {
+      addText(text, isSetField = true) {
         this.panel.addPrintText({
           options: {
-            field: text || '',
+            field: isSetField ? text : '',
-            testData: text || '',
+            testData: isSetField ? text : '',
-            title: '',
+            title: isSetField ? '' : text,
             left: 70.5,
             top: 58.5,
             width: 140,
@@ -435,11 +443,26 @@
         })
       },
 
-      getHtml() {
+      save() {
+        const html = this.elementToString(this.hiprintTemplate.getHtml(this.printData))
+        const json = this.hiprintTemplate.getJson()
+
+        return {
+          html,
+          json,
+          params: JSON.stringify(this.dynamicFromList)
+        }
+      },
+
+      preview() {
         this.html = this.elementToString(this.hiprintTemplate.getHtml(this.printData))
         this.isShowPreview = true
       },
 
+      getHtml() {
+        return this.elementToString(this.hiprintTemplate.getHtml(this.printData))
+      },
+
       clearPaper() {
         this.hiprintTemplate.clear()
       },

src/view/lables/AddTemplate.vue

@@ -11,7 +11,7 @@
           <el-button @click="savePdf" size="small" type="primary">下载pdf</el-button>
           <el-button @click="print" size="small">打印</el-button>
           <el-button @click="clearPaper" size="small" type="danger">清空纸张</el-button>
-          <el-button @click="saveTemplate" size="small" type="primary">保存</el-button>
+          <el-button @click="saveTemplate" size="small" type="primary" :loading="isLoading">保存</el-button>
         </template>
       </ai-title>
     </template>
@@ -40,7 +40,9 @@
       return {
         name: '',
         template: template,
-        printData: {}
+        printData: {},
+        id: '',
+        isLoading: false
       }
     },
 
@@ -59,7 +61,7 @@
       },
 
       preview () {
-        this.$refs.printRef.getHtml()
+        this.$refs.printRef.preview()
       },
 
       savePdf () {
@@ -75,8 +77,22 @@
           return this.$message.error('模板名称不能为空')
         }
 
-        const json = this.$refs.printRef.exportJson()
+        const data = this.$refs.printRef.save()
-        console.log(json)
+        console.log(data)
+
+        this.isLoading = true
+        this.$http.post('/api/template/addTemplate', {
+          name: this.name,
+          codes: data.html,
+          content: JSON.stringify(data.json),
+          params: data.params
+        }).then(res => {
+          if (res.code === 0) {
+            this.isLoading = false
+          }
+        }).catch(() => {
+          this.isLoading = false
+        })
       },
 
       print() {

src/view/lables/Template.vue

@@ -61,7 +61,7 @@
     },
 
     created () {
-      // this.getList()
+      this.getList()
     },
 
     methods: {
@@ -74,15 +74,14 @@
       },
 
       getList () {
-        console.log(this.tableData)
+        this.$http.post('/api/template/getPage', null, {
-        this.$http.post('/api/learning/pluginPage', null, {
           params: {
             ...this.search
           }
         }).then(res => {
           if (res.code === 0) {
-            // this.tableData = res.data.records
+            this.tableData = res.data.records
-            // this.total = res.data.total
+            this.total = res.data.total
           }
         })
       },