<template>
  <div class="couponBox">
    <div class="discountList clearfix">
      <div
        v-for="(item, index) in settlementData.coupons" :key="item.couponId" class="couponItem"
        :class="{ active: curPrefCouponInx === index }" @click="preferentialUse(item, index)"
      >
        <div class="couponItemTop">
          <img src="../../assets/images/indexLogo.png" alt="">
          <span>
            <i>￥</i>{{ item.reduceMoney }}
          </span>
          <span style="height:15px;">使用条件：{{ item.content }}</span>
          <span>有效期至：{{ item.endTime }}</span>
          <div class="couponType">平台券</div>
        </div>
        <div class="couponItemBot">
          立即使用
          <span v-if="curPrefCouponInx === index" class="iconfont currentSelect">
            &#xe612;
          </span>
        </div>
      </div>
      <div v-for="(item, index) in shopsData" :key="item.shopId">
        <div
          v-for="(shop) in item.shopCoupons" :key="shop.id" class="couponItem"
          :class="{ active: shopCoupons[index].id === shop.id }" @click="selectShopCoupon(item, index, shop)"
        >
          <div class="couponItemTop">
            <img src="../../assets/images/indexLogo.png" alt="">
            <!--                <span><i>￥</i>{{item.reduceMoney}}</span> -->
            <span>优惠：{{ shop.content }}</span>
            <span style="height:15px;"></span>
            <span>有效期至：{{ shop.endTime }}</span>
            <div class="couponType">店铺券</div>
          </div>
          <div class="couponItemBot">
            立即使用
            <!-- <span class="iconfont currentSelect" v-if="currentShopCoupon === shopIndex">&#xe612;</span> -->
            <span v-if="shopCoupons[index].id === shop.id" class="iconfont currentSelect">
              &#xe612;
            </span>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  props: {}
}
</script>

<style></style>
