JenkinsTest/page/video/post.vue

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

<template>
    <div class="page-video-post">
        <section class="post-hd">
            <video :poster="curCommentarie.cover" controls :src="curVideoUrl" playsinline="isiPhoneShowPlaysinline" webkit-playsinline="isiPhoneShowPlaysinline"></video>
        </section>
        
        <section class="v-mod-video">
            <div class="info-row1">
                <div class="col-fl">
                    <span class="img-wrap">
                        <img :src="curVideoUp.head">
                    </span>
                    <h2>{{curVideoUp.nick}}</h2>
                </div>
                <div class="col-fr">{{curCommentarie.playCount}}</div>
            </div>

           
            <div class="info-row2">
                <h1>{{curCommentarie.title}}</h1>
                <a :href="downloadUrl" class="btn-more" v-if="(commentaryCount>1)">（还有{{commentaryCount-1}}个解说登录APP可看）</a>
            </div>

        </section>

        <section class="v-mod-detail mt-16">
            <a :data-href='"/?page=video-detail&articleId="+article.id' class="detail-wrap">
                <div class="detail-fl">
                    <img :src="article.cover" :alt="article.name">
                </div>
                <div class="detail-fm">
                    <h2>{{article.name}}</h2>
                    <p>上映时间：{{article.releaseDate | parseReleaseDate}}</p>

                    <p v-if="articleType==2">{{article.episode}}集/单集片长：{{article.duration}}min / <span v-for="(area,index) in areas" :key="index">{{area}}</span></p>
                    <p v-else>片长：{{article.duration}}min / <span v-for="(area,index) in areas" :key="index">{{area}}</span></p>

                    <p>演员：<span v-for="(actor,index) in actors" :key="index">{{actor.name}}</span></p>
                    <p>更多详情&gt;</p>
                </div>
                <div class="detail-fr">
                    <div class="rate-wrap">
                        <span>{{article.dbRate?article.dbRate:0}}</span>
                        <p>豆瓣评分</p>
                        <div class="imdb-wrap">IMDB: {{article.imdbRate?article.imdbRate:0}}</div>
                    </div>
                </div>
            </a>
            <div class="btn-wrap" v-if="watchOnline.count>0">
                <a :href="downloadUrl" class="btn-app" >{{watchOnline.count}}个片源登录App可看</a>
            </div>
        </section>

        <section class="v-mod-jieshuo mt-16" v-if="recommends.length>0">
            <h2 class="clearfix">相关推荐 <a :href="downloadUrl" v-if="recommends.length>3">更多推荐&nbsp;&gt;</a></h2>
            <ul class="list-jieshuo" v-if="recommends.length==1">
                <li v-for="(recommend,index) in recommends" :key="index" v-if="index<3">
                    <a :href='"/?page=video-post&cid="+recommend.id'>
                        <div class="item-fl">
                            <img :src="recommend.cover" :alt="recommend.title">
                        </div>
                        <div class="item-fr">
                            <h3>{{recommend.title}}</h3>
                            <p><img :src="recommend.up.head">{{recommend.up.nick}}</p>
                        </div>
                    </a>
                </li>
            </ul>
            <ul class="list-jieshuo2" v-else>
                <li v-for="(recommend,index) in recommends" :key="index" v-if="index<3">
                    <a :href='"/?page=video-post&cid="+recommend.id'>
                        <div class="cover">
                            <img :src="recommend.cover" :alt="recommend.title">
                        </div>
                        <h3>{{recommend.title}}</h3>
                    </a>
                </li>
            </ul>
        </section>

        <section class="v-mod-comment mt-16 pb-150">
            <div class="comment-hd comment-hd1">
                <h2><span>用户辣评<em id="commentNum">0</em></span></h2>
                <ul class="tag-nav">
                    <li class="active" @click="changeCommentTag(0)">全部评论</li>
                    <li @click="changeCommentTag(1)">本视频评论</li>
                </ul>
            </div>
            <div class="tag-cont">
                <div class="tag-panel active">
                    <comment 
                        :type="1" 
                        :id="articleId" 
                        :hasPlayer="true" 
                        v-if="article.id">
                    </comment>
                </div>

                <div class="tag-panel">
                    <comment 
                        :type="2" 
                        :id="cid" 
                        :hasPlayer="true">
                    </comment>
                </div>
            </div>
        </section>

        <dlfooter></dlfooter>
        <photoswipe></photoswipe>
    </div>
</template>

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