<template>
|
|
<uni-popup ref="popup" type="center">
|
|
<view class="rule-popup">
|
|
<view class="rule-popup-title">优惠券详细规则</view>
|
|
<view class="rule-popup-content">
|
|
<view class="rule-item">
|
|
<view class="rule-label">名称:</view>
|
|
<view class="rule-value">{{couponData.stockName || ''}}</view>
|
|
</view>
|
|
<!-- <view class="rule-item" v-if="couponData.comment">
|
|
<view class="rule-label">备注:</view>
|
|
<view class="rule-value">{{couponData.comment}}</view>
|
|
</view> -->
|
|
<view class="rule-item">
|
|
<view class="rule-label">类型:</view>
|
|
<view class="rule-value">{{getStockTypeText(couponData)}}</view>
|
|
</view>
|
|
<view class="rule-item">
|
|
<view class="rule-label">优惠内容:</view>
|
|
<view class="rule-value">{{getDiscountText(couponData)}}</view>
|
|
</view>
|
|
<view class="rule-item" v-if="couponData.transactionMinimum">
|
|
<view class="rule-label">消费门槛:</view>
|
|
<view class="rule-value">满{{couponData.transactionMinimum}}元可用</view>
|
|
</view>
|
|
<view class="rule-item" v-if="couponData.goodsName">
|
|
<view class="rule-label">适用范围:</view>
|
|
<view class="rule-value">{{couponData.goodsName}}</view>
|
|
</view>
|
|
<view class="rule-item">
|
|
<view class="rule-label">有效期:</view>
|
|
<view class="rule-value">{{getValidTimeText(couponData)}}</view>
|
|
</view>
|
|
<!-- <view class="rule-item" v-if="couponData.maxCouponsPerUser">
|
|
<view class="rule-label">领取限制:</view>
|
|
<view class="rule-value">每人最多可领{{couponData.maxCouponsPerUser}}张</view>
|
|
</view> -->
|
|
<view class="rule-item">
|
|
<view class="rule-label">特别说明:</view>
|
|
<view class="rule-value">单笔订单仅限使用1张优惠券;优惠券仅限用户本人使用,不可赠送、不可提现、不得找零。</view>
|
|
</view>
|
|
</view>
|
|
<view class="rule-popup-close" @click="close">关闭</view>
|
|
</view>
|
|
</uni-popup>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
name: 'CouponRulePopup',
|
|
data() {
|
|
return {
|
|
couponData: {}
|
|
}
|
|
},
|
|
methods: {
|
|
// 打开弹窗
|
|
open(couponData = {}) {
|
|
this.couponData = couponData;
|
|
this.$refs.popup.open();
|
|
},
|
|
|
|
// 关闭弹窗
|
|
close() {
|
|
this.$refs.popup.close();
|
|
},
|
|
|
|
// 获取批次类型文本
|
|
getStockTypeText(coupon) {
|
|
if (!coupon || !coupon.stockType) return '';
|
|
|
|
const typeMap = {
|
|
'PNORMAL': '平台满减券',
|
|
'PDISCOUNT': '平台折扣券',
|
|
'PTRAIL': '平台体验券',
|
|
'NORMAL': '微信满减券',
|
|
'DISCOUNT': '微信折扣券',
|
|
'EXCHANGE': '微信换购券'
|
|
};
|
|
return typeMap[coupon.stockType] || coupon.stockType;
|
|
},
|
|
|
|
// 获取优惠券折扣文本
|
|
getDiscountText(coupon) {
|
|
if (!coupon || !coupon.stockType) return '';
|
|
|
|
if (coupon.stockType === 'PNORMAL') {
|
|
// 平台满减券
|
|
if (coupon.discountAmount && coupon.transactionMinimum) {
|
|
return `满${coupon.transactionMinimum}元减${coupon.discountAmount}元`;
|
|
} else if (coupon.discountAmount) {
|
|
return `减${coupon.discountAmount}元`;
|
|
}
|
|
return '满减优惠';
|
|
} else if (coupon.stockType === 'PDISCOUNT') {
|
|
// 平台折扣券
|
|
if (coupon.discountPercent) {
|
|
return `${coupon.discountPercent / 10}折优惠`;
|
|
}
|
|
return '折扣优惠';
|
|
} else if (coupon.stockType === 'PTRAIL') {
|
|
// 平台体验券
|
|
return '免费体验';
|
|
} else if (coupon.stockType === 'NORMAL') {
|
|
// 微信满减券
|
|
if (coupon.discountAmount && coupon.transactionMinimum) {
|
|
return `满${coupon.transactionMinimum}元减${coupon.discountAmount}元`;
|
|
}
|
|
return '满减优惠';
|
|
} else if (coupon.stockType === 'DISCOUNT') {
|
|
// 微信折扣券
|
|
if (coupon.discountPercent) {
|
|
return `${coupon.discountPercent}折优惠`;
|
|
}
|
|
return '折扣优惠';
|
|
} else if (coupon.stockType === 'EXCHANGE') {
|
|
// 微信换购券
|
|
return '换购优惠';
|
|
}
|
|
return '';
|
|
},
|
|
|
|
// 获取有效期文本
|
|
getValidTimeText(coupon) {
|
|
if (!coupon) return '';
|
|
|
|
const beginTime = coupon.availableBeginTime ? coupon.availableBeginTime.slice(0, 16).replace('T', ' ') : '';
|
|
const endTime = coupon.availableEndTime ? coupon.availableEndTime.slice(0, 16).replace('T', ' ') : '';
|
|
|
|
if (beginTime && endTime) {
|
|
return `${beginTime} 至 ${endTime}`;
|
|
} else if (endTime) {
|
|
return `截止至 ${endTime}`;
|
|
} else if (beginTime) {
|
|
return `${beginTime} 开始生效`;
|
|
}
|
|
|
|
// 如果有领取后生效天数
|
|
if (coupon.availableDayAfterReceive) {
|
|
return `领取后${coupon.availableDayAfterReceive}天开始生效`;
|
|
}
|
|
|
|
return '长期有效';
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.rule-popup {
|
|
width: 600rpx;
|
|
background-color: #FFFFFF;
|
|
border-radius: 16rpx;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.rule-popup-title {
|
|
height: 100rpx;
|
|
line-height: 100rpx;
|
|
text-align: center;
|
|
font-size: 32rpx;
|
|
font-weight: 600;
|
|
color: #FFFFFF;
|
|
background-color: #FFAA48;
|
|
}
|
|
|
|
.rule-popup-content {
|
|
padding: 30rpx;
|
|
}
|
|
|
|
.rule-item {
|
|
display: flex;
|
|
margin-bottom: 20rpx;
|
|
}
|
|
|
|
.rule-label {
|
|
width: 140rpx;
|
|
font-size: 28rpx;
|
|
color: #666666;
|
|
flex-shrink: 0;
|
|
}
|
|
|
|
.rule-value {
|
|
flex: 1;
|
|
font-size: 28rpx;
|
|
color: #333333;
|
|
line-height: 40rpx;
|
|
}
|
|
|
|
.rule-popup-close {
|
|
height: 90rpx;
|
|
line-height: 90rpx;
|
|
text-align: center;
|
|
font-size: 30rpx;
|
|
color: #FFAA48;
|
|
border-top: 1px solid #EEEEEE;
|
|
}
|
|
</style>
|