You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
86 lines
1.9 KiB
86 lines
1.9 KiB
<template>
|
|
<!-- 20221017 -->
|
|
<view class="discount-coupon-cn">
|
|
|
|
<!-- 组件内容 -->
|
|
<view class="cn-content">
|
|
|
|
<!-- 单张优惠券 -->
|
|
<view class="position-relative margin-30 shadow-grey">
|
|
|
|
<!-- 已使用、已过期、不可选择状态加透明度 -->
|
|
<view class="padding-tb-20 flex align-center bg-ff"
|
|
:style="data.status == 2 || data.status == 3 || data.is_able == 0 ? 'opacity: 0.5;' : ''">
|
|
<!-- 左侧 -->
|
|
<view class="flex flex-direction align-center" style="width: 140rpx;">
|
|
<view class="flex align-start justify-center">
|
|
<text class="text-24 text-main">¥</text>
|
|
<text class="line-height-50 text-50 text-main">{{data.price}}</text>
|
|
</view>
|
|
<view class="margin-top-20 text-20 text-main">满{{data.limit_price}}元可用</view>
|
|
</view>
|
|
|
|
<!-- 右侧 -->
|
|
<view class="flex-one padding-lr-30 border_left">
|
|
<text class="line-height-40 text-30 text-cut-one">{{data.name}}</text>
|
|
<view class="margin-top-10">
|
|
<view class="line-height-30 text-20 text-98 text-cut-one">
|
|
<text v-if="data.brief">· {{data.brief}}</text>
|
|
</view>
|
|
<view class="margin-top-30 line-height-30 text-20 text-98 text-cut-one">·
|
|
{{data.validity_text}}
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 右侧插槽 -->
|
|
<view class="" style="width: 130rpx;">
|
|
<slot></slot>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 底部插槽 -->
|
|
<slot name="bottom"></slot>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 组件浮层 -->
|
|
<view class="cn-layer">
|
|
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
props: {
|
|
// 优惠券数据
|
|
data: {
|
|
type: Object,
|
|
default: () => {}
|
|
}
|
|
},
|
|
|
|
data() {
|
|
return {
|
|
|
|
}
|
|
},
|
|
|
|
methods: {
|
|
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
.border_left {
|
|
border-left: 1rpx dashed #e6e6e6;
|
|
}
|
|
|
|
.btn.active {
|
|
border: 1rpx solid var(--main);
|
|
color: var(--main);
|
|
}
|
|
</style>
|