miaosha.vue 5.5 KB
<template>
	<view class="content">
		<view class='homehead miaoshahead'>
			<view class="miaoshaimg">
				<image src="../../static/miaoshatop.png" mode=""></image>
			</view>

		</view>
		<view class="miaoshatime flexthree" v-if="timestatus==2">
			<view class='miaoname'>距离开始</view>
			
			<view class='miaotime miaohour boxsizing'>{{days}}</view>
			<view class="miaoname">天</view>
			<view class="miaofen flexone miaohour">
				<view class='miaotime miaok'>{{hours}}</view>
				
			</view>
			<view class="miaoname">:</view>
			<view class="miaofen flexone miaohour">
				<view class='miaotime boxsizing miaok'>{{minutes}}</view>
				
			</view>
			<view class="miaoname">:</view>
			<view class="miaofen flexone miaohour">
				<view class='miaotime boxsizing miaok'>{{seconds}}</view>
				
			</view>
		</view>
		<view class="miaoshatime flexthree" v-if="timestatus==1">
			<view class='miaoname'>距离结束</view>
			
			<view class='miaotime miaohour boxsizing'>{{days}}</view>
			<view class="miaoname">天</view>
			<view class="miaofen flexone miaohour">
				<view class='miaotime miaok'>{{hours}}</view>
				
			</view>
			<view class="miaoname">:</view>
			<view class="miaofen flexone miaohour">
				<view class='miaotime boxsizing miaok'>{{minutes}}</view>
				
			</view>
			<view class="miaoname">:</view>
			<view class="miaofen flexone miaohour">
				<view class='miaotime boxsizing miaok'>{{seconds}}</view>
				
			</view>
		</view>
		<!-- 搜索商品 -->
		<view class="searchgood commnonpadding">
			<view class="searchgooditem flexone boxsizing" v-for="(item,index) in orderlist" :key="index"  @click="timestatus==1?goodtail(item):''" >
				
				<view class="gooditemleft">
					<image :src="item.image" mode=""></image>
				</view>
				<view class="gooditemright ">
					<view class="goodsouname morehidden">{{item.name}}</view>

					<view class="miaogood flextwo">
						<view class="miaogoodleft">
							<view class="saleprice">¥{{item.seckill_price}}</view>
							<view class="yuansaleprice">¥{{item.goods_price}}</view>
						</view>
						<view class="buynow">立即抢购</view>
					</view>

					<view class="miaojindu flextwo">
						<view class="miaojinduleft">
							<view class="miaojinnei"  :style="{width:item.percentage+'%'}"></view>
						</view>
						<view class="miaojinduright">已抢{{item.percentage}}%</view>
					</view>
				</view>
			</view>
		

		</view>


	</view>
</template>

<script>
	import app from "../../App.vue";
	export default {
		data() {
			return {
				showbanben: false,
				page:1,
				orderlist:[],
				days:'',
				hours:'',
				minutes:'',
				seconds:'',
				timestatus:''
			}
		},
		onLoad() {
			this.getmiaosha();
			this.getTime()
		},
		methods: {
			// 获取倒计时
			getTime(){
				let that = this;
				var url = 'flour_goods/seckill_setting';
				
				var params = {
				}
				console.log(params)
				app.post(url,params, "post").then((res) => {
					console.log(res);
					that.timestatus=res.data.data.status;
					let now_time = parseInt(new Date().getTime())
					now_time=parseInt(now_time/1000);
					let remaintime=res.data.data.endtime-now_time
					let number = res.data.data.time;
					      // 时间戳处理
					      var totalSecond = number;
						  console.log(totalSecond);
					      var interval = setInterval(function () {
					        // 秒数    
					        var second = totalSecond;
							
					        // 天数位
					        var day = Math.floor(second/3600/24);
					        var dayStr = day.toString();
					        if (dayStr.length == 1) dayStr = '0' + dayStr;
					        // 小时位
					        var hr = Math.floor((second - day * 3600 * 24) / 3600);
					        var hrStr = hr.toString();
					        if (hrStr.length == 1) hrStr = '0' + hrStr;
					        // 分钟位
					        var min = Math.floor((second - day * 3600 * 24 - hr * 3600) / 60);
					        var minStr = min.toString();
					        if (minStr.length == 1) minStr = '0' + minStr;
					        // 秒位
					        var sec = second - day * 3600 * 24 - hr * 3600 - min * 60;
					        var secStr = sec.toString();
					        if (secStr.length == 1) secStr = '0' + secStr;
							
							that.days=dayStr;
							that.hours=hrStr;
							that.minutes=minStr;
							that.seconds=secStr;
					       
					        totalSecond--;
					        if (totalSecond <= 0) {
					          clearInterval(interval);
					          uni.showToast({
					            title: '活动已结束',
					            icon:'none'
					          });
					          // 倒计时结束
					          //that.countDown();
					         that.days='00';
					         that.hours='00';
					         that.minutes='00';
					         that.seconds='00';
					        }
					      }.bind(this), 1000);
					
				
				}).catch((err) => {})
			
			},
			
			getmiaosha() {
				let that = this;
				var url = 'flour_goods/get_flour_goods';
				console.log('获取的参数', that.seldata)
				var params = {
					is_seckill: 1,
					page: that.page,
					pageNum: 10
				}
				console.log(params)
				app.post(url, params, "post").then((res) => {
					console.log(res);
					that.orderlist=that.orderlist.concat(res.data.data)
					


				}).catch((err) => {})
			},
			
			// 商品详情
			goodtail(item) {
				let id = item.id;
				console.log(id)
				// type 1 面访商品
				uni.navigateTo({
					url: '/pages/nearshop/goodtail?id=' + id + '&type=' + 1
				})
			},

		},
		onReachBottom() {
			let newpage=this.page;
			newpage++;
			this.page=newpage;
			this.getmiaosha()
		}

	}
</script>
<style>
	@import url('../../base/homepage');
</style>