Browse Source

倒计时

master
Enzo 4 years ago
parent
commit
648c691199
  1. 20
      components/uni-countdown/uni-countdown.vue
  2. 79
      pages/shop/goodsdetail.vue
  3. 51
      pages/shop/seckillList.vue

20
components/uni-countdown/uni-countdown.vue

@ -1,15 +1,15 @@
<template>
<view class="uni-countdown">
<text v-if="showDay" :style="{ borderColor: borderColor, color: color, backgroundColor: backgroundColor }"
<text v-if="showDay" :style="{ borderColor: borderColor, color: color }"
class="uni-countdown__number">{{ d }}</text>
<text v-if="showDay" :style="{ color: splitorColor }" class="uni-countdown__splitor">{{dayText}}</text>
<text :style="{ borderColor: borderColor, color: color, backgroundColor: backgroundColor }"
<text :style="{ borderColor: borderColor, color: color }"
class="uni-countdown__number">{{ h }}</text>
<text :style="{ color: splitorColor }" class="uni-countdown__splitor">{{ showColon ? ':' : hourText }}</text>
<text :style="{ borderColor: borderColor, color: color, backgroundColor: backgroundColor }"
<text :style="{ color: splitorColor }" class="uni-countdown__splitor">{{ showColon ? '' : hourText }}</text>
<text :style="{ borderColor: borderColor, color: color }"
class="uni-countdown__number">{{ i }}</text>
<text :style="{ color: splitorColor }" class="uni-countdown__splitor">{{ showColon ? ':' : minuteText }}</text>
<text :style="{ borderColor: borderColor, color: color, backgroundColor: backgroundColor }"
<text :style="{ color: splitorColor }" class="uni-countdown__splitor">{{ showColon ? '' : minuteText }}</text>
<text :style="{ borderColor: borderColor, color: color }"
class="uni-countdown__number">{{ s }}</text>
<text v-if="!showColon" :style="{ color: splitorColor }" class="uni-countdown__splitor">{{secondText}}</text>
</view>
@ -59,15 +59,15 @@
},
borderColor: {
type: String,
default: '#000000'
default: '#15716E'
},
color: {
type: String,
default: '#000000'
default: '#15716E'
},
splitorColor: {
type: String,
default: '#000000'
default: '#15716E'
},
day: {
type: Number,
@ -250,8 +250,6 @@
/* #endif */
justify-content: center;
align-items: center;
width: $countdown-width;
height: $countdown-height;
line-height: $countdown-height;
margin: 5rpx;
text-align: center;

79
pages/shop/goodsdetail.vue

@ -9,7 +9,7 @@
<image mode="aspectFill" :src="item" style="width: 100%; height: 100%;" @click="lookImg(index)"></image>
<view class="seckill-box" v-if="type == 'seckill'">
<view>距离结束还剩余</view>
<view v-if="$isRight(time)">
<view>
<countdown-timer :time="time" :autoStart="true" @finish="dateFinish">
<template v-slot="{day, hour, minute, second}">
<view class="lf-flex">
@ -177,7 +177,7 @@
<button class="btn" style="width: 349rpx;">立即秒杀</button>
</view>
<view v-else-if="type == 'point'">
<button class="btn" style="width: 349rpx;" @click="goExchange()">立即兑换</button>
<button class="btn" style="width: 349rpx;">立即兑换</button>
</view>
<view class="lf-flex" v-else>
<button class="btn1" @click="shoot(1)">加入购物车</button>
@ -268,9 +268,7 @@
token: '',
coupons: [], //
goods_num: 1,
is_date_finish: false,
show_share: false,
shareImg: ''
is_date_finish: false
}
},
computed: {
@ -319,11 +317,6 @@
this.getGoodsStock(); //
},
methods: {
goExchange() {
if(this.showSpec == '请选择规格') {
this.shoot(3)
}
},
//
switchCollect(){
if(!this.token){
@ -396,7 +389,7 @@
}
}
},
//
// TODO
confirm(){
if(this.is_date_finish){
return this.$msg('活动已结束');
@ -484,7 +477,7 @@
//
this.$cookieStorage.set('order_confirm', par);
uni.hideLoading();
this.$url('/pages/order/confirm/confirm?goods_type=1');
this.$url('/pages/order/confirm/confirm');
// this.$http.post({
// api: 'api/shopping/order/checkout',
// data: par,
@ -499,73 +492,50 @@
// }
// uni.hideLoading()
// }).catch(err => uni.hideLoading())
}else if(this.click_type == 3) {
//
this.$cookieStorage.set('order_confirm', par);
uni.hideLoading();
this.$url('/pages/order/confirm/confirm?goods_type=0');
}
},
//
shareGraphic(){
this.getShearImg();
this.getCreateShareImg();
},
//
getShearImg() {
//h5
getCreateShareImg(){
wx.showLoading({
title:"生成中",
mask:true
});
var token = this.token;
})
let origin = window.location.origin;
let share_url = origin+'/pages/store/detail/detail';
this.$http.get({
api: 'api/distribution/createMiniShareImg',
header: {
Authorization: token
},
api:'api/distribution/createH5ShareImg',
data:{
goods_id: this.goods_id
goods_id:this.id,
share_url:share_url
}
}).then(res=>{
if (res.statusCode == 200) {
res = res.data;
if(res.status){
this.setData({
shareImg: res.data.image
});
this.qr_code_image = res.data.image;
setTimeout(() => {
this.changeImg();
}, 100)
} else {
wx.showModal({
content: res.message || '请求失败',
showCancel: false
});
if(this.qr_code_image){
this.share_gaphic =!this.share_gaphic;
this.is_toggle_share = false;
}
} else{
wx.showModal({
content: '请求失败',
content: res.message || '请求失败,请重试',
showCancel: false
});
}
wx.hideLoading();
this.changeShare();
wx.hideLoading()
}).catch(rej=>{
wx.hideLoading()
wx.showModal({
content: '内部错误',
content: rej.message || '内部错误,请重试',
showCancel: false
});
wx.hideLoading();
this.changeShare();
});
},
//
changeShare() {
this.setData({
show_share: !this.show_share
});
})
},
//
getNewdetail(){
@ -590,7 +560,6 @@
this.seckill = meta.seckill;
let currentDate = this.$shared.recordTime();
this.time = new Date(meta.seckill.ends_at).getTime() - new Date(currentDate).getTime()
console.log("time", this.time, meta.seckill.ends_at, currentDate)
}
if(type != 'point'){
this.getBrandDetail(goods_detail.brand_id);

51
pages/shop/seckillList.vue

@ -54,7 +54,7 @@
</view> -->
<view class="desc" v-if="item.seckill.end_left_time.length==0">
距离开始还剩余
<countdown-time :day="item.seckill.end_left_time[0]" :hour="item.seckill.end_left_time[1]" :minute="item.seckill.end_left_time[2]" :second="item.seckill.end_left_time[3]">
<countdown-time :day="item.seckill.start_left_time[0]" :hour="item.seckill.start_left_time[1]" :minute="item.seckill.start_left_time[2]" :second="item.seckill.start_left_time[3]">
</countdown-time>
</view>
@ -85,7 +85,6 @@
</template>
<script>
import countdownTimer from '@/components/countdown-timer/countdown-timer';
import countdownTime from '@/components/uni-countdown/uni-countdown.vue';
export default {
data() {
@ -107,7 +106,6 @@
}
},
components: {
countdownTimer,
countdownTime
},
computed: {
@ -174,52 +172,9 @@
this.isRefresher = false;
}
if (this.page == 1) {
let list = res.data.data;
list.forEach((item,index) => {
let now_date = new Date(new Date().toLocaleDateString()).getTime();
let start_date = new Date(new Date(item.seckill.starts_at).toLocaleDateString()).getTime();
console.log(now_date)
console.log(start_date)
console.log(item)
if(now_date < start_date) {
this.$set(item,'ifStart',false)
var date = this.getTime()
let time = new Date(item.seckill.starts_at).getTime() - new Date(date).getTime()
this.$set(item,'countTime',time)
console.log("time", time);
}else {
this.$set(item,'ifStart',true)
var date = this.getTime()
let time = new Date(item.seckill.ends_at).getTime() - new Date(date).getTime()
this.$set(item,'countTime',time)
console.log("time", time);
}
})
this.list = list
console.log(this.list)
this.list = res.data.data;
} else {
let list = res.data.data;
list.forEach((item,index) => {
let now_date = new Date(new Date().toLocaleDateString()).getTime();
let start_date = new Date(new Date(item.seckill.starts_at).toLocaleDateString()).getTime();
console.log(now_date)
console.log(start_date)
console.log(item)
if(now_date < start_date) {
this.$set(item,'ifStart',false)
var date = this.getTime()
let time = new Date(item.seckill.starts_at).getTime() - new Date(date).getTime()
this.$set(item,'countTime',time)
}else {
this.$set(item,'ifStart',true)
var date = this.getTime()
let time = new Date(item.seckill.ends_at).getTime() - new Date(date).getTime()
this.$set(item,'countTime',time)
}
})
this.list.push(...list);
this.list.push(...res.data.data);
}
})

Loading…
Cancel
Save