<template>
  <div class="mainPage">
    <div class="box">
      <discounts @toUse='toUse' :data='item' @toDetail="toDetail" v-for="(item,index) in list" :key="index"></discounts>
      <noMore v-if="hasPic"></noMore>
    </div>
  </div>
</template>

<script>
import line from '../../../common/icon/cicyle.png'
import logo from '../../../common/icon/logo-t.png'
import Line3 from '../../../common/icon/Line3.png'
import used from '../../../common/icon/already.png'
import failure from '../../../common/icon/inv.png'
// 上拉加载组件
import scroll from '../../../components/scroll/scroll'
import noMore from '../../../components/noMore/noMore'
import discounts from '../../../components/discounts/discounts'
import { mapState, createNamespacedHelpers } from 'vuex'
const { mapActions: caseTableActions } = createNamespacedHelpers('placeOrderForCoffee')

export default {
  data () {
    return {
      logo,
      Line3,
      used,
      failure,
      pullUpLoad: true,
      pullUpLoadThreshold: 40,
      startY: 0,
      isloading: true,
      hasPic: false,
      hasMore: true,
      list: [],
      line 
    }
  },
  components: {
    scroll,
    noMore,
    discounts
  },
  created () {
    this.getCouponList().then((res) => {
      // console.log(JSON.stringify(res))
      // console.log(JSON.stringify(this.couponList))
      if (res) {
        for (var n = 0; n < res.length; n++) {
          let useType
          let nowDate = new Date().valueOf()
          let endDate = new Date(res[n].EndDate).valueOf()
          if (res[n].Status === 2) {
            useType = '已使用'
          } else if (res[n].Status === 1 && nowDate > endDate) {
            useType = '已失效'
          } else {
            useType = '未使用'
          }
          this.list.push({
            title: res[n].Coupon.CouponName,
            desc: res[n].Coupon.Share.UseRule,
            time: this.toolClass.dateFormat(res[n].EndDate),
            useType: useType,
            tag: res[n].Coupon.CouponType === 'course' ? '课程' : '商品',
            customercouponid: res[n].CustomerCouponId,
            couponid: res[n].Coupon.CouponId,
            Coupon: res[n].Coupon
          })
        }
      } else {
        this.hasPic = true
      }

    })
  },
  methods: {
    ...caseTableActions([
      'getCouponList',
    ]),
    change (item, index) {
      this.active = index
    },
    toUse (item) {
      console.log(item)
      item.Coupon.Targets = item.Coupon.Targets || []
      if (item.Coupon.Targets.length > 1) {
        this.$router.push({ name: 'indexPage' })
      } else {
        if (item.tag === '商品') {
          this.$router.push({ name: 'coffeeIndex' })
        } else {
          if (item.Coupon.Targets && item.Coupon.Targets.length === 1) {
            this.$router.push({ name: 'majorProjectsDetail', query: { id: item.Coupon.Targets[0].TargetId } })
          } else {
            this.$router.push({ name: 'indexPage' })
          }
        }
      }
    },
    toDetail (item) {
      this.$router.push({ name: 'couponsDetail', query: { id: item.customercouponid } })
    }
  }
}
</script>

<style lang="scss" scoped>
@import 'page.scss';
</style>
