{include file='user/header.tpl'}

    <link rel="stylesheet" type="text/css" href="../theme/cool/assets/css/plugins/datatables.bootstrap4.min.css">
    <style>
        @media (max-width: 992px) {
            .nav-pills .nav-item {
                margin-bottom: 1rem;
            }
        }

        .btn-radio .custom-control { position: absolute; left: 1.5rem; top: .3rem; }
        .btn-radio .badge-hot { position: absolute; right: 1rem; top: 0; border-radius: 0 .5rem 0 .5rem; padding: .375rem; }
        
        body.swal2-height-auto {
            height: 100% !important;
        }
        
        .table-responsive {
            overflow: auto;
        }
    </style>
    <!-- BEGIN: Content-->
    <div class="app-content content">
        <div class="content-overlay"></div>
        <div class="header-navbar-shadow"></div>
        <div class="content-wrapper">
            <div class="content-header row">
                <div class="content-header-left col-md-9 col-12 mb-2">
                    <div class="row breadcrumbs-top">
                        <div class="col-12">
                            <h2 class="content-header-title float-left mb-0">我的钱包</h2>
                            <div class="breadcrumb-wrapper col-12">
                                <ol class="breadcrumb">
                                    <li class="breadcrumb-item"><a href="/user">Home</a></li>
                                    <li class="breadcrumb-item"><a href="/user/code">Wallet</a></li>
                                </ol>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="content-body">
                <div class="row tab-content">
                    <div class="col-lg-2">
                        <ul class="nav nav-pills flex-column nav-left">
                            <li class="nav-item">
                                <a class="nav-link active" data-toggle="pill" href="#account-vertical-code" aria-expanded="true">
                                    <span class="font-weight-bold">钱包充值</span>
                                </a>
                                <a class="nav-link" data-toggle="pill" href="#account-vertical-code_2" aria-expanded="true" style="margin-top:8px;">
                                    <span class="font-weight-bold">钱包记录</span>
                                </a>
                            </li>
                        </ul>
                    </div>
                    
                    <!-- 钱包充值 -->
                    <div role="tabpanel" class="col-lg-5 tab-pane active" id="account-vertical-code" aria-labelledby="account-pill-code" aria-expanded="true">
                        <div class="card">
                            <div class="card-header">
                                <h4 class="card-title">钱包充值</h4>
                            </div>
                            <div class="card-body">
                                <div class="alert alert-secondary" role="alert">
                                    <div class="alert-body font-medium-1">
                                        <div>账户余额：<span class="text-primary">￥{$user->money}</span>
                                        </div>
                                    </div>
                                </div>
                                <div class="tab-content">
                                    
                                    <!-- 切换 加密货币支付
                                    <div class="tab-pane fade" id="recharge-code" role="tabpanel" aria-labelledby="recharge-code" aria-expanded="false">
                                        <div class="row match-height">
                                            <div class="col-12">
                                                 <h5>充值码 支持加密货币支付！</h5>
                                            </div>
                                            <div class="col-md-9 mt-1">
                                    		      <div class="form-group">
                                    		        <input id="pay_code" type="text" class="form-control">
                                    		      </div>
                                            </div>
                                            <div class="col-lg-4 mt-1">
                                            <a class="btn btn-primary waves-effect waves-float waves-light" href="https://oni.surf/" target="_blank" role="button">购买充值码</a>
                                            </div>
                                            <div class="col-lg-4 mt-1">
                                              <button class="btn btn-primary waves-effect waves-float waves-light" onclick="if (!window.__cfRLUnblockHandlers) return false; codeTopup()" data-cf-modified-c4d86746314722ec8753695f-="">立即充值</button>
                                            </div>
                					    </div>
                                    </div>
                                    -->

                                    
                                    <!-- 切换 在线支付 -->
                                    <div>
                                        <div class="row match-height">
                                            <div class="col-12">充值方式：</div>
                                            
                                            <div class="col-md-9 mt-1">
                                            
                                            <!--
                                                <ul class="nav nav-pills row" role="tablist" id="pay_the">
                                                    <li class="nav-alipay nav-item d-flex col-md-4 cursor_onclick">
                                                        <a class="nav-link border py-10 d-flex flex-grow-1 rounded flex-column align-items-center active" data-toggle="pill" data-name="alipay">
                                                            <span class="nav-icon py-1 w-auto">
                                                                <i class="fab fa-alipay icon-2x"></i>
                                                            </span>
                                                            <span class="nav-text font-size-lg py-2 font-weight-bold text-center">支付宝</span>
                                                        </a>
                                                    </li>
                                                    <li class="nav-wechat nav-item d-flex col-md-4 cursor_onclick">
                                                        <a class="nav-link border py-10 d-flex flex-grow-1 rounded flex-column align-items-center" data-toggle="pill" data-name="wechat">
                                                            <span class="nav-icon py-1 w-auto">
                                                                <i class="fab fa-wechat icon-2x"></i>
                                                            </span>
                                                            <span class="nav-text font-size-lg py-2 font-weight-bold text-center">微信</span>
                                                        </a>
                                                    </li>
                                                </ul>
                                            -->
                                            
                                                <ul class="nav nav-pills row" role="tablist" id="pay_the">
                                                    <li class="nav-alipay nav-item d-flex col-md-4 mb-3 mb-lg-0 cursor_onclick" "="">
                                                        <a class="nav-link border py-10 d-flex flex-grow-1 rounded flex-column align-items-center active tom-hand" data-toggle="pill" data-name="wxpay">
                                                            <span class="nav-icon py-1 w-auto">
                                                                <i class="fab fa-wechat icon-2x"></i>
                                                            </span>
                                                            <span class="nav-text font-size-lg py-2 font-weight-bold text-center">微信</span>
                                                        </a>
                                                    </li>
                                                    <li class="nav-alipay nav-item d-flex col-md-4 mb-3 mb-lg-0 cursor_onclick" "="">
                                                        <a class="nav-link border py-10 d-flex flex-grow-1 rounded flex-column align-items-center tom-hand" data-toggle="pill" data-name="alipay">
                                                            <span class="nav-icon py-1 w-auto">
                                                                <i class="fab fa-alipay icon-2x"></i>
                                                            </span>
                                                            <span class="nav-text font-size-lg py-2 font-weight-bold text-center">支付宝</span>
                                                        </a>
                                                    </li>
                                                </ul>
                                                
                                            </div>
                                            
                                            <div class="col-12 mt-2">充值金额：</div>
                                                                                            <div class="col-xl-4 col-lg-4 col-12 mt-1">
                                                    <label class="btn-radio text-center active">
                                                        <div class="custom-control custom-radio d-none">
                                                            <input type="radio" id="money10" name="money" value="10" class="custom-control-input" autocomplete="off" onclick="if (!window.__cfRLUnblockHandlers) return false; changeoption();" data-cf-modified-c4d86746314722ec8753695f-="">
                                                            <label class="custom-control-label" for="money10"></label>
                                                        </div>
                                                        <p class="mb-0 font-medium-3">￥10</p>
                                                    </label>
                                                </div>
                                                                                            <div class="col-xl-4 col-lg-4 col-12 mt-1">
                                                    <label class="btn-radio text-center ">
                                                        <div class="custom-control custom-radio d-none">
                                                            <input type="radio" id="money20" name="money" value="20" class="custom-control-input" autocomplete="off" onclick="if (!window.__cfRLUnblockHandlers) return false; changeoption();" data-cf-modified-c4d86746314722ec8753695f-="">
                                                            <label class="custom-control-label" for="money20"></label>
                                                        </div>
                                                        <p class="mb-0 font-medium-3">￥20</p>
                                                    </label>
                                                </div>
                                                                                            <div class="col-xl-4 col-lg-4 col-12 mt-1">
                                                    <label class="btn-radio text-center ">
                                                        <div class="custom-control custom-radio d-none">
                                                            <input type="radio" id="money30" name="money" value="30" class="custom-control-input" autocomplete="off" onclick="if (!window.__cfRLUnblockHandlers) return false; changeoption();" data-cf-modified-c4d86746314722ec8753695f-="">
                                                            <label class="custom-control-label" for="money30"></label>
                                                        </div>
                                                        <p class="mb-0 font-medium-3">￥30</p>
                                                    </label>
                                                </div>
                                                                                            <div class="col-xl-4 col-lg-4 col-12 mt-1">
                                                    <label class="btn-radio text-center ">
                                                        <div class="custom-control custom-radio d-none">
                                                            <input type="radio" id="money50" name="money" value="50" class="custom-control-input" autocomplete="off" onclick="if (!window.__cfRLUnblockHandlers) return false; changeoption();" data-cf-modified-c4d86746314722ec8753695f-="">
                                                            <label class="custom-control-label" for="money50"></label>
                                                        </div>
                                                        <p class="mb-0 font-medium-3">￥50</p>
                                                    </label>
                                                </div>
                                                                                            <div class="col-xl-4 col-lg-4 col-12 mt-1">
                                                    <label class="btn-radio text-center ">
                                                        <div class="custom-control custom-radio d-none">
                                                            <input type="radio" id="money100" name="money" value="100" class="custom-control-input" autocomplete="off" onclick="if (!window.__cfRLUnblockHandlers) return false; changeoption();" data-cf-modified-c4d86746314722ec8753695f-="">
                                                            <label class="custom-control-label" for="money100"></label>
                                                        </div>
                                                        <p class="mb-0 font-medium-3">￥100</p>
                                                    </label>
                                                </div>
                                                                                            <div class="col-xl-4 col-lg-4 col-12 mt-1">
                                                    <label class="btn-radio text-center ">
                                                        <div class="custom-control custom-radio d-none">
                                                            <input type="radio" id="money500" name="money" value="500" class="custom-control-input" autocomplete="off" onclick="if (!window.__cfRLUnblockHandlers) return false; changeoption();" data-cf-modified-c4d86746314722ec8753695f-="">
                                                            <label class="custom-control-label" for="money500"></label>
                                                        </div>
                                                        <p class="mb-0 font-medium-3">￥500</p>
                                                    </label>
                                                </div>
                                                                                        
                                            <div class="col-xl-12 col-12 mt-1">
                                                <label class="btn-radio text-center" for="money0" onclick="if (!window.__cfRLUnblockHandlers) return false; change();">
                                                    <div class="custom-control custom-radio d-none">
                                                        <input type="radio" id="money0" name="money" value="0" class="custom-control-input" autocomplete="off">
                                                        <label class="custom-control-label" for="money0"></label>
                                                    </div>
                                                    <div class="input-group input-group-merge" style="width: 160px; margin: 0 auto;">
                                                        <span class="input-group-text" style="border: 0; background: transparent; font-size: 1.3rem;">￥</span>
                                                        <input type="text" id="c_number" class="form-control" placeholder="其它金额" oninput="if (!window.__cfRLUnblockHandlers) return false; change();" style="border: 0; background: transparent; font-size: 1.3rem;" for="money0" data-cf-modified-c4d86746314722ec8753695f-="">
                                                    </div>
                                                </label>
                                            </div>
                                            <div class="col-12 mt-1">
                                                <div class="d-flex align-items-center">
                                                    <div>支付金额:</div>
                                                    <div class="text-primary ml-50"><sup class="font-medium-1">￥</sup><span class="font-large-1 code_pay">10</span>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="col-lg-4 mt-1">
                                                <!-- <button class="btn btn-primary disabled">暂不支持在线充值，请直接在会员商店页面购买。</button> -->
                                                <button type="button" class="btn btn-primary js-modal_keep waves-effect waves-float waves-light" data-dismiss="modal" id="pay-confirm">在线支付</button>
                                            </div>
                                        </div>
                                    </div>
                                    <!-- end -->
                                </div>
                            </div>
                        </div>
                    </div>
                    
                    <div role="tabpanel" class="col-lg-9 tab-pane" id="account-vertical-code_2" aria-labelledby="account-vertical-code_2" aria-expanded="true">
                        <div class="card">
                            <!--
                            <div class="card-header">
                                
                                <h4>变动记录</h4>
                                
                                    <a class="btn btn-primary btn-icon icon-left waves-effect waves-light" data-toggle="pill" href="code.html#" aria-expanded="true" onclick="if (!window.__cfRLUnblockHandlers) return false; Conversion();" data-cf-modified-c4d86746314722ec8753695f-="">
                                        <span class="font-weight-bold"><i class="fa fa-leaf"></i> 套餐折算</span>
                                    </a>
                                
                            </div>
                                -->
                            <div class="card-content">
                                <div class="card-body">
                                    <div class="table-responsive">
                                        
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    
                    <!-- <div  role="tabpanel" class="tab-pane fade" id="account-vertical-code_2" aria-labelledby="account-pill-code" aria-expanded="true">
                    <div role="tabpanel" class="col-lg-5 tab-pane fade" id="account-vertical-code_2" aria-labelledby="account-vertical-code_2" aria-expanded="true">
                        <div class="card">
                        
                            <div class="card-header">
                                <h4>变动记录</h4>
                                
                                    <a class="btn btn-primary btn-icon icon-left waves-effect waves-light" data-toggle="pill" href="code.html#" aria-expanded="true" onclick="if (!window.__cfRLUnblockHandlers) return false; Conversion();" data-cf-modified-c4d86746314722ec8753695f-="">
                                        <span class="font-weight-bold"><i class="fa fa-leaf"></i> 套餐折算</span>
                                    </a>
                                
                            </div>
                            
                            <div class="card-content">
                                <div class="card-body">
                                    <div class="table-responsive">
                                        <table class="table table-hover-animation mb-0"> 
                                            <thead>
							                  <tr>
                                                <th>ID</th>
                                                <th>变动前</th>
                                                <th>变动后</th>
                                                <th>备注</th>
                                                <th>变动时间</th>
							                  </tr>
                                            </thead>
                                            <tbody>
                                                <tr>
                                                    <td>1</td>
                                                    <td>2</td>
                                                    <td>3</td>
                                                    <td>4</td>
                                                </tr>
                                            </tbody>
                                        </table>
                                    </div>
                                </div>
                            </div>
                            
                        </div>
                        
                        -->
                        
                        <!--
                        <div class="card">
                            <div class="card-header">
                                <h4>套餐记录</h4>
                            </div>
                            <div class="card-content">
                                <div class="card-body">
                                    <div class="table-responsive">
                                        <table class="table table-hover-animation mb-0"> 
                                            <thead>
							                  <tr>
                                                <th>ID</th>
                                                <th>商品名称</th>
                                                <th>价格</th>
                                                <th>购买时间</th>
                                                <th>续费时间</th>
                                                <th>续费时重置流量</th>
                                                <th>操作</th>
							                  </tr>
                                            </thead>
                                            <tbody>
																		                    <tr>
							                      <td colspan="7"><strong>无购买记录</strong></td>
							                    </tr>
							                                                            </tbody>
                                        </table>
                                    </div>
                                </div>
                            </div>
                        </div>
                        -->
                        
                    </div>
                    
                </div>
            </div>
            
                    <!--PackageConversion modal-->
            <div class="modal fade" id="PackageConversion-modal" tabindex="-1" role="dialog" aria-labelledby="deleteidModalLabel" aria-hidden="true">
                <div class="modal-dialog modal-dialog-centered" role="document">
                    <div class="modal-content">
                        <div class="modal-header">
                            <h5 class="modal-title">折算确认</h5>
                            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                <span aria-hidden="true">×</span>
                            </button>
                        </div>
                        <div class="modal-body">
                            <label class="row col-12 col-form-label" id="zs_name"></label>
                            <label class="row col-12 col-form-label" id="zs_type"></label>
                            <label class="row col-12 col-form-label" id="zs_the"></label>
                            <label class="row col-12 col-form-label" id="zs_ppt"></label>
                            <label class="row col-12 col-form-label" id="zs_used"></label>
                            <label class="row col-12 col-form-label" id="zs_money"></label>
                        </div>
                        <div class="modal-footer">
                            <button class="btn btn-primary" id="Conversion_ok" type="button" >确定折算</button>
                            <button class="btn btn-secondary waves-effect waves-float waves-light" type="button" data-dismiss="modal">取消</button>
                        </div>
                    </div>
                </div>
            </div>
                    
        </div>
    </div>
    
    <!-- 支付确认跳转model -->
    <div class="modal fade" id="coolpay-modal" tabindex="-1" role="dialog" aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h4 class="modal-title">支付</h4>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">×</span>
                    </button>
                </div>
                <div class="modal-body">
                    <div class="text-center">
                      点击“继续支付”打开支付页面支付<br>
                      支付完成后，钱包金额将在5分钟之内到账
                    </div>
                </div>
                <div class="modal-footer">
                    <a id="to-coolpay" href="shop.html##" class="btn btn-primary">继续支付</a>
                </div>
            </div>
        </div>
    </div>
    <!-- END: Content-->

    {include file='user/footer.tpl'}
    
    <script type="c4d86746314722ec8753695f-text/javascript">
    
    var payRedir = "/user";
    
    $("#pay-confirm").click(function () {
    
        let amount = $(".code_pay").html();
        
        let payType = $('.cursor_onclick .active').attr('data-name');
        
        $.ajax({
            url: "/user/payment/code",
            data: {
                amount: amount,
                payType: payType,
                redir: payRedir
            },
            dataType: "json",
            type: "POST",
            success: function (data) {
                
                if (data.ret === 'success') {
                    $("#coolpay-modal").modal("show");
                    $("#to-coolpay").attr("href", data.url);
                } else {
                    Swal.fire("发生错误", data.msg, "error");
                }
                
                /*
                if (data.ret == 1) {
                    alert(data.msg);
                } else {
                    var o = {
                        type: "error",
                        title: "购买失败"
                    };
                    
                        Swal.fire(o)
                    return false;
                }
                 */
            },
            error: function(xhr, status, error) {
                console.error('请求失败:', status, error);
            }
            
        })
         
        
    })
        
    function page(num)
    {
        $.ajax({
            url: '/user/code/ajax/moneylog/'+num+'/view',
            type: 'GET',
            dataType: 'json',
            success: function(data) {
                if (data.ret == 1) {
                    $(".table-responsive").html(data.view);
                }
            },
            error: function(xhr, status, error) {
                console.error('请求失败:', status, error);
            }
        });
        
        return false;
    }
    
    $(document).ready(function() {
    
        page(1);
        
    });

    </script>
    
    
    <script type="c4d86746314722ec8753695f-text/javascript">
        $('.tab-content').find('.btn-radio').on('click', function () {
            if ($('.tab-content').find('.btn-radio').hasClass('active')) {
                $('.tab-content').find('.btn-radio').removeClass('active');
            }
            $(this).addClass('active');
        });
        
        $('#c_number').keyup(function(){
            $(this)[0].value=$(this)[0].value.replace(/^(0+)|[^\d]+/g,'')
        })
    </script>
    
    <script type="c4d86746314722ec8753695f-text/javascript">
        function change() {
            $("input[name=money]:checked").attr('checked',false);
            $("#money0").attr("checked","checked");
            $('.code_pay').html($('#c_number').val());
            qian = Math.floor($('#c_number').val()/100) * 10;
            $('.code_number').html($('#c_number').val()*1 + qian);
        }
        
        function changeoption() {
            $('.code_pay').html($("input[name='money']:checked").val());
            qian = Math.floor($("input[name='money']:checked").val()/100) * 10;
            $('.code_number').html($("input[name='money']:checked").val()*1 + qian);
        }
    </script>
    
    <script type="c4d86746314722ec8753695f-text/javascript">
        var paymentSystem = "cool";
        $('#topup-confirm').click(function () {
            walletTopup($('.cursor_onclick .active').attr('data-name'));
        })
    </script>
    
    <script src="../cdn-cgi/scripts/7d0fa10a/cloudflare-static/rocket-loader.min.js" data-cf-settings="c4d86746314722ec8753695f-|49" defer></script>
    
<!-- <script src="../cdn-cgi/scripts/7d0fa10a/cloudflare-static/rocket-loader.min.js" data-cf-settings="c4d86746314722ec8753695f-|49" defer></script> -->
<!-- "c4d86746314722ec8753695f-text/javascript" -->

</body>
</html>