JenkinsTest/page/zt/schedule.vue

<style lang="sass">
@import "./scss/schedule.scss";
</style>

<template>
    <div class="page-video-schedule">
        <section class="schedule-hd">
            <ul class="hd-row1">
                <li>
                    <a :class='{active:area=="CN"}' @click='changeNav("CN",timeType)'>中国</a>
                </li>
                <li>
                    <a :class='{active:area=="USA"}' @click='changeNav("USA",timeType)'>美国</a>
                </li>
            </ul>
            <div class="hd-row2">
                <p>状态：<a :class='{active:timeType=="0"}' @click='changeNav(area,0)'>正在热映</a>&nbsp;&nbsp;/&nbsp;&nbsp;
                         <a :class='{active:timeType=="1"}' @click='changeNav(area,1)'>即将上映</a>
                </p>
            </div>
        </section>
        <section  class="schedule-bd">

            <ul class="zt-list-film ext-list" v-if="timeType==0">
                <li class="item-film" v-for="(article,id) in articles" :key="id" @click="toVideoDetail(article.id)">
                    <div class="item-fl">
                        <img :src="article.cover" :alt="article.name">
                    </div>
                    <div class="item-fr">
                        <h2>{{article.name}}<em>{{article.rate}}</em></h2>
                        <p>
                            <template v-if="article.sumBoxOffice>0">
                                累计票房<em>{{area=="CN"?"￥":"$"}}{{article.sumBoxOffice | parseBoxOffice}}</em>，
                            </template>
                            <template>
                                <em>{{article.releaseDate | parseReleaseDate}}</em>
                            </template>
                        </p>
                        <p v-if="article.filmmakers">
                            导演：<span v-for="(director,index) in article.filmmakers.directors" :key="index">{{director.name}}&nbsp;</span>  
                            演员：<span v-for="actor in article.filmmakers.actors">{{actor.name}}/</span> 
                        </p>
                        <div class="item-btns2">
                            <span class="btn btn-preview" v-if="article.trailerCount>0" @click.stop.prevent="toVideoPreview(article.id)">预告片</span>
                            <span class="btn btn-post" v-if="article.commentaryCount>0" @click.stop.prevent="toCommentaryDetail(article.commentaryId)">解说视频</span>
                        </div>
                    </div>
                </li>
            </ul>

            <ul class="list-month" v-else>
                <li class="item-month" v-for="(monthData,index) in monthList" :key="index">
                    <h2 class="title-month">{{index | parseMonth}}</h2>
                    <ul class="list-date">
                        <li class="item-date" v-for="(dateData,monthIndex) in monthData" :key="monthIndex">
                            <h2 class="title-date" :data-time="monthIndex"><i></i>{{monthIndex | parseDay}}</h2>
                            <ul class="zt-list-film ext-list">
                                <li class="item-film" v-for="(article,id) in dateData" :key="id" @click="toVideoDetail(article.id)">
                                    <div class="item-fl">
                                        <img :src="article.cover" :alt="article.name">
                                    </div>
                                    <div class="item-fr">
                                        <h2>{{article.name}}<em>{{article.rate}}</em></h2>
                                        <p v-if="article.filmmakers">
                                            <span v-if="article.filmmakers.directors">导演：</span><span v-for="(director,dIndex) in article.filmmakers.directors" :key="dIndex">{{director.name}}&nbsp;</span>  
                                            <span v-if="article.filmmakers.actors">演员：</span><span v-for="actor in article.filmmakers.actors">{{actor.name}}/</span> 
                                        </p>
                                        <div class="item-btns2">
                                            <span class="btn btn-preview" v-if="article.trailerCount>0" @click.stop.prevent="toVideoPreview(article.id)">预告片</span>
                                            
                                            <span class="btn btn-post" v-if="article.commentaryCount>0" @click.stop.prevent="toCommentaryDetail(article.commentaryId)">解说视频</span>
                                        </div>
                                    </div>
                                </li>
                            </ul>
                        </li>
                    </ul>
                </li>
            </ul>

        </section>
        <loading 
            :nextFlag = "nextFlag"
            :loading = "isloading"
            @getLoadMore = "getShowtimes"></loading>
    </div>
</template>

<script>
    import schedule from './js/schedule.js'
    export default schedule
</script>