<template>
<Layout-Child>
    <div class='w-11/12 mx-auto mt-6'>
      <div class='collection-list'>
        <div v-if="collectionList.length>0">
            <app-collectionCard   v-for="i in collectionList" :colletionData='i'  :key="i.id" class='mt-3' @click.native="goDetail(i.id)"></app-collectionCard>
        </div>
        <div v-else class="mt-12">
            <van-empty  image="/img/empty.png" description="没有找到更多内容"/>
        </div>
      </div>
        
    </div>
</Layout-Child>
</template>

<script lang="ts">
import Vue from 'vue';

export default Vue.extend({
  data(){
    return{
      collectionList:{}
    }
  },
  async created(){
    this.collectionList = await this.$service.nftService.getCollection()
    console.log(this.collectionList);
    
  },
  components:{
       'Layout-Child':()=>import('@/layout/Child.vue'),
       'app-collectionCard':()=>import('@/components/CollectionCard.vue')
    //    'app-cell':()=>import('@/components/common/Cell.vue'),
    //     'app-btn':()=>import('@/components/common/Btn.vue')
  },
  methods:{
    goDetail(id:any){
      this.$router.push({ name: 'Nftdetail', params: { id: id }})
    }
  }
});
</script>
