<template>
  <view class="x-send-coupon">
    <send-coupon
      v-if="coupon"
      :sign="coupon.sign"
      data-com-type="wx"
      :send_coupon_params="coupon.send_coupon_params"
      :send_coupon_merchant="coupon.send_coupon_merchant"
      :suggest_immediate_use="suggestImmediateUse"
      @sendcoupon="handleCustomEvent"
      @userconfirm="handleUserConfirm"
    >
      <slot />
    </send-coupon>
    <slot v-else />
  </view>
</template>

<script>
export default {
  name: 'XSendCoupon',
  props: {
    coupon: {
      type: Object,
      default: () => null
    },
    suggestImmediateUse: {
      type: Boolean,
      default: true
    }
  },
  data() {
    return {};
  },
  created() {},
  methods: {
    handleCustomEvent({ detail }) {
      console.log('handleCustomEvent')
      this.$store.dispatch('product/setCouponSend', detail).then(() => {
        this.handleConfirm();
      }).catch(() => {
        this.handleConfirm();
      });
      this.$XTrack('HandleSendCouponConfirm', detail);
    },
    handleConfirm() {
      console.log('handleConfirm')
      this.$emit('sendcoupon');
    },
    handleUserConfirm() {
      console.log('handleUserConfirm')
      this.$emit('userconfirm');
    }
  }
};
</script>

<style>

</style>