src/main/webapp/WEB-INF/pages/check.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>查看账单</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
    <meta name="format-detection" content="telephone=no"/>
    <meta name="format-detection" content="email=no"/>
    <meta name="apple-mobile-web-app-status-bar-style" content="black"/>
    <meta name="apple-mobile-web-app-capable" content="yes"/>
    <meta name="apple-mobile-web-app-title" content="">
    <meta name="google" value="notranslate"><!-- 禁止Chrome 浏览器中自动提示翻译 -->
    <link rel="apple-touch-icon-precomposed" href="favicon.ico">
    <link rel="shortcut icon" href="favicon.ico">
    <link rel="Bookmark" href="favicon.ico">
    <link rel="stylesheet" href="//cdn.bootcss.com/weui/1.1.1/style/weui.min.css">
    <link rel="stylesheet" href="//cdn.bootcss.com/jquery-weui/1.0.1/css/jquery-weui.min.css">
    <link rel="stylesheet" href="${staticHost}/css/reset.css">
    <style>
        .all_told, .platen_number {
            text-align: center;
        }
        .all_told {
            padding: 30px 0 10px 0;
        }
        .all_told span {
            margin-right: 5px;
            font-size: 22px;
        }
        .discount_money {
            color: #fc3817;
        }
        .discount {
            padding: 4px 7px;
            background: #fc3817;
            border-radius: 2px;
            position: relative;
            margin-left: 10px;
            color: #fff;
        }
        .discount:before {
            position: absolute;
            content: '';
            width: 0;
            height: 0;
            left: -6px;
            top: 8px;
            border-top: 6px solid transparent;
            border-bottom: 6px solid transparent;
            border-right: 6px solid #fc3817;
        }
    </style>
</head>
<body ontouchstart="">
<header class="demos-header">
    <p class="all_told discount_money"><span id="orderNotPayFee">90.00</span>元</p>
    <p class="platen_number discount_money" style="font-weight:bold;" id="orderTitle">待付费用</p>
</header>
<div class="weui-cells weui-cells_form">
    <input type="hidden" id="carNumPre" value="${carNum!''}"/>
    <input type="hidden" id="parkOrderId"/>
    <input type="hidden" id="payOrderId">
    <div class="weui-cell">
        <div class="weui-cell__hd"><label for="" class="weui-label">当前车牌</label></div>
        <div class="weui-cell__bd" id="carNumber">
        </div>
    </div>
    <div class="weui-cell">
        <div class="weui-cell__hd"><label for="" class="weui-label">停车位置</label></div>
        <div class="weui-cell__bd" id="parkName">
        </div>
    </div>
    <div class="weui-cell">
        <div class="weui-cell__hd"><label for="" class="weui-label">进场时间</label></div>
        <div class="weui-cell__bd" id="parkInTime">
        </div>
    </div>
    <div class="weui-cell">
        <div class="weui-cell__hd"><label for="" class="weui-label">停车时长</label></div>
        <div class="weui-cell__bd" id="parkingDuration">
        </div>
    </div>
</div>
<div class="weui-cells weui-cells_form" id="parkOutTime">
    <div class="weui-cell">
        <div class="weui-cell__hd"><label for="" class="weui-label">总计费用</label></div>
        <div class="weui-cell__bd">
            ¥<span id="orderTotalFee"></span>
        </div>
    </div>
    <div class="weui-cell">
        <div class="weui-cell__hd"><label for="" class="weui-label">已付费用</label></div>
        <div class="weui-cell__bd">
            ¥<span id="orderPayedFee"></span>
        </div>
    </div>
    <!--  <div class="weui-cell">
        <div class="weui-cell__hd"><label for="" class="weui-label">优惠费用</label></div>
        <div class="weui-cell__bd discount_money">
            -¥<span>2.40</span><span class="discount">8折优惠</span>
        </div>
    </div>-->
</div>
<div class="pay-content-padded">
    <a class="weui-btn weui-btn_primary " href="javascript:" id="showTooltips">确定支付</a>
</div>
<script src="//cdn.bootcss.com/jquery/1.11.0/jquery.min.js"></script>
<script src="//cdn.bootcss.com/jquery-weui/1.0.1/js/jquery-weui.min.js"></script>
<script src="${staticHost}/js/jsutil.js"></script>
<script src="${staticHost}/js/url.js"></script>
<script type="text/javascript">
    var func = {
        /**查询待支付订单*/
        initData: function () {
            $('#orderNotPayFee').empty();
            $('#orderTitle').empty();
            $('#carNumber').empty();
            $('#parkName').empty();
            $('#parkInTime').empty();
            $('#parkingDuration').empty();
            $('#orderTotalFee').empty();
            $('#orderPayedFee').empty();
            var carNumPre = $('#carNumPre').val();
            jsutil.defaultReq(
                mUrl.queryParkOrderForNotPay,
                {"carNum": carNumPre},
                function (data) {
                    if (data != null && "1005" == data.code) {
                        window.location.href = mUrl.queryOrderCheckErrorView + "&carNum=" + carNumPre;
                    } else if (data != null && "8888" != data.code) {
                        $.alert("查询待支付订单失败,请重试!");
                    } else {
                        var orderVO = data.data;
                        $('#parkOrderId').val(orderVO.orderId);
                        $('#payOrderId').val(orderVO.payOrderId)
                        $('#orderNotPayFee').text(orderVO.orderNotPayFee);
                        $('#orderTitle').text(orderVO.orderTitle);
                        $('#carNumber').text(orderVO.carNumber);
                        $('#parkName').text(orderVO.parkName);
                        $('#parkInTime').text(orderVO.parkInTime);
                        $('#parkingDuration').text(orderVO.parkingDuration);
                        $('#orderTotalFee').text(orderVO.orderTotalFee);
                        $('#orderPayedFee').text(orderVO.orderPayedFee);
                    }
                });
        },
    };
    $(function () {
        func.initData();
    });
    var flg = true;
    $("#showTooltips").click(function () {
        if (flg) {
            flg = false;
            $('#showTooltips').attr('class', 'weui-btn weui-btn_primary weui-btn_disabled');
            var parkOrderId = $('#parkOrderId').val();
            var payOrderId = $('#payOrderId').val();
            if (parkOrderId.length < 1) {
                $.toptip("订单Id为空", 2000, "error");
                $('#showTooltips').attr('class', 'weui-btn weui-btn_primary');
                flg = true;
                return false;
            }
            var req = {
                orderId: parkOrderId,
                payOrderId:payOrderId
            }
            $.ajax({
                url: mUrl.getJSPayParam,
                type: 'post',
                dataType: 'json',
                data: req,
                success: function (res) {
                    if (res.code == '8888') {
                        var payParam = res.data;
                        //调用微信支付
                        callpay(payParam);
                    } else {
                        $.toptip(res.msg, 2000, "error");
                        console.log('详细错误信息为:' + res.data);
                    }
                }
            });
        }//if
    });
    //调用微信JS api 支付
    function jsApiCall(payParam) {
        WeixinJSBridge.invoke(
            'getBrandWCPayRequest',
            payParam,
            function (res) {
                if (res.err_msg == "get_brand_wcpay_request:ok") {
                    $.alert("亲!支付成功!");
                    //支付成功
                    windows.location.href = mUrl.paySuccessView + '&payMoney=' + totleMoney;
                } else {
                    //支付失败
                    $.alert("亲!支付失败!err_msg=" + res.err_msg);
                    //windows.location.href='${host}/pay/payFail';
                }
            }
        );
    }
    function callpay(payParam) {
        if (typeof WeixinJSBridge == "undefined") {
            if (document.addEventListener) {
                document.addEventListener('WeixinJSBridgeReady', jsApiCall, false);
            } else if (document.attachEvent) {
                document.attachEvent('WeixinJSBridgeReady', jsApiCall);
                document.attachEvent('onWeixinJSBridgeReady', jsApiCall);
            }
        } else {
            jsApiCall(payParam);
        }
    }
</script>
</body>
</html>