【新增】模板库

src/components/print/Print.vue

@@ -95,6 +95,7 @@
                 <el-button slot="reference" size="small" :type="'other' == curPaperType ? 'primary' : ''">自定义纸张</el-button>
               </el-popover>
             </el-button-group>
+            <el-button @click="isShowTemplate = true" type="warning" size="small" style="margin-left: 10px;">模板库</el-button>
           </div>
         </div>
         <div class="center-wrapper">
@@ -180,6 +181,28 @@
         </el-form-item>
       </el-form>
     </ai-dialog>
+    <ai-dialog :visible.sync="isShowTemplate" title="模板库" width="960" customFooter>
+      <ai-table
+        :tableData="templateList"
+        :col-configs="templateColConfigs"
+        :total="templateTotal"
+        :current.sync="searchTemplate.current"
+        :size.sync="searchTemplate.size"
+        style="margin-top: 8px;"
+        height="400"
+        @getList="getTemplateList">
+        <el-table-column slot="options" label="操作" align="center">
+          <template v-slot="{ row }">
+            <div class="table-options">
+              <el-button type="text" @click="updateTempate(row), isShowTemplate = false">使用</el-button>
+            </div>
+          </template>
+        </el-table-column>
+      </ai-table>
+      <div class="dialog-footer" slot="footer">
+        <el-button @click="isShowImage = false">取消</el-button>
+      </div>
+    </ai-dialog>
   </div>
 </template>
 
@@ -249,6 +272,8 @@
         html: '',
         isShowPreview: false,
         hiprintTemplate: null,
+        isShowTemplate: false,
+        templateList: [],
         curPaper: {
           type: 'other',
           width: 200,
@@ -279,9 +304,18 @@
           size: 10,
           type: 1
         },
+        searchTemplate: {
+          current: 1,
+          size: 10,
+          type: 1
+        },
+        templateTotal: 0,
         isShowImage: false,
         tableData: [],
-        total: 0
+        total: 0,
+        templateColConfigs: [
+          { prop: 'name', label: '模板名称', align: 'center' }
+        ]
       }
     },
 
@@ -342,6 +376,8 @@
         this.buildLeftElement()
         this.buildDesigner()
         this.getConfig()
+
+        this.getTemplateList()
       }
     },
 
@@ -355,14 +391,28 @@
         }
 
         this.isShowDynamicForm = true
-
-        console.log(this.dynamicFrom)
       },
 
       removeField(index) {
         this.dynamicFromList.splice(index, 1)
       },
 
+      updateTempate(row) {
+
+        this.hiprintTemplate.update(JSON.parse(row.content))
+      },
+
+      getTemplateList() {
+        this.$http.post(`/api/templateRecommend/getRecommendPage`, null, {
+          params: this.searchTemplate
+        }).then(res => {
+          if (res.code === 0) {
+            this.templateList = res.data.records
+            this.templateTotal = res.data.total
+          }
+        })
+      },
+
       getConfig() {
         this.$http.post(`/api/material/getPage?current=${this.search.current}&size=${this.search.size}&type=${this.search.type}`).then(res => {
           if (res.code === 0) {

src/view/Home.vue

@@ -192,16 +192,23 @@
             <i class="el-icon-s-data"></i>
             <span slot="title">数据统计</span>
           </el-menu-item> -->
-          <el-submenu index="/labelsTemplate">
+          <el-submenu index="labels">
             <template slot="title">
               <i class="el-icon-s-goods"></i>
               <div slot="title" style="display: inline-block;">
-                <span>标签管理</span>
+                <span>高级功能</span>
-                <el-button type="text" style="margin-left: 72px; padding: 0;" @click.stop="openMember">开通</el-button>
               </div>
             </template>
-            <el-menu-item index="/labelsTemplate">模板管理</el-menu-item>
+            <el-submenu index="/labelsTemplate" style="padding-left: 15px;">
-            <el-menu-item index="/labelsPrint">标签打印</el-menu-item>
+              <template slot="title">
+                <div slot="title" style="display: inline-block; ">
+                  <span>标签管理</span>
+                  <el-button type="text" style="margin-left: 57px; padding: 0;" @click.stop="openMember">开通</el-button>
+                </div>
+              </template>
+              <el-menu-item index="/labelsTemplate">模板管理</el-menu-item>
+              <el-menu-item index="/labelsPrint">标签打印</el-menu-item>
+            </el-submenu>
           </el-submenu>
         </el-menu>
       </el-scrollbar>

src/view/lables/Print.vue

@@ -78,11 +78,10 @@
         :height="height"
         @getList="() => {}"
         :loading="isLoading">
-        <el-table-column slot="options" label="操作" align="center" fixed="right" width="140px">
+        <el-table-column slot="options" label="操作" align="center" fixed="right" width="120px">
           <template v-slot="{ row }">
             <div class="table-options">
               <el-button type="text" @click="toPrint(row)">打印</el-button>
-              <el-button type="text" @click="toDetail(row.url)">详情</el-button>
             </div>
           </template>
         </el-table-column>
@@ -93,7 +92,7 @@
         title="打印数量"
         width="890px"
         @confirm="onConfirm">
-        <el-form class="ai-form" :model="form" ref="form" label-width="80px">
+        <el-form class="ai-form" :model="form" ref="form" label-width="100px">
           <el-form-item label="标签名称" style="width: 100%;" prop="count" :rules="[{ required: true, message: '请输入打印数量', trigger: 'change' }]">
             <el-input-number v-model="form.count" :min="1" :max="500" label="请输入打印数量"></el-input-number>
           </el-form-item>
@@ -118,13 +117,13 @@
     data () {
       return {
         colConfigs: [
-          { type: 'selection' },
           { prop: 'mallName', label: '店铺名称', align: 'left' },
           { prop: 'labelCode', label: '条码编码', align: 'center' },
           { prop: 'productSkcId', label: 'SKC', align: 'center' },
           { prop: 'productSkuId', label: 'SKU', align: 'center' },
           { prop: 'skuExtCode', label: 'SKU货号',  align: 'center' },
-          { prop: 'skuSpecName', label: '次销售属性', align: 'center' }
+          { prop: 'skuSpecName', label: '次销售属性', align: 'center' },
+          { prop: 'deliveryNum', label: '发货数', align: 'center' }
         ],
         search: {
           mallId: '',
@@ -177,23 +176,52 @@
 
       toPrint(row) {
         this.isLoading = true
-        this.$http.post(`/api/template/detail?id=${row.templateId}`).then(res => {
+        if (this.addType === '1') {
-          this.isLoading = false
+          this.$http.post(`/api/template/getPage?productSkuId=${row.productSkuId}`).then(res => {
-          if (res.code === 0) {
+            if (!res.data.records.length) {
-            const params = JSON.parse(res.data.params)
+              this.isLoading = false
-            const getValue = v => params.filter(e => e.fieldValue === v)[0].fieldName
+              return this.$message.error('该SKU未配置模板')
-            Object.keys(row).forEach(key => {
+            }
-              if (params.findIndex(v => v.fieldValue === key) > -1) {
+
-                row[getValue(key)] = row[key]
+            this.$http.post(`/api/template/detail?id=${res.data.records[0].id}`).then(res => {
+              this.isLoading = false
+              if (res.code === 0) {
+                const params = JSON.parse(res.data.params)
+                const getValue = v => params.filter(e => e.fieldValue === v)[0].fieldName
+                Object.keys(row).forEach(key => {
+                  if (params.findIndex(v => v.fieldValue === key) > -1) {
+                    row[getValue(key)] = row[key]
+                  }
+                })
+
+                this.$refs.printRef.toPrint(JSON.parse(res.data.content), new Array(row.deliveryNum).fill(row))
               }
             })
-            this.printData = {
+          })
-              template: JSON.parse(res.data.content),
+        }  else {
-              data: row
+          this.$http.post(`/api/template/detail?id=${row.templateId}`).then(res => {
+            this.isLoading = false
+            if (res.code === 0) {
+              if (!res.data) {
+                this.isLoading = false
+                return this.$message.error('该SKU未配置模板')
+              }
+              const params = JSON.parse(res.data.params)
+              const getValue = v => params.filter(e => e.fieldValue === v)[0].fieldName
+              Object.keys(row).forEach(key => {
+                if (params.findIndex(v => v.fieldValue === key) > -1) {
+                  row[getValue(key)] = row[key]
+                }
+              })
+
+              this.printData = {
+                template: JSON.parse(res.data.content),
+                data: row
+              }
+              this.isShow = true
             }
-            this.isShow = true
+          })
-          }
+        }
-        })
       },
 
       onConfirm () {
@@ -242,8 +270,8 @@
           }).then(res => {
             if (res.errorCode == 1000000) {
               resolve({
-                list: res.result.list.map(v => v.deliveryOrderSn),
+                list: [].concat(res.result.list.map(v => v.deliveryOrderList.map(e => e.deliveryOrderSn)).flat()),
-                isHasNext: res.result.total && res.result.list.length && (res.result.list.length < 200)
+                isHasNext: res.result.total && res.result.list.length && (res.result.list.length < 200 && res.result.total > 200)
               })
             } else {
               resolve({ list: [], isHasNext: false })
@@ -266,8 +294,9 @@
             }
           }).then(res => {
             if (res.errorCode == 1000000) {
-              resolve(res.data.result.map(v => {
+              resolve(res.result.map(v => {
                 return {
+                  mallName: this.$store.state.mallList.filter(v => v.mallId === this.search.mallId)[0].mallName,
                   productName: v.productName,
                   productSkcId: v.productSkcId,
                   productSkuId: v.productSkuId,
@@ -306,12 +335,15 @@
         const len = Math.ceil(deliveryOrderSnList.length / 100)
         for (let i = 0; i < len; i++) {
           this.page = 1
-          const ids = [...new Set(deliveryOrderSnList)].slice(i * 100, i * 100 + 100).join(',')
+          const ids = [...new Set(deliveryOrderSnList)].slice(i * 100, i * 100 + 100)
           const res = await this.getLabels(ids)
           list.push(...res)
           await this.$sleepSync(500)
         }
 
+        this.isLoading = false
+
+        this.lableList = list
         console.log(list)
       }
     }

src/view/lables/SkuManage.vue

@@ -56,11 +56,18 @@
               @clear="getList">
             </el-input>
           </div>
+          <div class="search-item" style="margin-bottom: 0;">
+            <label style="width: 100px;">仅显示未填写：</label>
+            <el-select v-model="search.isShowWhite" placeholder="请选择" clearable size="small">
+              <el-option label="是" value="1"></el-option>
+              <el-option label="否" value="0"></el-option>
+            </el-select>
+          </div>
           <el-button style="margin-left: 10px;" @click="getList" size="small" :loading="pageShow">查询</el-button>
         </template>
       </ai-search-bar>
       <ai-table
-        :tableData="skuList"
+        :tableData="list"
         :col-configs="colConfigs"
         style="margin-top: 8px;"
         @getList="getList"
@@ -207,7 +214,8 @@
           current: 1,
           size: -1,
           productSkuId: '',
-          productSkcId: ''
+          productSkcId: '',
+          isShowWhite: ''
         },
         lableSearch: {
           current: 1,
@@ -262,6 +270,19 @@
     },
 
     computed: {
+      list () {
+        if (!this.skuList.length) {
+          return []
+        }
+
+        if (this.search.isShowWhite !== '1') {
+          return this.skuList
+        }
+
+        const keys = this.relationList.map(v => v.field)
+        return this.skuList.filter(v => keys.some(e => !v[e]))
+      },
+
       currMall () {
         if (!this.$store.state.mallList.length) {
           return {}
@@ -324,9 +345,8 @@
       },
 
       readXLSX(file) {
-        return new Promise((resolve, reject) => {
+        return new Promise(resolve => {
           const reader = new FileReader()
-
           reader.readAsBinaryString(file)
           reader.onload = evt => {
             const data = evt.target.result
@@ -380,7 +400,7 @@
             mallId: this.lableSearch.mallId,
             anti: true,
             data: {
-              page: page,
+              page,
               pageSize: 200,
               catIds: catIds
             }
@@ -388,7 +408,7 @@
             if (res.errorCode == 1000000) {
               resolve({
                 list: res.result.pageItems.map(v => v.productSkcId),
-                isHasNext: res.result.pageItems.length < 200
+                isHasNext: res.result.total && res.result.pageItems.length && (res.result.pageItems.length < 200 && res.result.total > 200)
               })
             } else {
               resolve({ list: [], isHasNext: false })

src/view/lables/Template.vue

@@ -76,7 +76,7 @@
       return {
         colConfigs: [
           { prop: 'name', label: '模板名称', align: 'left' },
-          { prop: 'count', label: '绑定SKU数量', align: 'center' },
+          { prop: 'skuTotal', label: '绑定SKU数量', align: 'center' },
           { prop: 'createTime', label: '创建时间', align: 'center' },
         ],
         isLoading: false,