【修复】修复首页【秒杀】【团购】优惠后价格计算显示异常的问题。修复【秒杀】【团购】列表页面优惠后价格计算显示异常的问。

【优化】取消首页【秒杀】【团购】【服务商品】自定义倒计时组件,使用组件原生数字倒计时,减少监听事件,去除内存可能泄露的风险。
This commit is contained in:
大灰灰
2022-11-04 04:54:30 +08:00
parent 9c96fb0538
commit 18acbe2bc0
6 changed files with 360 additions and 230 deletions

View File

@@ -7,69 +7,70 @@
<view class="coreshop-divider">
<view class="complete"></view>
</view>
<view class="coreshop-flex-direction-row coreshop-margin-bottom-10 coreshop-text-black" v-for="(item, key) in listData" :key="key">
<view class="coreshop-flex coreshop-justify-start">
<view class="coreshop-flex-direction coreshop-margin-bottom-10 coreshop-text-black" v-for="(item, key) in listData" :key="key">
<view class="coreshop-flex">
<view>
<u--image :src="item.goods.image" mode="widthFix" width="96px" height="96px" radius="8"></u--image>
<u--image :src="item.goodThumbnail" mode="widthFix" width="96px" height="96px" radius="8"></u--image>
</view>
<view class="coreshop-flex coreshop-flex-direction coreshop-padding-left-10 coreshop-percent-100">
<view class="coreshop-font-15 u-line-2 coreshop-text-black">{{ item.name }}</view>
<view class="coreshop-font-11 coreshop-padding-top-5 coreshop-padding-bottom-3 u-line-2 coreshop-text-brown">{{ item.goods.name }}</view>
<view class="coreshop-font-11 coreshop-padding-top-5 coreshop-padding-bottom-3 u-line-2 coreshop-text-brown">{{ item.goodName }}</view>
<!--<view class="coreshop-flex coreshop-align-center coreshop-padding-top-10 coreshop-padding-bottom-5">
<view class="coreshop-font-11 coreshop-bg-orange coreshop-padding-2 coreshop-border-radius-4 coreshop-margin-right-10" v-if="item.maxBuyNumber>0">限购{{item.maxBuyNumber}}</view>
<view class="coreshop-font-11 coreshop-bg-green coreshop-padding-2 coreshop-border-radius-4 coreshop-margin-right-10" v-if="item.maxBuyNumber==0">不限购</view>
<view class="coreshop-font-11 coreshop-bg-olive coreshop-padding-2 coreshop-border-radius-4">{{item.ticketNumber}}张券</view>
</view>-->
<view class="coreshop-flex coreshop-justify-between coreshop-flex-direction-row coreshop-align-center" v-if="(item.startStatus == 1) && item.lastTime">
<view class="coreshop-text-right coreshop-time-right coreshop-margin-top-10" v-if="(item.startStatus == 1) && item.lastTime">
<u-count-down :time="item.lastTime*1000" :autoStart="true" format="DD天HH时mm秒ss" @change="onChange($event,key)">
<view class="time coreshop-font-11">
<view class="coreshop-font-12">仅剩</view>
<view class="time__custom">
<text class="time__custom__item">{{ item.timeData.days }}</text>
</view>
<text class="time__doc"></text>
<view class="time__custom">
<text class="time__custom__item">{{ item.timeData.hours >= 10 ? item.timeData.hours :'0' +item.timeData.hours}}</text>
</view>
<text class="time__doc">:</text>
<view class="time__custom">
<text class="time__custom__item">{{ item.timeData.minutes }}</text>
</view>
<text class="time__doc">:</text>
<view class="time__custom">
<text class="time__custom__item">{{ item.timeData.seconds }}</text>
</view>
<view class="coreshop-flex coreshop-align-center coreshop-flex-direction-row coreshop-justify-start coreshop-min-height-30" v-if="(item.startStatus == 1) && item.timestamp">
<view class="coreshop-font-12">仅剩</view><u-count-down :time="item.timestamp*1000" format="DD天HH时mm秒ss" autoStart></u-count-down>
<!--<u-count-down :time="item.lastTime*1000" :autoStart="true" format="DD天HH时mm秒ss" @change="onChange($event,key)">
<view class="time coreshop-font-11">
<view class="coreshop-font-12">仅剩</view>
<view class="time__custom">
<text class="time__custom__item">{{ item.timeData.days }}</text>
</view>
</u-count-down>
</view>
<view class="coreshop-text-right coreshop-time-right coreshop-margin-top-10" v-if="(item.startStatus == 2) && item.lastTime">
<u-count-down :time="item.lastTime*1000" :autoStart="true" format="DD天HH时mm秒ss" @change="onChange($event,key)">
<view class="time">
<view class="coreshop-font-12">即将开始</view>
<view class="time__custom">
<text class="time__custom__item">{{ item.timeData.days }}</text>
</view>
<text class="time__doc"></text>
<view class="time__custom">
<text class="time__custom__item">{{ item.timeData.hours>=10?item.timeData.hours:'0'+item.timeData.hours}}</text>
</view>
<text class="time__doc">:</text>
<view class="time__custom">
<text class="time__custom__item">{{ item.timeData.minutes }}</text>
</view>
<text class="time__doc">:</text>
<view class="time__custom">
<text class="time__custom__item">{{ item.timeData.seconds }}</text>
</view>
<text class="time__doc"></text>
<view class="time__custom">
<text class="time__custom__item">{{ item.timeData.hours >= 10 ? item.timeData.hours :'0' +item.timeData.hours}}</text>
</view>
</u-count-down>
</view>
<text class="time__doc">:</text>
<view class="time__custom">
<text class="time__custom__item">{{ item.timeData.minutes }}</text>
</view>
<text class="time__doc">:</text>
<view class="time__custom">
<text class="time__custom__item">{{ item.timeData.seconds }}</text>
</view>
</view>
</u-count-down>-->
</view>
<view class="coreshop-flex coreshop-justify-between coreshop-flex-direction-row coreshop-align-center coreshop-margin-top-10">
<view class="coreshop-flex coreshop-align-center coreshop-flex-direction-row coreshop-justify-start coreshop-min-height-30" v-if="(item.startStatus == 2) && item.timestamp">
<view class="coreshop-font-12">即将开始</view><u-count-down :time="item.timestamp*1000" format="DD天HH时mm秒ss" autoStart></u-count-down>
<!--<u-count-down :time="item.lastTime*1000" :autoStart="true" format="DD天HH时mm秒ss" @change="onChange($event,key)">
<view class="time">
<view class="coreshop-font-12">即将开始</view>
<view class="time__custom">
<text class="time__custom__item">{{ item.timeData.days }}</text>
</view>
<text class="time__doc"></text>
<view class="time__custom">
<text class="time__custom__item">{{ item.timeData.hours>=10?item.timeData.hours:'0'+item.timeData.hours}}</text>
</view>
<text class="time__doc">:</text>
<view class="time__custom">
<text class="time__custom__item">{{ item.timeData.minutes }}</text>
</view>
<text class="time__doc">:</text>
<view class="time__custom">
<text class="time__custom__item">{{ item.timeData.seconds }}</text>
</view>
</view>
</u-count-down>-->
ew
</view>
<view class="coreshop-flex coreshop-justify-between coreshop-flex-direction-row coreshop-align-center">
<view class="coreshop-flex coreshop-align-center">
<view class="coreshop-font-14 coreshop-text-red">{{item.goods.product.price}}</view>
<view class="coreshop-font-xs coreshop-text-through coreshop-margin-left-5">{{item.goods.product.mktprice}}</view>
<view class="coreshop-font-14 coreshop-text-red">{{item.price}}</view>
<view class="coreshop-font-xs coreshop-text-through coreshop-margin-left-5">{{item.mktPrice}}</view>
</view>
<view class="coreshop-groupPurchase-btn" v-if="item.startStatus == 1" @click="goGroupBuyingDetail(item.id)">立即团</view>
<view class="coreshop-groupPurchase-btn" v-if="item.startStatus == 0">即将开始</view>

View File

@@ -7,64 +7,64 @@
<view class="coreshop-divider">
<view class="complete"></view>
</view>
<view class="coreshop-flex-direction coreshop-margin-bottom-10 coreshop-text-black" v-for="(item, key) in listData" :key="key" @click="goSeckillDetail(item.id)">
<view class="coreshop-flex-direction coreshop-margin-bottom-10 coreshop-text-black" v-for="(item, key) in listData" :key="key">
<view class="coreshop-flex">
<view>
<u--image :src="item.goods.image" mode="widthFix" width="96px" height="96px" radius="8"></u--image>
<u--image :src="item.goodThumbnail" mode="widthFix" width="96px" height="96px" radius="8"></u--image>
</view>
<view class="coreshop-flex coreshop-flex-direction coreshop-padding-left-10 coreshop-percent-100">
<view class="coreshop-font-15 u-line-2 coreshop-text-black">{{ item.name }}</view>
<view class="coreshop-font-11 coreshop-padding-top-5 coreshop-padding-bottom-3 u-line-2 coreshop-text-brown">{{ item.goods.name }}</view>
<view class="coreshop-flex coreshop-justify-between coreshop-flex-direction-row coreshop-align-center" v-if="(item.startStatus == 1) && item.lastTime">
<view class="coreshop-text-right coreshop-time-right coreshop-margin-top-10" v-if="(item.startStatus == 1) && item.lastTime">
<u-count-down :time="item.lastTime*1000" :autoStart="true" format="DD天HH时mm秒ss" @change="onChange($event,key)">
<view class="time coreshop-font-11">
<view class="coreshop-font-12">仅剩</view>
<view class="time__custom">
<text class="time__custom__item">{{ item.timeData.days }}</text>
</view>
<text class="time__doc"></text>
<view class="time__custom">
<text class="time__custom__item">{{ item.timeData.hours >= 10 ? item.timeData.hours :'0' +item.timeData.hours}}</text>
</view>
<text class="time__doc">:</text>
<view class="time__custom">
<text class="time__custom__item">{{ item.timeData.minutes }}</text>
</view>
<text class="time__doc">:</text>
<view class="time__custom">
<text class="time__custom__item">{{ item.timeData.seconds }}</text>
</view>
<view class="coreshop-font-11 coreshop-padding-top-5 coreshop-padding-bottom-3 u-line-2 coreshop-text-brown">{{ item.goodName }}</view>
<view class="coreshop-flex coreshop-align-center coreshop-flex-direction-row coreshop-justify-start coreshop-min-height-30" v-if="(item.startStatus == 1) && item.timestamp">
<view class="coreshop-font-12">仅剩</view><u-count-down :time="item.timestamp*1000" format="DD天HH时mm秒ss" autoStart></u-count-down>
<!--<u-count-down :time="item.lastTime*1000" :autoStart="true" format="DD天HH时mm秒ss" @change="onChange($event,key)">
<view class="time coreshop-font-11">
<view class="coreshop-font-12">仅剩</view>
<view class="time__custom">
<text class="time__custom__item">{{ item.timeData.days }}</text>
</view>
</u-count-down>
</view>
<view class="coreshop-text-right coreshop-time-right coreshop-margin-top-10" v-if="(item.startStatus == 2) && item.lastTime">
<u-count-down :time="item.lastTime*1000" :autoStart="true" format="DD天HH时mm秒ss" @change="onChange($event,key)">
<view class="time">
<view class="coreshop-font-12">即将开始</view>
<view class="time__custom">
<text class="time__custom__item">{{ item.timeData.days }}</text>
</view>
<text class="time__doc"></text>
<view class="time__custom">
<text class="time__custom__item">{{ item.timeData.hours>=10?item.timeData.hours:'0'+item.timeData.hours}}</text>
</view>
<text class="time__doc">:</text>
<view class="time__custom">
<text class="time__custom__item">{{ item.timeData.minutes }}</text>
</view>
<text class="time__doc">:</text>
<view class="time__custom">
<text class="time__custom__item">{{ item.timeData.seconds }}</text>
</view>
<text class="time__doc"></text>
<view class="time__custom">
<text class="time__custom__item">{{ item.timeData.hours >= 10 ? item.timeData.hours :'0' +item.timeData.hours}}</text>
</view>
</u-count-down>
</view>
<text class="time__doc">:</text>
<view class="time__custom">
<text class="time__custom__item">{{ item.timeData.minutes }}</text>
</view>
<text class="time__doc">:</text>
<view class="time__custom">
<text class="time__custom__item">{{ item.timeData.seconds }}</text>
</view>
</view>
</u-count-down>-->
</view>
<view class="coreshop-flex coreshop-justify-between coreshop-flex-direction-row coreshop-align-center coreshop-margin-top-10">
<view class="coreshop-flex coreshop-align-center coreshop-flex-direction-row coreshop-justify-start coreshop-min-height-30" v-if="(item.startStatus == 2) && item.timestamp">
<view class="coreshop-font-12">即将开始</view><u-count-down :time="item.timestamp*1000" format="DD天HH时mm秒ss" autoStart></u-count-down>
<!--<u-count-down :time="item.lastTime*1000" :autoStart="true" format="DD天HH时mm秒ss" @change="onChange($event,key)">
<view class="time">
<view class="coreshop-font-12">即将开始</view>
<view class="time__custom">
<text class="time__custom__item">{{ item.timeData.days }}</text>
</view>
<text class="time__doc"></text>
<view class="time__custom">
<text class="time__custom__item">{{ item.timeData.hours>=10?item.timeData.hours:'0'+item.timeData.hours}}</text>
</view>
<text class="time__doc">:</text>
<view class="time__custom">
<text class="time__custom__item">{{ item.timeData.minutes }}</text>
</view>
<text class="time__doc">:</text>
<view class="time__custom">
<text class="time__custom__item">{{ item.timeData.seconds }}</text>
</view>
</view>
</u-count-down>-->
</view>
<view class="coreshop-flex coreshop-justify-between coreshop-flex-direction-row coreshop-align-center">
<view class="coreshop-flex coreshop-align-center">
<view class="coreshop-font-14 coreshop-text-red">{{item.goods.product.price}}</view>
<view class="coreshop-font-xs coreshop-text-through coreshop-margin-left-5">{{item.goods.product.mktprice}}</view>
<view class="coreshop-font-14 coreshop-text-red">{{item.price}}</view>
<view class="coreshop-font-xs coreshop-text-through coreshop-margin-left-5">{{item.mktPrice}}</view>
</view>
<view class="coreshop-seckill-btn" v-if="item.startStatus == 1" @click="goSeckillDetail(item.id)">马上秒</view>
<view class="coreshop-seckill-btn" v-if="item.startStatus == 0">即将开始</view>
@@ -127,6 +127,8 @@
</script>
<style lang="scss" scoped>
.u-count-down__text { font-size: 12px; }
.img-list-item { border-radius: 8px; margin: 2.5px 2.5px 10px 2.5px; background-color: #ffffff; padding: 5px; position: relative; overflow: hidden; flex-direction: row;
.img-list-item-l { width: 100px; height: 100px; display: inline-block; float: left; }
.img-list-item-r { width: calc(100% - 120px); display: inline-block; margin-left: 7.5px; float: left; position: relative;

View File

@@ -20,53 +20,56 @@
<view class="coreshop-font-11 coreshop-bg-green coreshop-padding-2 coreshop-border-radius-4 coreshop-margin-right-10" v-if="item.maxBuyNumber==0">不限购</view>
<view class="coreshop-font-11 coreshop-bg-olive coreshop-padding-2 coreshop-border-radius-4">{{item.ticketNumber}}张券</view>
</view>
<view class="coreshop-flex coreshop-justify-between coreshop-flex-direction-row coreshop-align-center" v-if="item.openStatus != 3">
<view class="coreshop-text-right coreshop-time-right coreshop-margin-top-10" v-if="item.openStatus == 1 && item.lastTime > 0">
<u-count-down :time="item.lastTime*1000" :autoStart="true" format="DD天HH时mm秒ss" @change="onChange($event,key)">
<view class="time coreshop-font-11">
<view class="coreshop-font-12">仅剩</view>
<view class="time__custom" v-if="item.timeData.days>0">
<text class="time__custom__item">{{ item.timeData.days }}</text>
</view>
<text class="time__doc" v-if="item.timeData.days>0"></text>
<view class="time__custom">
<text class="time__custom__item">{{ item.timeData.hours >= 10 ? item.timeData.hours :'0' +item.timeData.hours}}</text>
</view>
<text class="time__doc">:</text>
<view class="time__custom">
<text class="time__custom__item">{{ item.timeData.minutes }}</text>
</view>
<text class="time__doc">:</text>
<view class="time__custom">
<text class="time__custom__item">{{ item.timeData.seconds }}</text>
</view>
<view class="coreshop-flex coreshop-align-center coreshop-flex-direction-row coreshop-justify-start" v-if="item.openStatus == 1 && item.lastTime > 0">
<view class="coreshop-font-12">仅剩</view><u-count-down :time="item.lastTime*1000" format="DD天HH时mm秒ss" autoStart></u-count-down>
<!--<u-count-down :time="item.lastTime*1000" :autoStart="true" format="DD天HH时mm秒ss" @change="onChange($event,key)">
<view class="time coreshop-font-11">
<view class="coreshop-font-12">仅剩</view>
<view class="time__custom" v-if="item.timeData.days>0">
<text class="time__custom__item">{{ item.timeData.days }}</text>
</view>
</u-count-down>
</view>
<view class="coreshop-text-right coreshop-time-right coreshop-margin-top-10" v-if="item.openStatus == 2 && item.lastTime > 0">
<u-count-down :time="item.lastTime*1000" :autoStart="true" format="DD天HH时mm秒ss" @change="onChange($event,key)">
<view class="time">
<view class="coreshop-font-12">即将开始</view>
<view class="time__custom" v-if="item.timeData.days>0">
<text class="time__custom__item">{{ item.timeData.days }}</text>
</view>
<text class="time__doc" v-if="item.timeData.days>0"></text>
<view class="time__custom">
<text class="time__custom__item">{{ item.timeData.hours>=10?item.timeData.hours:'0'+item.timeData.hours}}</text>
</view>
<text class="time__doc">:</text>
<view class="time__custom">
<text class="time__custom__item">{{ item.timeData.minutes }}</text>
</view>
<text class="time__doc">:</text>
<view class="time__custom">
<text class="time__custom__item">{{ item.timeData.seconds }}</text>
</view>
<text class="time__doc" v-if="item.timeData.days>0"></text>
<view class="time__custom">
<text class="time__custom__item">{{ item.timeData.hours >= 10 ? item.timeData.hours :'0' +item.timeData.hours}}</text>
</view>
</u-count-down>
</view>
<text class="time__doc">:</text>
<view class="time__custom">
<text class="time__custom__item">{{ item.timeData.minutes }}</text>
</view>
<text class="time__doc">:</text>
<view class="time__custom">
<text class="time__custom__item">{{ item.timeData.seconds }}</text>
</view>
</view>
</u-count-down>-->
</view>
<view class="coreshop-flex coreshop-justify-between coreshop-flex-direction-row coreshop-align-center coreshop-margin-top-10">
<view class="coreshop-flex coreshop-align-center coreshop-flex-direction-row coreshop-justify-start" v-if="item.openStatus == 2 && item.lastTime > 0">
<view class="coreshop-font-12">即将开始</view><u-count-down :time="item.lastTime*1000" format="DD天HH时mm秒ss" autoStart></u-count-down>
<!--<u-count-down :time="item.lastTime*1000" :autoStart="true" format="DD天HH时mm秒ss" @change="onChange($event,key)">
<view class="time">
<view class="coreshop-font-12">即将开始</view>
<view class="time__custom" v-if="item.timeData.days>0">
<text class="time__custom__item">{{ item.timeData.days }}</text>
</view>
<text class="time__doc" v-if="item.timeData.days>0"></text>
<view class="time__custom">
<text class="time__custom__item">{{ item.timeData.hours>=10?item.timeData.hours:'0'+item.timeData.hours}}</text>
</view>
<text class="time__doc">:</text>
<view class="time__custom">
<text class="time__custom__item">{{ item.timeData.minutes }}</text>
</view>
<text class="time__doc">:</text>
<view class="time__custom">
<text class="time__custom__item">{{ item.timeData.seconds }}</text>
</view>
</view>
</u-count-down>-->
</view>
<view class="coreshop-flex coreshop-justify-between coreshop-flex-direction-row coreshop-align-center">
<view class="coreshop-flex coreshop-align-center">
<view class="coreshop-font-14 coreshop-text-red">{{ item.money }}</view>
</view>