feat: 视频列表加入广告;

components/charge-dialog/charge-dialog.js

@@ -63,12 +63,14 @@ Component({
         this.videoAd = wx.createRewardedVideoAd({
           adUnitId: adId
         })
+        this.videoAd.offClose()
         this.videoAd.onLoad(() => {
           console.log('激励加载成功')
         })
         this.videoAd.onError((err) => {
           console.log('激励失败', err)
         })
+        
         this.videoAd.onClose((res) => {
           const novelManager = novelPlugin.getNovelManager(this.properties.novelManagerId)
           if (res && res.isEnded) {
@@ -85,6 +87,7 @@ Component({
               novelManager.paymentCompleted()
               console.log('章节解锁成功')
             })
+            this.videoAd.offClose()
           } else {
             novelManager.closeChargeDialog()
             console.log('关闭解锁组件')

pages/video/video.js

@@ -37,7 +37,8 @@ Page({
         // 当前选中的分类ID
         currentCategoryId: null,
 
-        share_count: 1
+        share_count: 1,
+        hasLoadAdConfig: false,
     },
 
   async onLoad() {
@@ -48,6 +49,10 @@ Page({
       })
     }
 
+    this.setData({
+      hasLoadAdConfig: true
+    })
+
     this.interstitalLoad()
     getTemplateConfig({
       box_type: 67,
@@ -66,7 +71,7 @@ Page({
 
   onShow() {
     console.log('页面显示--------------------------')
-
+    this.rewardVideoLoad()
     // 每次显示页面时刷新列表
     if (this.data.videoList.length === 0) {
       this.setData({
@@ -248,11 +253,14 @@ Page({
           ...item,
           views: rnd(1, 10),
           favors: rnd(5000, 10000),
-          adType: "video"
+          adType: "video",
+          lock: false
         }))
 
         videoList = this.formatVideoAdList(videoList);
 
+        console.log(videoList, '过滤后的数组')
+
         console.log("format videoList", videoList)
 
       } catch (apiError) {
@@ -333,6 +341,7 @@ Page({
 
     return result;
   },
+
   // 加载更多
   loadMore() {
     console.log("触发loadMore")
@@ -391,19 +400,10 @@ Page({
 
   // 点击视频
   onVideoTap(e) {
-    const videoId = e.currentTarget.dataset.id;
-
-    // 显示加载中提示
-    wx.showLoading({
-      title: '加载中...',
-      mask: true
-    });
-
-    // 获取当前点击的视频项
-    const video = this.data.videoList.find(item => item.id === videoId);
-
-    // 确保视频对象存在
-    if (!video) {
+    const { id, info, index } = e.currentTarget.dataset;
+    console.log(id, info, index, 111111111111111)
+    // const video = this.data.videoList.find(item => item.id === id);
+    if (!info) {
       wx.hideLoading();
       wx.showToast({
         title: '视频数据错误',
@@ -411,25 +411,34 @@ Page({
       });
       return;
     }
-
-    // 将标题进行URI编码处理（避免特殊字符导致的问题）
-    const encodedTitle = encodeURIComponent(video.title || '');
-
-    // 跳转到视频详情页
-    wx.navigateTo({
-      url: `/pages/video/detail?id=${videoId}&title=${encodedTitle}&tag_id=${e.currentTarget.dataset.info.tag_ids[0]}`,
-      success: () => {
-        wx.hideLoading();
-      },
-      fail: (err) => {
-        console.error('跳转失败:', err);
-        wx.hideLoading();
-        wx.showToast({
-          title: '跳转失败',
-          icon: 'none'
-        });
-      }
-    });
+    const encodedTitle = encodeURIComponent(info.title || '');
+    this.unlockUrl = `/pages/video/detail?id=${id}&title=${encodedTitle}&tag_id=${info.tag_ids[0]}`
+    if (!info.lock) {
+      // 显示加载中提示
+      wx.showLoading({
+        title: '加载中...',
+        mask: true
+      });
+      // 跳转到视频详情页
+      wx.navigateTo({
+        url: this.unlockUrl,
+        success: () => {
+          wx.hideLoading();
+        },
+        fail: (err) => {
+          console.error('跳转失败:', err);
+          wx.hideLoading();
+          wx.showToast({
+            title: '跳转失败',
+            icon: 'none'
+          });
+        }
+      });
+    } else {
+      this.reawrdVideoIndex = index
+      this.rewardVideo = info
+      this.rewardVideoPlayFn()
+    }
   },
 
   // 下拉刷新
@@ -496,5 +505,59 @@ Page({
       wxBookId: 'A1Hcfv456vGtMYxQjxUm8KNdJ8',
       chapterId: null
     });
-  }
+  },
+
+  // 激励视频加载
+  rewardVideoLoad() {
+    if (wx.createRewardedVideoAd) {
+      let adId = apple.ads.rewardAdId
+      let that = this
+      this.videoAd = wx.createRewardedVideoAd({
+        adUnitId: adId
+      })
+
+      this.videoAd.onLoad(() => {
+        console.log('首页激励加载成功')
+      })
+      this.videoAd.onError((err) => {
+        console.log('首页激励失败', err)
+      })
+      this.videoAd.onClose((res) => {
+        // 用户点击了【关闭广告】按钮
+        this.setData({
+          isLoadingVideo: false
+        })
+        if (res && res.isEnded) {
+          // 发放奖励
+          that.setData({
+            [`videoList[${that.reawrdVideoIndex}].lock`]: false
+          })
+          console.log('发放奖励跳转')
+          wx.navigateTo({
+            url: `${that.unlockUrl}`
+          })
+        }
+      })
+    }
+  },
+
+  // 激励视频展示
+  rewardVideoPlayFn() {
+    wx.showLoading({
+      title: '解锁视频中',
+    })
+    this.videoAd.show().then(() => {
+      console.log('激励视频播放成功')
+    }).catch((err) => {
+      console.log('激励视频播放失败', err)
+      this.setData({
+        [`videoList[${that.reawrdVideoIndex}].lock`]: false
+      })
+      wx.navigateTo({
+        url: `${this.unlockUrl}`
+      })
+    }).then(() => {
+      wx.hideLoading()
+    })
+  },
 })

pages/video/video.wxml

@@ -29,10 +29,16 @@
     fast-deceleration="{{ true }}"
   >
     <view class="list">
-      <block wx:for="{{ videoList }}" wx:key="id">
+      <block wx:for="{{ videoList }}" wx:key="id" wx:for-index="idx">
+        <!-- 视频广告 -->
+        <view wx:if="{{itm.adType === 'videoAd' && hasLoadAdConfig}}" class="ad-custom-card">
+          <ad unit-id="{{ads.video_banner_id[0]}}" ad-type="video" ad-theme="white" data-field="videoError"
+            data-name="首页-视频1" data-adId="{{ads.video_banner_id[0]}}" bindload="appletsAdLoad"
+            binderror="appletsAdError" bindclose="appletsAdClose"></ad>
+        </view>
         <view wx:if="{{ item.adType === 'video' }}">
           <!-- 视频卡片 -->
-          <view class="video-item" bindtap="onVideoTap" data-info="{{ item }}" data-id="{{ item.id }}">
+          <view class="video-item" bindtap="onVideoTap" data-info="{{ item }}" data-id="{{ item.id }}" data-index="{{idx}}">
             <view class="video-cover-container">
               <image
                 class="video-cover"
@@ -68,7 +74,6 @@
               data-adId="{{ads.template_card_ads}}" capture-bind:tap="appletsAdClick" bindload="appletsAdLoad"
               binderror="appletsAdError"></ad-custom>
           </view>
-            
       </block>
     </view>
 

pages/video/video.wxss

@@ -327,3 +327,10 @@
   background-color: #333;
   border-radius: 3rpx;
 }
+
+.ad-custom-card-1 {
+  width: 100%;
+  padding: 0 20rpx;
+  box-sizing: border-box;
+  border-radius: 8rpx;
+}