<template>
  <div class="details">
    <div class="information">
      <brand-detail/>
      <div class="comm-list" v-if="true">
        <categories-list :isShow="isShow"></categories-list>
        <brand-component @showEvent="showList"></brand-component>
      </div>
    </div>
  </div>
</template>
<script>
  import { BrandDetail, CategoriesList, BrandComponent } from '~components/product'
  export default {
    layout: 'default',
    data () {
      return {
        code: '',
        isShow: 0
      }
    },
    components: {
      BrandDetail,
      CategoriesList,
      BrandComponent
    },
    fetch ({ store, params }) {
      return Promise.all([
        store.dispatch('loadBrandDetail', { id: params.code }),
        store.dispatch('product/loadSupplierInformation', { uuid: params.code, count: 5, page: 1 })
      ])
    },
    methods: {
      showList: function (status) {
        this.isShow = status
      },
      listenChild: function (brand) {
        this.$store.dispatch('loadBrandPages', {count: 10, filter: { brandid: brand.id }, page: brand.page})
      }
    }
  }
</script>
<style scoped>
  .comm-list{
    width: 1190px;
    margin: 0 auto;
    overflow: hidden;
  }
</style>
