Commit ff20d6cd authored by mengcuiguang's avatar mengcuiguang

优化快手推荐视频展示

parent 75d3cb10
<template> <template>
<view class="body"> <view class="body">
<swiper class="swiper" circular @change="swiperChange" :current="current" :vertical="true" duration="300"> <swiper class="swiper" style="height: 100%;width: 100%;" circular @change="swiperChange" :current="current" :vertical="true" duration="300">
<swiper-item v-for="(list, index) in displaySwiperList" :key="index"> <swiper-item v-for="(list, index) in displaySwiperList" :key="index" style="height: 100%;width: 100%;">
<view v-if="Math.abs(displayIndex-index)==0" style="height: 100%;"> <view v-if="Math.abs(displayIndex-index)==0" style="height: 100%;width: 100%;">
<video v-if="Math.abs(displayIndex-index)==0" :id="''+list.vedioId" :controls="controls" <video style="height: 100%;width: 100%;" v-if="Math.abs(displayIndex-index)==0" :id="''+list.vedioId" :controls="controls"
:autoplay="true" :isplay="true" play-btn-position="center" :loop="!isplay" @ended="ended" :autoplay="true" :isplay="true" play-btn-position="center" :loop="!isplay" @ended="ended"
@controlstoggle="controlstoggle" :show-fullscreen-btn="false" :poster="list.coverImage" @controlstoggle="controlstoggle" :show-fullscreen-btn="false" :poster="list.coverImage"
:show-loading="true" @click="tapVideoHover()" :enable-progress-gesture="false" class="tsvideo" :show-loading="true" @click="tapVideoHover()" :enable-progress-gesture="false" class="tsvideo"
......
...@@ -17,13 +17,6 @@ ...@@ -17,13 +17,6 @@
// } // }
// }, // },
{ {
"path": "pages/home",
"style": {
"navigationStyle": "custom",
"navigationBarBackgroundColor": "#2196f3",
"navigationBarTextStyle": "black"
}
}, {
"path": "pages/index/index", "path": "pages/index/index",
"style": { "style": {
"navigationStyle": "custom", "navigationStyle": "custom",
...@@ -152,6 +145,32 @@ ...@@ -152,6 +145,32 @@
"scrollIndicator": "none" "scrollIndicator": "none"
} }
}, },
"tabBar": {
"color": "#999",
"selectedColor": "#F8425A",
"borderStyle": "black",
"backgroundColor": "#ffffff",
"height": "50px",
"fontSize": "16px",
"iconWidth": "24px",
"spacing": "3px",
"list": [{
"pagePath": "pages/index/index",
"iconPath": "static/tab/index_unselected.png",
"selectedIconPath": "static/tab/index_selected.png",
"text": "剧场"
}, {
"pagePath": "pages/recommend/recommendVideo",
"iconPath": "static/tab/promote_unselected.png",
"selectedIconPath": "static/tab/promote_selected.png",
"text": "推荐"
}, {
"pagePath": "pages/my/my",
"iconPath": "static/tab/my_unselected.png",
"selectedIconPath": "static/tab/my_selected.png",
"text": "我的"
}]
},
"condition": { //模式配置,仅开发期间生效 "condition": { //模式配置,仅开发期间生效
"current": 0, //当前激活的模式(list 的索引项) "current": 0, //当前激活的模式(list 的索引项)
"list": [{ "list": [{
......
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
<view class="body"> <view class="body">
<view style="height: 100%;"> <view style="height: 100%;">
<indexPage v-show="currentPage==0" ref="index" /> <indexPage v-show="currentPage==0" ref="index" />
<recommendPage v-on:showEditBarH="showEditBarH" v-on:changeBottomBarColor="changeBottomBarColor" <recommendPage v-on:showEditBarH="showEditBarH" v-on:changeBottomBarColor="changeBottomBarColor"z
v-show="currentPage==1" ref="recommend" /> v-show="currentPage==1" ref="recommend" />
<userPage v-show="currentPage==2" ref="user" /> <userPage v-show="currentPage==2" ref="user" />
</view> </view>
...@@ -93,7 +93,7 @@ ...@@ -93,7 +93,7 @@
// import userPage from "@/pages/my/my.vue"; // import userPage from "@/pages/my/my.vue";
import indexPage from "@/components/home/index.vue"; import indexPage from "@/components/home/index.vue";
import recommendPage from "@/components/home/recommend.vue"; import recommendPage from "@/components/home/recommendVideo.vue";
import userPage from "@/components/home/my.vue"; import userPage from "@/components/home/my.vue";
export default { export default {
......
...@@ -250,7 +250,7 @@ ...@@ -250,7 +250,7 @@
}; };
}, },
methods: { methods: {
show() { onShow() {
// 匹配视频 // 匹配视频
this.showFirstDialog(); this.showFirstDialog();
// 轮播图 // 轮播图
......
...@@ -71,6 +71,10 @@ ...@@ -71,6 +71,10 @@
我的订单 我的订单
<view class="item_bd ellipsis" style="margin-left: 58rpx;"></view> <view class="item_bd ellipsis" style="margin-left: 58rpx;"></view>
</view> </view>
<view class="item arrow" @click="handleVedio">
我的追剧
<view class="item_bd ellipsis" style="margin-left: 58rpx;"></view>
</view>
<view v-if="os === 'android' " class="item arrow" @click="handleDotRecord"> <view v-if="os === 'android' " class="item arrow" @click="handleDotRecord">
看点记录 看点记录
<view class="item_bd ellipsis" style="margin-left: 58rpx;"></view> <view class="item_bd ellipsis" style="margin-left: 58rpx;"></view>
...@@ -135,8 +139,8 @@ ...@@ -135,8 +139,8 @@
}; };
}, },
methods: { methods: {
show() { onShow() {
this.os = wx.getSystemInfoSync().platform; // this.os = wx.getSystemInfoSync().platform;
this.windowHeight = uni.getSystemInfoSync().windowHeight this.windowHeight = uni.getSystemInfoSync().windowHeight
// loadData() { // loadData() {
this.post({ this.post({
...@@ -151,6 +155,9 @@ ...@@ -151,6 +155,9 @@
}, },
hide() { hide() {
},
handleVedio(){
navigateTo(`/pages/recommend/follow`)
}, },
handleDotRecord() { handleDotRecord() {
// 看点记录 // 看点记录
......
<template> <template>
<view style="background: white;"> <view style="background-color: white;">
<status-title :showBack="true">我的追剧</status-title>
<scroll-view scroll-y="true" <scroll-view scroll-y="true"
:style="'height: '+(windowHeight -120)+'px;margin-top:'+(titleBarHeight +statusBarHeight)+'px;'"> :style="'height: '+(windowHeight -80)+'px;'">
<view class="flex space" style="display:flex; flex-wrap:wrap;"> <view class="flex space" style="display:flex; flex-wrap:wrap;height: 100%;width: 100%;background-color: white;">
<block v-for="(value,key) in dataList" :key="key"> <block v-for="(value,key) in dataList" :key="key">
<view class="mt-10" <view class="mt-10"
style="width:31%; position: relative; border-radius:20rpx;margin-bottom: 10rpx;margin-left: 14rpx;" style="width:31%; position: relative; border-radius:20rpx;margin-bottom: 10rpx;margin-left: 14rpx;"
...@@ -26,11 +27,11 @@ ...@@ -26,11 +27,11 @@
</view> </view>
</scroll-view> </scroll-view>
<view v-if="dataList.length<=0" <!-- <view v-if="dataList.length<=0"
style="position: absolute;left: 50%;width: 240rpx;margin-left: -120rpx;top: 600rpx;text-align: center;"> style="position: absolute;left: 50%;width: 240rpx;margin-left: -120rpx;top: 600rpx;text-align: center;">
<text style="color: gray;">暂无在追剧</text> <text style="color: gray;">暂无在追剧</text>
<view @click="goRecommend" class="button" style="margin-top: 20rpx;color: white;">去剧场</view> <view @click="goRecommend" class="button" style="margin-top: 20rpx;color: white;">去剧场</view>
</view> </view> -->
</view> </view>
</template> </template>
...@@ -64,7 +65,7 @@ ...@@ -64,7 +65,7 @@
}, },
onLoad(e) {}, onLoad(e) {},
methods: { methods: {
show() { onShow() {
this.windowHeight = uni.getSystemInfoSync().windowHeight this.windowHeight = uni.getSystemInfoSync().windowHeight
this.loadData() this.loadData()
}, },
......
<template> <template>
<view class="body"> <view class="body">
<swiper class="swiper" circular @change="swiperChange" :current="current" :vertical="true" duration="300"> <swiper style="height: 100%;width: 100%;" class="swiper" circular @change="swiperChange" :current="current" :vertical="true" duration="300">
<swiper-item v-for="(list, index) in displaySwiperList" :key="index"> <swiper-item v-for="(list, index) in displaySwiperList" :key="index" style="height: 100%;width: 100%;">
<view v-if="Math.abs(displayIndex-index)==0" style="height: 100%;"> <view v-if="Math.abs(displayIndex-index)==0" style="height: 100%;width: 100%;">
<video v-if="Math.abs(displayIndex-index)==0" :id="''+list.vedioId" :controls="controls" <video style="height: 100%;width: 100%;" v-if="Math.abs(displayIndex-index)==0" :id="''+list.vedioId" :controls="controls"
:autoplay="true" :isplay="true" play-btn-position="center" :loop="!isplay" @ended="ended" :autoplay="true" :isplay="true" play-btn-position="center" :loop="!isplay" @ended="ended"
@controlstoggle="controlstoggle" :show-fullscreen-btn="false" :poster="list.coverImage" @controlstoggle="controlstoggle" :show-fullscreen-btn="false" :poster="list.coverImage"
:show-loading="true" @click="tapVideoHover()" :enable-progress-gesture="false" class="tsvideo" :show-loading="true" @click="tapVideoHover()" :enable-progress-gesture="false" class="tsvideo"
...@@ -118,7 +118,7 @@ ...@@ -118,7 +118,7 @@
}) })
// #endif // #endif
}, },
show() { onShow() {
if (this.isFirstLoad) { if (this.isFirstLoad) {
this.isFirstLoad = false this.isFirstLoad = false
this.queryList() this.queryList()
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment