discount.html 5.9 KB
<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link rel="stylesheet" type="text/css" href="../css/swiper-3.4.2.min.css" />
		<link rel="stylesheet" type="text/css" href="../css/init.css" />
		<link rel="stylesheet" type="text/css" href="http://at.alicdn.com/t/font_647640_n3cow34ja3gzaor.css" />
		<link rel="stylesheet" type="text/css" href="../css/PersonCenter/discount.css" />
		<script src="../js/base.js" type="text/javascript" charset="utf-8"></script>
		<title>我的优惠券</title>
		<style>
			.nodata{
				margin-top: 90px;
				text-align: center;
				color: #999;
				font-size: 14px;
			}
			[v-cloak]{
				display: none;
			}

		</style>
	</head>

	<body>
		<div class="container" id="discount">
			<!--导航-->
			<div class="nav">
				<ul>
					<li class="active" @click="unuse($event)">未使用</li>
					<li @click="alreadyuse($event)">已使用</li>
					<li @click="expired($event)">已过期</li>
				</ul>
			</div>
			<!--优惠券-->
			<!--<div class="discount tab">
				<div class="discount_item">
					<div class="discount_item_num">
						<div class="discount_item_num_bxo">
							<p>50</p>
							<p>元</p>
						</div>
						<div class="discount_item_time">
							<span>全场购物满300元,立减50元</span>
							<span>有效期截止:2018年5月9日</span>
						</div>
					</div>
					<div class="discount_item_btn">
						立即使用<span>&gt;</span>
					</div>
				</div>

				<div class="discount_item">
					<div class="discount_item_num">
						<div class="discount_item_num_bxo">
							<p>50</p>
							<p>元</p>
						</div>
						<div class="discount_item_time">
							<span>全场购物满300元,立减50元</span>
							<span>有效期截止:2018年5月9日</span>
						</div>
					</div>
					<div class="discount_item_btn">
						立即使用<span>&gt;</span>
					</div>
				</div>
			</div>-->
			<div class="discount tab" v-cloak>
				<div class="discount_item" v-for="item in discount" :id="item.id">
					<div class="discount_item_num">
						<div class="discount_item_num_bxo">
							<p>{{item.reduce}}</p>
							<p></p>
						</div>
						<div class="discount_item_time">
							<span>{{item.discount_coupon_name}}</span>
							<span>有效期截止:{{item.deadline}}</span>
						</div>
					</div>
					<div class="discount_item_btn">
						立即使用<span>&gt;</span>
					</div>
				</div>

				<!--<div class="discount_item">
					<div class="discount_item_num">
						<div class="discount_item_num_bxo">
							<p>50</p>
							<p>元</p>
						</div>
						<div class="discount_item_time">
							<span>全场购物满300元,立减50元</span>
							<span>有效期截止:2018年5月9日</span>
						</div>
					</div>
					<div class="discount_item_btn">
						立即使用<span>&gt;</span>
					</div>
				</div>-->
			</div>
			<!--已使用-->
			<!--<div class="discountuesd tab">
				<div class="discount_item">
					<div class="discount_item_num">
						<div class="discount_item_num_bxo">
							<p>50</p>
							<p>元</p>
						</div>
						<div class="discount_item_time">
							<span>全场购物满300元,立减50元</span>
							<span>有效期截止:2018年5月9日</span>
						</div>
					</div>
					<div class="discountuesd_item_btn">
						已使用<span>&gt;</span>
					</div>
				</div>

				<div class="discount_item">
					<div class="discount_item_num">
						<div class="discount_item_num_bxo">
							<p>50</p>
							<p>元</p>
						</div>
						<div class="discount_item_time">
							<span>全场购物满300元,立减50元</span>
							<span>有效期截止:2018年5月9日</span>
						</div>
					</div>
					<div class="discountuesd_item_btn">
						已使用<span>&gt;</span>
					</div>
				</div>
			</div>
			-->
			<!--已过期-->
			<!--<div class="discountuesd tab">
				<div class="discount_item">
					<div class="discount_item_num">
						<div class="discount_item_num_bxo">
							<p>50</p>
							<p>元</p>
						</div>
						<div class="discount_item_time">
							<span>全场购物满300元,立减50元</span>
							<span>有效期截止:2018年5月9日</span>
						</div>
					</div>
					<div class="discountuesd_item_btn">
						已过期<span>&gt;</span>
					</div>
				</div>

				<div class="discount_item">
					<div class="discount_item_num">
						<div class="discount_item_num_bxo">
							<p>50</p>
							<p>元</p>
						</div>
						<div class="discount_item_time">
							<span>全场购物满300元,立减50元</span>
							<span>有效期截止:2018年5月9日</span>
						</div>
					</div>
					<div class="discountuesd_item_btn">
						已过期<span>&gt;</span>
					</div>
				</div>
			</div>-->
			<!--没有优惠券提醒-->
			<div class="nodata" v-if="discount.length==0">
				暂无优惠券
			</div>
		</div>
		</div>
		<script src="../js/vue.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="../js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="../js/cookie.js" type="text/javascript" charset="utf-8"></script>
		<script src="../js/swiper-3.4.2.jquery.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="../js/discount.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
//			window.onload = function() {
//				var aLi = document.getElementsByClassName('nav')[0].getElementsByTagName('li');
//				var tab = document.getElementsByClassName('tab');
//				for(i = 0; i < aLi.length; i++) {
//					aLi[i].index = i;
//					tab[i].style.display = 'none';
//					tab[0].style.display = 'block';
//					aLi[i].onclick = function(){
//						for (j=0; j<aLi.length; j++) {
//							tab[j].style.display = 'none';
//							aLi[j].className = '';
//						}
//						this.classList.add('active');
//						tab[this.index].style.display="block";
//					}
//				} 
//
//			}
		</script>
	</body>

</html>