index.vue 1.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445
  1. <template>
  2. <view class="layout-coupon-container">
  3. <image :src="require('./images/background.png')" class="layout-coupon-image"></image>
  4. <!-- 优惠券内容部分 -->
  5. <view class="absolute layout-coupon-content row aCenter">
  6. <view class="center price-group row">
  7. <text><text>¥</text><text class="price-int">{{price}}</text></text>
  8. </view>
  9. <view class="flex-1 center">
  10. <view class="line-1 layout-coupon-message">{{item.title}}</view>
  11. <view class="coupon-button center" @click="$emit('receive')">立即领取</view>
  12. </view>
  13. </view>
  14. </view>
  15. </template>
  16. <script>
  17. import props from './props';
  18. export default {
  19. name: "layout-coupon",
  20. computed:{
  21. price(){
  22. if (this.item.value) {
  23. let price = parseFloat(this.item.value);
  24. let intPrice = Math.floor(this.item.value);
  25. if (price === intPrice) {
  26. return intPrice;
  27. } else {
  28. return price;
  29. }
  30. } else {
  31. return 0;
  32. }
  33. },
  34. },
  35. props
  36. }
  37. </script>
  38. <style lang="scss" src="./style.scss"></style>