个人中心和优惠券

iamberry-wechat-web/src/main/java/com/iamberry/wechat/handles/coupon/CouponTypeHandler.java

@@ -359,6 +359,7 @@ public class CouponTypeHandler {
 		cDto.setPage(new PageBean());
 		cDto.getPage().setPageSize(pageSize);
 		cDto.getPage().setPageNumber(pageNO);
+		cDto.getPage().initRecordBegin();
 		List<CouponItemDto> list = couponItemService.getCouponItemDtoList(cDto);
 		
 		Date now = new Date();

iamberry-wechat-web/src/main/webapp/common/wechat/coupon_list.html

@@ -6,11 +6,12 @@
 		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1, user-scalable=no">
 		<meta name="apple-mobile-web-app-capable" content="yes">
 		<meta name="apple-mobile-web-app-status-bar-style" content="black">
-		<link rel="stylesheet" type="text/css" href="css/mui.min.css" />
-		<link rel="stylesheet" type="text/css" href="css/iconfont.css" />
-		<link rel="stylesheet" type="text/css" href="css/main.css" />
+		<link rel="stylesheet" type="text/css" href="//s.iamberry.com/wechat/aiberle/css/mui.min.css" />
+		<link rel="stylesheet" type="text/css" href="//s.iamberry.com/wechat/aiberle/css/iconfont.css" />
+		<link rel="stylesheet" type="text/css" href="//s.iamberry.com/wechat/aiberle/css/main.css" />
 		<style>
-		.my-yhq-list{background-color: transparent;padding:0 15px;}
+		.mui-content{background-color: #f1f1f1;}
+		.my-yhq-list{background-color:#f1f1f1;padding:0 15px;}
 		.my-yhq-list:before,.my-yhq-list:after{display: none;}
 		.my-yhq-list .my-yhq-cell{margin: 15px 0;position: relative;}
 		.my-yhq-list .my-yhq-cell:last-child{margin-bottom: 0;}
@@ -21,7 +22,7 @@
 		.my-yhq-list .left-cell .tit{font-size: 20px;color: #f44f80;}
 		.my-yhq-list .left-cell .time{color: #f44f80;font-size: 12px;}
 		.my-yhq-list .left-cell .condition{position: absolute;left: 10px;bottom: 15px;font-size: 12px;color: #807f80;}
-		.my-yhq-list .right-cell .money{color: #fff;margin: 5px 0;}
+		.my-yhq-list .right-cell .money{color: #333;margin: 5px 0;}
 		.my-yhq-list .right-cell .money>span{font-size: 35px;}
 		.my-yhq-list .right-cell .my-btn{color: #fff;padding:8px 10px;font-size: 14px;border-radius: 5px;}
 		.my-yhq-list .right-cell .my-btn:active{background-color: rgba(0,0,0,.5);}
@@ -60,7 +61,7 @@
 		.mui-popup-buttons{display: block;}
 		.x-close{position: absolute;right:32px;top: 0;width:20px;}
 		.mui-popup.mui-popup-out{-webkit-transition-duration: 0ms;transition-duration: 0ms;}
-		.mui-scroll-wrapper{top: 50px;bottom:60px;}
+		.mui-scroll-wrapper{top:0;bottom:50px;}
 		</style>
 		<script type="text/javascript" src="//res.wx.qq.com/open/js/jweixin-1.1.0.js"></script>
 		<script>
@@ -79,7 +80,7 @@
 			</div>
 		</div>
 	<footer class="mui-bar mui-bar-tab">
-			<a class="mui-tab-item mui-active" href="#tabbar">
+			<a class="mui-tab-item" href="#tabbar">
 				<span class="iconfont icon-shouye"></span>
 				<span class="mui-tab-label">首页</span>
 			</a>
@@ -97,24 +98,6 @@
 			</a>
 	</footer>
 	<div class="mui-content">
-		<div class="mui-segmented-control tab-yhq-list">
-				<a class="mui-control-item icon-all mui-active" tabindex="1" href="#item1mobile">
-							<span class="mui-icon"></span>
-							<span class="mui-tab-label">全部</span>
-				</a>
-				<a class="mui-control-item icon-noused" tabindex="2" href="#item2mobile">
-							<span class="mui-icon"></span>
-							<span class="mui-tab-label">未使用</span>
-				</a>
-				<a class="mui-control-item icon-used" tabindex="3" href="#item3mobile">
-							<span class="mui-icon"></span>
-							<span class="mui-tab-label">已使用</span>
-				</a>
-				<a class="mui-control-item icon-overdue" tabindex="4" href="#item4mobile">
-							<span class="mui-icon"></span>
-							<span class="mui-tab-label">过期</span>
-				</a>
-		</div>
 		<!--下拉刷新容器-->
 		<div id="pullrefresh_yhq_list" class="mui-content mui-scroll-wrapper">
 			<div class="mui-scroll">
@@ -125,84 +108,80 @@
 			</div>
 		</div>
 	</div>
-	<script type="text/javascript" src="js/mui.min.js"></script>
-	<script type="text/javascript" src="js/jquery-2.1.1.min.js"></script>
-	<script type="text/javascript" src="js/main.js"></script>
+	<script type="text/javascript" src="//s.iamberry.com/wechat/aiberle/js/mui.min.js"></script>
+	<script type="text/javascript" src="//s.iamberry.com/wechat/aiberle/js/jquery-2.1.1.min.js"></script>
+	<script type="text/javascript" src="//s.iamberry.com/wechat/aiberle/js/main.js"></script>
 	<script>
 	var tabindex = 1,pageNumber = 0,pagesize = 10;
 	var tabindex=$('.tab-yhq-list .mui-active').prop('tabindex');
-			mui.init({
-				pullRefresh: {
-					container: '#pullrefresh_yhq_list',
-					down: {
-						//						callback: pulldownRefresh
-					},
-					up: {
-						contentrefresh: '正在加载...',
-						callback: pullupRefresh
-					}
-				}
-			});
 			var count = 0;
 			/**
 			 * 上拉加载具体业务实现
 			 */
 			function pullupRefresh() {
-				
-				setTimeout(function() {
-					mui('#pullrefresh_yhq_list').pullRefresh().endPullupToRefresh((++count > 2)); //参数为true代表没有更多数据了。
-					var table = document.body.querySelector('.my-yhq-list');
-//					var cells = document.body.querySelectorAll('.my-tab-view-pull .mui-table-view-cell');
-					for (var i = 10, len = i + 5; i < len; i++) {
-						var li = document.createElement('li');
-						li.className = 'my-yhq-cell';
-						li.innerHTML = '<img width="100%" src="images/yhq-1.png" /><div class="fixed-box"><div class="table"><div class="left-cell"><span class="tit">优惠券</span><p class="time">有效期至2016年12月12日</p><span class="condition">无使用限制条件</span></div><div class="right-cell"><div class="money"><strong>¥</strong><span>30</span></div><span class="my-btn">立即领取</span></div></div></div';
-//						li.innerHTML = '<img width="100%" src="images/yhq_overdue_bg.png" /><div class="fixed-box grayscale"><div class="table"><div class="left-cell"><span class="tit grayscale">优惠券</span><p class="time grayscale">有效期至2016年12月12日</p><span class="condition">无使用限制条件</span></div><div class="right-cell"><div class="money grayscale"><strong>¥</strong><span>50</span></div><span class="my-btn grayscale">立即领取</span></div></div></div>';
-						table.appendChild(li);
-					}
-				}, 1500);
+                ++pageNumber;
+                console.log(pageNumber);
+                $.ajax( base_path + '/wechat/coupon/couponItemList?dates=' + new Date().getTime(),{
+                    data :{
+                        pageNO : pageNumber
+                    },
+                    dataType:'json',
+                    type:'post',
+                    timeout:15000,
+                    success:function(dt){
+                        var data = dt.data.itemList;
+                        mui('#pullrefresh_yhq_list').pullRefresh().endPullupToRefresh((++count > 2)); //参数为true代表没有更多数据了。
+                        var table = document.body.querySelector('.my-yhq-list');
+
+                        mui(data).each(function(index) {
+                            var li = document.createElement('li');
+                            var src = '//s.iamberry.com/wechat/aiberle/images/yhq-1.png';
+                            if(new Date(this.couponUseEndDate) >= new Date){
+                                li.className = 'my-yhq-cell';
+                            }else{
+                                li.className = 'my-yhq-cell active';
+                                src = '//s.iamberry.com/wechat/aiberle/images/yhq-2.png';
+                            }
+                            var couponReduceHtml = '';
+                            var couponReduceTypeHtml = '';
+                            if(this.couponType == 1){ //减免金额
+                                couponReduceHtml += this.couponReduce/100;
+                                couponReduceTypeHtml = '¥'
+                            }else if(this.couponType == 2){ //减免率
+                                couponReduceHtml += this.couponReduce/100 + "折" ;
+                                couponReduceTypeHtml = '';
+                            }
+                            li.innerHTML = '<img width="100%" src="'+ src + '" /><div class="fixed-box"><div class="table"><div class="left-cell"><span class="tit">'+ this.couponName +'</span><p class="time">有效期至'+ this.couponUseEndDate +'</p><span class="condition">无使用限制条件</span></div><div class="right-cell"><div class="money"><strong>'+ couponReduceTypeHtml +'</strong><span>'+ couponReduceHtml +'</span></div><span class="my-btn"></span></div></div></div';
+                            //li.innerHTML = '<img width="100%" src="images/yhq_overdue_bg.png" /><div class="fixed-box grayscale"><div class="table"><div class="left-cell"><span class="tit grayscale">优惠券</span><p class="time grayscale">有效期至2016年12月12日</p><span class="condition">无使用限制条件</span></div><div class="right-cell"><div class="money grayscale"><strong>¥</strong><span>50</span></div><span class="my-btn grayscale">立即领取</span></div></div></div>';
+                            table.appendChild(li);
+                        });
+
+                        mui('#pullrefresh_yhq_list').pullRefresh().endPullupToRefresh(false);
+                    },
+                    error:function(xhr,type,errorThrown){
+                        //异常处理；
+                        console.log(xhr);
+                    }
+                });
 			}
+
 		mui.ready(function() {
+            mui.init({
+                pullRefresh: {
+                    container: '#pullrefresh_yhq_list',
+                    down: {
+                    },
+                    up: {
+                        contentrefresh: '正在加载...',
+                        callback: pullupRefresh
+                    }
+                }
+            });
 			mui('#pullrefresh_yhq_list').pullRefresh().pullupLoading();
-				console.log("页面加载完毕")
-				document.querySelector('.loading-bg').style.display = 'none';
-			mui('body').on('tap','.my-btn',function(){
-				var btnArray = ['立即使用', '以后使用'];
-				mui.confirm('<strong>¥</strong><span>50元</span>优惠券<img class="x-close" src="images/x.png" />', '恭喜您成功领取一张', btnArray, function(e) {
-					if (e.index == 1) {
-						console.log("以后使用");
-					} else {
-						console.log("立即使用");
-					}
-				})
-			});
-			mui('body').on('tap','.x-close',function(){
-				mui.closePopup();
-			});
-			
-		});	
-		mui.each(document.querySelectorAll('.tab-yhq-list .mui-control-item'), function(index, el) {
-				el.addEventListener('tap', function() {
-					pageNumber = 0;
-					switch (index) {
-						case 0:
-							tabindex = 0;
-							break;
-						case 1:
-							tabindex = 1;
-							break;
-						case 2:
-							tabindex = 2;
-							break;
-						default:
-							tabindex = 3;
-							break;
-					}
-					$('.my-yhq-list').empty();
-					mui('#pullrefresh_yhq_list').pullRefresh().refresh(true);
-					mui('#pullrefresh_yhq_list').pullRefresh().pullupLoading();
-				}, false);
-			});
+			console.log("页面加载完毕")
+			document.querySelector('.loading-bg').style.display = 'none';
+
+		});
 	</script>
 	</body>
 </html>