Skip to content

U
uniapp_vedio
Commit d939f3ae authored by jyx's avatar jyx
Browse files
Options

代码优化

parent 4e9f5989
Show whitespace changes
Inline Side-by-side
Showing with 76 additions and 111 deletions
vedio/pages/recommend/follow.vue
View file @ d939f3ae
......@@ -8,8 +8,10 @@
style="width:31%; position: relative; border-radius:20rpx;margin-bottom: 10rpx;margin-left: 14rpx;"
@click.stop="click(value)" @longpress.stop="longClick(key)">
<image class="integral-mall-goods" mode="aspectFill" :src="value.coverImage"></image>
<view class="text" style="font-size: 26rpx;color: black;">{{value.title}}</view>
<view class="text" style="font-size: 22rpx;color: gray;">{{value.vedioDesc}}</view>
<view class="text" style="font-size: 26rpx;color: black;height: 36rpx;">{{value.title}}</view>
<view class="text" style="font-size: 22rpx;color: gray;height: 30rpx;">
{{value.vedioDesc}}
</view>
<view v-if="isEditStyle" @click.stop="cbClick(key)" style="position: absolute;background: #000000; opacity: 0.6;width: 92%;height: 100%;top: 0;border-radius:20rpx;
padding-left: 20rpx;padding-top: 20rpx;">
<image v-if="value.isChecked" src="@/static/ic_selected.png"
......@@ -74,9 +76,9 @@
}) => {
this.dataList = data.list;
if (this.dataList.length > 0) {
this.$emit("showEdit", true)
this.$emit("showEditR", true)
} else {
this.$emit("showEdit", false)
this.$emit("showEditR", false)
}
}
});
......
vedio/pages/recommend/recommend.vue
View file @ d939f3ae
......@@ -38,7 +38,7 @@
<swiper class="swiper" @change="swiperChange" :current="current" :disable-touch="showEditBar">
<swiper-item class="swiper-item">
<followPage v-on:showEditBarR="showEditBarR" v-on:goRecommend="goRecommend" v-on:showEdit="showEdit"
<followPage v-on:showEditBarR="showEditBarR" v-on:goRecommend="goRecommend" v-on:showEditR="showEditR"
ref="follow" />
</swiper-item>
......
vedio/pages/recommend/recommendVideo.vue
View file @ d939f3ae
......@@ -3,26 +3,19 @@
<swiper class="swiper" circular @change="swiperChange" :current="current" :vertical="true" duration="300">
<swiper-item v-for="(list, index) in displaySwiperList" :key="index">
<view v-if="Math.abs(displayIndex-index)!=0" style="z-index: 999;height: 100%;">
<video v-if="Math.abs(displayIndex-index)!=0" :id="''+list.vedioId" :controls="controls"
:loop="false" @ended="ended" @controlstoggle="controlstoggle" :show-fullscreen-btn="false"
@click="tapVideoHover()" :style="'width:100%; height:100%;'" :src="list.recommendUrl"
play-btn-position="center" object-fit="fill" />
</view>
<view v-if="Math.abs(displayIndex-index)==0" style="height: 100%;">
<video v-if="Math.abs(displayIndex-index)==0" :id="''+list.vedioId" :controls="controls"
:isplay="true" :loop="!isplay" @ended="ended" @controlstoggle="controlstoggle"
:show-fullscreen-btn="false" @click="tapVideoHover()" :enable-progress-gesture="false"
:style="'width:100%; height:100%;'" :src="list.recommendUrl" play-btn-position="center"
object-fit="fill" />
<video v-if="Math.abs(displayIndex-index)==0" :id="''+list.vedioId" :controls="isqp" :isplay="true"
play-btn-position="center" :show-play-btn="isqp" :show-progress="true" :loop="!isplay"
@ended="ended" @controlstoggle="controlstoggle" :show-fullscreen-btn="false"
@click="tapVideoHover()" :enable-progress-gesture="false" :style="'width:100%; height:100%;'"
:src="list.recommendUrl" object-fit="fill" />
</view>
<view v-if="isqp" class="userInfo flex">
<view v-if="!isqp" class="userInfo flex">
<!-- 点赞 -->
<view class="flex" @click.stop="cLike(list.collect,list.id,list.mid);"
style="opacity: 0.9; margin-top: 10rpx;">
<image @click="collect(list.vedioId,index)" v-if="list.collect==0"
<view class="flex" style="opacity: 0.9; margin-top: 10rpx;">
<image @click.stop="collect(list.vedioId,index)" v-if="list.collect==0"
src="@/static/home_collect_img_0.png" />
<image @click="cancelCollect(list.vedioId,index)" v-if="list.collect==1"
<image @click.stop="cancelCollect(list.vedioId,index)" v-if="list.collect==1"
src="@/static/home_collect_img_1.png" />
<text
style="margin-top: 110rpx;color: #FFFFFF;font-size: 26rpx; text-align: center;font-weight: bold;"
......@@ -39,7 +32,7 @@
</view>
</view>
<!-- 最底下的文字部分 -->
<view v-if="isqp" class="contentcd flex" @click.stop="detail(list)">
<view v-if="!isqp" class="contentcd flex" @click.stop="detail(list)">
<text class="userName">{{list.title}}</text>
<text class="words">{{'第'+list.recommendIndex+'集'}}</text>
<view class="wordss2">
......@@ -81,12 +74,8 @@
oid: 0,
isplay: true, // 是否自动播放下一个视频
playCount: 2, // 剩余多少视频加载视频列表
nodate: true, // true 有数据
issp: '',
isqp: false, // 是否全屏
page: 1,
urls: "https://xjc.demo.hongcd.com/api/video/videoRecommend?page=1&uid=0",
dataList: [],
isFirstLoad: true,
videoContext: null
}
......@@ -94,12 +83,10 @@
onLoad(e) {
this.windowWidth = uni.getSystemInfoSync().windowWidth
this.windowHeight = uni.getSystemInfoSync().windowHeight
this.show()
},
methods: {
reShare() {
var href = '/pages/client/video' + '?fxpid=' + this.uid
var href = ''
// #ifdef H5
uni.setClipboardData({
data: href,
......@@ -134,7 +121,6 @@
show() {
if (this.isFirstLoad) {
this.isFirstLoad = false
// this.queryRecommend()
this.queryList()
} else {
this.videoContext?.play()
......@@ -156,33 +142,10 @@
for (let i = 0; i < msg.length; i++) {
this.originList.push(msg[i])
}
if (this.page == 1) {
this.initSwiperData();
}
this.page = this.page + 1
}
});
},
queryRecommend() {
uni.request({
url: this.urls,
success: (res) => {
if (res.data.isempty == 1) {
var msg = res.data.data
//2.这里把视频添加到视频列表
for (let i = 0; i < msg.length; i++) {
this.originList.push(msg[i])
}
if (this.page == 1) {
this.initSwiperData();
}
this.page = this.page + 1
} else {
this.nodate = false
}
}
})
},
tapVideoHover() {
// 控制是否全屏
this.isqp = !this.isqp
......@@ -234,8 +197,7 @@
this.videoContext.play()
}, 500)
var pCount = this.originList.length - this.playCount
if (originIndex == pCount && this.nodate) {
// this.queryRecommend()
if (originIndex == pCount) {
this.queryList()
}
},
......@@ -264,26 +226,17 @@
this.oid = this.originIndex + 1
this.initSwiperData(this.originIndex);
}
this.isqp = true
this.isqp = false
},
controlstoggle(e) {
console.log(e.detail.show);
this.issp = e.detail.show
},
detail(detail) {
navigateTo(`/pagesC/video/videoDetail?data=` + encodeURIComponent(JSON.stringify(detail)) +
`&playNext=1`)
},
cLike(sss, vid, mid) {
if (uni.getStorageSync("userinfo")) {
} else {
this.loginTips()
return false
}
},
collect(vedioId, index) {
this.dataList[index].collect = 1
this.originList[index].collect = 1
// 收藏
this.post({
url: '/vedio/collect',
......@@ -293,11 +246,15 @@
showLoading: false,
success: ({
data
}) => {}
}) => {
uni.showToast({
title: "收藏成功"
})
}
});
},
cancelCollect(vedioId, index) {
this.dataList[index].collect = 0
this.originList[index].collect = 0
// 取消收藏
this.post({
url: '/vedio/cancelCollect',
......@@ -307,7 +264,11 @@
showLoading: false,
success: ({
data
}) => {}
}) => {
uni.showToast({
title: "取消收藏"
})
}
});
},
loginTips() {
......
vedio/pagesC/video/videoDetail.vue
View file @ d939f3ae
......@@ -4,9 +4,9 @@
<swiper class="swiper" circular @change="swiperChange" :current="current" :vertical="true">
<swiper-item v-for="(list, index) in displaySwiperList" :key="index" :style="'width:100%; height:100%;'">
<view :style="'width:100%; height:100%;'">
<video v-if="Math.abs(displayIndex-index)==0 && list.vedioUrl" :id="list.vedioId"
:controls="controls" :loop="!isplay" :enable-progress-gesture="false" :auto-play="true"
:show-center-play-btn="false" :show-loading="true" :show-fullscreen-btn="false" @ended="ended"
<video v-if="Math.abs(displayIndex-index)==0 && list.vedioUrl" :id="list.vedioIndex"
:controls="isqp" :loop="!isplay" :enable-progress-gesture="false" :auto-play="true"
:show-play-btn="isqp" :show-loading="true" :show-fullscreen-btn="false" @ended="ended"
@controlstoggle="controlstoggle" @click="tapVides()" @timeupdate="timeupdate"
:style="'width:100%; height:100%;'" :src="list.vedioUrl" :poster="data.coverImage"
class="tsvideo" play-btn-position="center" object-fit="fill" />
......@@ -42,11 +42,11 @@
<image class="wordsss" src="@/static/up.png" />
</view>
</view>
<view v-if="Math.abs(displayIndex-index)!=0 || !list.vedioUrl" class="videoHover tsimg"
<view v-if="originIndex>=data.unlockIndex || !list.vedioUrl" class="videoHover tsimg"
@click.stop="tapVideoHover(index,list.pays)"
:style="'width: '+ windowWidth +'px; height:'+heightxw+'vh;'">
:style="'width: '+ windowWidth +'px; height:'+100+'%;'">
<image :src="data.coverImage"
:style="'width: 100%; height:'+heightxw+'%; background-color: #000; position: absolute;'"
:style="'width: 100%; height:'+100+'%; background-color: #000; position: absolute;'"
mode="aspectFit" />
<image class="playState" src="@/static/video/play.png" />
</view>
......@@ -58,8 +58,7 @@
<view v-if="fenji==1"
:style="'width: '+ windowWidth +'px; height: 860rpx; background-color: #202020; border-top-left-radius: 20rpx; border-top-right-radius: 20rpx;'">
<view style="height: 70rpx;display: flex; flex-direction: row;align-items: center;">
<image src="@/static/video/layers.png" style="width: 40rpx; height: 40rpx; margin-left: 20rpx;">
</image>
<image src="@/static/video/layers.png" style="width: 40rpx; height: 40rpx; margin-left: 20rpx;" />
<view
:style="'font-size: 30rpx; font-weight: bold; color: #FFFFFF; margin-left: 20rpx; overflow: hidden;'">
当前播放第{{ Number(originIndex+1) }}集
......@@ -86,7 +85,8 @@
<block v-for="(list,index2) in subList[index1]">
<view @click.stop="selectThisVideo(index2 + (index1%30*30))"
style="position: relative;width:16%;height: 120rpx; background: gray;border-radius: 10rpx;margin-left: 5rpx;margin-bottom: 5rpx;">
<image v-if="(index+1)>data.unlockIndex" src="@/static/video/lock.png"
<image v-if="(index2+1 + (index1%30*30))>data.unlockIndex"
src="@/static/video/lock.png"
style="width:30rpx;height:30rpx;position:absolute;right:5rpx;top:5rpx;" />
<view class="flex"
style="width:100%;height:100%;align-items:center;justify-content:center;">
......@@ -117,7 +117,10 @@
style="width: 50rpx; height: 50rpx; margin:0 20rpx 0 auto; ">
</image>
</view>
<view @click="govip()" class="gdfgjh mt-30">开通VIP</view>
<view style="color: white;text-align: center;">
{{'解锁 '+data.title+' 全集'}}
</view>
<view @click="govip()" class="button" style="margin:30rpx auto 50rpx auto;color: white;">开通VIP</view>
</view>
</uni-popup>
......@@ -204,37 +207,35 @@
this.windowWidth = uni.getSystemInfoSync().windowWidth
this.windowHeight = uni.getSystemInfoSync().windowHeight - this.safeArea - this.ttuop
console.log(this.windowHeight)
this.getData();
},
onShow() {
this.getData()
},
methods: {
govip() {
navigateTo(`/pagesA/vipPay/vipPay`)
},
timeupdate(event) {
if (event.detail.currentTime > 0 && this.originList[this.originIndex].vedioIndex > this.data.unlockIndex) {
uni.createVideoContext(this.originList[this.originIndex].vedioId, this).seek(0);
uni.createVideoContext(this.originList[this.originIndex].vedioId, this).pause();
uni.createVideoContext(this.originList[this.originIndex].vedioIndex, this).seek(0);
uni.createVideoContext(this.originList[this.originIndex].vedioIndex, this).pause();
this.fenji = 2
this.$refs.select.open('bottom');
}
},
selectThisVideo(index, pays) {
this.down();
// if (pays == 1) {
// this.fenji = 2
// this.$refs.select.open('bottom');
// } else {
if (this.originList[this.originIndex].vedioIndex > this.data.unlockIndex) {
this.fenji = 2
this.$refs.select.open('bottom');
} else {
this.duration = 20;
this.originIndex = index
this.initSwiperData(index);
setTimeout(() => {
this.duration = 500;
}, 500)
// }
}
},
down() {
this.$refs.select.close();
......@@ -277,12 +278,11 @@
this.originIndex = this.data.unlockIndex - 1
}
}
if (this.originIndex > this.data.vedioTotal || this.originIndex <= 0) {
if (this.originIndex >= this.data.vedioTotal || this.originIndex < 0) {
this.originIndex = 0
}
this.data = data.vedioMsg
this.initSwiperData(this.originIndex);
this.initEpisode()
}
});
......@@ -296,7 +296,7 @@
} else {
this.current = 0
}
this.isqp = true
this.isqp = false
console.log('显示swiper Index:', this.displayIndex)
}
},
......@@ -329,19 +329,18 @@
this.oid = this.originList.length - 1
}
console.log('++++++++++++上一条播放数据 Index:', this.oid)
uni.createVideoContext("" + this.originList[this.oid].vedioId, this).stop();
uni.createVideoContext("" + this.originList[this.oid].vedioIndex, this).stop();
if (this.originList[originIndex].vedioIndex > this.data.unlockIndex) {
this.isqp = true
this.isqp = false
this.fenji = 2
this.$refs.select.open('bottom');
} else {
setTimeout(() => {
this.isqp = true
console.log('qqqqqq:', this.originList[originIndex + 1].vedioId)
this.isqp = false
console.log('qqqqqq:', this.originList[originIndex].vedioIndex)
// audo.play()
uni.createVideoContext("" + this.originList[originIndex + 1].vedioId, this).play();
uni.createVideoContext("" + this.originList[originIndex].vedioIndex, this).play();
this.commitVideo()
}, 500)
}
......@@ -359,7 +358,7 @@
this.originIndex =
this.originIndex + 1 == originListLength ? 0 : this.originIndex + 1;
this.displayIndex = this.displayIndex + 1 == 3 ? 0 : this.displayIndex + 1;
//console.log('+++',this.originIndex)
console.log('+++', this.originIndex)
this.oid = this.originIndex - 1
this.initSwiperData(this.originIndex);
}
......@@ -367,7 +366,7 @@
else if (this.displayIndex - current == -2 || this.displayIndex - current == 1) {
this.originIndex = this.originIndex - 1 == -1 ? originListLength - 1 : this.originIndex - 1;
this.displayIndex = this.displayIndex - 1 == -1 ? 2 : this.displayIndex - 1;
//console.log('---',this.originIndex)
console.log('---', this.originIndex)
this.oid = this.originIndex + 1
this.initSwiperData(this.originIndex);
}
......@@ -467,12 +466,14 @@
.videoHover {
position: absolute;
top: 0px;
top: 0;
left: 0;
flex: 1;
display: flex;
background-color: rgba(0, 0, 0, 0.1);
justify-content: center;
align-items: center;
.tsimg {}
}
.playState {
......@@ -548,10 +549,11 @@
.contentcd {
z-index: 99;
width: 100%;
left: 4%;
width: 92%;
position: absolute;
// bottom: 36px;
bottom: 0;
bottom: 30rpx;
color: #ffffff;
flex-direction: column;
align-items: flex-start;
......
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