<template>
  <text class="" v-if="item.msg_type == 1">{{ item.content }}</text>
  <image
    v-if="item.msg_type == 2"
    :src="item.image_url"
    class="img"
    mode="widthFix"
    @click="previewImage(item.image_url)"
  ></image>
  <video
    @error="videoErrorCallback"
    v-if="item.msg_type == 5"
    :src="item.image_url"
    class="img"
    mode="widthFix"
    @click="previewVideo(item.video_url)"
  ></video>
  <view class="" v-if="item.msg_type == 4">
    <view>发优惠券了！数量有限！快来领取吧！</view>
    <view class="u-m-t-16 bg-f7 coupon u-flex">
     <view class="left">
        <view class="price">
            <text class="u-font-32">¥</text>
            <text style="font-size: 72rpx;">15</text>
        </view>
        <view class="u-font-24 color-999 no-wrap">满{{item.coupon.fullAmount}}可用</view>
     </view>
     <view class="right u-p-l-28">
        <view class="u-font-32 ">优惠券名称叫什么</view>
        <view class="u-font-24 color-999 u-m-t-8">有效期：2002.1.22-2022.1.22</view>
     </view>
    </view>
  </view>
</template>

<script setup>
const props = defineProps({
  item: {
    type: Object,
    default: () => {},
  },
});
</script>

<style lang="scss" scoped>
  .img {
    width: 50vw;
  }
  .coupon{
    padding: 16rpx 10rpx;
    border-radius: 16rpx;
    .price{
        color: #FF1C1C;
        font-weight: 700;
    }
    .left{
        padding-right: 26rpx;
        border-right: 1rpx solid #EDEDED;
    }
    .right{

    }
  }
</style>
