代码优化

vedio/pages/recommend/follow.vue

@@ -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

@@ -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

@@ -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

@@ -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;