<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>代理中心</title>
<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/style.css" />
<style>
.vip-tt {position: relative;width:100%;height:150px;background:url(images/gift-card-tit-bg3.png) center center /100% 100% no-repeat;}
.vip-tt>img {width: 100%;}
.tx {position: absolute;left:1em;top: 50%;width: 4.5em;height: 4.5em;display: inline-block;-webkit-transform: translateY(-50%);transform: translateY(-50%);border-radius: 50%;background-color: #88d9eb;padding: 3px;}
.tx>img {width: 100%;border-radius: 50%;}
.nikname {position: absolute;left:6.5em;width:68%;top: 50%;color: #fff;-webkit-transform: translateY(-52%);transform: translateY(-52%);line-height: 1.5;}
.nikname>div{padding:3px 0;}
.nikname>div:first-child{position: relative;width: 100%;overflow: hidden;text-overflow: ellipsis;}
.mui-table-view-chevron .mui-badge{display:none;}
.btn_share{background: #fff;border-radius:6px;padding:3px 10px;float: right;margin-right: 10px;color: #e9004c;font-size: 13px;}
.center-middle{font-size: 12px; position: absolute;
left: 90px;
top: 50%;
-webkit-transform: translateY(-50%);}
.my-btn-line{border: 1px solid #fff; background: transparent;color: #fff;padding: 3px 10px;margin-right:8px;}
.icon-daifahuo{font-size: 15px;padding-left:30px;}
.icon-daifahuo:before{font-size: 19px;color: #24cae9;position: absolute;left: 0;width: 20px;height: 18px;}
.my-div{padding: 5px 0;border-bottom: 1px solid rgba(0,0,0,.1);margin-bottom: 5px;}
.mui-table-view.mui-grid-view .mui-table-view-cell {
font-size: 17px;
display: inline-block;
margin-right: -3px;
padding: 0 0 0 8px;
text-align: center;
vertical-align: middle;
background: 0 0;
}
.mui-table-view.mui-grid-view {
font-size: 0;
display: block;
width: 100%;
padding: 0 8px 8px 0;
white-space: normal;
}
.mui-card-link{color: #70d8eb;}
.mui-card-link.active{color: #e2e2e2;}
.mui-card-footer:after{content: '';position: absolute;left: 50%;top: 20%;width: 1px;height: 60%;background: #70D8EB;-webkit-transform: scaleX(.5);}
.mui-card-footer, .mui-card-header {min-height: 30px;padding: 6px 6px;}
.mui-card {
box-shadow: 0 0 0 rgba(1,1,1,0);
border: 1px solid rgba(110,214,235,.5);
}
.mui-card{font-size: 12px;}
.mui-card-footer .mui-card-link, .mui-card-header .mui-card-link {
line-height: 34px;
height: 34px;
}
.bgcolor-1{height:32vw;background:url(images/gift-card-list-1.jpg) top center no-repeat;background-size: 100% 100%;}
.bgcolor-2{height:32vw;background:url(images/gift-card-list-2.jpg) top center no-repeat;background-size: 100% 100%;}
.h6-vip{font-size: 12px;color: #F0F0F0;text-align: left;}
.mui-btn-link{font-size: 12px;color: #fff;position: absolute;right: 10px;bottom: 0;}
.card-password{padding: 5px 0;
font-size: 26px;
-webkit-user-select: text;
position: absolute;
left: 0;
width: 100%;
top: 50%;-webkit-transform: translateY(-50%);}
.mui-col-xs-6 .mui-card-header{-webkit-user-select:text !important;}
.ul-desc{padding:10px 10px 10px 15px;background: #fff;color: #666;font-size: 12px;}
.icon-gift.active:before{content: '\e71e';}
.my-card-list{padding:8px 8px 8px 0 !important;}
.more-view{padding: 0 0 10px 0;}
.more-view:before,.my-card-list:after{display:none;}
.mui-icon-info{font-size:20px;}
.my-select {border: 1px solid #6fd7eb !important;
color: #6fd7eb;
width: auto;
margin-bottom: 0;
padding: 3px 4px;
text-align: center;
position: absolute;
-webkit-appearance: menulist;
right: 10px;
top: 8px;}
.time-card{position:absolute;left:10px;bottom:5px;font-size: 14px;}
.cl-gray{color:#8794a7;}
</style>
<script>
// 屏蔽分享
window.hiddenAllWechatMenu = true;
</script>
</head>
<body style="background: #fff;">
<div class="loading-bg">
<div class="mui-loading">
<div class="mui-spinner">
</div>
加载中...
</div>
</div>
<div class="mui-content">
<div class="vip-tt">
<div class="tx bg-orange" id="headDiv">
<img src="images/image-12.jpg" id="userHead">
</div>
<div class="nikname">
<div>
<span id="userNickname">水时代watero</span> <span>代理商<span class="mui-icon mui-icon-info" id="btn_go_explain"></span></span>
</div>
<div>
<button type="button" class="my-btn-line" id="my-zeng">我的赠品</button>
<!--<button type="button" class="my-btn-line" id="my-xiaxian">继续代理</button>-->
</div>
</div>
</div>
<ul class="mui-table-view">
<li class="mui-table-view-cell">
<span class="iconfont icon-daifahuo">提货卡</span><select class="my-select">
<option value="4" id="btn-all">全部</option>
<option value="1" id="btn-sales">待提货</option>
<option value="2" id="btn-waitExchange">已提货</option>
<option value="3" id="btn-exchange">已兑现</option>
</select>
</li>
</ul>
<ul class="mui-table-view mui-grid-view my-card-list">
</ul>
<div class="mui-content-padded">
<ul class="mui-pager">
<li class="mui-disabled">
<!-- <span class="my_prev">上一页 </span> -->
</li>
<li>
<a class="my_next">
下一页
</a>
</li>
</ul>
</div>
<!-- <ul class="mui-table-view more-view">
<li class="mui-text-center">
<span class="iconfont icon-gift" id="gift-more" style="padding: 3px 15px;"></span>
</li>
</ul> -->
<ul class="ul-desc">
<li>使用说明：</li>
<li>1、提货卡在获取一年后方可兑现，每张提货卡兑现1250元；</li>
<li>2、每次销售完8张提货卡以后，系统自动赠送一台净水机。</li>
</ul>
</div>
<script src="js/mui.min.js"></script>
<script src="js/jquery-2.1.1.min.js"></script>
<script src="js/main.js"></script>
<script src="js/page/wechat-utils-1.0.js"></script>
<script type="text/javascript">
var pageNumber = 0,pageSize=10;
mui.ready(function(){
$.ajax(base_path + '/agent_pay/agent_info?dates=' + new Date().getTime(), {
data: {},
dataType: 'json',
type: 'post',
timeout: 15000,
xhrFields: {
withCredentials: true
},
crossDomain: true,
success: function(dt) {
if(dt.isRedirect) {
location.href = dt.redirectURL;
} else {
if (dt.isRedirect) {
location.href = dt.redirectURL;
} else {
if(dt.status){
if(dt.data.agentHead != null && typeof(dt.data.agentHead) != "undefined" && dt.data.agentHead != '') {
$("#userHead").prop('src',dt.data.agentHead);
}
if(dt.data.agentNickname != null && typeof(dt.data.agentNickname) != "undefined" && dt.data.agentNickname != '') {
var name=decodeURI(dt.data.agentNickname);
if(name.length>9){
name=name.substring(0,8)+"..."
}
$("#userNickname").html(name);
}
document.querySelector('.loading-bg').style.display='none';
}else{
mui.alert(dt.message,'',function(){
mui.openWindow({url:'/watero/view/gift_card_to_agent.html'});
});
}
}
}
},
error: function(xhr, type, errorThrown) {
//异常处理；
console.log(xhr);
}
});
getGiftList(4);
//$(".hide").addClass('mui-hidden');
});
function getGiftList(obj){
++pageNumber;
mui.ajax(base_path + '/giftCard/card/selectCardList?dates=' + new Date().getTime(), {
data: {
"status":obj,"pageNO":pageNumber,"pageSize":pageSize
},
dataType: 'json',
type: 'post',
timeout: 15000,
success: function(dt) {
console.log(dt)
if(dt.isRedirect) {
location.href = dt.redirectURL;
} else {
if(dt.status) {
var table = document.body.querySelector('.my-card-list');
//table.innerHTML='';
var gift_data = [];
gift_data = dt.data.list;
$("#btn-all").text("全部"+dt.data.count+"张");
$("#btn-sales").text("待提货"+dt.data.salesNum+"张");
$("#btn-waitExchange").text("已提货"+dt.data.waitExchangeNum+"张");
$("#btn-exchange").text("已兑现"+dt.data.exchangeNum+"张");
mui(gift_data).each(function(index) {
var status='',salesStatus='',cl='',ft_cl='';
if (this.cardStatus == 2) {
status='已提货';cl='bgcolor-2';ft_cl='cl-gray';
} else if (this.cardStatus == 1) {
status='待提货';cl='bgcolor-1';
} else if (this.cardStatus == 3){
status='已兑';cl='bgcolor-2';ft_cl='cl-gray';
}
/* if(this.cardSalesStatus==1 || (this.cardSalesStatus==2 && this.cardStatus == 3)){
salesStatus='<a class="mui-card-link btn-details" name="'+this.cardPassword+'" id="'+this.cardId+'">查看详情</a>';
} else if (this.cardSalesStatus==2 && this.cardStatus == 1) {
salesStatus='<a class="mui-card-link myactive" name="'+this.cardPassword+'" id="'+this.cardId+'">待售/赠</a>';
} */
var li = document.createElement('li');
li.className = 'mui-table-view-cell mui-media mui-col-xs-12 btn-details';
li.setAttribute('name',this.cardPassword);
li.setAttribute('id',this.cardId);
li.innerHTML = '<div class="mui-card"><div class="mui-card-header mui-card-media '+cl+'"><div class="ft-12 mui-text-left"></div><div class="card-password '+ft_cl+'" name="'+this.cardPassword+'">'+this.cardPassword+'</div><span class="time-card">'+formatDate(this.cardCreateDate)+'</span><a class="mui-btn-link my-link">'+status+'</a></div></div>';
table.appendChild(li);
});
} else {
mui.alert(dt.message);
}
}
},
error: function(xhr, type, errorThrown) {
//异常处理；
console.log(xhr);
}
});
}
$(document).on('tap', '.my_next', function() {
getGiftList($(".my-select").find("option:selected").val());
});
mui('body').on('tap', '#btn_go_explain', function() {
mui.openWindow({
url: '/watero/view/gift_card_agent_explain.html'
});
});
mui('body').on('tap', '#my-zeng', function() {
mui.openWindow({
url: '/watero/view/gift_card_give_order_list.html'
});
});
mui('body').on('tap', '#my-xiaxian', function() {
mui.openWindow({
url: '/watero/view/gift_card_renew_agent.html'
});
});
mui('body').on('tap', '#gift-more', function() {
getGiftList();
});
/* $(document).on('tap', '.see', function() {
if($(this).hasClass('icon-biyan')){
$(this).parent().next().text($(this).parent().next().attr('name'));
$(this).removeClass('icon-biyan').addClass('icon-yanjing');
}else{
$(this).removeClass('icon-yanjing').addClass('icon-biyan');
$(this).parent().next().prop('name',$(this).parent().next().text());
$(this).parent().next().text("*******");
}
}); */
$(document).on('change', '.my-select', function() {
$(".my-card-list").empty();
pageNumber=0;
getGiftList($(this).val());
});
mui('body').on('tap', '.btn-details', function() {
var th=this;
mui.openWindow({
url: '/watero/view/gift_card_exchange_details.html?name='+th.getAttribute("id")+'&psw='+th.getAttribute("name")
});
});
</script>
</body>
</html>