供应商数据绑定和增加分页效果

components/product/brand/BrandComponent.vue

@@ -59,12 +59,12 @@
       <tbody>
       <tr class="text-center" v-for="item in supplier.content">
         <td><img :src="item.img || '/images/store/common/default.png'" alt="" class="showImg"></td>
-        <td v-show="item.vendorName">深圳市华商龙商务互联科技有限公司</td>
-        <td v-show="item.detailAddress">深圳市南山区 科技园科技南五路英唐大厦一楼...</td>
-        <td v-show="item.tel">0755-26038000 </td>
-        <td v-show="item.fax"> 0755-26038000 </td>
-        <td v-show="item.email"> 123456789@qq.com... </td>
-        <td v-show="item.website"> http://www.worldshine.net... </td>
+        <td>{{item.vendorName || '-'}}</td>
+        <td>{{item.detailAddress || '-'}}</td>
+        <td>{{item.tel || '-'}}</td>
+        <td>{{item.fax || '-'}}</td>
+        <td>{{item.email || '-'}}</td>
+        <td>{{item.website || '-'}}</td>
       </tr>
       <tr v-if="!supplier.content || supplier.content.length === 0">
         <td colspan="10" class="text-center">
@@ -81,6 +81,10 @@
       </tr>
       </tbody>
     </table>
+    <div style="float: right;" v-if="activeTab == 1">
+      <page :total="supplier.totalElements" :page-size="supplierPageParams.size"
+            :current="supplierPageParams.page" @childEvent="handleChange"></page>
+    </div>
   </div>
 </template>
 <script>
@@ -94,6 +98,11 @@
           count: 10,
           filter: {}
         },
+        supplierPageParams: {
+          page: 1,
+          size: 5,
+          sort: {'updatetime': 'DESC'}
+        },
         searchCode: '',
         activeTab: 0
       }
@@ -139,6 +148,16 @@
         this.pageParams.filter.brandid = this.brand.id
         this.pageCmpGoods(this.pageParams)
       },
+//      获取供应商分页
+      async pageSupplier (params) {
+        let uuid = this.$route.params.code
+        let { data } = await this.$http.get(`/api/produce/vendorlist/${uuid}`, { params })
+        this.$store.commit('product/supplierInformation/GET_INFORMATION_SUCCESS', data)
+      },
+      handleChange (page) {
+        this.supplierPageParams.page = page
+        this.pageSupplier(this.supplierPageParams)
+      },
       listenChild: function (brand) {
         this.$store.dispatch('loadBrandPages', {count: 10, filter: { brandid: brand.id }, page: brand.page})
       }
@@ -271,7 +290,7 @@
     max-width: 100px;
   }
   .component-list .supper-table tbody tr img.showImg{
-    width: 98px;
+    width: 90px;
     height: 49px;
     border: 1px solid #dcdcdc;
   }