From 2e24923ed954974c3b134fae89cc23b64f4406b8 Mon Sep 17 00:00:00 2001
From: xiangpei <xiangpei@timesnew.cn>
Date: 星期二, 03 六月 2025 18:41:18 +0800
Subject: [PATCH] 视频主页-视频播放接口适配

---
 pages/tabbar/index/home.vue |   47 +++++++++++++++++++++++++++++++----------------
 1 files changed, 31 insertions(+), 16 deletions(-)

diff --git a/pages/tabbar/index/home.vue b/pages/tabbar/index/home.vue
index 356bd51..e65155f 100644
--- a/pages/tabbar/index/home.vue
+++ b/pages/tabbar/index/home.vue
@@ -8,7 +8,7 @@
       :current="currentIndex"
       @change="onSwiperChange"
     >
-      <swiper-item v-for="(item, index) in videoList" :key="item.id + index">
+      <swiper-item v-for="(item, index) in videoList" :key="item.id">
 		<!-- 鎾斁鎸夐挳锛堜粎褰撹棰戞殏鍋滄椂鏄剧ず锛� -->
 		<view 
 		  class="play-icon" 
@@ -66,25 +66,25 @@
 		  </view>
           <view style="width: 100%;word-wrap: break-word;white-space: normal;overflow-wrap: break-word;">
 			  <text class="video-title">{{item.title}}</text>
-			  <text class="video-tag" v-for="(tag, index) in item.tagList" :key="item.id + tag.id">#{{tag.tagName}}</text>
+			  <text class="video-tag" v-for="(tag, index) in item.tagList" :key="tag.id">#{{tag.tagName}}</text>
 		  </view>
         </view>
         
         <!-- 鍙充晶浜掑姩鎸夐挳 -->
        <view class="action-buttons">
 		   <view class="avatar-container">
-			   <image class="avatar" @click="() => jumpToHomePage(item.authorId)" :src="item.authorAvatar" mode="aspectFill"></image>
+			   <image class="avatar" @click="jumpToHomePage(item.authorId)" :src="item.authorAvatar" mode="aspectFill"></image>
 			   <!-- 鍏虫敞鍥炬爣 - 浣跨敤缁濆瀹氫綅 -->
-			   <view v-if="!item.subscribeThisAuthor" class="follow-icon" @click="() => subscribeAuth(index, item.authorId)">
+			   <view v-if="!item.subscribeThisAuthor" class="follow-icon" @click="subscribeAuth(index, item.authorId)">
 				 <text class="iconfont">&#xe629;</text>
 			   </view>
 		   </view>
-          <view class="action-item" @click="() => toggleCollect(item, index)">
+          <view class="action-item" @click="toggleCollect(item, index)">
 			<text class="iconfont" v-if="item.collected">&#xe605;</text>
 			<text class="iconfont" v-else>&#xe601;</text>
 			<text style="font-size: 10px;font-weight: lighter;">{{item.collectNum}}</text>
           </view>
-         <view class="action-item" @click="() => showComments(item)">
+         <view class="action-item" @click="showComments(item)">
             <text class="iconfont">&#xe7f7;</text>
             <text style="font-size: 10px;font-weight: lighter;">{{item.commentNum}}</text>
           </view>
@@ -114,7 +114,7 @@
 	        鏆傛棤璇勮锛屽揩鏉ュ彂琛ㄧ涓�鏉¤瘎璁哄惂~
 	      </view>
 	      
-	      <view v-else class="comment-item" v-for="(comment, index) in comments" :key="comment.id + index">
+	      <view v-else class="comment-item" v-for="(comment, index) in comments" :key="comment.id">
 			<view style="display: flex;">
 				<image class="comment-avatar" :src="comment.userAvatar || '/static/default-avatar.png'"></image>
 				<view class="comment-content">
@@ -130,7 +130,7 @@
 			</view>
 			<!-- 鍥炲鍒楄〃 -->
 			  <view class="reply-list" v-if="comment.replies && comment.replies.length > 0">
-				<view class="reply-item" v-for="(reply, replyIndex) in comment.replies" :key="reply.id + index">
+				<view class="reply-item" v-for="(reply, replyIndex) in comment.replies" :key="reply.id">
 				  <view class="reply-content">
 					<view style="display: flex;">
 						<image class="comment-reply-avatar" :src="reply.replyUserAvatar || '/static/default-avatar.png'"></image>
@@ -183,6 +183,7 @@
 export default {
   data() {
     return {
+		videoNoMore: false, // 鏄惁杩樻湁鏇村瑙嗛
 		commentNoMore: false, // 鏄惁杩樻湁鏇村璇勮
 		commentQuery: {
 			pageNumber: 1,
@@ -228,8 +229,11 @@
 		],   // 瑙嗛鍒楄〃鏁版嵁
 		videoContexts: [], // 瑙嗛涓婁笅鏂囧璞￠泦鍚�
 		loading: false,  // 鏄惁姝ｅ湪鍔犺浇
-		page: 1,         // 褰撳墠椤电爜
-		pageSize: 10     // 姣忛〉鏁伴噺
+		videoQuery: {
+			pageNumber: 1,
+			pageSize: 6,
+			videoFrom: 'recommend'
+		}
     }
   },
   onShow() {
@@ -493,21 +497,31 @@
     
     // 鍔犺浇瑙嗛鏁版嵁
     async loadVideos() {
-      if (this.loading) return;
+      if (this.loading || this.videoNoMore) return;
       this.loading = true;
-	  getRecommendVideos({pageNumber: this.page, pageSize: this.pageSize}).then(res => {
+      
+	  getRecommendVideos(this.videoQuery).then(res => {
 		  console.log(res, "瑙嗛鏁版嵁");
-		  if (this.page === 1) {
+		  if (this.videoQuery.pageNumber === 1) {
 		    this.videoList = res.data.data;
 		  } else {
-		    this.videoList = [...this.videoList, ...res.data.data];
+			this.videoList = [
+			  ...this.videoList,
+			  ...res.data.data.filter(
+			    (newItem) => !this.videoList.some((oldItem) => oldItem.id === newItem.id)
+			  ),
+			];
 		  }
-		  
-		  this.page++;
 		  this.$nextTick(() => {
 		    this.initVideoContexts();
 		  });
 		  this.loading = false;
+		  if(res.data.data.length < this.videoQuery.pageSize) {
+			  this.videoNoMore = true;
+			  return;
+		  }
+		  this.videoQuery.pageNumber++;
+		  
 	  })
     },
     
@@ -561,6 +575,7 @@
     },
     // 鍗曞嚮灞忓箷锛氭殏鍋滄垨缁х画鎾斁
 	togglePlay(index) {
+		console.log("鍗曞嚮瑙嗛", index, this.videoContexts);
 		if(this.currentVideoIsPlaying) {
 			this.videoContexts[index].pause();
 		} else {

--
Gitblit v1.8.0