public/themes/simpleboot3/portal/region/index.html

<!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/js/swiper4/swiper.min.css">
    <link rel="stylesheet" href="__TMPL__/public/assets/css/show.css">
    <style>
        .slide-image{
            width:260px;
            height:375px;
        }
        .show_INMain_con5_2 p, .show_INMain_con6_1 p {
            height: 45px;
        }
    </style>
</head>

<body>
    <!--头部-->
    <include file="public@header"/>
    <div class="show_index">
        <!-- banner视频 -->
        <div class="show_index_banner">
            <notempty name="res_xqyy">
                <video id="video" autoplay="autoplay" controls width="100%" height="660" src="{:cmf_get_file_download_url($res_xqyy.video)}"></video>
                <else/>
                <video id="video" autoplay="autoplay" controls width="100%" height="660" src="__TMPL__/public/assets/starImg/video.mp4"></video>
            </notempty>
            <!-- poster="__TMPL__/public/assets/starImg/aicon_01.png" -->
            <!-- <img onclick="bofang()" class="show_in_banner2" src="__TMPL__/public/assets/starImg/aicon_30.png" alt=""> -->
        </div>

        <!-- main 背景 -->
        <div class="show_InMain">
            <!-- 明星访谈盒子 -->
            <div class="show_InMain_box">
                <!-- 顶部标题 -->
                <div class="show_INMain_tit clearfix" id="star_interview">
                    <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="/portal/region/getMoreStar"> MORE+ </a>
                    </div>
                </div>
                <!-- 内容 -->
                <div class="show_INMain_con clearfix">
                    <a href="/portal/region/getStarDetail?id={$res_mxft.id}">
                        <img class="show_INMain_con1" src="{:cmf_get_image_url($res_mxft.avatar)}" alt="">
                        <div class="show_INMain_con2 clearfix">
                            <img class="show_INMain_con3" src="__TMPL__/public/assets/starImg/aicon_32.png" alt="">
                            <h2>{$res_mxft.full_name}</h2>
                            <h3>{$res_mxft.position} {$res_mxft.trade}</h3>
                            <p>{$res_mxft.post_excerpt}</p>
                        </div>
                    </a>
                </div>
            </div>
            <!-- 星球故事盒子 -->
            <div class="show_InMain_box show_InMain_box2">
                <!-- 顶部标题 -->
                <div class="show_INMain_tit clearfix" id="story">
                    <div class="show_IN1 clearfix">
                        <img src="__TMPL__/public/assets/starImg/aicon_03.png" alt="">
                        <p>星球<span>故事</span></p>
                        <h2>Planet Story</h2>
                    </div>
                    <!-- 更多 -->
                    <div class="show_IN2">
                        <a href="/portal/region/getMoreStory"> MORE+ </a>
                    </div>
                </div>
                <!-- 内容 -->
                <div class="show_INMain_con2_2 swiper-container2">
                    <div class="swiper-wrapper">
                        <volist name="res_xqgs" id="vo">
                            <div class="swiper-slide">
                                <div class="show_index_con2Txt clearfix">
                                    <a href="/portal/star/getStoryDetail?id={$vo.id}">
                                        <!-- 左侧图片 -->
                                        <img class="show_indexImg1" src="{:cmf_get_image_url($vo.thumbnail)}" alt="">
                                    </a>
                                    <!-- 文字 -->
                                    <div class="show_index_con2Txt2">
                                        {$vo.excerpt}
                                    </div>
                                    <!-- 进度条 -->
                                    <div class="show_index_progress">
                                        <img src="__TMPL__/public/assets/starImg/aicon_15.png" alt="">
                                    </div>
                                </div>
                            </div>
                        </volist>
                    </div>
                    <div class="show_swiper2_btn clearfix">
                        <div class="show_swiper2_btn22">
                            <div class="swiper-button-prev2"></div>
                            <div class="swiper-pagination">
                            </div>
                            <div class="swiper-button-next2"></div>

                        </div>

                    </div>

                </div>
            </div>
        </div>
        <!-- 星球画廊盒子 -->
        <div class="show_InMain_box show_InMain_box3">
            <!-- 顶部标题 -->
            <div class="show_INMain_tit clearfix" id="gallery">
                <div class="show_IN1 clearfix">
                    <img src="__TMPL__/public/assets/starImg/aicon_50.png" alt="">
                    <p>星球<span>画廊</span></p>
                    <h2>Star Gallery</h2>
                </div>
                <!-- 更多 -->
                <div class="show_IN2">
                    <a href="/portal/region/getMoreGallery"> MORE+ </a>
                </div>
            </div>
            <!-- 内容 -->
            <div class="show_INMain_con3_3 swiper-container">
                <ul class="swiper-wrapper">
                    <volist name="res_xyhl" id="vo">
                        <li class="swiper-slide">
                            <a href="/portal/region/getGalleryDetail?id={$vo.id}">
                            <img class="swiper-slide slide-image" src="{:cmf_get_image_url($vo.thumbnail)}" alt="">
                            </a>
                        </li>
                    </volist>
                </ul>
                <div class="swiper-button-next">

                </div>
                <div class="swiper-button-prev ">

                </div>
            </div>
        </div>
        <!-- 独角快报 -->
        <div class="show_InMain2">
            <div class="show_InMain_box4">
                <!-- 顶部标题 -->
                <div class="show_INMain_tit clearfix" id="news">
                    <div class="show_IN1 clearfix">
                        <img src="__TMPL__/public/assets/starImg/aicon_51.png" alt="" style="margin-top:5px;width: 30px;">
                        <p>独角<span>快报</span></p>
                        <h2>Planet Express</h2>
                    </div>
                    <!-- 更多 -->
                    <div class="show_IN2">
                        <a href="/portal/region/getMoreNews"> MORE+ </a>
                    </div>
                </div>
                <!-- 内容 -->
                <div class="show_INMain_con4">
                    <ul>
                        <volist name="res_djkb" id="vo">
                            <li class="clearfix">
                                <a href="/portal/region/getNewsDetail?id={$vo.id}">
                                    <img src="{:cmf_get_image_url($vo.thumbnail)}" alt="">
                                    <div class="show_INMain_con4_txt">
                                        <h2>{$vo.post_title}</h2>
                                        <p>
                                            {$vo.post_excerpt}
                                        </p>
                                        <span>{$vo.create_time|date="Y-m-d",###}</span>
                                    </div>
                                </a>
                            </li>
                        </volist>
                    </ul>
                </div>
            </div>
        </div>
        <!-- 独角日志 -->
        <div class="show_InMain_box show_InMain_box5">
            <!-- 顶部标题 -->
            <div class="show_INMain_tit clearfix" id="note">
                <div class="show_IN1 clearfix">
                    <img src="__TMPL__/public/assets/starImg/aicon_52.png" alt="" style="margin-top:3px;width: 28px;">
                    <p>独角<span>日志</span></p>
                    <h2>Neo Blog</h2>
                </div>
            </div>
            <!-- 内容 -->
            <div class="show_INMain_con5">
                <ul class="clearfix">
                    <volist name="res_djrz" id="vo">
                        <li>
                            <a href="/portal/region/getNoteDetail?id={$vo.id}">
                                <div class="show_INMain_con5_1">
                                    <img src="{:cmf_get_image_url($vo.thumbnail)}" alt="">
                                </div>
                                <div class="show_INMain_con5_2">
                                    <h1>{$vo.post_title}</h1>
                                    <p>
                                        {$vo.post_excerpt}
                                    </p>
                                    <img src="{:cmf_get_image_url($vo.avatar)}" alt="">
                                </div>
                            </a>
                        </li>
                    </volist>
                </ul>
            </div>
        </div>
        <!-- 公益未来 -->
        <div class="show_InMain_box show_InMain_box6">
            <!-- 顶部标题 -->
            <div class="show_INMain_tit clearfix" id="future">
                <div class="show_IN1 clearfix">
                    <img src="__TMPL__/public/assets/starImg/aicon_53.png" alt="" style="margin-top:5px;width:37px;">
                    <p>公益<span>未来</span></p>
                    <h2>Commonweal & Future</h2>
                </div>
            </div>
            <!-- 内容 -->
            <div class="show_INMain_con6">
                <ul class="clearfix">
                    <volist name="res_tqwl" id="vo">
                        <li>
                            <a href="/portal/region/getFutureDetail?id={$vo.id}">
                                <img src="{:cmf_get_image_url($vo.thumbnail)}" alt="">
                                <div class="show_INMain_con6_1">
                                    <h1>{$vo.post_title}</h1>
                                    <p>{$vo.post_excerpt}</p>
                                </div>
                            </a>
                        </li>
                    </volist>
                </ul>
            </div>
        </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/swiper4/swiper.min.js"></script>
    <script src="__TMPL__/public/assets/js/public.js"></script>
    <script>
        // 星球画廊swiper
        var swiper = new Swiper('.swiper-container', {
            slidesPerView: 4,
            spaceBetween: 53,

            navigation: {
                nextEl: '.swiper-button-next',
                prevEl: '.swiper-button-prev',
            },
        });
        // 星球故事swiper
        var swiper = new Swiper('.swiper-container2', {
            slidesPerView: 1,
            spaceBetween: 30,
            // loop: true,
            pagination: {
                el: '.swiper-pagination',
                clickable: true,
            },
            navigation: {
                nextEl: '.swiper-button-next2',
                prevEl: '.swiper-button-prev2',
            },
        });

        // banner视频
        // var video = document.getElementById("video");
        // function bofang() {
        //     video.play();
        //     $('#video').attr('controls', 'controls')
        //     $('.show_in_banner2').hide();
        // }
    </script>
</body>

</html>