|
@@ -26,24 +26,34 @@
|
|
>{{ item.title }}</view>
|
|
>{{ item.title }}</view>
|
|
</scroll-view>
|
|
</scroll-view>
|
|
<!--几集选择-->
|
|
<!--几集选择-->
|
|
- <view class="content dir-left-wrap main-left">
|
|
|
|
- <view
|
|
|
|
- v-for="(item, index) in episodeTabData[episodesTabIndex].lists"
|
|
|
|
|
|
+ <swiper
|
|
|
|
+ class="content"
|
|
|
|
+ :current="episodesTabIndex"
|
|
|
|
+ @change="handleSwiperChange"
|
|
|
|
+ >
|
|
|
|
+ <swiper-item
|
|
|
|
+ v-for="(row, index) in episodeTabData"
|
|
:key="index"
|
|
:key="index"
|
|
- class="episode-item"
|
|
|
|
- @click="handleSelectEpisode(item.index)"
|
|
|
|
|
|
+ class="dir-left-wrap main-left"
|
|
>
|
|
>
|
|
- <image :src="episode.cover_img" />
|
|
|
|
- <text>第{{ item.sort }}集</text>
|
|
|
|
- <view v-if="currentEpisode.sort === item.sort && isPlaying" class="playing" />
|
|
|
|
<view
|
|
<view
|
|
- v-if="!item.is_free && buyRecord.indexOf(item.id) === -1 && !(episode.is_vip_watch && userInfo.info.is_vip)"
|
|
|
|
- class="lock main-center cross-center"
|
|
|
|
|
|
+ v-for="(item, rowIndex) in row.lists"
|
|
|
|
+ :key="rowIndex"
|
|
|
|
+ class="episode-item"
|
|
|
|
+ @click="handleSelectEpisode(item.index)"
|
|
>
|
|
>
|
|
- <u-icon name="lock-fill" :color="$colors.defaultColor" size="46rpx" />
|
|
|
|
|
|
+ <image :src="episode.cover_img" />
|
|
|
|
+ <text>第{{ item.sort }}集</text>
|
|
|
|
+ <view v-if="currentEpisode.sort === item.sort && isPlaying" class="playing" />
|
|
|
|
+ <view
|
|
|
|
+ v-if="!item.is_free && buyRecord.indexOf(item.id) === -1 && !(episode.is_vip_watch && userInfo.info.is_vip)"
|
|
|
|
+ class="lock main-center cross-center"
|
|
|
|
+ >
|
|
|
|
+ <u-icon name="lock-fill" :color="$colors.defaultColor" size="46rpx" />
|
|
|
|
+ </view>
|
|
</view>
|
|
</view>
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
|
|
+ </swiper-item>
|
|
|
|
+ </swiper>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
@@ -113,6 +123,9 @@ export default {
|
|
handleSelectEpisode(index) {
|
|
handleSelectEpisode(index) {
|
|
this.$emit('selectEpisode', index)
|
|
this.$emit('selectEpisode', index)
|
|
this.footerShow = false
|
|
this.footerShow = false
|
|
|
|
+ },
|
|
|
|
+ handleSwiperChange(e) {
|
|
|
|
+ this.episodesTabIndex = e.detail.current
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
@@ -192,6 +205,7 @@ export default {
|
|
}
|
|
}
|
|
.content{
|
|
.content{
|
|
margin-top: 20rpx;
|
|
margin-top: 20rpx;
|
|
|
|
+ height: 580rpx;
|
|
.episode-item{
|
|
.episode-item{
|
|
position: relative;
|
|
position: relative;
|
|
width: calc((100% - #{40rpx}) / 3);
|
|
width: calc((100% - #{40rpx}) / 3);
|
|
@@ -199,6 +213,7 @@ export default {
|
|
margin-bottom: 20rpx;
|
|
margin-bottom: 20rpx;
|
|
overflow: hidden;
|
|
overflow: hidden;
|
|
border-radius: 18rpx;
|
|
border-radius: 18rpx;
|
|
|
|
+ height: 270rpx;
|
|
&:nth-child(3n){
|
|
&:nth-child(3n){
|
|
margin-right: 0;
|
|
margin-right: 0;
|
|
}
|
|
}
|
|
@@ -214,7 +229,7 @@ export default {
|
|
}
|
|
}
|
|
image{
|
|
image{
|
|
width: 100%;
|
|
width: 100%;
|
|
- height: 260rpx;
|
|
|
|
|
|
+ height: 270rpx;
|
|
}
|
|
}
|
|
text{
|
|
text{
|
|
position: absolute;
|
|
position: absolute;
|