<template>
  <div class="supplier" style="background: #f2f1f1;padding-top:20px;">
    <div class="container">
      <div class="article">
        <article-two></article-two>
      </div>
      <div class="section">
        <banner/>
        <!--<carousel>-->
        <!--<kind-category @loadchild="loadProductKinds"></kind-category>-->
        <!--</carousel>-->
      </div>
    </div>
  </div>
</template>

<script>
  import { KindCategory, Carousel } from '~components/home'
  import { MerchantView, Banner, ArticleOne, ArticleTwo } from '~components/supplier'
  export default {
    name: 'SupplierView',
    layout: 'main',
    fetch ({store}) {
      return Promise.all([
        store.dispatch('supplier/loadVendorList', {page: 1, size: 10}),
        store.dispatch('supplier/loadVendorAll', {page: 1, size: 20}),
        store.dispatch('supplier/loadNewMerchant', {filter: 'page', size: 10}),
        store.dispatch('supplier/loadRecommend', {size: 19})
      ])
    },
    components: {
      KindCategory,
      Carousel,
      MerchantView,
      Banner,
      ArticleOne,
      ArticleTwo
    }
  }
</script>
