【新增】打印组件

public/css/print-lock.css

@@ -356,7 +356,7 @@ table.hiprint-printElement-tableTarget {
   width: 100%;
   height: 100%;
   padding: 10pt 10pt;
-  border: 1pt solid #000;
+  border: 2pt solid #000;
 }
 
 .temuBarCode-code {
@@ -364,19 +364,19 @@ table.hiprint-printElement-tableTarget {
   height: 100%;
 }
 
+.temuBarCode-code svg {
+  width: 100%;
+}
+
 .temuBarCode-top,
 .temuBarCode-bottom {
   display: flex;
   align-items: center;
   justify-content: space-between;
-  width: 90%;
+  width: 93%;
 }
 
 .temuBarCode-middle {
-  width: 80%;
+  width: 85%;
   height: 60%;
 }
-
-.temuBarCode-code svg {
-  width: 100%;
-}

src/components/print/Print.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="print">
-    <div class="print-wrapper">
+    <div class="print-wrapper" v-if="!isPrint">
       <div class="left">
         <div class="left-wrapper">
           <div class="title">基础元素</div>
@@ -126,7 +126,6 @@
 <script>
   import { hiprint, defaultElementTypeProvider, disAutoConnect } from 'vue-plugin-hiprint'
   import { newHiprintPrintTemplate } from '@/utils/template-helper'
-  import printData from './printData'
   import { customProvider } from './customProvider'
 
   disAutoConnect()
@@ -138,6 +137,41 @@
         default: () => {
           return []
         }
+      },
+
+      printData: {
+        type: Object,
+        default: () => {
+          return {
+          }
+        }
+      },
+
+      template: {
+        type: Object,
+        default: () => {
+          return {
+            "index": 0,
+            "name": 1,
+            "height": 200,
+            "width": 200,
+            "paperHeader": 0,
+            "paperFooter": 547,
+            "printElements": [],
+            "paperNumberLeft": 500,
+            "paperNumberTop": 530,
+            "paperNumberDisabled": true,
+            "paperNumberContinue": true,
+            "fontFamily": "Microsoft YaHei",
+            "scale": 1,
+            "watermarkOptions": {}
+          }
+        }
+      },
+
+      isPrint: {
+        type: Boolean,
+        default: false
       }
     },
 
@@ -209,8 +243,14 @@
         providers: [defaultElementTypeProvider(), customProvider({})]
       })
 
-      this.buildLeftElement()
+      if (this.isPrint) {
-      this.buildDesigner()
+        this.hiprintTemplate = newHiprintPrintTemplate('temulables', {
+          template: this.template
+        })
+      } else {
+        this.buildLeftElement()
+        this.buildDesigner()
+      }
     },
 
     methods: {
@@ -280,7 +320,7 @@
         // eslint-disable-next-line no-undef
         $('#hiprint-printTemplate').empty()
         this.hiprintTemplate = newHiprintPrintTemplate('temulables', {
-          template: {},
+          template: this.template,
           settingContainer: '#PrintElementOptionSetting',
           onImageChooseClick: (target) => {
             let input = document.createElement('input')
@@ -302,26 +342,11 @@
 
 
         this.$nextTick(() => {
-          this.hiprintTemplate.design('#hiprint-printTemplate', {
+          !this.isPrint && this.hiprintTemplate.design('#hiprint-printTemplate', {
             grid: true
           })
 
-          this.panel = this.hiprintTemplate.printPanels[0]
+          // this.panel = this.hiprintTemplate.printPanels[0]
-          console.log(this.hiprintTemplate.printPanels[0])
-          // this.hiprintTemplate.printPanels[0].addPrintText({
-          //   type: 'text',
-          //   data: 'XS888888888',
-          //   options: {
-          //     field: 'barcode',
-          //     testData: 'XS888888888',
-          //     height: 32,
-          //     fontSize: 12,
-          //     lineHeight: 18,
-          //     textAlign: 'left',
-          //     textType: 'barcode',
-          //     hideTitle: true
-          //   }
-          // })
         })
       },
 
@@ -348,16 +373,12 @@
       },
 
       print() {
-        let options = { leftOffset: 0, topOffset: 0 }
+        this.hiprintTemplate.print(this.printData)
-        let ext = {
+      },
-          callback: () => {
-            console.log('浏览器打印窗口已打开')
-          },
 
-          styleHandler: () => {
+      // js打印（不显示设计界面）
-            return '<style></style>'
+      toPrint (template, printData) {
-          }
+        this.hiprintTemplate.update(template)
-        }
         this.hiprintTemplate.print(printData)
       },
 
@@ -373,13 +394,13 @@
       },
 
       savePdf() {
-        this.hiprintTemplate.toPdf(printData, '测试导出pdf').then(v => {
+        this.hiprintTemplate.toPdf(this.printData, '测试导出pdf',{scale:2 }).then(v => {
           console.log(v)
         })
       },
 
       getHtml() {
-        this.html = this.elementToString(this.hiprintTemplate.getHtml(printData))
+        this.html = this.elementToString(this.hiprintTemplate.getHtml(this.printData))
         this.isShowPreview = true
       },
 

src/components/print/template.js

@@ -6,26 +6,8 @@ export default {
       "height": 200,
       "width": 200,
       "paperHeader": 0,
-      "paperFooter": 566.9291338582677,
+      "paperFooter": 547,
       "printElements": [
-        {
-          "options": {
-            "left": 188,
-            "top": 36,
-            "height": 40,
-            "width": 9,
-            "right": 219,
-            "bottom": 144.75,
-            "vCenter": 214.5,
-            "hCenter": 99.75,
-            "coordinateSync": false,
-            "widthHeightSync": false
-          },
-          "printElementType": {
-            "title": "竖线",
-            "type": "vline"
-          }
-        },
         {
           "options": {
             "left": 253.5,
@@ -44,6 +26,24 @@ export default {
             "type": "vline"
           }
         },
+        {
+          "options": {
+            "left": 188,
+            "top": 36,
+            "height": 40,
+            "width": 9,
+            "right": 219,
+            "bottom": 144.75,
+            "vCenter": 214.5,
+            "hCenter": 99.75,
+            "coordinateSync": false,
+            "widthHeightSync": false
+          },
+          "printElementType": {
+            "title": "竖线",
+            "type": "vline"
+          }
+        },
         {
           "options": {
             "left": 370.5,
@@ -143,11 +143,11 @@ export default {
         },
         {
           "options": {
-            "left": 187.5,
+            "left": 253.5,
             "top": 37,
             "height": 18,
-            "width": 66,
+            "width": 117,
-            "title": "Date:",
+            "title": "Dec1,2023",
             "coordinateSync": false,
             "widthHeightSync": false,
             "fontFamily": "Microsoft YaHei",
@@ -167,11 +167,11 @@ export default {
         },
         {
           "options": {
-            "left": 253.5,
+            "left": 187.5,
             "top": 37,
             "height": 18,
-            "width": 117,
+            "width": 66,
-            "title": "Dec1,2023",
+            "title": "Date:",
             "coordinateSync": false,
             "widthHeightSync": false,
             "fontFamily": "Microsoft YaHei",
@@ -527,6 +527,30 @@ export default {
             "type": "text"
           }
         },
+        {
+          "options": {
+            "left": 13.5,
+            "top": 74.5,
+            "height": 20,
+            "width": 103.5,
+            "title": "Manufacturer：",
+            "right": 116.25,
+            "bottom": 112.5,
+            "vCenter": 64.5,
+            "hCenter": 103.5,
+            "coordinateSync": false,
+            "widthHeightSync": false,
+            "fontFamily": "Microsoft YaHei",
+            "fontWeight": "700",
+            "textContentVerticalAlign": "middle",
+            "contentPaddingLeft": 3.75,
+            "qrCodeLevel": 0
+          },
+          "printElementType": {
+            "title": "文本",
+            "type": "text"
+          }
+        },
         {
           "options": {
             "left": 279,
@@ -545,6 +569,24 @@ export default {
             "type": "vline"
           }
         },
+        {
+          "options": {
+            "left": 370.5,
+            "top": 74.5,
+            "height": 21,
+            "width": 9,
+            "right": 379.9921875,
+            "bottom": 114.75,
+            "vCenter": 375.4921875,
+            "hCenter": 104.25,
+            "coordinateSync": false,
+            "widthHeightSync": false
+          },
+          "printElementType": {
+            "title": "竖线",
+            "type": "vline"
+          }
+        },
         {
           "options": {
             "left": 13.5,
@@ -564,48 +606,6 @@ export default {
             "type": "hline"
           }
         },
-        {
-          "options": {
-            "left": 370.5,
-            "top": 74.5,
-            "height": 21,
-            "width": 9,
-            "right": 379.9921875,
-            "bottom": 114.75,
-            "vCenter": 375.4921875,
-            "hCenter": 104.25,
-            "coordinateSync": false,
-            "widthHeightSync": false
-          },
-          "printElementType": {
-            "title": "竖线",
-            "type": "vline"
-          }
-        },
-        {
-          "options": {
-            "left": 13.5,
-            "top": 74.5,
-            "height": 20,
-            "width": 103.5,
-            "title": "Manufacturer：",
-            "right": 116.25,
-            "bottom": 112.5,
-            "vCenter": 64.5,
-            "hCenter": 103.5,
-            "coordinateSync": false,
-            "widthHeightSync": false,
-            "fontFamily": "Microsoft YaHei",
-            "fontWeight": "700",
-            "textContentVerticalAlign": "middle",
-            "contentPaddingLeft": 3.75,
-            "qrCodeLevel": 0
-          },
-          "printElementType": {
-            "title": "文本",
-            "type": "text"
-          }
-        },
         {
           "options": {
             "left": 117,
@@ -1050,16 +1050,12 @@ export default {
         },
         {
           "options": {
-            "left": 24,
+            "left": 21,
-            "top": 384,
+            "top": 387,
             "height": 120,
-            "width": 292.5,
+            "width": 316,
-            "elId": "barCode-1729657391988",
+            "elId": "barCode-1729837262980",
-            "formatter": "function (data, options, templateData) {\n        console.log(data, options, templateData);\n        const elId = options.elId || 'barCode-' + new Date().getTime();\n        const codeWidth = parseInt((options.width - 22) * 0.85);\n        options.elId = `${elId}`;\n\n        // eslint-disable-next-line no-undef\n        $('body').append(`<div id=\"codewrapper-${elId}\" style=\"width: ${codeWidth}pt\">\n              <svg id=\"${elId}\" width=\"100%\" display=\"block\" height=\"100%\" class=\"hibarcode_imgcode\" preserveAspectRatio=\"none slice\"></svg>\n            </div>`);\n        // eslint-disable-next-line no-undef\n        JsBarcode('#' + elId, '96778555251', {\n          format: \"CODE128B\",\n          width: 2,\n          height: parseInt(hinnn.pt.toPx(options.height - 22).toString()) * 0.6,\n          margin: 0,\n          displayValue: false\n        });\n\n        // eslint-disable-next-line no-undef\n        const codeHtml = $(`#codewrapper-${elId}`).html();\n        // eslint-disable-next-line no-undef\n        $(`body>#codewrapper-${elId}`).remove();\n        // eslint-disable-next-line no-undef\n        const resizeObserver = new ResizeObserver(() => {\n          JsBarcode('#' + elId, '96778555251', {\n            format: \"CODE128B\",\n            width: 2,\n            height: parseInt(hinnn.pt.toPx(options.height - 22).toString()) * 0.6,\n            margin: 0,\n            displayValue: false\n          });\n        });\n        setTimeout(() => {\n          const node = document.getElementById(`temuBarCode-${elId}`);\n          if (node) {\n            resizeObserver.observe(node);\n          }\n        }, 0);\n        var html = `\n              <div class=\"temuBarCode\" id=\"temuBarCode-${elId}\">\n                <div class=\"temuBarCode-top\">\n                  <div class=\"hiprint-printElement-text-content hiprint-printElement-content\">(AA+AAA)*20PCS</div>\n                  <div class=\"hiprint-printElement-text-content hiprint-printElement-content\">AA 20PCS+AAA 20PCS</div>\n                </div>\n                <div class=\"temuBarCode-middle\">\n                  <div class=\"hiprint-printElement-text-content hiprint-printElement-content temuBarCode-code\" style=\"width: 100%\">\n                    ${codeHtml}\n                  </div>\n                </div>\n                <div class=\"temuBarCode-bottom\">\n                  <div class=\"hiprint-printElement-text-content hiprint-printElement-content\">1034130097</div>\n                  <div class=\"hiprint-printElement-text-content hiprint-printElement-content\">Made in China</div>\n                </div>\n              </div>\n            `;\n        return html;\n      }",
+            "formatter": "function (data, options, templateData) {\n        console.log(data, options, templateData);\n        const elId = options.elId || 'barCode-' + new Date().getTime();\n        const codeWidth = parseInt((options.width - 22) * 0.85);\n        options.elId = `${elId}`;\n\n        // eslint-disable-next-line no-undef\n        $('body').append(`<div id=\"codewrapper-${elId}\" style=\"width: ${codeWidth}pt\">\n              <svg id=\"${elId}\" width=\"100%\" display=\"block\" height=\"100%\" class=\"hibarcode_imgcode\" preserveAspectRatio=\"none slice\"></svg>\n            </div>`);\n        // eslint-disable-next-line no-undef\n        JsBarcode('#' + elId, '96778555251', {\n          format: \"CODE128B\",\n          width: 2,\n          height: parseInt(hinnn.pt.toPx(options.height - 22).toString()) * 0.6,\n          margin: 0,\n          displayValue: false\n        });\n\n        // eslint-disable-next-line no-undef\n        const codeHtml = $(`#codewrapper-${elId}`).html();\n        // eslint-disable-next-line no-undef\n        $(`body>#codewrapper-${elId}`).remove();\n        // eslint-disable-next-line no-undef\n        const resizeObserver = new ResizeObserver(() => {\n          JsBarcode('#' + elId, '96778555251', {\n            format: \"CODE128B\",\n            width: 2,\n            height: parseInt(hinnn.pt.toPx(options.height - 22).toString()) * 0.6,\n            margin: 0,\n            displayValue: false\n          });\n        });\n        setTimeout(() => {\n          const node = document.getElementById(`temuBarCode-${elId}`);\n          if (node) {\n            resizeObserver.observe(node);\n          }\n        }, 0);\n        var html = `\n              <div class=\"temuBarCode\" id=\"temuBarCode-${elId}\">\n                <div class=\"temuBarCode-top\">\n                  <div class=\"hiprint-printElement-text-content hiprint-printElement-content\">(AA+AAA)*20PCS</div>\n                  <div class=\"hiprint-printElement-text-content hiprint-printElement-content\">AA 20PCS+AAA 20PCS</div>\n                </div>\n                <div class=\"temuBarCode-middle\">\n                  <div class=\"hiprint-printElement-text-content hiprint-printElement-content temuBarCode-code\" style=\"width: 100%\">\n                    ${codeHtml}\n                  </div>\n                </div>\n                <div class=\"temuBarCode-bottom\">\n                  <div class=\"hiprint-printElement-text-content hiprint-printElement-content\">1034130097</div>\n                  <div class=\"hiprint-printElement-text-content hiprint-printElement-content\">Made in China</div>\n                </div>\n              </div>\n            `;\n        return html;\n      }"
-            "right": 289.5,
-            "bottom": 504,
-            "vCenter": 156.75,
-            "hCenter": 444
           },
           "printElementType": {
             "title": "temu条码",
@@ -1067,11 +1063,12 @@ export default {
           }
         }
       ],
-      "paperNumberLeft": 0,
+      "paperNumberLeft": 500,
-      "paperNumberTop": 520,
+      "paperNumberTop": 530,
       "paperNumberDisabled": true,
       "paperNumberContinue": true,
       "fontFamily": "Microsoft YaHei",
+      "scale": 1,
       "watermarkOptions": {}
     }
   ]

src/view/lables/AddTemplate.vue

@@ -1,13 +1,15 @@
 <template>
   <AiDetail class="add-label">
     <template #title>
-      <ai-title title="添加标签" isShowBack :isShowBottomBorder="true" @onBackClick="cancel">
+      <ai-title title="添加模板" isShowBack :isShowBottomBorder="true" @onBackClick="cancel">
         <template #rightBtn>
+          <label>模板名称：</label>
+          <el-input placeholder="请输入模板名称" size="small" v-model="name" style="width: 200px; margin-right: 300px;"></el-input>
           <el-button @click="preview" size="small" type="danger">预览</el-button>
           <el-button @click="savePdf" size="small" type="primary">下载pdf</el-button>
-          <el-button @click="saveTemplate" size="small" type="primary">保存</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>
         </template>
       </ai-title>
     </template>
@@ -15,7 +17,7 @@
       <ai-card title="标签模板" class="card" :hideTitle="true">
         <template #content>
           <div class="add-label__wrapper">
-            <Print ref="printRef" :labels="labels"></Print>
+            <Print ref="printRef" :template="template" :isPrint="false"></Print>
           </div>
         </template>
       </ai-card>
@@ -25,6 +27,7 @@
 
 <script>
   import Print from '@/components/print/Print'
+  import template from '@/components/print/template'
 
   export default {
     components: {
@@ -33,7 +36,8 @@
 
     data () {
       return {
-        labels: []
+        name: '',
+        template: template
       }
     },
 
@@ -55,6 +59,10 @@
       },
 
       saveTemplate () {
+        if (!this.name) {
+          return this.$message.error('模板名称不能为空')
+        }
+
         const json = this.$refs.printRef.exportJson()
         console.log(json)
       },

src/view/lables/Print.vue

@@ -2,45 +2,98 @@
   <ai-list class="Learning">
     <ai-title
       slot="title"
-      title="新手园地"
+      title="标签打印"
       isShowBottomBorder>
     </ai-title>
     <template slot="content">
-      <ai-search-bar>
+      <div class="search-item__wrapper">
-        <template #left>
+        <div class="left">
-          <el-radio-group v-model="search.categoryId" @change="onChange">
+          <div class="search-item">
-            <el-radio-button label="">全部</el-radio-button>
+            <label>添加方式：</label>
-            <el-radio-button label="isFavorite">我的收藏</el-radio-button>
+            <el-radio-group v-model="type" size="small" @change="onSearchRest">
-            <el-radio-button :label="item.id" :key="item.id" v-for="item in cateList">{{ item.name }}</el-radio-button>
+              <el-radio-button label="1">按备货单打印</el-radio-button>
-          </el-radio-group>
+              <el-radio-button label="2">按SKC打印</el-radio-button>
-        </template>
+              <el-radio-button label="3">按SKU打印</el-radio-button>
-        <template #right>
+            </el-radio-group>
-        </template>
+          </div>
-      </ai-search-bar>
+          <div class="search-item">
+            <label>店铺：</label>
+            <el-select v-model="search.mallId" placeholder="请选择店铺" size="small">
+              <el-option
+                v-for="item in $store.state.mallList"
+                :key="item.mallId"
+                :label="item.mallName"
+                :value="item.mallId">
+              </el-option>
+            </el-select>
+          </div>
+        </div>
+        <div class="right"></div>
+      </div>
+      <div class="search-item__wrapper">
+        <div class="left">
+          <div class="search-item" v-show="addType === '1'">
+            <label>备货单：</label>
+            <el-button style="margin-left: 10px;" @click="onCateChange" size="small" :disabled="!search.mallId" :loading="isLoading">查询</el-button>
+          </div>
+        <div class="search-item" v-show="addType === '2'">
+          <label>SKC：</label>
+          <el-input
+            v-model="search.SKC"
+            style="width: 250px"
+            size="small"
+            placeholder="多个查询请用户逗号分割"
+            clearable
+            suffix-icon="iconfont iconSearch">
+          </el-input>
+          <el-button style="margin-left: 10px;" @click="getSkuList" size="small" :disabled="!search.mallId" :loading="isLoading">查询</el-button>
+        </div>
+        <div class="search-item" v-show="addType === '3'">
+          <label>SKU：</label>
+          <el-input
+            v-if="addType === '3'"
+            v-model="search.SKU"
+            style="width: 250px"
+            size="small"
+            clearable
+            placeholder="多个查询请用户逗号分割"
+            suffix-icon="iconfont iconSearch">
+          </el-input>
+          <el-button style="margin-left: 10px;" @click="getSkuList" size="small" :disabled="!search.mallId" :loading="isLoading">查询</el-button>
+        </div>
+        </div>
+      </div>
       <ai-table
         :tableData="tableData"
         :col-configs="colConfigs"
         :total="total"
         :current.sync="search.current"
         :size.sync="search.size"
-        style="margin-top: 8px;"
+        :isShowPagination="false"
         @getList="getList">
         <el-table-column slot="options" label="操作" align="center" fixed="right" width="140px">
           <template v-slot="{ row }">
             <div class="table-options">
-              <el-button type="text" @click="collection(row.id, row.isFavorite)">{{ row.isFavorite === '0' ? '收藏' : '取消收藏' }}</el-button>
+              <el-button type="text">打印</el-button>
               <el-button type="text" @click="toDetail(row.url)">详情</el-button>
             </div>
           </template>
         </el-table-column>
       </ai-table>
+      <Print ref="printRef" :isPrint="true"></Print>
     </template>
   </ai-list>
 </template>
 
 <script>
+  import Print from '@/components/print/Print'
+
   export default {
-    name: 'Learning',
+    name: 'PrintPage',
+
+    components: {
+      Print
+    },
 
     data () {
       return {
@@ -49,83 +102,27 @@
           { prop: 'createTime', label: '发布时间', align: 'center' },
         ],
         tableData: [],
-        total: 0,
         search: {
-          current: 1,
+          mallId: '',
-          size: 10,
+          SKC: '',
-          categoryId: ''
+          SKU: ''
         },
         cateList: [],
-        isFavorite: 0
+        type: '1',
+        isLoading: false
       }
     },
 
     created () {
-      this.$store.dispatch('getUserInfo').then(e => {
-        console.log(e)
-      })
-      this.getCateList()
       this.getList()
     },
 
     methods: {
-      toDetail (url) {
+      toPrint (template, printData) {
-        window.open(url)
+        this.$refs.printData.print(template, printData)
-      },
-
-      onChange (e) {
-        if (e === 'isFavorite') {
-          this.$http.post('/api/learning/favoritePage', null, {
-            params: {
-              ...this.search
-            }
-          }).then(res => {
-            if (res.code === 0) {
-              this.tableData = res.data.records
-              this.total = res.data.total
-            }
-          })
-        } else {
-          this.search.current = 1
-          this.getList()
-        }
-      },
-
-      collection (id, isFavorite) {
-        this.$confirm(isFavorite === '0' ? '确定收藏该文章?' : '确定取消收藏？', '温馨提示', {
-          confirmButtonText: '确定',
-          callback: action => {
-            if (action === 'confirm') {
-              this.$http.post(isFavorite === '0' ? `/api/learning/addFavorite?id=${id}` : `/api/learning/delFavorite?id=${id}`).then(res => {
-                if (res.code === 0) {
-                  this.$message.success(isFavorite === '0' ? '收藏成功' : '取消成功')
-                  this.getList()
-                }
-              })
-            }
-          }
-        })
-      },
-
-      getCateList () {
-        this.$http.post('/api/learningCategory/page?size=50').then(res => {
-          if (res.code === 0) {
-            this.cateList = res.data.records
-          }
-        })
       },
 
       getList () {
-        this.$http.post('/api/learning/pluginPage', null, {
-          params: {
-            ...this.search
-          }
-        }).then(res => {
-          if (res.code === 0) {
-            this.tableData = res.data.records
-            this.total = res.data.total
-          }
-        })
       }
     }
   }

src/view/lables/SkuManage.vue

@@ -10,13 +10,15 @@
     <template slot="content">
       <ai-search-bar>
         <template #left>
-          <el-button type="primary" size="small" @click="isShow = true">添加</el-button>
+          <el-button type="primary" size="small" @click="chooseSkuList = [], isShow = true">添加</el-button>
+          <el-button type="warning" size="small" @click="toAdd(row.url)">导入</el-button>
+          <el-button type="danger" size="small" @click="toAdd(row.url)">导出</el-button>
         </template>
         <template #right>
         </template>
       </ai-search-bar>
       <ai-table
-        :tableData="tableData"
+        :tableData="skuList"
         :col-configs="colConfigs"
         :total="total"
         :current.sync="search.current"
@@ -32,7 +34,7 @@
             </div>
           </template>
         </el-table-column>
-        <el-table-column slot="options" label="操作" align="center" fixed="right" width="140px">
+        <el-table-column slot="options" label="操作" align="center" fixed="right" width="240px">
           <template v-slot="{ row }">
             <div class="table-options">
               <el-button type="text" @click="toAdd(row.url)">编辑</el-button>
@@ -58,7 +60,7 @@
             </div>
             <div class="search-item">
               <label>店铺：</label>
-              <el-select v-model="skuSearch.mallId" placeholder="请选择店铺" size="small">
+              <el-select v-model="lableSearch.mallId" placeholder="请选择店铺" size="small">
                 <el-option
                   v-for="item in $store.state.mallList"
                   :key="item.mallId"
@@ -84,7 +86,7 @@
                 collapse-tags
                 clearable>
               </el-cascader>
-              <el-button style="margin-left: 10px;" @click="onCateChange" size="small" :disabled="!skuSearch.mallId" :loading="isLoading">查询</el-button>
+              <el-button style="margin-left: 10px;" @click="onCateChange" size="small" :disabled="!lableSearch.mallId" :loading="isLoading">查询</el-button>
             </div>
           <div class="search-item" v-show="addType === '2'">
             <label>SKC：</label>
@@ -98,7 +100,7 @@
               @clear="getSkuList()"
               suffix-icon="iconfont iconSearch">
             </el-input>
-            <el-button style="margin-left: 10px;" @click="getSkuList" size="small" :disabled="!skuSearch.mallId" :loading="isLoading">查询</el-button>
+            <el-button style="margin-left: 10px;" @click="getSkuList" size="small" :disabled="!lableSearch.mallId" :loading="isLoading">查询</el-button>
           </div>
           <div class="search-item" v-show="addType === '3'">
             <label>SKU：</label>
@@ -113,22 +115,23 @@
               @clear="getSkuList()"
               suffix-icon="iconfont iconSearch">
             </el-input>
-            <el-button style="margin-left: 10px;" @click="getSkuList" size="small" :disabled="!skuSearch.mallId" :loading="isLoading">查询</el-button>
+            <el-button style="margin-left: 10px;" @click="getSkuList" size="small" :disabled="!lableSearch.mallId" :loading="isLoading">查询</el-button>
           </div>
           </div>
         </div>
         <ai-table
           height="370"
-          :tableData="skuList"
+          :tableData="lableList"
           :col-configs="colConfigs"
-          :total="skuTotal"
+          :total="lableTotal"
-          :current.sync="skuSearch.current"
+          :current.sync="lableSearch.current"
-          :size.sync="skuSearch.size"
+          :size.sync="lableSearch.size"
           style="margin-top: 8px;"
-          @getList="getSkuList"
           :pageSizes="[10, 20, 50, 100, 500, 1000]"
           v-loading="isLoading"
-          :isShowPagination="false">
+          :isShowPagination="false"
+          @getList="() => {}"
+          @selection-change="handleSelectionChange">
           <el-table-column slot="productName" width="300px" :show-overflow-tooltip="true" label="商品名称"  fixed="left">
             <template slot-scope="scope">
               <div>
@@ -162,19 +165,18 @@
           { prop: 'skuExtCode', label: 'SKU货号',  align: 'center' },
           { prop: 'skuSpecName', label: '次销售属性', align: 'center' }
         ],
-        tableData: [],
         total: 0,
         search: {
           current: 1,
           size: 100
         },
-        skuSearch: {
+        lableSearch: {
           current: 1,
           size: 100,
           mallId: ''
         },
-        skuTotal: 0,
+        lableTotal: 0,
-        skuList: [],
+        lableList: [],
         isShow: false,
         skuReqParams: {
           page: 1,
@@ -209,7 +211,9 @@
             })
           }
         },
-        targetCatId: []
+        targetCatId: [],
+        skuList: [],
+        chooseSkuList: []
       }
     },
 
@@ -219,7 +223,7 @@
           return {}
         }
 
-        return this.$store.state.mallList.filter(v => v.mallId === this.skuSearch.mallId)[0]
+        return this.$store.state.mallList.filter(v => v.mallId === this.lableSearch.mallId)[0]
       }
     },
 
@@ -239,6 +243,7 @@
 
       handleSelectionChange(e) {
         console.log(e)
+        this.chooseSkuList = e
       },
 
       getSKCList(catIds, page) {
@@ -246,7 +251,7 @@
           sendChromeAPIMessage({
             url: 'bg-visage-mms/product/skc/pageQuery',
             needMallId: true,
-            mallId: this.skuSearch.mallId,
+            mallId: this.lableSearch.mallId,
             anti: true,
             data: {
               page: 1,
@@ -269,35 +274,42 @@
       },
 
       async onCateChange() {
-        let page = 1
+        this.$userCheck(this.lableSearch.mallId).then(async () => {
-        let list = []
+          let page = 1
-        let isHasNext = true
+          let list = []
-        this.isLoading = true
+          let isHasNext = true
-        while (isHasNext) {
+          this.lableList = []
-          const result = await this.getSKCList([].concat(this.targetCatId.flat()), page)
+          this.isLoading = true
-          page = page + 1
+          while (isHasNext) {
-          isHasNext = result.isHasNext ? true : false
+            const result = await this.getSKCList([].concat(this.targetCatId.flat()), page)
-          list.push(...result.list)
+            page = page + 1
+            isHasNext = result.isHasNext ? true : false
+            list.push(...result.list)
 
-          await this.$sleepSync(5000)
+            await this.$sleepSync(5000)
-        }
+          }
 
-        const skcList = [...new Set(list)]
+          const skcList = [...new Set(list)]
-        const len = Math.ceil(skcList.length / 100)
+          const len = Math.ceil(skcList.length / 100)
-        for (let i = 0; i < len; i++) {
+          for (let i = 0; i < len; i++) {
-          this.skuReqParams.page = 1
+            this.skuReqParams.page = 1
-          this.skuReqParams.SKC = [...new Set(list)].slice(i * 100, i * 100 + 100).join(',')
+            this.skuReqParams.SKC = [...new Set(list)].slice(i * 100, i * 100 + 100).join(',')
-          await this.requestSKUList()
+            await this.requestSKUList(true)
-          await this.$sleepSync(2000)
+            await this.$sleepSync(2000)
-        }
+          }
+
+          console.log(111)
+          this.isLoading = false
+        }).catch(() => {
+          this.lableSearch.mallId = ''
+        })
       },
 
-      requestSKUList() {
+      requestSKUList(flag) {
-        this.isLoading = true
         return sendChromeAPIMessage({
           url: 'bg-visage-mms/labelcode/pageQuery',
           needMallId: true,
-          mallId: this.skuSearch.mallId,
+          mallId: this.lableSearch.mallId,
           anti: true,
           data: {
             page: this.skuReqParams.page,
@@ -309,7 +321,7 @@
           if (res.errorCode == 1000000) {
             const list = res.result.pageItems.map(v => {
               return {
-                mallId: this.skuSearch.mallId,
+                mallId: this.lableSearch.mallId,
                 mallName: this.currMall.mallName,
                 productName: v.productName,
                 productSkuId: v.labelCodeVO.productSkuId,
@@ -320,33 +332,32 @@
                 }).join(',')
               }
             })
-            this.skuTotal = res.result.total
+            this.lableTotal = res.result.total
-            this.skuList.push(...list)
+            this.lableList.push(...list)
 
-            if (res.result.total > this.skuList.length) {
+            if (res.result.total > this.lableList.length) {
               this.skuReqParams.page++
               await this.$sleepSync(5000)
               await this.requestSKUList()
             } else {
-              this.isLoading = false
+              !flag && (this.isLoading = false)
             }
           }
         })
       },
 
       getSkuList () {
-        if (!this.skuSearch.mallId) {
+        if (!this.lableSearch.mallId) {
           return this.$message.error('请选择店铺')
         }
 
-        this.$userCheck(this.skuSearch.mallId).then(() => {
+        this.$userCheck(this.lableSearch.mallId).then(() => {
-          this.skuList = []
+          this.lableList = []
           this.skuReqParams.page = 1
           this.isLoading = true
-
           this.requestSKUList()
         }).catch(() => {
-          this.skuSearch.mallId = ''
+          this.lableSearch.mallId = ''
         })
       },
 
@@ -364,7 +375,8 @@
       },
 
       onConfirm () {
-
+        this.skuList = this.chooseSkuList
+        this.isShow = false
       }
     }
   }