baseXX/application/wap/view/first/index/index.html

{extend name="public/container"}
{block name="title"}{$title}{/block}
{block name='head_top'}
<script src="{__WAP_PATH}zsff/js/jquery.cookie.js"></script>
<style>
    body {
        background-color: #f5f5f5;
    }

    .thematic-details,
    .banner,
    .nav {
        background-color: #fff;
    }

    .thematic-details {
        position: fixed;
        top: 0;
        left: 0;
        z-index: 9;
        width: 100%;
        height: .8rem;
        background-color: rgba(0, 0, 0, .32);
    }

    .index .studyCourse .title .more {
        font-size: 0.25rem;
        color: #999;
        display: inherit;
    }

    .index .studyCourse .title .titleCon {
        width: 4rem;
    }

    .free {
        font-weight: 400;
        font-size: .24rem;
        color: #ffba25;
    }

    .news {
        display: -webkit-flex;
        display: flex;
        -webkit-align-items: center;
        align-items: center;
        padding: .24rem .2rem;
        background-color: #fff;
        margin-top: 0.14rem;
    }

    .news .pictrue {
        width: 1.24rem;
        margin-right: .2rem;
    }

    .news .pictrue img {
        display: block;
        width: 100%;
    }

    .news .swiper-container {
        -webkit-flex: 1;
        flex: 1;
        height: .4rem;
    }

    .news .swiper-slide a {
        display: block;
        height: .4rem;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
        font-weight: 400;
        font-size: .28rem;
        line-height: .4rem;
    }

    .teacher {
      margin-top: .14rem;
      background-color: #fff;
    }

    .teacher .teacher-hd {
      display: -webkit-box;
      display: -webkit-flex;
      display: flex;
      -webkit-box-align: center;
      -webkit-align-items: center;
      align-items: center;
      padding: .3rem .2rem 0;
    }

    .teacher .teacher-hd .name {
      -webkit-box-flex: 1;
      -webkit-flex: 1;
      flex: 1;
        font-weight: bold;
      font-size: .32rem;
      color: #333;
    }

    .teacher .teacher-hd .link {
      font-size: .22rem;
      color: #999999;
    }

    .teacher .teacher-hd .knowledge {
      font-size: .22rem;
    }

    .teacher .swiper-slide {
      width: 2.7rem;
      height: 3.2rem;
      border-radius: .1rem;
      margin: .3rem 0 .4rem;
        background-color: #f9fafc;
    }

    .teacher .swiper-slide .link {
      display: -webkit-box;
      display: -webkit-flex;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -webkit-flex-direction: column;
      flex-direction: column;
      -webkit-box-pack: center;
      -webkit-justify-content: center;
      justify-content: center;
      -webkit-box-align: center;
      -webkit-align-items: center;
      align-items: center;
      height: 100%;
    }

    .teacher .swiper-slide .img {
      width: 1.3rem;
      height: 1.3rem;
      border-radius: 50%;
      object-fit: cover;
    }

    .teacher .swiper-slide .name {
      width: 100%;
      padding: 0 .27rem;
      margin-top: .17rem;
      overflow: hidden;
      white-space: nowrap;
      text-overflow: ellipsis;
      font-size: .3rem;
      line-height: .42rem;
      text-align: center;
      color: #282828;
    }

    .teacher .swiper-slide .info {
      display: -webkit-box;
      -webkit-box-orient: vertical;
      -webkit-line-clamp: 2;
      width: 100%;
      padding: 0 .27rem;
      margin-top: .12rem;
      overflow: hidden;
      font-size: .24rem;
      text-align: center;
      color: #999;
    }

    .teacher .swiper-slide .label {
        width: 100%;
        padding: 0 .27rem;
        margin-top: .12rem;
        text-align: center;
    }

    .teacher .swiper-slide .label .cell {
        display: inline-block;
        height: .34rem;
        padding: 0 .12rem;
        border-radius: .04rem;
        background-color: #fff7e6;
        vertical-align: middle;
        font-size: .22rem;
        line-height: .34rem;
        color: #feb720;
    }

    .teacher .swiper-slide .explain {
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        overflow: hidden;
        padding: 0 .33rem;
        margin-top: .1rem;
        font-size: .26rem;
        line-height: .4rem;
        text-align: center;
        color: #999;
    }
</style>
{/block}
{block name="content"}
<div v-cloak id="app" class="indexNew">
    <!--关注-->
    {if !$subscribe}
    <div class="thematic-details" v-if="topFocus">
        <div class="follow acea-row row-between-wrapper">
            <div>点击“立即关注”即可关注公众号</div>
            <div>
                <span class="followBnt" @click=" is_code = true">立即关注</span>
                <span class="iconfont iconguanbi2" @click="topFocus = false"></span>
            </div>
        </div>
    </div>
    {/if}
    <!--搜索-->
    <div class="header">
        <a class="search acea-row row-center-wrapper" href="{:Url('search')}"><span
                class="iconfont icon-sousuo"></span>输入你想要找的课程名称</a>
    </div>
    <!--幻灯片-->
    <div class="banner">
        <div id="carousel" class="swiper-container" style="width: 7.1rem;border-radius: .2rem;">
            <div class="swiper-wrapper">
                <div v-for="(item, index) in swiperlist" :key="index" class="swiper-slide">
                    <img :src="item.pic" :data-url="item.url" style="width: 100%;height: 100%;border-radius: .2rem;object-fit: cover;" />
                </div>
            </div>
            <!-- 如果需要分页器 -->
            <div id="carousel-pagination" class="swiper-pagination"></div>
        </div>
    </div>
    <!--导航-->
    <div class="nav acea-row" v-cloak="">
        <a class="item" v-for="(item,index) in navList" :href="getNavHref(item,1)">
            <div class="pictrue"><img :src="item.icon"></div>
            <div class="text">{{item.title}}</div>
        </a>
    </div>
    <!-- 新闻 -->
    <div v-if="newsList.length" class="news">
        <div class="pictrue"><img src="{__WAP_PATH}zsff/images/news.png" /></div>
        <div id="news" class="swiper-container">
            <div class="swiper-wrapper">
                <div v-for="(item, index) in newsList" :key="index" class="swiper-slide">
                    <a :href="$h.U({c:'article', a:'unified_list'})">{{ item.title }}</a>
                </div>
            </div>
        </div>
    </div>
    <!--活动区域-->
    <div class="activity acea-row row-between" v-if="activity.length || activityOne.id">
        <a class="left" :href="activityOne.wap_link">
            <div class="title line1" v-text="activityOne.title"></div>
            <div class="info line1" v-text="activityOne.info"></div>
            <div class="pictrue"><img :src="activityOne.pic"></div>
        </a>
        <div class="right" v-if="activity.length">
            <a class="item acea-row row-middle" v-for="item in activity" :href="item.wap_link">
                <div class="text">
                    <div class="title line1" v-text="item.title"></div>
                    <div class="info line1" v-text="item.info">考研强助力</div>
                </div>
                <div class="pictrue"><img :src="item.pic"></div>
            </a>
        </div>
    </div>
    <!-- 自定义排版 -->
    <template v-if="recommend.length">
        <template v-for="(item, index) in recommend">
            <!--直播-->
            <div class="broadcast" v-if="item.type === 5 && item.list.length">
                <div class="public_title acea-row row-between-wrapper">
                    <div class="name">热门直播</div>
                </div>
                <div class="swiper-container swiperScroll">
                    <div class="swiper-wrapper">
                        <a class="swiper-slide item" v-for="itm in item.list" :href="getDetails(2,itm.id)">
                            <div class="pictrue">
                                <img :src="itm.image">
                                <div class="state acea-row row-center-wrapper" v-if="itm.status == 1">
                                    <img src="/wap/first/zsff/images/live01.png">
                                    <div class="stateTxt">直播中</div>
                                </div>
                                <div class="state return acea-row row-center-wrapper" v-else-if="itm.status == 2">
                                    <img src="/wap/first/zsff/images/returnVisit.png">
                                    <div class="stateTxt">回放</div>
                                </div>
                                <div class="state make acea-row row-center-wrapper" v-else-if="itm.status == 3">
                                    <img src="/wap/first/zsff/images/live_time.png">
                                    <div class="stateTxt">直播时间 {{itm.start_play_time}}</div>
                                </div>
                            </div>
                            <div class="text">
                                <div class="name line1" v-text="itm.title"></div>
                                <div class="info"><span class="red">{{itm.records}}</span>人正在学习</div>
                            </div>
                        </a>
                    </div>
                </div>
            </div>
            <!-- 推荐讲师 -->
            <div v-if="item.type === 6 && item.list.length" class="teacher">
                <div class="teacher-hd">
                <div class="name">推荐讲师</div>
                    <a  class="link" href="{:url('wap/special/teacher_list')}">查看更多<span class="knowledge iconxiangyou"></span></a>
                </div>
                <div id="teacher" class="swiper-container">
                <div class="swiper-wrapper">
                    <div v-for="(itm, index) in item.list" :key="index" class="swiper-slide">
                        <a class="link" :href="$h.U({c:'special',a:'teacher_detail'})+'?id=' + itm.id">
                            <img class="img" :src="itm.lecturer_head">
                            <div class="name">{{itm.lecturer_name}}</div>
                            <div v-if="itm.label.length" class="label">
                                <template v-for="(itms, idx) in itm.label">
                                <div v-if="!idx" :key="idx" class="cell">{{itms}}</div>
                                </template>
                            </div>
                            <div class="explain">{{itm.explain}}</div>
                        </a>
                    </div>
                </div>
                </div>
            </div>
            <!-- 线下活动 -->
            <div class="essential activity-offline" v-if="item.type === 7 && item.list.length">
                <div class="public_title acea-row row-between-wrapper">
                    <div class="name">线下活动</div>
                    <a class="more acea-row row-middle" :href="getActivityHref()">查看更多<span class="knowledge iconxiangyou"></span></a>
                </div>
                <div class="list">
                    <a class="item" v-for="itm in item.list" :href="activityDetails(itm.id)">
                        <div class="pictrue">
                            <img :src="itm.image">
                        </div>
                        <div class="text">
                            <div class="title acea-row row-middle">
                                <div class="name line1" v-text="itm.title"></div>
                            </div>
                            <div class="info">
                                <div><span class="knowledge icondidian"></span>{{ itm.province }}{{ itm.city }}{{ itm.district }}{{ itm.detail }}</div>
                                <div><span class="knowledge iconshijian2"></span>{{ itm.time }}</div>
                            </div>
                        </div>
                    </a>
                </div>
            </div>
            <!-- 左右切换 -->
            <div v-if="item.typesetting == 4 && item.list.length" :key="index" class="curriculum">
                <div class="public_title acea-row row-between-wrapper">
                    <div class="name" v-text="item.title"></div>
                    <a class="more acea-row row-middle" :href="getNavHref(item)">查看更多<span
                        class="knowledge iconxiangyou"></span></a>
                </div>
                <div class="swiper-container" :class="'swiper-course-'+index" :data-index="index">
                    <div class="swiper-wrapper">
                        <div class="swiper-slide" v-for="(vv,inx) in item.data">
                            <div class="public_list">
                                <a class="item acea-row" v-for="val in vv.value"
                                    :href="getDetails(item.type,val.link_id)">
                                    <div class="pictrue">
                                        <img :src="val.image">
                                    </div>
                                    <div class="text">
                                        <div class="title acea-row row-middle">
                                            <div class="name line1">{{val.title}}</div>
                                        </div>
                                        <div class="labelList">
                                            <span class="labelItem" v-for="label in val.label">{{label}}</span>
                                        </div>
                                        <div class="acea-row row-between-wrapper">
                                            <div>
                                                <div class="free" v-if="val.pay_type == 0 || val.pay_type == 2">免费</div>
                                                <div class="money" v-if="val.pay_type == 1 && val.is_pink == 0">￥<span>{{val.money}}</span></div>
                                                <div class="money" v-if="val.pay_type == 1 && val.is_pink > 0">￥<span>{{val.pink_money}}</span></div>
                                                <!--<div class="money" v-if="item.type==0">￥<span>{{val.money}}</span></div>-->
                                                <!--<div class="money" v-if="item.type==4">￥<span>{{val.money}}</span></div>-->
                                            </div>
                                            <div class="total" v-if="val.special_type!=4 && item.type==0">共{{ val.count }}节</div>
                                            <!--<div class="num acea-row row-center-wrapper" v-if="item.type==0">-->
                                                <!--{{val.browse_count >= 1000 ? '1000+' :  val.browse_count}}人已学习</div>-->
                                            <!--<div class="num acea-row row-center-wrapper" v-if="item.type==4">-->
                                                <!--已售{{ val.count }}件</div>-->
                                        </div>
                                    </div>
                                </a>
                            </div>
                        </div>
                    </div>
                    <div v-if="item.data.length > 1" class="swiper-pagination"></div>
                </div>
            </div>
            <!-- 大图 -->
            <div v-if="item.typesetting == 1 && item.list.length" :key="index" class="essential">
                <div class="public_title acea-row row-between-wrapper">
                    <div class="name" v-text="item.title"></div>
                    <a class="more acea-row row-middle" :href="getNavHref(item)">查看更多<span
                            class="knowledge iconxiangyou"></span></a>
                </div>
                <div class="list">
                    <a class="item" v-for="val in item.list" :href="getDetails(item.type,val.link_id)">
                        <div class="pictrue"><img :src="val.image">
                            <div class="label">{{val.special_type_name}}</div>
                        </div>
                        <div class="text">
                            <div class="title acea-row row-middle">
                                <div class="name line1" v-text="val.title"></div>
                            </div>
                            <div class="info acea-row row-between-wrapper">
                                <div class="labelList">
                                    <span class="labelItem" v-for="label in val.label">{{label}}</span>
                                </div>
                                <div>
                                    <div class="free" v-if="val.pay_type == 0 || val.pay_type == 2">免费</div>
                                    <div class="money" v-if="val.pay_type == 1 && val.is_pink == 0">￥<span>{{val.money}}</span></div>
                                    <div class="money" v-if="val.pay_type == 1 && val.is_pink > 0">￥<span>{{val.pink_money}}</span></div>
                                    <!--<div class="money" v-if="val.money > 0 && val.pay_type == 1 && item.type==0">-->
                                        <!--<span class="yen">￥</span>{{val.money}}-->
                                    <!--</div>-->
                                    <!--<div class="money" v-else-if="val.money > 0 && item.type==4">-->
                                        <!--<span class="yen">￥</span>{{val.money}}-->
                                    <!--</div>-->
                                    <!--<div class="free" v-else-if="item.type==0">免费</div>-->
                                    <div class="total" v-if="val.special_type!=4 && item.type==0">共{{ val.count }}节</div>
                                    <div class="total" v-else-if="item.type==4">已售{{ val.count }}件</div>
                                </div>
                            </div>
                        </div>
                    </a>
                </div>
            </div>
            <!-- 小图 -->
            <div v-if="item.typesetting == 3 && item.list.length" :key="index" class="interest">
                <div class="public_title acea-row row-between-wrapper">
                    <div class="name" v-text="item.title"></div>
                    <a class="more acea-row row-middle" :href="getNavHref(item)">查看更多<span
                            class="knowledge iconxiangyou"></span></a>
                </div>
                <div class="public_list">
                    <a class="item acea-row" v-for="val in item.list"
                        :href="getDetails(item.type,val.link_id)">
                        <div class="pictrue">
                            <img :src="val.image">
                            <div class="label">{{val.special_type_name}}</div>
                        </div>
                        <div class="text">
                            <div class="title acea-row row-middle">
                                <div class="name line1" v-text="val.title"></div>
                            </div>
                            <div class="labelList" style="height:.4rem;line-height:.4rem;">
                                <span class="labelItem" v-for="label in val.label">{{label}}</span>
                            </div>
                            <div class="acea-row row-middle row-between" style="height:.45rem;" v-if="item.type==0">
                                <div>
                                    <div class="free" v-if="val.pay_type == 0 || val.pay_type == 2">免费</div>
                                    <div class="money" v-if="val.pay_type == 1 && val.is_pink == 0">￥<span>{{val.money}}</span></div>
                                    <div class="money" v-if="val.pay_type == 1 && val.is_pink > 0">￥<span>{{val.pink_money}}</span></div>
                                </div>
                                <div class="total" v-if="val.special_type!=4">共{{ val.count }}节</div>
                                <!--<div class="num">{{val.browse_count >= 1000 ? '1000+' :  val.browse_count}}人已学习</div>-->
                            </div>
                            <div class="acea-row row-middle row-between" style="height:.45rem;" v-if="item.type==4">
                                <div>
                                    <div class="money" v-if="val.money > 0">￥<span>{{val.money}}</span></div>
                                    <div class="free" v-else>免费</div>
                                </div>
                                <!--<div class="num">已售{{ val.count }}件</div>-->
                            </div>
                        </div>
                    </a>
                </div>
            </div>
            <!-- 宫图 -->
            <div v-if="item.typesetting == 2 && item.list.length" :key="index" class="interest english">
                <div class="public_title acea-row row-between-wrapper">
                    <div class="name" v-text="item.title"></div>
                    <a class="more acea-row row-middle" :href="getNavHref(item)">查看更多<span
                            class="knowledge iconxiangyou"></span></a>
                </div>
                <div class="list acea-row row-between-wrapper">
                    <a class="item" v-for="val in item.list" :href="getDetails(item.type,val.link_id)">
                        <div class="pictrue"><img :src="val.image"></div>
                        <div class="text">
                            <div class="title acea-row row-middle">
                                <div class="name line1" v-text="val.title"></div>
                            </div>
                            <div class="label acea-row row-middle">
                                <span class="cell" v-for="label in val.label">{{label}}</span>
                            </div>
                            <div class="group acea-row row-middle" v-if="item.type==0">
                                <div class="free" v-if="val.pay_type == 0 || val.pay_type == 2">免费</div>
                                <div class="money" v-if="val.pay_type == 1 && val.is_pink == 0">
                                    ￥<span class="num">{{val.money}}</span>
                                </div>
                                <div class="money" v-if="val.pay_type == 1 && val.is_pink > 0">
                                    ￥<span class="num">{{val.pink_money}}</span>
                                </div>
                                <div class="total" v-if="val.special_type!=4">共{{ val.count }}节</div>
                            </div>
                            <div class="group acea-row row-middle" v-if="item.type==4">
                                <div class="free" v-if="val.money==0">免费</div>
                                <div class="money" v-if="val.money > 0">
                                    ￥<span class="num">{{val.money}}</span>
                                </div>
                                <div class="total" >已售{{ val.count }}件</div>
                            </div>
                        </div>
                    </a>
                </div>
            </div>
        </template>
    </template>
    <p class="loading-line">
        <span v-show="loading==true" class="fa fa-spinner loadingpic" style="font-size: 0.4rem"></span>
    </p>
    <!--关注二维码-->
    {if !$subscribe}
    <div class="mask" style="align-items:center;display: flex;" v-show="is_code" @click="is_code=false" v-cloak="">
        <img src="{$code_url}" alt="" style="width: 5rem;height: 5rem;margin: 0 auto;">
    </div>
    {/if}
    <div class="masks" style="align-items:center;display: flex;" v-show="is_live_one"   v-cloak="">
        <div class="liveone" >
            <img src="{__WAP_PATH}zsff/images/close1.png" class="close" alt="" @click="clickLive(0,liveOne.id)">
            <img :src="liveOne.image" alt="" style="width: 100%;margin: 0 auto;">
            <div class="btn" @click="clickLive(1,liveOne.id)">看直播</div>
        </div>
    </div>
    <div style="height: 1.0rem"></div>
    {include file="public/store_menu"}
</div>

<script type="text/javascript">
    var banner = {$banner}, activity = {$activity}, liveOne={$liveOne};
    require(['vue', 'helper', 'store'], function (Vue, $h, storeApi) {
        new Vue({
            el: '#app',
            data: {
                liveOne: liveOne ? liveOne : {},
                swiperlist: banner,
                recommend: [],
                navList: [],
                loading: false,
                loadTitle: '',
                loadend: false,
                page: 1,
                limit: 10,
                is_code: false,
                activity: activity,
                activityOne: {},
                is_live_one: false,
                newsList: [],
                topFocus: true
            },
            created: function () {
                this.getNewsList();
            },
            mounted: function () {
                var that = this;
                var live_one = $.cookie('live_one');
                if (live_one != undefined && live_one != null) live_one = JSON.parse(live_one);
                if ($.isEmptyObject(that.liveOne) == true) {
                    $.cookie('live_one', null);
                    that.is_live_one = false;
                } else {
                    if (live_one == undefined && live_one == null) { that.is_live_one = true; }
                    else if (live_one.is_lives && live_one.id == that.liveOne.id) { that.is_live_one = false; }
                    else if (live_one.id != that.liveOne.id) { that.is_live_one = true; }
                    else { that.is_live_one = false; }
                }
                that.$nextTick(function () {
                    new Swiper('#carousel', {
                        speed: 1000,
                        autoplay: 2500,
                        spaceBetween: 20,
                        autoplayDisableOnInteraction: false,
                        pagination: '#carousel-pagination',
                        paginationClickable: true,
                        loop: true,
                        observer: true,
                        observeParents: true,
                        onInit: function (swiper) {
                            if (swiper.slides.length <= 3) {
                                swiper.lockSwipes();
                            }
                        },
                        onClick: function (swiper, event) {
                            var url = event.target.dataset.url;
                            if (url && url != '#') {
                                location.href = url;
                            }
                        }
                    });
                });
                if (this.activity.length) {
                    var activityOne = this.activity.shift();
                    that.$set(that, "activityOne", activityOne);
                }
                this.get_content_recommend();
                this.get_recommend();
            },
            methods: {
                // 获取新闻列表
                getNewsList: function () {
                    var that = this;
                    storeApi.baseGet($h.U({ c: 'article', a: 'get_unifiend_list' }), function (res) {
                        that.newsList = res.data.data;
                        that.$nextTick(function () {
                            new Swiper('#news', {
                                direction: "vertical",
                                speed: 1000,
                                autoplay: 2500,
                                loop: true,
                                observer: true,
                                observeParents: true,
                                autoplayDisableOnInteraction: false
                            });
                        });
                    }, function (err) {
                        $h.pushMsgOnce('获取失败');
                    });
                },
                clickLive:function(type,id){
                    this.is_live_one=false;
                    var data={};
                    data.is_lives=1;
                    data.id=id;
                    $.cookie('live_one', JSON.stringify(data), { expires: 1 });
                    if(type){
                        window.location.href=$h.U({c: 'special', a: 'details', q: {id: id}});
                    }
                },
                activityDetails:function(id){
                    return $h.U({c: 'special', a: 'activity_details', q: {id: id}});
                },
                getDetails: function (type, id) {
                    switch (type) {
                            case 0:
                            case 2:
                                return $h.U({c: 'special', a: 'details', q: {id: id}});
                                break;
                            case 1:
                                return $h.U({c: 'article', a: 'details', q: {id: id}});
                                break;
                            case 4:
                                return $h.U({c: 'store', a: 'detail', q: {id: id}});
                                break;
                    }
                },
                getNavHref: function (item, bo) {
                    if (item.type == 3) {
                        return item.link;
                    }else if (item.type == 4) {
                        return $h.U({ c: 'store', a: 'index'});
                    } else {
                        if (bo) {
                            return $h.U({ c: 'special', a: 'special_cate', q: { cate_id: item.grade_id } });
                        }
                        return $h.U({
                            c: 'index',
                            a: 'unified_list',
                            q: { type: item.type, title: item.title, recommend_id: item.id }
                        });
                    }
                },
                getActivityHref:function(){
                    return $h.U({
                        c: 'activity',
                        a: 'index'
                    });
                },
                get_recommend: function () {
                    storeApi.baseGet($h.U({ c: 'index', a: 'get_recommend' }), function (res) {
                        this.$set(this, 'navList', res.data.data);
                    }.bind(this))
                },
                initSwiper: function () {
                    var that = this;
                    this.$nextTick(function () {
                        var swiperScroll = new Swiper('.swiperScroll', {
                            freeMode: true,
                            freeModeMomentum: true,
                            slidesPerView: "auto",
                            observer: true,
                            observeParents: true
                        });
                        for (var index in that.recommend) {
                            if (that.recommend[index].typesetting == 4 && that.recommend[index].list.length) {
                                var className = '.swiper-course-' + index;
                                new Swiper(className, {
                                    pagination: '.swiper-pagination',
                                    speed: 1000,
                                    watchOverflow: true,
                                    paginationClickable: false,
                                    autoplayDisableOnInteraction: false,
                                    onSlideChangeStart: function (swiper) {
                                        var inx = $(className).data('index');
                                        that.$set(that.recommend[inx], 'courseIndex', swiper.activeIndex + 1);
                                    }
                                });
                            }
                        }
                    })
                },
                get_content_recommend: function () {
                    if (this.loading) return;
                    if (this.loadend) return;
                    this.loadTitle = '';
                    this.loading = true;
                    storeApi.baseGet($h.U({
                        c: 'index',
                        a: 'get_content_recommend',
                        q: { page: this.page, limit: this.limit }
                    }), function (res) {
                        var list = res.data.data.recommend;
                        var recommend = $h.SplitArray(list, this.recommend);
                        this.loading = false;
                        this.page = res.data.data.page;
                        this.loadend = list.length < this.limit;
                        this.loadTitle = this.loadend ? '我是有底线的' : '上拉加载更多';
                        this.$set(this, 'recommend', recommend);
                        this.initSwiper();
                        this.$nextTick(function () {
                            new Swiper('#teacher', {
                                slidesPerView: 'auto',
                                spaceBetween: 10,
                                slidesOffsetBefore: 10,
                                slidesOffsetAfter: 10,
                                observer: true,
                                observeParents: true
                            });
                        });
                    }.bind(this), function (res) {
                        this.loadTitle = '加载更多';
                        this.loading = false;
                    }.bind(this));
                }
            }
        });
    })
</script>
{/block}