<template>
  <LayoutApp :show-back="true" :title="title">
    <Scroll :scroll-events="['scroll-end','scroll']"
            @scroll-end="fetchList(isMore)"
            v-if="favoriteProductList.list.length"
            >
      <ProductList :list="favoriteProductList.list"></ProductList>
    </Scroll>
    <!-- <empty-list v-show="!isShowEmpty" /> -->
    <UfoNoItem :tip="`暂无数据`" v-else></UfoNoItem>
  </LayoutApp>
</template>
<script>
import ProductList from '../../list/components/productList';
import EmptyList from "../../order/order-list/components/empty";
import UfoNoItem from '../../../components/ufo-no-item'
import {Scroll} from 'cube-ui';
import {createNamespacedHelpers} from 'vuex';

const {mapState, mapActions} = createNamespacedHelpers('home/favorite');

export default {
  name: 'list',
  components: {
    ProductList,
    Scroll,
    EmptyList,
    UfoNoItem
  },
  data() {
    return {
      title: '我的收藏',
      scrollOptions: {
        bounce: {
          top: false
        },
        pullUpLoad: true
      },
      fixed: false
    };
  },
  mounted() {
    this.fetchFavoriteList();
  },
  methods: {
    ...mapActions(['fetchFavoriteList']),

    async fetchList(isMore) {
      if(this.isMore){
        await this.fetchFavoriteList();
      }
      
    },
    // scroll({ y }) {
    //   const height = this.$refs.banner.$el.offsetHeight + this.$refs.header.offsetHeight;

    //   if (-y >= height) {
    //     this.fixed = true;
    //   } else {
    //     this.fixed = false;
    //   }
    // }
  },
  
  computed: {
    ...mapState(['favoriteProductList','isMore']),
  },
};
</script>

<style scoped>
</style>