<%@ page import="com.lightinit.hsdataportal.dictionary.DicOrderState" %>
<%@ page language="java" pageEncoding="UTF-8"
         contentType="text/html; charset=UTF-8" %>
<%@ page isELIgnored="false" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%
    String basePath = request.getContextPath();
    String resourcePath = basePath + "/resource";
%>
<!doctype html>
<html>
<head>
    <title>我的账户-支付</title>
    <meta charset="utf-8">
    <jsp:include page="../common/head.jsp"></jsp:include>
</head>
<body>
<jsp:include page="../common/body_header.jsp"></jsp:include>
<jsp:include page="../common/user_center_header.jsp"></jsp:include>
<div class="line0"></div>
<div class="mid-xiangqing01">
    <div class="pay-mid">
        <div class="pay-midtop" >
            <%--<div class="pay-sp">--%>
                <%--<img src="<%=resourcePath%>/resource/images/open/icon_wenjian.png" alt="">--%>
            <%--</div>--%>
            <div class="pay-js">
                <div class="js1">订单编号:</div>
            </div>

            <div class="pay-jg" >
                <span class="js1" id="orderNumber">${orderNumber}</span>
            </div>


        </div>
        <div class="pay-mid0">
            <div class="pay-fangshi0">请选择支付方式</div>
            <div class="pay-fangshi">
                <div>
                    <input type="radio" name="pay" value="1">
                    <span class="fangshi1"></span>
                </div>
                <div class="fs">
                    <input type="radio" name="pay" value="2">
                    <span class="fangshi2"></span>
                </div>
                <%--<div class="fs">--%>
                    <%--<input type="radio" name="zhifu" value="余额支付">--%>
                    <%--<span class="fangshi4">--%>
                                        <%--<div>(余额<span class="yue-sz">21</span>元)</div>--%>
                                    <%--</span>--%>
                <%--</div>--%>
                <div class="fs">
                    <input type="radio" name="pay" value="3">
                    <span class="fangshi3"></span>
                </div>
            </div>
            <div class="pay-line"></div>
            <div class="zf00">
                <div class="zf01">总金额：&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;${transAmount}元</div>
                <br><br>
                <div class="clearfix"></div>
                <div class="zf02">需要支付额度：&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="yue-sz">${transAmount}</span>元</div>
                <button type="button" onclick="payment()" class="queren5">确认支付</button>
            </div>
        </div>


    </div>
</div>
<jsp:include page="../common/body_footer.jsp"></jsp:include>
<div id="beijing" class="fade" style="display: none"></div>
<div class="code" id="wxzf" >
    <p class="code_top">微信支付</p>
    <img alt="">
    <p class="code_bottom">请使用微信扫描支付</p>
    <div style="cursor:pointer;" class="close" onclick="closeWx()"></div>
</div>
</body>
<script>
    wxHiden() ;
    function wxShow() {
        $("#wxzf").show() ;
        $("#beijing").show() ;
    }
    function wxHiden() {
        $("#wxzf").hide() ;
        $("#beijing").hide() ;
    }
    function payment() {
        var paymentMethod = $("input[type='radio']:checked").val();
        var orderNumber = $("#orderNumber").html();
        if(paymentMethod==1) {
            window.open("<%=basePath%>/alipay/pay.action/"+orderNumber);
        }else if(paymentMethod==2){
            $.ajax({
                type: "POST",
                url: "<%=basePath%>/wxpay/orderPay.action/" + orderNumber,
                dataType: "json",
                success: function (ret) {
                    if (ret && ret.code == "000000") {
                        wxShow();
                        $("#wxzf").find("img").attr("src", "data:image/png;base64," + ret.qrcode);
                        //定时任务
                        var interval = setInterval(function () {
                            $.ajax({
                                type: "POST",
                                url: "<%=basePath%>/wxpay/selectFalgType.action/" + orderNumber,
                                dataType: "json",
                                success: function (data) {
                                    if (data== '<%=DicOrderState.PAY_SUCCESS%>'){
                                        clearInterval(interval ) ;
                                        window.location.href = '<%=basePath%>/wxpay/success.htm' ;
                                    }
                                }
                            });
                        }, 100);
                        //定时任务完毕
                    }
                }
            });
        }

    }

    function closeWx() {
        $("#wxzf").find("img").attr("src", "");
        wxHiden() ;
    }

</script>
</html>