<!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" />
<link rel="stylesheet" type="text/css" href="css/vip_center.css" />
<style>
body,.mui-content{background: #fff;}
.my-view-order .mui-media-body {
padding-top: 0;
}
.center-middle{font-size: 12px; position: absolute;
left: 90px;
top: 50%;
-webkit-transform: translateY(-50%);}
.wh-80 {
width: 70px !important;
max-width: 70px !important;
height: 70px !important;
margin: 0 5px 0 0 !important;
overflow: hidden;
display: inline-block;
text-align: center;
}
.wh-80 img {
height: 70px;
}
.btn-box{bottom:auto;top:12px;}
.icon-orderyue{font-size: 35px;}
#menu-nav .mui-control-item {line-height: 1;color: #333;border-color: #fff;border:0;padding: 10px 0 15px 0;font-size: 12px;}
#menu-nav {border: 0;border-radius: 3px;}
#menu-nav .mui-control-item.mui-active {color: #333;background-color:rgba(0,0,0,.1);}
#menu-nav .iconfont{color: #55c0dc;padding: 10px 0;}
#menu-order .mui-control-item {line-height: 1;color: #333;border-color: #fff;border:0;padding: 6px 0 10px 0;font-size: 12px;}
#menu-order {border: 0;border-radius: 3px;}
#menu-order .mui-control-item.mui-active {color: #333;background-color:rgba(0,0,0,.1);}
#menu-order .iconfont{color: #f5556c;padding: 5px 0;}
.my-view-order{color: #333;}
.my-view-order:before{display: none;}
.mui-grid-view.mui-grid-9 .mui-media{background-color: #fff;padding: 11px 5px;}
.mui-grid-view.mui-grid-9:after{height: 0;display: none;}
.icon-xiaxian,.icon-kefu{color: #55c0dc;}
.icon-liwu,.icon-wheel{color: #f7624e;}
.icon-renwu,.icon-naifen{color: #f88c43;}
.icon-shouhou,.icon-order{color: #31c27c;}
.mui-table-view.mui-grid-view .mui-table-view-cell .mui-media-body{font-size: 12px;}
#menu-lease-order,#menu-lease-other{border: 0;border-radius: 3px;}
#menu-lease-order .mui-control-item,#menu-lease-other .mui-control-item{line-height: 1;color: #333;border-color: #fff;border:0;padding: 6px 0 10px 0;font-size: 12px;}
#menu-lease-order .mui-control-item.mui-active,#menu-lease-other .mui-control-item.mui-active{color: #333;background-color:rgba(0,0,0,.1);}
#menu-lease-order .iconfont,#menu-lease-other .iconfont{padding: 5px 0;}
.icon-daifahuo1,.icon-shebeiliebiao{color: #1bcba8;}
.icon-yifahuo,.icon-zulinxieyi{color: #55c0dc;}
.wh-80 {
width: 60px !important;
max-width: 60px !important;
height: 80px !important;
margin: 0 5px 0 0 !important;
overflow: hidden;
display: inline-block;
text-align: center;
}
.try-btn-pay{ background: #55c0dc;
border: 1px solid transparent;
border-radius: 4px;
color: #fff;
padding: 3px 8px;}
.center-middle{font-size: 12px; position: absolute;
left: 90px;
top: 50%;
-webkit-transform: translateY(-50%);}
.vip-tt{background: #fff;}
.nikname{color: #333;left: 7.5em;}
#menu-order .iconfont{color: #24cae9;}
#menu-order .mui-control-item{font-size: 14px;}
.tx{padding: 0;left: 2em;}
.see-rights{color:#8f8f94;background: #fff;border-radius: 6px;padding: 3px 10px;float: right;margin-right: 10px;font-size: 13px;}
.vip-show{background: #dff4fa;border-radius: 25px;font-size: 12px;text-align: center;width: 90%;margin:0 auto;padding: 3px 0;display: none;}
</style>
<script>
// 屏蔽分享
window.hiddenAllWechatMenu = true;
</script>
</head>
<body>
<div class="loading-bg">
<div class="mui-loading">
<div class="mui-spinner">
</div>
加载中...
</div>
</div>
<nav class="mui-bar mui-bar-tab" id="footer-bar">
<a class="mui-tab-item" >
<div class="iconfont icon-home"></div>
<span class="mui-tab-label">首页</span>
</a>
<a class="mui-tab-item">
<div class="iconfont icon-gouwuche"><span class="mui-badge">0</span></div>
<span class="mui-tab-label">购物车</span>
</a>
<a class="mui-tab-item">
<div class="iconfont icon-dingdan"></div>
<span class="mui-tab-label">我的订单</span>
</a>
<a class="mui-tab-item mui-active">
<div class="iconfont icon-vip"></div>
<span class="mui-tab-label">会员中心</span>
</a>
</nav>
<div class="mui-content">
<div class="vip-tt">
<!-- <img src="/iamberry/common/shop/images/member_photo-bg_2.png"> -->
<div class="tx bg-orange" id="headDiv">
<img src="images/logo_head.png" id="userHead">
</div>
<div class="nikname">
<div>
<span id="userNickname">水时代</span>
</div>
<div >
<span id="vipName">普通用户</span>
<!--<span class="go_daili_2wm" id="2WM" style="display:none">立即分享二维码 ></span>-->
<span class="see-rights">查看权益<span class="mui-icon mui-icon-arrowright" style="font-size: 18px;"></span></span>
</div>
</div>
</div>
<div class="vip-show">
凡购买滤芯套装，立减100元/套，结算时系统自动减免
</div>
<!-- <div style="padding:0;background: #fff;margin-bottom: 8px;">
<div id="menu-nav" class="mui-segmented-control">
<a class="mui-control-item go_cash_log">
<div class="iconfont icon-orderyue"></div>
余额
</a>
<a class="mui-control-item go_daili_order_list">
<div class="iconfont icon-orderjiangli"></div>
待奖励
</a>
<a class="mui-control-item go_couponList">
<div class="iconfont icon-orderyouhui"></div>
优惠券
</a>
<a class="mui-control-item go_gwc">
<div class="iconfont icon-ordercart"></div>
购物车
</a>
</div>
</div> -->
<!--<div style="padding:0;background: #fff;margin-bottom: 8px;">-->
<!--<div id="menu-nav" class="mui-segmented-control">-->
<!--<a class="mui-control-item go_cash_log">-->
<!--<div class="iconfont icon-orderjiangli"></div>-->
<!--奖励记录-->
<!--</a>-->
<!--<a class="mui-control-item">-->
<!--<div class="iconfont icon-orderyue"></div>-->
<!--余额 <span class="cl-red">0.00</span>-->
<!--</a>-->
<!--<a class="mui-control-item" href="/watero/view/coupon_bag.html">-->
<!--<div class="iconfont icon-wodequanbao"></div>-->
<!--我的券包-->
<!--</a>-->
<!--</div>-->
<!--</div>-->
<!--<ul class="mui-table-view my-view-order">-->
<!--<li class="mui-table-view-cell">-->
<!--<a class="mui-navigate-right go_pay_count">-->
<!--我的订单-->
<!--</a>-->
<!--</li>-->
<!--</ul>-->
<div style="padding:10px 0 30px 0;background: #fff;">
<div id="menu-order" class="mui-segmented-control">
<a class="mui-control-item go_pay_count">
<div class="iconfont icon-daifukuan"></div>
待付款
</a>
<a class="mui-control-item go_deliver_count">
<div class="iconfont icon-daifahuo"></div>
待发货
</a>
<a class="mui-control-item go_delivered_count">
<div class="iconfont icon-yifahuo"></div>
已发货
</a>
<a class="mui-control-item go_all_count">
<div class="iconfont icon-alldingdan"></div>
全部订单
</a>
</div>
</div>
<!--<ul class="mui-table-view my-view-order">-->
<!--<li class="mui-table-view-cell">-->
<!--设备租赁-->
<!--</li>-->
<!--</ul>-->
<!--<div style="padding:0;background: #fff;margin-bottom: 8px;">-->
<!--<div id="menu-lease-order" class="mui-segmented-control">-->
<!--<a class="mui-control-item">-->
<!--<div class="iconfont icon-daifahuo1" id="rent_wait_deliver"></div>-->
<!--全部订单-->
<!--</a>-->
<!--<a class="mui-control-item">-->
<!--<div class="iconfont icon-yifahuo" id="rent_already_deliver"></div>-->
<!--已发货-->
<!--</a>-->
<!--<a class="mui-control-item">-->
<!--<div class="iconfont icon-shebeiliebiao"></div>-->
<!--设备列表-->
<!--</a>-->
<!--<a class="mui-control-item">-->
<!--<div class="iconfont icon-zulinxieyi" id="xieyi-dalog"></div>-->
<!--租赁协议-->
<!--</a>-->
<!--</div>-->
<!--</div>-->
<!--<ul class="mui-table-view my-view-order">-->
<!--<li class="mui-table-view-cell">-->
<!--服务-->
<!--</li>-->
<!--</ul>-->
<!--<div style="padding:0;background: #fff;margin-bottom: 8px;">-->
<!--<div id="menu-lease-other" class="mui-segmented-control">-->
<!--<a class="mui-control-item">-->
<!--<div class="iconfont icon-xiaxian"></div>-->
<!--我的好友-->
<!--</a>-->
<!--<a class="mui-control-item">-->
<!--<div class="iconfont icon-shouhou"></div>-->
<!--售后服务-->
<!--</a>-->
<!--<a class="mui-control-item">-->
<!--<div class="iconfont icon-kefu"></div>-->
<!--客服电话-->
<!--</a>-->
<!--<a class="mui-control-item">-->
<!--<div class="iconfont icon-order"></div>-->
<!--常见问答-->
<!--</a>-->
<!--</div>-->
<!--</div>-->
<ul class="mui-table-view mui-table-view-striped mui-table-view-condensed my-center-no" id="center-menu" >
<li class="mui-table-view-cell" href="coupon_bag.html">
<div class="mui-table">
<div class="mui-table-cell mui-col-xs-5 table-middle">
我的券包
</div>
<div class="mui-table-cell mui-col-xs-5 mui-text-right">
<span class="mui-icon mui-icon-arrowright"></span>
</div>
</div>
</li>
<li class="mui-table-view-cell" href="//w.iamberry.com/watero/view/faq.html">
<div class="mui-table">
<div class="mui-table-cell mui-col-xs-5">
常见问答
</div>
<div class="mui-table-cell mui-col-xs-5 mui-text-right">
<span class="mui-icon mui-icon-arrowright"></span>
</div>
</div>
</li>
<li class="mui-table-view-cell" href="after_service_watero.html">
<div class="mui-table">
<div class="mui-table-cell mui-col-xs-5">
售后服务
</div>
<div class="mui-table-cell mui-col-xs-5 mui-text-right">
<span class="mui-icon mui-icon-arrowright"></span>
</div>
</div>
</li>
<li class="mui-table-view-cell" href="tel:400-8006692">
<div class="mui-table">
<div class="mui-table-cell mui-col-xs-5">
客服电话
</div>
<div class="mui-table-cell mui-col-xs-5 mui-text-right">
<span class="mui-h5" style="position: absolute;width: 100px;right: 25px;top: 3px;">400-8006692</span><span class="mui-icon mui-icon-arrowright"></span>
</div>
</div>
</li>
<li class="mui-table-view-cell" href="coupon_dec.html" id="coupon-sys" style="display: none;">
<div class="mui-table">
<div class="mui-table-cell mui-col-xs-5">
滤芯兑换券
</div>
<div class="mui-table-cell mui-col-xs-5 mui-text-right">
<span class="mui-h5" style="position: absolute;width: 100px;right: 25px;top: 3px;">使用说明</span><span class="mui-icon mui-icon-arrowright"></span>
</div>
</div>
</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 src="js/shop/vip_center.js?v=2017040701"></script>-->
<script>
mui.ready(function() {
marquee_Show();
getCartNum();
$.ajax(base_path + '/agent/member?dates=' + new Date().getTime(), {
dataType: 'json',
type: 'post',
timeout: 15000,
xhrFields: {
withCredentials: true
},
crossDomain: true,
success: function(dt) {
if (dt.isRedirect) {
location.href = dt.redirectURL;
} else {
var data = dt.data;
if(dt.status) {
if(data.userHead != null && typeof(data.userHead) != "undefined" && data.userHead != '') {
var imgObj = $("<img src='" + data.userHead + "?" + new Date().getTime() + "'/>");
$("#headDiv").empty().append(imgObj)
}
if(data.userNickname != null && typeof(data.userNickname) != "undefined" && data.userNickname != '') {
$("#userNickname").html(decodeURI(data.userNickname))
}
var userNickname = $("#userNickname").html();
if(data.userIsVip == 2) {
//$("#2WM").show();
if(userNickname != "") {
$("#userNickname").html(userNickname )
$("#vipName").html('<img style="width: 12px;" src="images/s-vip.png" /><span class="mui-h6">VIP用户</span>');
}
$(".vip-show,#coupon-sys").show();
} else {
if(userNickname != "") {
$("#userNickname").html(userNickname)
$("#vipName").html('<span class="mui-h6">普通用户</span>');
$(".see-rights").hide();
}
}
$.ajax({
type: 'post',
url: base_path + '/probationOrder/membersProbationOrder',
data: {},
dataType: 'json',
timeout: 15000,
xhrFields: {
withCredentials: true
},
crossDomain: true,
success: function(dts) {
if (dt.isRedirect) {
location.href = dt.redirectURL;
} else {
if(dts.status) {
var str = '';
if(dts.data.probationOrderDtoList.length == 0) {
$("#try_order_list").hide()
}
mui(dts.data.probationOrderDtoList).each(function(index) {
switch(this.probationStatus) {
case 1:
str = "待派送";
break;
case 2:
str = "派送中";
break;
case 3:
str = "待支付";
break;
case 4:
str = "暂停试用";
break;
case 5:
str = "支付完成";
break;
default:
str = "订单关闭";
break
}
var str1 = '',
str2 = '';
if(str == "待支付") {
str1 = '<a data-loading-icon="mui-spinner mui-spinner-custom" data-loading-text="正在支付" class="mui-btn try-btn-pay mui-pull-right" style="margin-right: 12px;" proid="' + this.probationOrderid + '">立即支付</a>';
str2 = '<div>试用剩余时间：<span id="time_out' + (index + 1) + '"></span></div>'
}
$("#try_order_list").append('<li class="mui-table-view-cell mui-media"><a class="go_try_order" proid="' + this.probationOrderid + '" style="margin-left: -20px;"><span class="mui-media-object mui-pull-left wh-80"><img src="' + this.productIntroduceImg + '"></span><div class="mui-media-body center-middle"><div>' + str + '</div><div>订单号：' + this.probationOrderid + '</div>' + str2 + '</div></a><div class="btn-box">' + str1 + '</div></li>');
if(str == "待支付") {
addTimer('time_out' + (index + 1), this.probationRemainingTime / 1000)
}
})
} else {
mui.alert(dts.data.message)
}
}
},
error: function(xhr, type, errorThrown) {
console.log(xhr);
mui.alert("请检查网络或刷新页面重试！")
}
});
document.querySelector('.loading-bg').style.display = 'none'
} else {
var btnArray = ['否', '是'];
mui.confirm(dt.message, '提示', btnArray, function(e) {
if(e.index == 1) {
location.reload(true)
}
})
}
}
},
error: function(xhr, type, errorThrown) {
console.log(xhr)
}
});
if(marquee != '') {
$('body').append('<div class="marquee-show"><div></div></div>')
}
});
var isPay = true;
mui('body').on('tap', '.try-btn-pay', function() {
var th = this;
if(isPay) {
mui(this).button('loading');
isPay = false;
$.ajax({
type: 'post',
url: base_path + '/probation/pay',
data: {
"orderId": th.getAttribute("proid")
},
dataType: 'json',
timeout: 15000,
xhrFields: {
withCredentials: true
},
crossDomain: true,
success: function(dt) {
if (dt.isRedirect) {
location.href = dt.redirectURL;
} else {
if(dt.status) {
var obj = JSON.parse("{" + dt.data.info + "}");
WeixinJSBridge.invoke('getBrandWCPayRequest', obj, function(res) {
if(res.err_msg == 'get_brand_wcpay_request:ok') {
$.ajax({
type: 'post',
url: base_path + '/probation/check_probation_pay_success',
data: {
"orderId": th.getAttribute("proid")
},
dataType: 'json',
timeout: 15000,
xhrFields: {
withCredentials: true
},
crossDomain: true,
success: function(data) {
if (dt.isRedirect) {
location.href = dt.redirectURL;
} else {
if(data.status) {
if(data.data == 5) {
mui.alert("支付成功", '', function() {
mui.openWindow({
url: base_path + '/probation/try_order?orderId=' + th.getAttribute("proid")
})
})
} else {
mui.alert(data.message, '', function() {
mui(th).button('reset')
})
}
} else {
mui(th).button('reset');
mui.alert(data.message)
}
}
},
error: function(xhr, type, errorThrown) {
isPay = true;
console.log(xhr);
mui(th).button('reset');
mui.alert("请检查网络或刷新页面重试！")
}
})
} else {
isPay = true;
mui(th).button('reset');
mui.alert("对不起，支付失败!请稍后重试!")
}
})
} else {
mui(th).button('reset');
mui.alert(dt.message)
}
}
},
error: function(xhr, type, errorThrown) {
isPay = true;
console.log(xhr);
mui(th).button('reset');
mui.alert("请检查网络或刷新页面重试！")
}
})
} else {
mui.alert("正在请求支付中~~请稍后!");
return
}
});
var addTimer = function() {
var list = [],
interval;
return function(id, time) {
if(!interval) {
interval = setInterval(go, 1000)
}
list.push({
ele: document.getElementById(id),
time: time
})
};
function go() {
for(var i = 0; i < list.length; i += 1) {
list[i].ele.innerHTML = getTimerString(list[i].time ? list[i].time -= 1 : 0);
if(!list[i].time) {
list.splice(i--, 1)
}
}
}
function getTimerString(time) {
d = Math.floor(time / 86400), h = Math.floor((time % 86400) / 3600), m = Math.floor(((time % 86400) % 3600) / 60), s = Math.floor(((time % 86400) % 3600) % 60);
if(time > 0) {
return d + "天" + h + "时" + m + "分" + s + "秒"
} else {
return "试用已结束"
}
}
}();
$(document).on('tap', '#center-menu>li', function() {
var href = $(this).attr("href");
location.href =href;
});
$(document).on('tap', '.see-rights', function() {
location.href ='member_benefits.html';
});
</script>
</body>
</html>