miaosha.vue 6.7 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==1">
			<view class='miaoname'>距离开始</view>
			<!-- days:'',
				hours:'',
				minutes:'',
				seconds:'', -->
			<view class='miaotime miaohour boxsizing'>{{days}}</view>
			<view class="miaoname">天</view>
			<view class="miaofen flexone miaohour">
				<view class='miaotime miaok'>{{hours}}</view>
				<!-- <view class='miaotime'>3</view> -->
			</view>
			<view class="miaoname">:</view>
			<view class="miaofen flexone miaohour">
				<view class='miaotime boxsizing miaok'>{{minutes}}</view>
				<!-- <view class='miaotime boxsizing'>5</view> -->
			</view>
			<view class="miaoname">:</view>
			<view class="miaofen flexone miaohour">
				<view class='miaotime boxsizing miaok'>{{seconds}}</view>
				<!-- <view class='miaotime boxsizing'>2</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 class="searchgooditem flexone boxsizing">
				<view class="gooditemleft">
					<image src="../../static/goopic.png" mode=""></image>
				</view>
				<view class="gooditemright ">
					<view class="goodsouname morehidden">商品名称商品名称商品名称商品名称商品名称商品名称商品名称商品名称</view>

					<view class="miaogood flextwo">
						<view class="miaogoodleft">
							<view class="saleprice">¥288</view>
							<view class="yuansaleprice">¥340</view>
						</view>
						<view class="buynow">立即抢购</view>

					</view>

					<view class="miaojindu flextwo">
						<view class="miaojinduleft">
							<view class="miaojinnei"></view>
						</view>
						<view class="miaojinduright">已抢60%</view>
					</view>



				</view>
			</view>

			<view class="searchgooditem flexone boxsizing">
				<view class="gooditemleft">
					<image src="../../static/goopic.png" mode=""></image>
				</view>
				<view class="gooditemright ">
					<view class="goodsouname morehidden">商品名称商品名称商品名称商品名称商品名称商品名称商品名称商品名称</view>

					<view class="miaogood flextwo">
						<view class="miaogoodleft">
							<view class="saleprice">¥288</view>
							<view class="yuansaleprice">¥340</view>
						</view>
						<view class="buynow">立即抢购</view>

					</view>

					<view class="miaojindu flextwo">
						<view class="miaojinduleft">
							<view class="miaojinnei"></view>
						</view>
						<view class="miaojinduright">已抢60%</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 = remaintime;
					      // 时间戳处理
					      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)
					// that.goodinfo=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>