| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421 | <!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" href="/css/mui.min.css">	<link rel="stylesheet" href="/css/iconfont.css" />	<link rel="stylesheet" href="/css/icons-extra.css"/>	<link rel="stylesheet" href="/css/style.css" />	<style type="text/css">		.cart_fixed{position: fixed;right: 30px;bottom:135px;background: rgba(0,0,0,.2);padding: 12px;border-radius: 50%;text-align: center;opacity: .5;}		.cart_fixed .mui-badge{position: absolute;right:-7px;top:-5px;font-size: 12px;}		.return{position: fixed;right: 30px;bottom: 80px;background: rgba(0,0,0,.2);padding: 12px;border-radius: 50%;text-align: center;opacity: .9;color: #333;display: none;}		.my-btn-hand{display:block;width: 100%;height: 55px;background-color: #c5c5c5;color: #fff;border: 0;border-radius: 0;}		.my-btn-hand.active{background-color: #1cc9f4;}		.cl-blue{color: #1cc9f4;}		.iconfont{font-size: 20px;}		.mui-content-madded{background: #fff;padding: 10px;}		.lease-ul{font-size: 14px;color: #999;}		.lease-ul li{padding: 5px 0;}		.lease-left{display: inline-block;width: 25%;}		.ul_radio{width: 73%;display: inline-block;}		.ul_radio li{width:100%;height: 55px;margin: 0 1%;border-radius: 5px; display: inline-block;position: relative;font-family:"iconfont" !important;font-style:normal;-webkit-font-smoothing: antialiased;}		.radio-cell .active:after{position: absolute;right: 0;bottom: 0;content: "\e66f";color: #f1436c;line-height: 1;font-size: 20px;}		.lease-r-center{position: absolute;left: 70px;top: 20px;}		.lease-color{padding: 10px 0;float: left;}		.lease-select-box{padding: 12px 0;position: relative;}		.lease-select{position: absolute;left: 0;top: 10px;}		.mui-input-row{font-size: 13px;}		.mui-input-row input{font-size: 13px;}		.mui-input-group:before{display: none;}		.btn-pull-code{position: absolute;right: 10px;top:3px;height:34px;padding:0 6px;border-radius: 5px; line-height: 34px;font-size: 12px; color: #fff; background: #24cae9;}		.btn-pull-code .active{background: #c8c8c8;}		.icon-fuxuankuang a {color: #24cae9;}		.icon-fuxuankuang{font-size: 13px;padding:5px 5px 5px 22px;}		.icon-fuxuankuang:before{font-size: 18px;color:#e4004d;position: absolute;left: 0;width: 20px;height: 18px;top:1px;}		.icon-fuxuankuang.mui-active:before {color: #c8c8c8;}		#xieyi-dalog{text-decoration:underline}		.ul_noline{padding-bottom: 60px;}		.ul_noline:before{display: none;}		.ul_noline li:after{display: none;}		.address_ul{color: #999;font-size: 12px;}		.address_ul li{white-space:nowrap;overflow: hidden;text-overflow: ellipsis;}		.my-select {border:0!important;color: #999;background-color: #f5f5f5;margin-bottom: 0;padding: 3px 14px;text-align: center;-webkit-appearance: none;height:36px;}		.my-view1:after,.my-view1 li:after{display: none;}		.color{position:absolute; left:100px;top:25px;-webkit-transform: translateY(-50%);}		.after{position: relative;}		.after:before{content:'';width: 0;			height: 0;			border-left: 4px solid transparent;			border-right: 4px solid transparent;			border-top: 8px solid #666;position: absolute;			right: 15px;			top: 15px;}	</style>	<script>        // 屏蔽分享        window.hiddenAllWechatMenu = true;	</script></head><body><div class="loading-bg">	<div class="mui-loading">		<div class="mui-spinner">		</div>		  加载中...	</div></div><div class="mui-content">	<div style="padding: 0 10px;background: #fff;">		<ul class="mui-table-view">			<li class="mui-table-view-cell" style="padding: 11px 0;">				<span class="iconfont icon-lease cl-blue"></span> 租用产品信息			</li>		</ul>		<ul class="lease-ul">			<li>产品名称:<span id="productName"></span></li>			<li style="position: relative;"><span class="lease-color">产品颜色:</span><img src="//s.iamberry.com/watero/images/cp-1.jpg" width="30px" /> <span class="color" id="productColor"></span></li>			<li>租用时长:<span id="rentTime"></span><span class="mui-pull-right">年服务费:<span id="serviceMoney" class="cl-red"></span></span></li>			<li>设备押金:<span id="pledgeMoney" class="cl-red"></span><span class="mui-pull-right">费用合计:<span id="rentMoney" class="cl-red"></span></span></li>		</ul>		<ul class="mui-table-view my-view1">			<li class="mui-table-view-cell" style="padding: 11px 0;">				<span class="mui-h6">使用抵扣券</span>			</li>			<li class="after">				<select class="my-select" id="couponSelect">				</select>			</li>			<li style="padding: 10px 0;display:none;" class="for_money">				<div><span class="mui-h6">抵扣金额:</span><span id="couponMoney" class="cl-red mui-pull-right">¥0</span></div>			</li>		</ul>		<ul class="mui-table-view ul_noline">			<li class="mui-table-view-cell" style="padding: 11px 0 5px 0;border-bottom: 1px solid rgba(0,0,0,.1);">				<span class="iconfont icon-lease2 cl-blue"></span> 收货信息			</li>			<li class="mui-table-view-cell"  style="padding: 11px 10px;">				<a class="mui-navigate-right" id="open-wechat-addres-a">					<span class="mui-h6">选择收货地址</span>					<!-- <ul class="address_ul">                        <li>收  货  人:林林</li>                        <li>手 机 号:15999999999</li>                        <li>详细地址:广东省深圳市福田区莲花街道特区报业大厦12B</li>                    </ul>  -->				</a>			</li>			<li>				<span class="mui-h6">说明:因滤芯为一次性耗材,不可回收,故充值金额概不退返</span>			</li>			<li class="mui-text-center" style="padding: 10px;">				<span class="iconfont icon-fuxuankuang mui-active" id="btn-tongyi">我已阅,并同意<a id="xieyi-dalog">《美国watero租用协议》</a></span>			</li>			<li class="mui-text-center" style="padding:10px 15px 15px 15px;">				支付金额:<span class="cl-red" id="rentPayMoney"></span>			</li>		</ul>	</div>	<div class="buy-footer">		<button type="button" data-loading-icon="mui-spinner mui-spinner-custom" data-loading-text="支付中" class="mui-btn my-btn-hand" id="btn_submit">立即支付</button>	</div></div><script src="/js/mui.min.js"></script><script src="/js/jquery-2.1.1.min.js"></script><script src="/js/shop/main.js"></script><script src="/js/shop/wechat-utils-1.0.js"></script><script src="/js/shop/layer.js"></script><script>    var pledgeMoney=getParam('pledgeMoney');    var serviceMoney=getParam('serviceMoney');    var radio1=getParam('radio1');    var rentProduct=getParam('rentProduct');    var giftId=getParam('giftId');    var productName = decodeURI(escape(getParam('productName')));    var rentMoney = getParam('rentMoney');    var productColor = decodeURI(escape(getParam('productColor')));    var isPay = true; // 是否在请求支付,false表示正在请求,true可以请求    mui.ready(function() {        document.querySelector('.loading-bg').style.display = 'none';        $('#productName').html(productName);        $('#productColor').html(productColor + ' x1');        $('#btn_submit').addClass("mui-active").prop("disabled","disabled");        $('#rentPayMoney').html('¥ ' + accDiv(rentMoney, 100));        switch (radio1) {            case '1':                $('#rentTime').html('1年');                $('#pledgeMoney').html('¥' + accDiv(pledgeMoney, 100));                $('#serviceMoney').html('¥' + accDiv(serviceMoney, 100));                $('#rentMoney').html('¥' + accDiv(rentMoney, 100));                break;            case '2':                $('#rentTime').html('2年');                $('#pledgeMoney').html('¥' + 0);                $('#serviceMoney').html('¥' + accDiv(rentMoney, 100));                $('#rentMoney').html('¥' + accDiv(rentMoney, 100));                break;            default:                $('#rentTime').html('3年');                $('#pledgeMoney').html('¥' + 0);                $('#serviceMoney').html('¥' + accDiv(rentMoney, 100));                $('#rentMoney').html('¥' + accDiv(rentMoney, 100));                break;        }        mui.ajax(base_path + '/rent_order/selectServiceCoupon?dates=' + new Date().getTime(), {            dataType: 'json',            type: 'post',            timeout: 15000,            success: function(dt) {                //console.log(dt);                if(dt.isRedirect) {                    location.href = dt.redirectURL;                }else{                    if(dt.status) {                        var coupon_data = dt.data[0];                        //循环显示租用类型                        if (coupon_data != null) {                            mui(coupon_data).each(function(index) {                                if (index == 0) {                                    $("#couponSelect").append( '<option serviceid="" value="0" selected>不使用抵扣券</option><option serviceId="' + this.serviceId + '"  value="' + this.serviceMoney + '">' + this.serviceName + '</option>');                                } else {                                    $("#couponSelect").append( '<option serviceId="' + this.serviceId + '" value="' + this.serviceMoney + '">' + this.serviceName + '</option>');                                }                            });							/* console.log($('#couponSelect option:first').val())							 $('#couponMoney').html('-¥' + accDiv($('#couponSelect option:first').val(),100)); */                        }else{                            $("#couponSelect").append( '<option serviceid="" value="" selected="selected">没有可用的抵扣券</option>');                        }                    } else {                        //mui('#pullrefresh_chanpin_list').pullRefresh().endPullupToRefresh(true);                    }                }            },            error: function(xhr, type, errorThrown) {                console.log(xhr)            }        })    });    //支付方法    mui('body').on('tap', '#btn_submit', function() {        var th=this;        var check = true;        if(!wechatAddr.status){            mui.alert("请选择收货地址");            check = false;        }        if (radio1 == null) {            mui.alert("请选择租用类型");            check = false;        }        if (rentProduct == null) {            mui.alert("请选择租用商品信息");            check = false;        }        if (giftId == null) {            mui.alert("请选择租用赠品信息");            check = false;        }        if(check){            if(isPay) {                isPay = false; // 锁定请求按钮                layer.open({                    type: 2,                    shadeClose: false,                    content: "正在请求加载订单信息..."                }); // 调用加载弹出层                mui(this).button('loading');                var param = {                    "rentAddressInfo": address,                    "rentAddressName": nickname,                    "rentAddressTel": ads_tel,                    "rentTypeId": radio1,                    "rentServiceId":$("#couponSelect").find("option:selected").attr("serviceId"),                    "productId":rentProduct,                    "giftId":giftId                }                $.ajax({                    type: 'post',                    url: '/watero/wechat/rent_order/rentOrderPay?dates=' + new Date().getTime(),                    data: param,                    dataType: 'json',                    timeout: 15000,                    success: function(dt) {                        //console.log(dt);                        layer.closeAll();                        if(dt.isRedirect) {                            location.href = dt.redirectURL;                        }else{                            if(dt.resultCode== '200') {                                var obj = JSON.parse("{" + dt.data.info + "}");                                WeixinJSBridge.invoke('getBrandWCPayRequest', obj, function(res) {                                    if(res.err_msg == 'get_brand_wcpay_request:ok') {                                        layer.open({                                            type: 2,                                            shadeClose: false,                                            content: "正在请求加载订单信息..."                                        }); // 调用加载弹出层                                        $.ajax({                                            type: 'post',                                            url: base_path +'/rent_order/check_rent_order_status',                                            data: {"orderId":dt.data.orderId},                                            dataType: 'json',                                            timeout: 15000,                                            success: function(data) {                                                //console.log(data);                                                if(data.status) {                                                    if(data.data.rentStatus == 2){                                                        isPay = true;                                                        mui.openWindow({url:'/watero/view/lease_order_win.html'});                                                    }else{                                                        mui.alert('如果已支付,请等待同步支付状态!', '', function() {                                                            isPay = true;                                                        });                                                    }                                                } else {                                                    isPay = true;                                                    mui.alert(data.message);                                                }                                            },                                            error: function(xhr, type, errorThrown) {                                                //异常处理;                                                console.log(xhr);                                                isPay = true;                                                mui.alert("请检查网络或刷新页面重试!");                                            }                                        });                                    } else {                                        isPay = true;                                        mui(th).button('reset');                                        mui.alert("对不起,支付失败!请稍后重试!");                                    }                                });                            } else {                                mui(th).button('reset');                                isPay = true;                                mui.alert(dt.message);                            }                        }                    },                    error: function(xhr, type, errorThrown) {                        //异常处理;                        console.log(xhr);                        isPay = true;                        layer.closeAll();                        mui.alert("请检查网络或刷新页面重试!");                        mui(th).button('reset');                    }                });            }else{                mui.alert("正在请求支付中~~请稍后!");                return;            }        }    });    var address='',nickname='',ads_tel='';    // 获取微信共享地址    mui('body').on('tap', '#open-wechat-addres-a', function() {        editAddrV1(            function(res) {                // 用户成功拉出地址                 address = res.provinceName + "-" + res.cityName + "-" + res.countryName + "-" + res.detailInfo;                nickname=res.userName;                ads_tel= res.telNumber;                wechatAddr.status = true;                wechatAddr.detailInfo = address;                wechatAddr.postalCode = res.postalCode;                wechatAddr.userName = res.userName;                wechatAddr.userTel = res.telNumber;                wechatAddr.nationalCode = res.nationalCode;                $("#open-wechat-addres-a").empty().append('<ul class="ft-12" style="color: #333;"><li>收  货  人:'+ wechatAddr.userName +'</li><li>手 机 号:' + wechatAddr.userTel + '</li><li>详细地址:'+ wechatAddr.detailInfo+'</li></ul>');                var btn_submit=$("#btn_submit");                if ($('#btn-tongyi').hasClass("mui-active")) {                    btn_submit.addClass("mui-active").prop("disabled","disabled");                    btn_submit.removeClass("active");                } else {                    btn_submit.removeClass("mui-active").removeAttr("disabled");                    btn_submit.addClass("active");                }            },            function() {                if($('#open-wechat-addres-a').html() != null && $('#open-wechat-addres-a').html() != '') {                    wechatAddr.status = true;                } else {                    wechatAddr.status = false;                    // 用户取消拉出地址                    $('#open-wechat-addres-a').html('收货地址<span class="mui-h5">请选择收货地址</span>');                    mui.alert("您没有选择收货地址!");                }            }        );    });    $(".ul_radio li").each(function() {        $(this).on("click", function() {            $(this).addClass("active");            $(this).siblings().removeClass("active");        });    });    $('#couponSelect').change(function(){        var serMoney = $('#couponSelect').val();        var money = rentMoney - serMoney;        $('#couponMoney').html('-¥' + accDiv(serMoney,100));        if(serMoney!=0){            $(".for_money").show();        }else{            $(".for_money").hide();        }        $('#rentPayMoney').html('¥' + accDiv(money,100));    });    $(document).on('tap', '#btn-tongyi', function() {        var btn_submit=$("#btn_submit");        if($(this).hasClass("mui-active")){            $(this).removeClass("mui-active");            if(wechatAddr.status){                btn_submit.removeClass("mui-active").removeAttr("disabled");                btn_submit.addClass("active");            }else{                btn_submit.addClass("mui-active").prop("disabled","disabled");                btn_submit.removeClass("active");            }        }else{            $(this).addClass("mui-active");            btn_submit.addClass("mui-active").prop("disabled","disabled");            btn_submit.removeClass("active");        }    });	/*	 $(document).on('tap', '#btn-tongyi', function() {	 var btn_submit=$("#btn_submit");	 console.log($(this).hasClass("mui-active"));	 if($(this).hasClass("mui-active")){	 $(this).removeClass("mui-active");	 btn_submit.removeClass("mui-active");	 }else{	 $(this).addClass("mui-active");	 btn_submit.addClass("mui-active");	 }	 }); */    mui('body').on('tap', '#xieyi-dalog', function() {        mui.openWindow({            url: 'try_xieyi.html'        });    });</script></body></html>
 |