get_more_star.html 9.7 KB
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>明星访谈更多</title>
    <link rel="stylesheet" href="__TMPL__/public/assets/css/layui.css">
    <link rel="stylesheet" href="__TMPL__/public/assets/css/bootstrap4.0.css">
    <link rel="stylesheet" href="__TMPL__/public/assets/css/show.css">
</head>

<body>
    <!--头部-->
    <include file="public@header">
    <!-- main 背景 -->
    <div class="show_InMain show_3_Box">
        <!-- 明星访谈盒子 -->
        <div class="show_InMain_box">
            <!-- 顶部标题 -->
            <div class="show_INMain_tit clearfix">
                <div class="show_IN1 clearfix">
                    <img src="__TMPL__/public/assets/starImg/aicon_48.png" alt="">
                    <p>明星<span>访谈</span></p>
                    <h2>Star Interview</h2>
                </div>
                <!-- 更多 -->
                <!--<div class="show_IN2">-->
                    <!--<a href=""> MORE+ </a>-->
                <!--</div>-->
            </div>
            <!-- 内容--1 -->
            <notempty name="res['data'][0]">
                <a href="/portal/region/getStarDetail?id={$res['data'][0]['id']}">
                    <div class="show_INMain_con clearfix">
                        <img class="show_INMain_con1" src="{:cmf_get_image_url($res['data'][0]['avatar'])}" alt="">
                        <div class="show_INMain_con2 clearfix">
                            <img class="show_INMain_con3" src="__TMPL__/public/assets/starImg/aicon_32.png" alt="">
                            <h2>{$res['data'][0]['full_name']}</h2>
                            <h3>{$res['data'][0]['position']} {$res['data'][0]['trade']}</h3>
                            <p>{$res['data'][0]['post_excerpt']}</p>
                        </div>
                    </div>
                </a>
                <!--<else/>-->
                <!--<div class="show_INMain_con clearfix">-->
                    <!--<img class="show_INMain_con1" src="__TMPL__/public/assets/starImg/aicon_31.png" alt="">-->
                    <!--<div class="show_INMain_con2 clearfix">-->
                        <!--<img class="show_INMain_con3" src="__TMPL__/public/assets/starImg/aicon_32.png" alt="">-->
                        <!--<h2>胡歌</h2>-->
                        <!--<h3>著名国际巨星 慈善家</h3>-->
                        <!--<p>那年孩子们都上大学了,我孑然一身,几个老弟兄说出国走走看看,一个老嫂子会点外语,于是我们就自由行到了欧洲,法国,德国,意大利,几个国家转了一圈,外国的天气,气候真是清新,不去的时候不想,但是身临其境的时候就会感受到巨大的差异。巴黎车水马龙,意大利热情奔放,</p>-->
                    <!--</div>-->
                <!--</div>-->
            </notempty>
            <!-- 内容--2 -->
            <div class="show_3_list">
                <ul class="clearfix">
                    <notempty name="res['data'][1]">
                        <a href="/portal/region/getStarDetail?id={$res['data'][1]['id']}">
                            <li>
                                <img src="{:cmf_get_image_url($res['data'][1]['avatar'])}" alt="">
                                <div class="show_3_list_txt">
                                    <h1>{$res['data'][1]['full_name']}</h1>
                                    <h2>{$res['data'][1]['position']} {$res['data'][1]['trade']}</h2>
                                    <p>
                                        {$res['data'][1]['post_excerpt']}
                                    </p>
                                </div>
                            </li>
                        </a>
                    </notempty>
                    <notempty name="res['data'][2]">
                        <a href="/portal/region/getStarDetail?id={$res['data'][2]['id']}">
                            <li>
                                <img src="{:cmf_get_image_url($res['data'][2]['avatar'])}" alt="">
                                <div class="show_3_list_txt">
                                    <h1>{$res['data'][2]['full_name']}</h1>
                                    <h2>{$res['data'][2]['position']} {$res['data'][2]['trade']}</h2>
                                    <p>
                                        {$res['data'][2]['post_excerpt']}
                                    </p>
                                </div>
                            </li>
                        </a>
                    </notempty>
                    <notempty name="res['data'][3]">
                        <a href="/portal/region/getStarDetail?id={$res['data'][3]['id']}">
                            <li>
                                <img src="{:cmf_get_image_url($res['data'][3]['avatar'])}" alt="">
                                <div class="show_3_list_txt">
                                    <h1>{$res['data'][3]['full_name']}</h1>
                                    <h2>{$res['data'][3]['position']} {$res['data'][3]['trade']}</h2>
                                    <p>
                                        {$res['data'][3]['post_excerpt']}
                                    </p>
                                </div>
                            </li>
                        </a>
                    </notempty>
                </ul>
            </div>
            <!-- 内容--3 -->
            <notempty name="res['data'][4]">
                <a href="/portal/region/getStarDetail?id={$res['data'][4]['id']}">
                    <div class="show_INMain_con show_3_con3 clearfix">
                        <img class="show_INMain_con1" src="{:cmf_get_image_url($res['data'][4]['avatar'])}" alt="">
                        <div class="show_INMain_con2 clearfix">
                            <img class="show_INMain_con3" src="__TMPL__/public/assets/starImg/aicon_32.png" alt="">
                            <h2>{$res['data'][4]['full_name']}</h2>
                            <h3>{$res['data'][4]['position']} {$res['data'][4]['trade']}</h3>
                            <p>
                                {$res['data'][4]['post_excerpt']}
                            </p>
                        </div>
                    </div>
                </a>
            </notempty>

            <!--分页-->
            <div class="pagination">
                {$page|default=''}
            </div>

        </div>
        <!--<div id="page">-->

        <!--</div>-->
    </div>
    <!-- 底部 -->
    <include file="public@footer">
    <script src="__TMPL__/public/assets/js/jquery-3.2.1.min.js"></script>
    <script src="__TMPL__/public/assets/js/layui.js"></script>
    <script src="__TMPL__/public/assets/js/public.js"></script>
    <script>
        // page 分页
        $(function() {
            var dataObj = {
                dataList: [{
                    img: "__TMPL__/public/assets/starImg/bicon_24.png",
                    name: "121212",
                    name_tit: "按时大苏打啊实打",
                    content: "偶是女的芬兰首都基辅九分零四"
                }, {
                    img: "__TMPL__/public/assets/starImg/bicon_24.png",
                    name: "121212",
                    name_tit: "按时大苏打啊实打",
                    content: "偶是女的芬兰首都基辅九分零四"
                }, {
                    img: "__TMPL__/public/assets/starImg/bicon_24.png",
                    name: "121212",
                    name_tit: "按时大苏打啊实打",
                    content: "偶是女的芬兰首都基辅九分零四"
                }, {
                    img: "__TMPL__/public/assets/starImg/bicon_24.png",
                    name: "121212",
                    name_tit: "按时大苏打啊实打",
                    content: "偶是女的芬兰首都基辅九分零四"
                }, {
                    img: "__TMPL__/public/assets/starImg/bicon_24.png",
                    name: "121212",
                    name_tit: "按时大苏打啊实打",
                    content: "偶是女的芬兰首都基辅九分零四"
                }]
            }
            var  currPage = 1; // 当前页

            var  limit = 1; // 每页显示的条数

            var count = dataObj.dataList.length;
            console.log(count);

            layui.use('laypage', function() {
                var laypage = layui.laypage //分页
                    //执行一个laypage实例
                laypage.render({ //layui分页 
                    elem: 'page',
                      //分页容器id
                        count: count, //总条数
                      curr: currPage, //当前页
                      limit: limit, //每页的条数
                    //     limits: 1, //可选择每页数目
                      prev: "<", //上一页图标
                      next: ">", //下一页图标
                      theme: 'xxx', //分页主色
                    //   layout: ['count', 'prev', 'page', 'next', 'limit', 'skip'], //设置分页组件显示
                        jump: function(obj, first) {        
                        if (!first) { //设置首次渲染分页无需走业务逻辑处理函数,不然会陷入死循环
                            console.log(obj);
                            currPage = obj.curr; 
                            console.log(currPage)       
                            limit = obj.limit;              
                        }          
                    }    
                })
            })
        });
    </script>
</body>

</html>