<template>
  <view
      class="coupon-item row aCenter relative"
      @click="triggerRadio"
      :class="[type === 'available'?'coupon-item-available':'','coupon-item-'+type]"
  >
    <view class="coupon-item-left">
      <text class="coupon-item-price-group"><text>¥</text><text class="coupon-item-price">{{price}}</text></text>
      <view class="coupon-introduce">抵扣券</view>
    </view>
    <view class="flex-all-1 overflow">
      <view class="coupon-item-title line-1">{{item.title || ''}}</view>
      <view class="coupon-item-time line-1">{{item.starttime || ''}}-{{item.endtime || ''}}</view>
    </view>
    <view v-if="type==='receive'" @click="triggerReceive" class="coupon-item-button center"
      :class="{'coupon-item-button-disabled':item.is_get===1}"
    >{{item.is_get===1?'已领取':'立即领取'}}</view>
    <v-radio :value="value" v-else-if="type==='radio'" disabled ></v-radio>
    <view v-else-if="type === 'available'" class="absolute coupon-available-footer jCenter">
      <view class="line-1">订单商品未满{{item.least}}元</view>
    </view>
    <image v-if="icon" class="coupon-item-icon" :src="'/static/images/'+icon+'.png'"></image>
  </view>
</template>

<script>
import props from "./props";
import vRadio from '@/components/v-radio/main';
export default {
  name: "layout-use-coupon",

  computed:{
    price(){
      if (this.item.value) {

        let price = parseFloat(this.item.value);

        let intPrice = Math.floor(this.item.value);

        if (price === intPrice) {
          return  intPrice;
        } else {
          return  price;
        }

      } else {
        return 0;
      }
    },

  },

  methods:{
    triggerReceive(){
      if (this.item.is_get !== 1) {
        return this.$emit('receive',{
          item:this.item
        })
      }
    },
    triggerRadio(){
      if (this.type==='radio') {
        return this.$emit('checked',{
          item:this.item
        })
      }
    }
  },

  components:{
    vRadio
  },

  props
}
</script>

<style lang="scss" src="./style.scss"></style>