添加观看广告解锁两集功能

vedio/components/ad-more-popup/ad-more-popup.vue

+<template>
+	<view>
+		<uni-popup type="center" ref="adPop2" :maskClick="false" :isMaskClick="false">
+			<view class="container">
+				<view class="content">
+					<text class="title">恭喜解锁剧集成功!</text>
+					<text class="info">再看一个广告可额外解锁 2 集视频，是否继续观看广告领取福利?</text>
+					<view class="flex space">
+						<text class="button1" @click="onClose">取消</text>
+						<text class="button2" @click="handleAd">领取福利</text>
+					</view>
+				</view>
+			</view>
+		</uni-popup>
+	</view>
+</template>
+
+<script>
+	import {
+		EXPRESS_ID
+	} from "@/utils/adConstant.js"
+
+	export default {
+		name: 'adPopup',
+		props: {
+			show: {
+				type: Boolean,
+				default: false,
+			},
+		},
+		data() {
+			return {};
+		},
+		methods: {
+			handleShow() {
+				this.$refs.adPop2.open('center');
+			},
+			handleAd() {
+				this.$refs.adPop2.close();
+				this.$emit('handleAdMore');
+			},
+			onClose() {
+				this.$refs.adPop2.close();
+				this.$emit('handleCloseMore');
+			},
+		},
+		watch: {
+			show: {
+				handler: function(newVal, oldVal) {
+					if (newVal) {
+						this.handleShow();
+					}
+				},
+				immediate: true
+			}
+		}
+	};
+</script>
+
+<style lang="scss">
+	.container {
+		width: 600rpx;
+		height: 800rpx;
+		position: relative;
+		display: flex;
+		flex-direction: column;
+		justify-content: center;
+	}
+
+	.content {
+		border-radius: 20rpx;
+		background-color: white;
+		display: flex;
+		// width: 600rpx;
+		padding: 50rpx 0;
+		flex-direction: column;
+		align-items: center;
+
+		.title {
+			color: black;
+			font-size: 40rpx;
+			margin-bottom: 30rpx;
+		}
+
+		.info {
+			width: 500rpx;
+			color: gray;
+			font-size: 34rpx;
+			margin-bottom: 30rpx;
+		}
+
+		.button1 {
+			width: 200rpx;
+			height: 80rpx;
+			line-height: 80rpx;
+			text-align: center;
+			margin: 10rpx 20rpx;
+			border-radius: 80rpx;
+			background-color: lightgrey;
+			color: black;
+			font-size: 36rpx;
+			box-shadow: 0 0 2px 0px rgba(255, 255, 255, 0.1);
+		}
+
+		.button2 {
+			width: 200rpx;
+			height: 80rpx;
+			line-height: 80rpx;
+			text-align: center;
+			margin: 10rpx 20rpx;
+			border-radius: 80rpx;
+			background-color: orangered;
+			color: white;
+			font-size: 36rpx;
+			box-shadow: 0 0 2px 0px rgba(255, 255, 255, 0.1);
+		}
+
+		.downtext {
+			color: darkgray;
+			font-size: 26rpx;
+		}
+	}
+</style>
\ No newline at end of file

vedio/components/ad-popup/ad-popup.vue

@@ -12,8 +12,8 @@
 
 				<view class="content">
 					<text class="title">恭喜你,获得免费看剧名额</text>
-					<text class="button1" @click="handleAd">看视频免费解锁1集</text>
-					<text class="button2" @click="handleVip">免广告解锁</text>
+					<text class="button-ad" @click="handleAd">看视频免费解锁1集</text>
+					<text class="button-vip" @click="handleVip">免广告解锁</text>
 					<text class="downtext">{{countDown}}s后自动进入广告,观看完成解锁第{{vedioIndex+1}}集剧情</text>
 				</view>
 			</view>
@@ -72,12 +72,12 @@
 			},
 			handleVip() {
 				clearInterval(this.timer)
-				this.$refs.adPop.close('center');
+				this.$refs.adPop.close();
 				this.$emit('handleVip');
 			},
 			onClose() {
 				clearInterval(this.timer)
-				this.$refs.adPop.close('center');
+				this.$refs.adPop.close();
 				this.$emit('handleClose');
 			},
 			onload(e) {
@@ -95,9 +95,13 @@
 				handler: function(newVal, oldVal) {
 					if (newVal) {
 						this.handleShow();
-					} else {
-						clearInterval(this.timer)
-						this.$refs.adPop.close('center');
+					} else {
+						try {
+							clearInterval(this.timer)
+							this.$refs.adPop.close();
+						} catch {
+
+						}
 					}
 				},
 				immediate: true
@@ -139,7 +143,7 @@
 			margin-bottom: 30rpx;
 		}
 
-		.button1 {
+		.button-ad {
 			width: 500rpx;
 			height: 66rpx;
 			line-height: 66rpx;
@@ -148,22 +152,22 @@
 			border-radius: 10rpx;
 			background-color: orange;
 			color: white;
-			font-size: 36rpx;
-			box-shadow: 0 0 2px 0px rgba(255, 255, 255, 0.1);
+			font-size: 36rpx;
+			box-shadow: 0 0 2px 0px rgba(255, 255, 255, 0.1);
 		}
 
-		.button2 {
-			width: 500rpx;
-			height: 66rpx;
-			line-height: 66rpx;
+		.button-vip {
+			width: 498rpx;
+			height: 64rpx;
+			line-height: 64rpx;
 			text-align: center;
 			margin: 20rpx 20rpx;
 			border-radius: 10rpx;
 			background-color: white;
 			border: 1px orange solid;
 			color: orange;
-			font-size: 36rpx;
-			box-shadow: 0 0 2px 0px rgba(255, 255, 255, 0.1);
+			font-size: 36rpx;
+			box-shadow: 0 0 2px 0px rgba(255, 255, 255, 0.1);
 		}
 
 		.downtext {

vedio/components/home/follow.vue

@@ -45,6 +45,7 @@
 	import common from '@/mixins/common';
 
 	import {
+		message,
 		navigateTo,
 	} from '@/utils/fun.js';
 
@@ -153,10 +154,8 @@
 					success: ({
 						data
 					}) => {
-						this.isEditStyle = false
-						uni.showToast({
-							title: "删除成功"
-						})
+						this.isEditStyle = false
+						message.notify("删除成功")
 						this.loadData()
 					}
 				});

vedio/components/home/recommendVideo.vue

@@ -56,7 +56,8 @@
 
 
 	import {
-		navigateTo,
+		navigateTo,
+		message
 	} from '@/utils/fun.js';
 
 	let audo = uni.createInnerAudioContext()
@@ -103,10 +104,8 @@
 				// #ifdef H5
 				uni.setClipboardData({
 					data: href,
-					complete() {
-						uni.showToast({
-							title: "分享连接已复制到剪贴板"
-						})
+					complete() {
+						message.notify("分享连接已复制到剪贴板")
 					}
 				})
 				// #endif
@@ -274,10 +273,8 @@
 					showLoading: false,
 					success: ({
 						data
-					}) => {
-						uni.showToast({
-							title: "收藏成功"
-						})
+					}) => {
+						message.notify("收藏成功")
 					}
 				});
 			},
@@ -292,10 +289,8 @@
 					showLoading: false,
 					success: ({
 						data
-					}) => {
-						uni.showToast({
-							title: "取消收藏"
-						})
+					}) => {
+						message.notify("取消收藏")
 					}
 				});
 			},

vedio/pagesC/ttvideo/ttVideoDetail.vue

@@ -69,8 +69,7 @@
 			@clickClose="coinPopupClose" @paySuccess="paySuccess" />
 		<ad-popup :show="showAdPop" @handleAd="handleAd" @handleVip="handleVip" @handleClose="handleClose"
 			:vedioIndex="originIndex" />
-		<ad-more-popup :show="showAdMorePop" @handleAd2="handleAd" @handleClose="handleClose"
-			/>
+		<ad-more-popup :show="showAdMorePop" @handleAdMore="handleAd2" @handleCloseMore="handleClose2" />
 		<sign-popup :show="showSignPop" @close="showSignPop = false" />
 	</view>
 </template>
@@ -110,6 +109,7 @@
 			episodePopup,
 			signPopup,
 			adPopup,
+			adMorePopup,
 			ttVideoPlayer
 		},
 		data() {
@@ -137,12 +137,13 @@
 				showTap: false,
 				showCoinPop: false,
 				showSignPop: false,
-				showAdPop: false,
+				showAdPop: false,
 				showAdMorePop: false,
 				vipBackPage: '',
 				curTimeData: '',
 				localTimeData: '',
 				canUseTTPlayer: true,
+				isMoreAd: false
 			};
 		},
 		onLoad(options) {
@@ -182,27 +183,15 @@
 				});
 			}
 
-			// this.post({
-			// 	url: '/vedio/confs',
-			// 	showLoading: false,
-			// 	success: ({
-			// 		data
-			// 	}) => {
-			// 		// this.showAdForServer = data.douyinAdTipOpen;
-			// 		this.showAdForServer = true;
-			// 	}
-			// });
-
+			this.reportBeginSeeTime()
+		},
+		onHide() {
+			this.reportEndSeeTime()
+		},
+		onUnload() {
+			this.removeRewardPoint()
+			this.reportEndSeeTime()
 		},
-		// 分享
-		// onShareAppMessage() {
-		// 	let result = {
-		// 		title: this.data.title,
-		// 		imageUrl: this.data.coverImage,
-		// 		path: `/pageC/ttvideo/ttVideoDetail?bookId=${this.bookData.id}`
-		// 	}
-		// 	return result;
-		// },
 		methods: {
 			startPlay() {
 				if (tt.canIUse('preloadResourceVideo')) {
@@ -273,7 +262,7 @@
 			govip() {
 				navigateTo(`/pagesA/vipPay/vipPay`)
 			},
-			timeupdate(event) {},
+			timeUpdate(event) {},
 			selectThisVideo(index) {
 				if (this.originIndex == index) {
 					return
@@ -304,6 +293,58 @@
 				this.isqp = true
 				this.controls = true
 			},
+			reportBeginSeeTime() {
+				// 上报看剧时间
+				let that = this
+				this.post({
+					url: '/vTask/common/reportCompleteMsg/beginSeeTime',
+					data: {},
+					showLoading: false,
+					success: ({
+						data
+					}) => {}
+				});
+			},
+			reportEndSeeTime() {
+				// 上报看剧时间
+				let that = this
+				this.post({
+					url: '/vTask/common/reportCompleteMsg/endSeeTime',
+					data: {},
+					showLoading: false,
+					success: ({
+						data
+					}) => {}
+				});
+			},
+			addRewardPoint(vedioId) {
+				// 看两次广告 10分钟内 免费看两集
+				let that = this
+				this.post({
+					url: '/vTask/vedioPageSeeAdForAddPoint',
+					data: {
+						vedioId
+					},
+					showLoading: false,
+					success: ({
+						data
+					}) => {
+						message.notify("恭喜您，10分钟内可免费解锁两集！")
+					}
+				});
+			},
+			removeRewardPoint() {
+				// 丢失所有剧集内临时看点
+				let that = this
+				this.post({
+					url: '/vTask/vedioPageClose',
+					data: {},
+					showLoading: false,
+					success: ({
+						data
+					}) => {}
+				});
+			},
 			unlock(num) {
 				let that = this
 				this.post({
@@ -316,10 +357,8 @@
 					success: ({
 						data
 					}) => {
-						uni.showToast({
-							title: data.msg,
-							icon: 'none'
-						})
+						message.notify(data.msg)
+
 						if (data.code == 200) {
 							that.originList[that.originIndex].lock = false
 							setTimeout(() => {
@@ -507,7 +546,6 @@
 				});
 			},
 			cancelCollect(vedioId, index) {
-				// this.showSignPop = true
 				this.data.collect = 0
 				// 取消收藏
 				this.post({
@@ -546,10 +584,8 @@
 				// 监听错误
 				this.ad.onError((err) => {
 					uni.hideLoading();
+					message.notify("网络太火爆了，请稍候重试")
 
-					uni.showToast({
-						title: "网络太火爆了，请稍候重试"
-					})
 					switch (err.errCode) {
 						case 1004:
 							// 无合适的广告
@@ -569,15 +605,24 @@
 				this.ad.onClose((data) => {
 					uni.hideLoading();
 					if (data.isEnded) {
-						uni.showToast({
-							title: "正在为您解锁剧集"
-						})
-						that.showAdPop = false
-						that.adUnlock(that.originIndex, '')
+						if (that.isMoreAd) {
+							message.notify("正在为您解锁剧集")
+							this.adUnlock(this.originIndex, '')
+							that.addRewardPoint(that.originList[that.originIndex].vedioId)
+
+
+							that.isMoreAd = false
+							that.showAdMorePop = false
+							that.showAdPop = false
+						} else {
+							that.showAdPop = false
+							that.$nextTick(() => {
+								// 延迟渲染，否则位置错乱
+								that.showAdMorePop = true
+							})
+						}
 					} else {
-						uni.showToast({
-							title: "未观看完整视频"
-						})
+						message.notify("未观看完整视频")
 
 						that.$nextTick(() => {
 							// 延迟渲染，否则位置错乱
@@ -606,19 +651,29 @@
 			handleClose() {
 				this.showAdPop = false
 			},
+			handleClose2() {
+				// 再看广告解锁两集，取消
+				this.showAdMorePop = false
+				this.adUnlock(this.originIndex, '')
+				message.notify("正在为您解锁剧集")
+			},
 			handleAd() {
 				// this.showAdPop = false
 				this.playRewardVideo()
 			},
+			handleAd2() {
+				// 再看广告解锁两集，看广告
+				this.showAdMorePop = false
+				this.isMoreAd = true
+				this.playRewardVideo()
+			},
 			handleVip() {
 				this.showAdPop = false
 				this.showCoinPop = true
 			},
 			playRewardVideo() {
-				// 播放激励视频
-				uni.showLoading({
-					title: '广告加载中'
-				});
+				// 播放激励视频
+				message.notify('广告加载中')
 				this.ad.show();
 			},
 			adUnlock(num, ecpm) {
@@ -634,11 +689,9 @@
 					showLoading: false,
 					success: ({
 						data
-					}) => {
-						uni.showToast({
-							title: data.msg,
-							icon: 'none'
-						})
+					}) => {
+						message.notify( data.msg)
+
 						if (data.code == 200) {
 							that.originList[that.originIndex].lock = false
 							setTimeout(() => {