loumengning
/
xs


			
				
					
						
						
							
							<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8" name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no">
    <title>充值 - {$kx.config.sitename}</title>
    <link rel="stylesheet" href="{$kx.config.resurl}/template/kxmobileno1/css/global.css"/>
    <script src="{$kx.config.resurl}/template/kxmobileno1/js/flexible.min.js"></script>
</head>
<body>
<div class="w100">
    <div class="w100  bg-white flex-wrp flex-align-center flex-between lh100 plr15 ptb15">
        <img src="{$kx.config.resurl}/template/kxmobileno1/images/return.png" class="pt-return">
        <div class="size18 bold color37">充值</div>
        <div>
            <img src="{$kx.config.resurl}/template/kxmobileno1/images/ellipsis.png" class="mr5 pt-ellipsis">
        </div>
        <div class="pt5 pb5 pt-tip">
            <a href="{link=index.index}" class="block color1 text-center pt-tip-item" title="{$kx.config.sitename}">前往首页</a>
            <a href="{link=novel.search.index}" class="block color1 text-center pt-tip-item">搜索小说</a>
        </div>
    </div>

    <div class="bg-white bold pl20 ptb20 mb10">
        <span>充值账号</span>
        <span class="fr color32 mr20">{$userinfo.name}</span>
    </div>

    <div class="bg-white mb10 pt-list pt-pay-platform">
        <div class="flex-wrp flex-align-center mb20" data-platform="2">
            <img src="{$kx.config.resurl}/template/kxmobileno1/images/wx.png" class="mr10" style="height: .22rem;width:.22rem">
            <span class="size14 lh100 color7">微信</span>
        </div>
        <div class="flex-wrp flex-align-center active" data-platform="1">
            <img src="{$kx.config.resurl}/template/kxmobileno1/images/alipay.png" class="mr10" style="height: .22rem;width:.22rem">
            <span class="size14 lh100 color7">支付宝</span>
        </div>
    </div>
    <div class="bg-white mb10 pt-list pt-pay-list">
        <div class="flex-wrp flex-align-center">
            <img src="{$kx.config.resurl}/template/kxmobileno1/images/wx.png" class="mr10" style="height: .22rem;width:.22rem">
            <span class="size14 lh100 color7">我的书架</span>
        </div>
        <ul style="padding: .1rem;">
            {section loop=$kx.config.recharge.list item=$loop}
            <li class="ptb10">
                <input type="radio" id="money_list_{$loop}" name="money_list" value="{$loop}">
                <label for="money_list_{$loop}">
                    <span class="inline-block size20 color32 bold mr20" style="border-right: 1px solid #858585;width: 1rem">
                    {=$loop * $kx.config.recharge.ratio}{$kx.config.user.money_caption}
                    </span>
                    &yen;<span>{$loop}</span>
                </label>
            </li>
            {/section}
            <li class="ptb10">
                <input type="radio" id="money_list_other" name="money_list" value="0">
                <label for="money_list_other">
                    <span class="inline-block size20 color32 bold mr20" style="border-right: 1px solid #858585;width: 1rem">自定金额</span>
                    <input type="number" id="money_other" placeholder="请输入自定义金额">
                </label>
            </li>
        </ul>
    </div>
    <div class="mb10 pt-list pt-pay-bottom">
        <button class="pt-login-btn color1" style="width:90vw;">立即支付</button>
        <div class="text-center color32 size14 mt10">
            <input type="checkbox" id="read_and_agree" checked="checked">
            <label for="read_and_agree">我同意<span class="color2">《用户服务协议》</span></label>
        </div>
    </div>
</div>

<!-- 底部版权 -->
{include file="/system/footer"}
<script>
    $('.pt-pay-platform .flex-align-center').click(function () {
        $('.pt-pay-list .flex-align-center img').attr('src', $(this).find('img').attr('src'));
        $('.pt-pay-list .flex-align-center span').text($(this).find('span').text());
        $('.pt-pay-list .flex-align-center').data('platform', $(this).data('platform'));
        $('.pt-pay-list').show();
        $('.pt-pay-bottom').show();
        $(this).parent().hide()
    });
    $('#money_other').click(function () {
        $('#money_list_other').prop('checked',true)
    }).change(function () {
        $('#money_list_other').val($(this).val());
    });
    $('#money_list_other').change(function () {
        $('#money_other').focus();
    });
    $('.pt-pay-bottom button').click(function () {
        if(!$('#read_and_agree').prop('checked')){
            return alert('请先阅读并同意协议');
        }
        var platform = $('.pt-pay-list .flex-align-center').data('platform'), price = parseFloat($('input[name=money_list]:checked').val());

        if (price > 0) {
            window.location.href = '{link=user.pay.unifiedOrder method=1 type=1}&type_info=' + price + '&platform=' + platform
        }
    });
</script>
</body>
</html>