<template>
|
<view class="popCoupon" :class="isShow?'show':''">
|
<view class="box" v-if="true">
|
<view class="title">优惠券规则</view>
|
<view class="zone-content">
|
<view class="zone-content-item" v-for="(item,index) in text" :key="index"><view class="desc">{{item}}</view></view>
|
<!-- <view class="zone-content-item"><view class="desc">1、每人仅能领1次，不可重复领取，优惠券数量有限，领完即止。</view></view>
|
<view class="zone-content-item"><view class="desc">2、商城全品类通用，有效期至2026年7月31日，过期未使用，自动失效。</view></view>
|
<view class="zone-content-item"><view class="desc">3、商城对于本次活动拥有最终解释权。</view></view> -->
|
<!-- <view class="zone-content-item"><view class="label">4.使用规则：</view><view class="desc">无门槛券，商城全品类通用；有效期至 2026 年 7 月 31 日，过期失效</view></view> -->
|
</view>
|
<!-- <view class="popCoupon_close" @click="hide()"></view> -->
|
<view class="guoqing_close" @click="hide()"></view>
|
</view>
|
</view>
|
|
</template>
|
|
<script>
|
export default {
|
name: "couponRule",
|
data() {
|
return {
|
isShow: false,
|
text:[]
|
};
|
},
|
methods: {
|
show(ruleContentText) {
|
this.text=ruleContentText.replace(/\r\n|\n|↵/g, '\n').split('\n')
|
this.isShow = true;
|
},
|
hide() {
|
this.isShow = false;
|
},
|
}
|
}
|
</script>
|
|
<style lang="scss" scoped>
|
.popCoupon {
|
position: fixed;
|
left: 0;
|
top: 0;
|
width: 100%;
|
height: 100%;
|
z-index: 11111;
|
background-color: rgba(0, 0, 0, .7);
|
display: none;
|
|
&.show {
|
display: block;
|
}
|
|
.box {
|
width: 600rpx;
|
padding: 90rpx 0 70rpx 0;
|
background: url("https://ossacmall.bluedeer.com.cn/app/static/images/confirm_bg.png") center -50rpx / 100% auto no-repeat;
|
background-color: #f5f5f5;
|
position: absolute;
|
left: 50%;
|
top: 50%;
|
transform: translate(-50%, -50%);
|
border-radius: 14rpx;
|
}
|
|
.popCoupon_close {
|
position: absolute;
|
right: 10rpx;
|
top: 10rpx;
|
width: 90rpx;
|
height: 90rpx;
|
background: url("https://ossacmall.bluedeer.com.cn/app/static/images/pop_close.png") center center/30rpx auto no-repeat;
|
}
|
|
.title {
|
lineh-height: 40rpx;
|
font-size: 30rpx;
|
font-weight: bold;
|
color: #000000;
|
text-align: center;
|
}
|
|
.zone-content {
|
padding: 20rpx 20rpx 0 20rpx;
|
line-height: 1.5rem;
|
font-size: 24rpx;
|
max-height: 40vh;
|
overflow: scroll;
|
.label{
|
width: 150rpx;
|
font-weight: bold;
|
}
|
.desc{
|
flex: 1;
|
}
|
.zone-content-item{
|
display: flex;
|
}
|
}
|
|
.guoqing_close {
|
position: absolute;
|
left: 50%;
|
margin-left: -45rpx;
|
bottom: -150rpx;
|
width: 90rpx;
|
height: 90rpx;
|
background: url("https://ossacmall.bluedeer.com.cn/app/static/images/pop_close2.png") center center/78rpx auto no-repeat;
|
|
}
|
}
|
</style>
|
