<template>
  <sail-page type="loading-view" title="社区活动" isHead>
    <div slot="content" class="community_activities_box">        
       <!--  <van-list
          v-model="loading"
          :finished="finished"
          @load="onLoad"
          :offset="10"
        >   -->       
         <router-link class="link" v-for="(activity, index) in communityAllActivityInfo" :key="index" :to="`/communityActivityDetail/${activity.id}`">
              <CommunityActivitiesCard :data="activity" class="community_activities_card"/>
          </router-link>
        
     <!--    </van-list>  -->          
    </div>
  </sail-page>
</template>

<script>

import sailPage from "@/components/sail-page.vue";
import CommunityActivitiesCard from "@/common/widget/communityActivitiesCard.vue";
import { mapState } from "vuex"; 
import { List } from "vant"; //继续加载后面数据
export default {
  components: {
    sailPage,
    CommunityActivitiesCard
  },
  computed: {
    ...mapState({
      communityAllActivityInfo:state => state.allActivityModule.communityAllActivityInfo,
      communityAllActivityList:state => state.allActivityModule.communityAllActivityList, //下拉加载数组
           
    })
  },
  data: function(){
    return {
      list: [],
      loading: false,
      finished: false,
      currentPage: 0
    };  
  },
  asyncData({store,route}) {
    return store.dispatch("allActivityModule/getCommunityActivityInfo",{
      pn : 1,
      pageSize : 1000
    }).then(res => {
      //store.commit('allActivityModule/SET_ACTIVITY_LIST_ADD_INFO', res.data.data.list)

    });
  },
  methods: {
    onLoad() {
      this.currentPage++;
      
      this.$store.dispatch("allActivityModule/getCommunityActivityInfo",{
        pn:this.currentPage,
        pageSize:10
      }).then(res=> {
        this.loading = false;
        if(res.data.data.list.length === 0) {
          this.finished = true;
        }
        this.$store.commit("allActivityModule/SET_ACTIVITY_LIST_ADD_INFO", res.data.data.list);
        //
      });       
    }
  }
};
</script>
<style lang="less">
  .community_activities_box {
    .van-list {
      height: 90vh;
      overflow: scroll;
    }
  }
</style>
<style lang="less" scoped>
    @import "~@/common/less/variable.less";
    .community_activities_box {
    	width: 375px;
      min-height: 100vh;
    	.community_activities_card {
    		margin:12px 26px;   		
    	}
    }
    
</style>