177 lines
27 KiB
Vue
177 lines
27 KiB
Vue
|
<template>
|
|||
|
|
<view>
|
|||
|
|
<view class='coupon-window' :class='window==true?"on":""'>
|
|||
|
|
<view class='couponWinList'>
|
|||
|
|
<view class='item acea-row row-between-wrapper' v-for="(item,index) in couponList" :key="index">
|
|||
|
|
<view class='money font-color'>￥<text class='num'>{{item.coupon_price}}</text></view>
|
|||
|
|
<view class='text'>
|
|||
|
|
<view class='name'>购物买{{item.use_min_price}}减{{item.coupon_price}}</view>
|
|||
|
|
<view>{{item.start_time ? item.start_time+'-' : ''}}{{item.end_time}}</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class='lid'>
|
|||
|
|
<navigator hover-class='none' url='/pages/users/user_get_coupon/index' class='bnt font-color'>立即领取</navigator>
|
|||
|
|
<view class='iconfont icon-guanbi3' @click="close"></view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class='mask' catchtouchmove="true" :hidden="window==false"></view>
|
|||
|
|
</view>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
// +----------------------------------------------------------------------
|
|||
|
|
// | CRMEB [ CRMEB赋能开发者，助力企业发展 ]
|
|||
|
|
// +----------------------------------------------------------------------
|
|||
|
|
// | Copyright (c) 2016~2021 https://www.crmeb.com All rights reserved.
|
|||
|
|
// +----------------------------------------------------------------------
|
|||
|
|
// | Licensed CRMEB并不是自由软件，未经许可不能去掉CRMEB相关版权
|
|||
|
|
// +----------------------------------------------------------------------
|
|||
|
|
// | Author: CRMEB Team <admin@crmeb.com>
|
|||
|
|
// +----------------------------------------------------------------------
|
|||
|
|
export default {
|
|||
|
|
props: {
|
|||
|
|
window: {
|
|||
|
|
type: Boolean,
|
|||
|
|
default: false,
|
|||
|
|
},
|
|||
|
|
couponList: {
|
|||
|
|
type: Array,
|
|||
|
|
default: function() {
|
|||
|
|
return []
|
|||
|
|
},
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
data() {
|
|||
|
|
return {
|
|||
|
|
|
|||
|
|
};
|
|||
|
|
},
|
|||
|
|
methods: {
|
|||
|
|
close:function(){
|
|||
|
|
this.$emit('onColse');
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<style scoped lang="scss">
|
|||
|
|
.coupon-window {
|
|||
|
|
background-image: url('data:image/png;base64,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
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
background-size: 100% 100%;
|
|||
|
|
width: 630rpx;
|
|||
|
|
height: 649rpx;
|
|||
|
|
position: fixed;
|
|||
|
|
top: 20%;
|
|||
|
|
z-index: 99;
|
|||
|
|
left: 50%;
|
|||
|
|
margin-left: -305rpx;
|
|||
|
|
transform: translate3d(0, -200%, 0);
|
|||
|
|
transition: all .3s cubic-bezier(.25, .5, .5, .9);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.coupon-window.on {
|
|||
|
|
transform: translate3d(0, 0, 0);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.coupon-window .couponWinList {
|
|||
|
|
width: 480rpx;
|
|||
|
|
margin: 157rpx 0 0 60rpx;
|
|||
|
|
height: 415rpx;
|
|||
|
|
overflow: auto;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.coupon-window .couponWinList .item {
|
|||
|
|
width: 100%;
|
|||
|
|
height: 120rpx;
|
|||
|
|
background-color: #fff;
|
|||
|
|
position: relative;
|
|||
|
|
margin-bottom: 17rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.coupon-window .couponWinList .item::after {
|
|||
|
|
content: '';
|
|||
|
|
position: absolute;
|
|||
|
|
width: 18rpx;
|
|||
|
|
height: 18rpx;
|
|||
|
|
border-radius: 50%;
|
|||
|
|
background-color: #f2443a;
|
|||
|
|
left: 25.5%;
|
|||
|
|
bottom: 0;
|
|||
|
|
margin-bottom: -9rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.coupon-window .couponWinList .item::before {
|
|||
|
|
content: '';
|
|||
|
|
position: absolute;
|
|||
|
|
width: 18rpx;
|
|||
|
|
height: 18rpx;
|
|||
|
|
border-radius: 50%;
|
|||
|
|
background-color: #f2443a;
|
|||
|
|
left: 25.5%;
|
|||
|
|
top: 0;
|
|||
|
|
margin-top: -9rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.coupon-window .couponWinList .item .money {
|
|||
|
|
width: 130rpx;
|
|||
|
|
border-right: 1px dashed #ddd;
|
|||
|
|
height: 100%;
|
|||
|
|
text-align: center;
|
|||
|
|
line-height: 120rpx;
|
|||
|
|
font-size: 26rpx;
|
|||
|
|
font-weight: bold;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.coupon-window .couponWinList .item .money .num {
|
|||
|
|
font-size: 40rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.coupon-window .couponWinList .item .text {
|
|||
|
|
width: 349rpx;
|
|||
|
|
font-size: 22rpx;
|
|||
|
|
color: #999;
|
|||
|
|
padding: 0 29rpx;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.coupon-window .couponWinList .item .text .name {
|
|||
|
|
font-size: 26rpx;
|
|||
|
|
color: #282828;
|
|||
|
|
font-weight: bold;
|
|||
|
|
margin-bottom: 9rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.coupon-window .lid {
|
|||
|
|
background-image: url('data:image/png;base64,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');
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
background-size: 100% 100%;
|
|||
|
|
width: 573rpx;
|
|||
|
|
height: 224rpx;
|
|||
|
|
position: fixed;
|
|||
|
|
left: 50%;
|
|||
|
|
top: 20%;
|
|||
|
|
margin: 424rpx 0 0 -296rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.coupon-window .lid .bnt {
|
|||
|
|
font-size: 29rpx;
|
|||
|
|
width: 440rpx;
|
|||
|
|
height: 80rpx;
|
|||
|
|
border-radius: 40rpx;
|
|||
|
|
background-color: #f9f1d3;
|
|||
|
|
text-align: center;
|
|||
|
|
line-height: 80rpx;
|
|||
|
|
font-weight: bold;
|
|||
|
|
margin: 98rpx auto 0 auto;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.coupon-window .lid .iconfont {
|
|||
|
|
color: #fff;
|
|||
|
|
font-size: 60rpx;
|
|||
|
|
text-align: center;
|
|||
|
|
margin-top: 87rpx;
|
|||
|
|
}
|
|||
|
|
</style>
|