Skip to content

M
mayi-mp-shop
Commit a23bc750 by hxx
Options

优惠券优化

parent dc75955f
Showing with 60 additions and 19 deletions
src/components/activity/coupon.vue
......@@ -12,7 +12,7 @@
<template v-for="(item,index) in couponList">
<div
class="coupon-box coupon-box9 clearfix"
v-if="item.receiveTag"
v-if="item.receiveTag != 2"
:key="index"
>
<div class="coupon-sort9"
......@@ -54,9 +54,21 @@
</div>
<div class="content-r">
<div class="coupon-box-title line-clamp1">{{item.couponName}}</div>
<div class="coupon-remark line-clamp1" v-if="!item.receiveEndTime">{{item.backRemark}}</div>
<div
class="coupon-remark line-clamp1"
v-if="!item.receiveStartTime && !item.receiveEndTime"
>
{{item.backRemark}}
</div>
<div class="coupon-remark" style="position: relative;" v-else>
<div class="coupon-receive__wrapper">{{ item.receiveEndTime }} 结束</div>
<div class="coupon-receive__wrapper">
<template v-if="item.receiveTag == 0">
{{ item.receiveStartTime }} 开始
</template>
<template v-else>
{{ item.receiveEndTime }} 结束
</template>
</div>
</div>
<div class="box-r-bottom">
<div class="coupon-time line-clamp1" style="width:100%" :style="{'display':datas.componentData.isSlide ? 'inline-block' : ''}">
......@@ -97,7 +109,7 @@
<template v-for="(item,index) in couponList">
<div
class="coupon-box coupon-box8 clearfix"
v-if="item.receiveTag"
v-if="item.receiveTag != 2"
:key="index"
>
<div class="coupon-sort8"
......@@ -152,7 +164,7 @@
<template v-for="(item,index) in couponList">
<div
class="coupon-box coupon-box7 clearfix"
v-if="item.receiveTag"
v-if="item.receiveTag != 2"
:key="index"
>
<div class="coupon-sort7"
......@@ -195,7 +207,7 @@
<template v-for="(item,index) in couponList">
<div
class="coupon-box coupon-box6 clearfix"
v-if="item.receiveTag"
v-if="item.receiveTag != 2"
:key="index"
>
<div class="coupon-sort6"
......@@ -234,9 +246,21 @@
<div class="box-r" :style="{'background' : datas.componentData.color && datas.componentData.color.name}">
<div class="box-r-info">
<div class="coupon-box-title line-clamp1">{{item.couponName}}</div>
<div class="coupon-remark line-clamp1" v-if="!item.receiveEndTime">{{item.backRemark}}</div>
<div
class="coupon-remark line-clamp1"
v-if="!item.receiveStartTime && !item.receiveEndTime"
>
{{item.backRemark}}
</div>
<div class="coupon-remark" style="position: relative;" v-else>
<div class="coupon-receive__wrapper">{{ item.receiveEndTime }} 结束</div>
<div class="coupon-receive__wrapper">
<template v-if="item.receiveTag == 0">
{{ item.receiveStartTime }} 开始
</template>
<template v-else>
{{ item.receiveEndTime }} 结束
</template>
</div>
</div>
<div class="box-r-bottom">
<div class="coupon-time line-clamp1" :style="{'display':datas.componentData.isSlide ? 'block' : ''}">
......@@ -280,7 +304,7 @@
<template v-for="(item,index) in couponList">
<div
class="coupon-box coupon-box5 clearfix"
v-if="item.receiveTag"
v-if="item.receiveTag != 2"
:key="index"
>
<div class="coupon-sort5"
......@@ -327,7 +351,7 @@
<template v-for="(item,index) in couponList">
<div
class="coupon-box coupon-box4 clearfix"
v-if="item.receiveTag"
v-if="item.receiveTag != 2"
:key="index"
>
<div class="coupon-sort4"
......@@ -376,7 +400,7 @@
<template v-for="(item,index) in couponList">
<div
class="coupon-box coupon-box1 clearfix"
v-if="item.receiveTag"
v-if="item.receiveTag != 2"
:key="index"
>
<div
......@@ -418,7 +442,7 @@
<template v-for="(item,index) in couponList">
<div
class="coupon-box coupon-box2 clearfix"
v-if="item.receiveTag"
v-if="item.receiveTag != 2"
:key="index"
>
<div
......@@ -463,7 +487,7 @@
<template v-for="(item,index) in couponList">
<div
class="coupon-box coupon-box3 clearfix"
v-if="item.receiveTag"
v-if="item.receiveTag != 2"
:key="index"
>
<div
......@@ -501,9 +525,21 @@
</div>
<div class="box-r">
<div class="coupon-box-title line-clamp1">{{item.couponName}}</div>
<div class="coupon-remark line-clamp1" v-if="!item.receiveEndTime">{{item.backRemark}}</div>
<div
class="coupon-remark line-clamp1"
v-if="!item.receiveStartTime && !item.receiveEndTime"
>
{{item.backRemark}}
</div>
<div class="coupon-remark" style="position: relative;" v-else>
<div class="coupon-receive__wrapper">{{ item.receiveEndTime }} 结束</div>
<div class="coupon-receive__wrapper">
<template v-if="item.receiveTag == 0">
{{ item.receiveStartTime }} 开始
</template>
<template v-else>
{{ item.receiveEndTime }} 结束
</template>
</div>
</div>
<div class="box-r-bottom">
<div class="coupon-time line-clamp1" :style="{'display':datas.componentData.isSlide ? 'inline-block' : ''}">
......@@ -600,8 +636,8 @@ export default {
if (item.preferentialType == 2) {
item.randomMoneyMinimum = this.keepSelfNum(item.randomMoneyMinimum);
item.randomMoneyMaximum = this.keepSelfNum(item.randomMoneyMaximum);
item.receiveTag = this.isShowRangeCoupon(item);
}
item.receiveTag = this.isShowRangeCoupon(item);
})
......@@ -703,11 +739,14 @@ export default {
},
// 判断当前优惠券是否在领取时间范围内
isShowRangeCoupon(item) {
if (!item.receiveStartTime && !item.receiveEndTime) return true;
// 0: 未到领取时间 1: 领取时间内 2: 超过领取时间
// 1. 如果没有设置领取开始时间和结束时间
if (!item.receiveStartTime && !item.receiveEndTime) return 1;
const startTimestamp = new Date(item.receiveStartTime).getTime();
const endTimestamp = new Date(item.receiveEndTime).getTime();
const nowTimestamp = new Date().getTime();
return nowTimestamp >= startTimestamp && nowTimestamp <= endTimestamp;
if (nowTimestamp < startTimestamp) return 0;
if (nowTimestamp > endTimestamp) return 2;
},
keepSelfNum(num) {
let r;
......@@ -1058,10 +1097,12 @@ export default {
margin-top: 16px;
width: 100%;
overflow: hidden;
display: flex;
align-items: center;
justify-content: space-between;
.coupon-time{
font-size: 11px;
color: #333;
width: 110px;
float: left;
}
.coupon-receive{
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment