{extend name="kuaifen@layout/layout" /}
{block name="title"}书籍详情{/block}
{block name="css"}
<!-- 这里引入css -->
<link href="{:asset('/css/frontend/common.css')}" rel="stylesheet" type="text/css">
<link href="{:asset('/css/frontend/classify.css')}" rel="stylesheet" type="text/css">
<link href="{:asset('/css/frontend/book_details.css')}" rel="stylesheet" type="text/css">
<style type="text/css">
    .bd_but_box {
        overflow: visible;
    }

    .bd_but_box a {
        display: inline-block;
        width: 1.5rem;
    }

    .bd_but_box a.js_add_shelfed {
        background: rgba(242, 242, 242, 1);
        color: rgba(214, 214, 214, 1);

    }

    .bd_but_box .add-icon {
        float: left;
        width: 10%;
        padding: 0.085rem 0.15rem 0 0.25rem;
    }

    .bd_but_box a.js_add_shelf {
        background: rgba(255, 255, 255, 1);
        box-shadow: 0px -2px 4px 0px rgba(0, 0, 0, 0.06);
        text-align: center;
        color: #E63B64;
    }

    .bd_but_box a.buts_2.js_add_shelf {
        background: rgba(255, 255, 255, 1);
        box-shadow: 0px -2px 4px 0px rgba(0, 0, 0, 0.06);
        text-align: center;
        color: #E63B64;
    }

    .bd_type .type_text.vip_cp_style {
        background: linear-gradient(180deg, rgba(255, 216, 135, 1) -11%, rgba(243, 224, 184, 1) 100%);
        color: #AC883B;
    }
</style>
{/block}
{block name="zepto"}
{block name="main"}
<!-- 这是正文  -->
<style>
    .bd_info_top{
        background: #fff;
    }
    .bd_head_info_txt h1{
        color:rgba(0,0,0,.8);
        margin-bottom: 0;
    }
    .bd_head_info_txt .bd_type{
        margin-top: .04rem;
        margin-bottom: .04rem;
    }
    .bd_info_top .bd_head_info_img,.bd_info_top .bd_head_info_img  img{
        width: .96rem;
        height: auto;
    }
    .cg_inro{
        height: .8rem;
        line-height: .2rem;
        text-overflow: -o-ellipsis-lastline;
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 4;
        line-clamp: 4;
        -webkit-box-orient: vertical;
    }
    .cg_share {
        margin-top: .3rem;

    }
    .cg_share h2{
        margin-bottom: .14rem;
        overflow: hidden;
        height: .26rem;
        font-family: 'PingFang-SC-Medium';
        font-weight: 600;
        font-size: .19rem;
        line-height: .26rem;
        padding-left: .15rem;
        color:rgba(0,0,0,.8);
    }
    .cg_share {
        border-bottom: 1px solid rgb(218, 215, 215);
        overflow:hidden;
    }

    .cg_share a {
        float: left;
        width: 50%;
        text-align: center;
        margin-bottom: .2rem;
        color:rgba(0,0,0,.8);
    }

    .cg_share a img {
        width: 25%;
        margin:0 auto;
        border-radius: 50%;
        font-size: 0;
    }

    .cg_share a p {
        margin-top: .06rem;
        font-size: .16rem;
        height: 0.2rem;
        line-height: .2rem;
        text-align: center;
    }
    .cg_send{
        padding-top: .16rem;
    }
    .cg_send h2 {
        margin-bottom: 0.14rem;
        overflow: hidden;
        height: 0.26rem;
        font-weight: 600;
        font-size: .19rem;
        line-height: .26rem;
        padding-left: .15rem;
        color: rgba(0, 0, 0, .8);
    }

    .cg_send .box {
        box-sizing: border-box;
        width: 96%;
        border:1px solid rgba(0, 0, 0, .3);
        margin: 0 auto;
        padding: 0 .066rem;
    }
    .cg_send .box h2{
        margin-bottom: .06rem;
        padding-left: 0;
        margin-top: 6px;
    }
    .cg_send .box h2.cg_rules{
        margin-top: 12px;
    }
    .cg_send .box h2 ul.u2{
        margin-top: .3rem;
    }
    .cg_send .box h2 ul li {
        font-size: .16rem;
        line-height: .2rem;
        color:rgba(0, 0, 0, .8);
        margin-bottom: .06rem;
    }

</style>

<div class="book_info">
    <div class="body_sytle">
        <div class="bd_head_box">

            <div class="bd_head_info">
                <div class="bd_info_top">
                    <div class="bd_head_info_img"><img src="{$book.image}"/></div>
                    <div class="bd_head_info_txt">
                        <h1>{$book.name}</h1>
                        <div class="bd_type">
                            <span class="type_text">{$book.category_text}</span>
                        </div>
                        <div class="cg_inro">{$book.description}</div>
                    </div>
                </div>

                <div class="cg_share">
                    <h2>一键分享赚钱</h2>

                    <a href="javascript:;" class="js_share_to_wx_session">
                        <img src="/assets/img/frontend/icon/shareToWxSession.jpeg" alt="">
                        <p>分享给好友</p>
                    </a>
                    <a href="javascript:;" class="js_share_to_wx_timeline">
                        <img src="/assets/img/frontend/icon/shareToWxTimeline.jpeg" alt="">
                        <p>分享朋友圈</p>
                    </a>
                </div>
                <div class="cg_send">
                    <h2>转发提示</h2>

                    <div class="box">
                        <h2>转发小技巧</h2>
                        <ul>
                            <li>1. 分享给喜欢读小说的朋友, 效果会更好;</li>
                            <li>2. 在茶余饭后分享, 涨粉更快;</li>
                            <li>3. 分享的时候加上一些自己的感受, 更容易让朋友来阅读.</li>
                        </ul>
                        <h2 class="cg_rules">转发规则</h2>
                        <ul class="u2">
                            <li>1. 本区分享产生的收益, 师父不享受徒弟20%提成和徒孙10%提成;</li>
                            <li>2. 本平台用户互相分享小说阅读不计费.</li>
                        </ul>
                    </div>
                </div>

            </div>

        </div>
        <input type="hidden" id="uid" value="{$uid}">
    </div>
</div>
{/block}

{block name="js"}
<script type="text/javascript">
    $(function () {
        var bookId = '{$book_id}';
        var title = '{$book.name}';
        var description = '{$book.description}';
        var image = '{$book.image}';
        var uid = '{$uid}';

        var getUrlParams = {
            uid: uid,
            xsid: bookId
        };

        $('.js_share_to_wx_session').click(function () {
            console.log('wx_session_click');
            $.get('https://kf.subno.cn/api/getShareUrl.php', getUrlParams, function (data) {
                var res = JSON.parse(data);
                // 分享到微信群
                $.post('https://kf.subno.cn/novel_share.php', {
                    n_id: bookId,
                    title: title,
                    abstract: description,
                    pic: image,
                    url: res.url,
                    scene: 1,
                    uid: uid
                }, function (result) {
                    var params = [res.url, title, description, image, 'cj'];
                    var strParams = params.join('||');
                    if (isIos()) {
                        nativeApp.newShareToWX(strParams);
                    } else {
                        nativeApp.shareToWXSession(strParams);
                    }
                });
            });


        });

        $('.js_share_to_wx_timeline').click(function () {
            console.log('wx_timeline_click');
            $.get('https://kf.subno.cn/api/getShareUrl.php', getUrlParams, function (data) {
                var res = JSON.parse(data);
                // 分享到微信群
                $.post('https://kf.subno.cn/novel_share.php', {
                    n_id: bookId,
                    title: title,
                    abstract: description,
                    pic: image,
                    url: res.url,
                    scene: 0,
                    uid: uid
                }, function (result) {
                    var params = [res.url, title, description, image, 'cj'];
                    var strParams = params.join('||');
                    if (isIos()) {
                        nativeApp.newShareToWX(strParams);
                    } else {
                        nativeApp.shareToWXTimeline(strParams);
                    }
                });
            });
        });

    });
</script>
{/block}