{extend name="./template/default/pub/pc_base.html" /}
{block name="seo"}
<title>卡密充值-{$site_name}</title>
{/block}
{block name="content"}
<section class="vip-banner-big container-fluid"
         style="background-image: url(http://css99tel.cdndm5.com/v201905271815/blue/images/vipbanner.jpg)">
    <div class="container">
        <div class="aside-box converted pull-right">
            <h3>卡密充值</h3>
            <p id="hint" style="color: red;"></p>
            <p><input id="code" type="text" autocomplete="off" value="" placeholder="输入充值码"></p>
            <p>
                <button type="button" onclick="subCode()">立即充值</button>
            </p>
            <p>
                <button style="background-color:#2ea6d4;" type="button" onclick="javascript:location.href='{$url}'">购买充值卡</button>
            </p>
            <dl class="desc">
                <dt>充值说明</dt>
                <dd>1、请在有效期内输入卡密进行充值</dd>
                <dd>2、卡密会通过邮箱或手机短信发送给您，请保存好购买的卡密</dd>
            </dl>
        </div>
    </div>
</section>
<main class="container overflow-Show clearfix">
    <div class="mt40">
        <h1 class="vip-box-title"> 畅读精选 <span class="head-pagination"></span></h1>
        <section class="box container overflow-Show mb20" style="margin-top:30px;">
            <div class="box-body">
                <ul class="mh-list col7">
                    {volist name="books" id="vo"}
                    <li>
                        <div class="mh-item">
                            <a href="/book/{$id_salt}{$vo.id}">
                                {if empty($vo.cover_url)}
                                <p class="mh-cover"
                                   style="background-image: url({$img_site}/static/upload/book/{$vo.id}/cover.jpg)">
                                    {else /}
                                <p class="mh-cover" style="background-image: url({$vo.cover_url})">
                                    {/if}
                                    <span class="tag mh-vip-tag">精选</span>
                                </p>
                            </a>
                            <div class="mh-item-detali">
                                <h2 class="title">
                                    <a href="/book/{$id_salt}{$vo.id}" title="{$vo.book_name}"
                                       style="white-space: nowrap; overflow: hidden; text-overflow: ellipsis;">
                                        {$vo.book_name}
                                    </a>
                                </h2>
                                <p class="zl"></p>
                                <p class="chapter" style="width: 181px;">
                                    <span>总计</span>
                                    <a href="/book/{$id_salt}{$vo.id}">{$vo.chapter_count}话</a>
                                </p>
                            </div>

                        </div>
                    </li>
                    {/volist}
                </ul>
            </div>
        </section>
    </div>
</main>
<script>
    function subCode() {
        var code = $('#code').val();
        if (code == '') {
            ShowDialog('请输入充值码');
        } else {
            $.post({
                url: '/kami',
                data: {'code': code},
                success: function (res) {
                    ShowDialog(res.msg);
                    if (res.err == 0) {
                        setTimeout(function () {
                            location.href = '/ucenter';
                        }, 1000);
                    }
                }
            })
        }
    }
</script>
{/block}