<%@ page import="com.lightinit.hsdataportal.dictionary.DicOrderState" %>
<%@ page language="java" pageEncoding="UTF-8" contentType="text/html; charset=UTF-8"%>
<%
    String basePath = request.getContextPath();
    String resourcePath = basePath + "/resource";
%>
<%@ page isELIgnored="false" %>
<%@ taglib prefix="shiro" uri="http://shiro.apache.org/tags" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<html>
<head>
    <jsp:include page="../common/head.jsp"></jsp:include>
    <style>
        .code{
            width: 320px;
            height: 320px;
            background: rgb(255, 255, 255);
            position: fixed;
            float: left;
            top:24%;
            right:0;
            left:0;
            margin:auto;
            border-radius: 8px;
            z-index: 999999;
        }
        .code img{
            display: block;
            width: 220px;
            height: 220px;
            margin: 0 auto;
            margin-top: 16px;
            background: #ffffff
        }
        .code_bottom{
            font-size: 18px;
            color: #00cac2;
            margin-top: 8px;
            text-align: center
        }
        .code_top{
            margin-top: 10px;
            text-align: center;
            font-size: 22px;
            font-weight: bold;
            color: #2f3335;
        }
        .code .close{
            position: absolute;
            width: 24px;
            height: 24px;
            background: url(../../../resource/images/icon_close.png) center no-repeat;
            background-size: 12px 12px;
            border-radius: 50%;
            top: 6px;
            right: 6px;
        }
    </style>
</head>
<body>
<jsp:include page="../common/body_header.jsp"></jsp:include>
<div class="line0"></div>
<div class="clearfix"></div>
<div class="cp_m">
    <div class="row">
        <b class="order_b">用户标签</b>
        <hr class="order_line">
        <div class="order_p height1">
            <div class="order_n"><b>下单人信息：</b></div>
            <div class="ddh">订单已提交成功。订单号：<b id="orderNumber">${orderNumber}</b>。请尽快完成支付。</div>
            <div class="ddh1">应付金额：
                <span >¥${orderAmount}</span>
            </div>
        </div>
        <div class="order_sp height1">
            <div class="order_n"><b>订购商品信息：</b></div>
            <div class="xzfs">
                <span class="ddh fs">选择支付方式：</span>
                <ul class="zffs">
                    <li><input type="radio"name="pay" class="radio" value="1"></li>
                    <li><img src="<%=basePath%>/resource/images/open/img_wechat.png" alt=""  class="wximg"></li>
                    <li><input type="radio" name="pay" class="radio radio_jl" value="2"></li>
                    <li><img src="<%=basePath%>/resource/images/open/img_alipay.png" alt="" class="wximg"></li>
                    <li><input type="radio" name="pay" class="radio radio_jl" value="3"></li>
                    <li><img src="<%=basePath%>/resource/images/zhifu_yue.png" alt="" class="wximg"></li>
                    <li><input type="radio" name="pay" class="radio radio_jl" value="4"></li>
                    <li><img src="<%=basePath%>/resource/images/zhifu_yinlian.png" alt="" class="wximg"></li>

                </ul>
            </div>
        </div>
        <div class="gm">
            <span class="yfje">应付金额：</span>
            <span class="je">¥${orderAmount}</span>
            <button type="button" onclick="payment()" class="qrgm">确认购买</button>
        </div>
    </div>
</div>
<!-- footer -->
<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==2) {
        window.open("<%=basePath%>/alipay/pay.action/"+orderNumber);
    }else if(paymentMethod==1){
        $.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);
                    //定时任务完毕
                }
            }
        });
    }else  if(paymentMethod==3){
        $.post("<%=basePath%>/open/balancePAy/balancePAy.action/"+orderNumber,function (ret) {
            if(ret.stateCode==200) {

                location.href="<%=basePath%>/open/balancePAy/toSuccess.htm";

            }else {
                alert(ret.msg)
            }
        });
    }else if(paymentMethod==4) {

        location.href="<%=basePath%>/unionPay/pay.action/"+orderNumber;
    }
        
    }

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

</script>
</html>
