绿满眶商城微信小程序-uniapp
peng
2025-10-15 92bd763024d8b6e53ea4b784ae81719ee2559bc0
pages/tabbar/index/home.vue
@@ -15,12 +15,13 @@
                     mode="aspectFit"></image>
               </view>
               <video v-if="index >= currentIndex - videoLiveOffset && index <= currentIndex + videoLiveOffset"
                  :id="'video' + index" :ref="'video' + index" :src="item.videoUrl" :autoplay="index === currentIndex"
                  :controls="isControls" :loop="true" :object-fit="item.videoFit" :enable-progress-gesture="false"
                  :show-center-play-btn="false" :show-progress="false" :show-fullscreen-btn="isControls"
                  :show-play-btn="isControls" :show-mute-btn="false" class="video-item"
                  @fullscreenchange="onFullscreenChange" @play="onPlay(item.id, index)" @pause="onPause(index)"
                  @ended="onEnded(index)" @click="togglePlay(index)" @timeupdate="onTimeUpdate($event)"
                  :id="'video' + index" :ref="'video' + index" :src="item.videoUrl"
                  :autoplay="index === currentIndex" :controls="isControls" :loop="true"
                  :object-fit="item.videoFit" :enable-progress-gesture="false" :show-center-play-btn="false"
                  :show-progress="false" :show-fullscreen-btn="isControls" :show-play-btn="isControls"
                  :show-mute-btn="false" class="video-item" @fullscreenchange="onFullscreenChange"
                  @play="onPlay(item.id, index)" @pause="onPause(index)" @ended="onEnded(index)"
                  @click="togglePlay(index)" @timeupdate="onTimeUpdate($event)"
                  @loadedmetadata="onLoadedMetadata($event)" @waiting="videoWaiting(index)"></video>
               <view class="fullscreen-btn">
                  <image class="fullscreen-icon" :src="isFullScreen ? off_screen : on_screen" mode="aspectFit"
@@ -61,7 +62,8 @@
            <!-- 悬挂商品链接层 -->
            <view class="goods-link-warp" v-if="item.goodsList.length > 0">
            <view class="goods-link-warp" :style="{ bottom: marginBottom + 55 + 'px' }"
               v-if="item.goodsList.length > 0">
               <view class="goods-link">
                  <swiper @change="goodsChange" :autoplay="true" :interval="4000" style="height: 120rpx;">
                     <swiper-item v-for="goods in item.goodsList" :key="goods.goodsId">
@@ -74,8 +76,8 @@
                              <text class="goods-name">{{ goods.goodsName }}</text>
                              <view class="price-section">
                                 <text class="current-price">¥{{ goods.price }}</text>
                                 <text class="original-price"
                                    v-if="goods.originalPrice">¥{{ goods.originalPrice }}</text>
                                 <text class="original-price" v-if="goods.originalPrice">¥{{
                                    goods.originalPrice }}</text>
                              </view>
                           </view>
                        </view>
@@ -94,8 +96,8 @@
               </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="tag.id">#{{ tag.tagName }}</text>
                  <text class="video-tag" v-for="(tag, index) in item.tagList" :key="tag.id">#{{ tag.tagName
                  }}</text>
               </view>
            </view>
@@ -171,12 +173,12 @@
                           <text @click="openReply(comment)" class="reply-btu time">回复</text>
                           <text v-if="!comment.hasThumbsUp" class="thumbs-up time iconfont"
                              @click="thubmsUp(comment.id, index, null)">&#xe614;<text
                                 v-show="comment.thumbsUpNum > 0"
                                 class="thumbs-num">{{ comment.thumbsUpNum }}</text></text>
                                 v-show="comment.thumbsUpNum > 0" class="thumbs-num">{{ comment.thumbsUpNum
                                 }}</text></text>
                           <text v-else class="thumbs-up time iconfont"
                              @click="cancelThumbsUp(comment.id, index, null)">&#xe607;<text
                                 v-show="comment.thumbsUpNum > 0"
                                 class="thumbs-num">{{ comment.thumbsUpNum }}</text></text>
                                 v-show="comment.thumbsUpNum > 0" class="thumbs-num">{{ comment.thumbsUpNum
                                 }}</text></text>
                        </view>
                     </view>
                  </view>
@@ -200,12 +202,12 @@
                              <text @click="openReply(comment, reply)" class="reply-btu time">回复</text>
                              <text v-if="!reply.hasThumbsUp" class="thumbs-up time iconfont"
                                 @click="thubmsUp(reply.id, index, replyIndex)">&#xe614;<text
                                    v-show="reply.thumbsUpNum > 0"
                                    class="thumbs-num">{{ reply.thumbsUpNum }}</text></text>
                                    v-show="reply.thumbsUpNum > 0" class="thumbs-num">{{ reply.thumbsUpNum
                                    }}</text></text>
                              <text v-else class="thumbs-up time iconfont"
                                 @click="cancelThumbsUp(reply.id, index, replyIndex)">&#xe607;<text
                                    v-show="reply.thumbsUpNum > 0"
                                    class="thumbs-num">{{ reply.thumbsUpNum }}</text></text>
                                    v-show="reply.thumbsUpNum > 0" class="thumbs-num">{{ reply.thumbsUpNum
                                    }}</text></text>
                           </view>
                        </view>
                     </view>
@@ -265,13 +267,15 @@
import { mapState, mapMutations } from 'vuex'
import { setPopupRedisTime, getPopupAcitivty } from '@/api/popup.js'
import { changeCollect } from "@/api/collect.js";
import { saveShare, saveShareClickRecord } from "@/api/share.js";
import { saveShare, saveShareClickRecord} from "@/api/share.js";
import { getSessionId, userAction,userShare  } from "@/api/userAction.js";
import { silentLogin } from "@/api/connect.js";
import { getUserInfo } from "@/api/members";
import storage from "@/utils/storage.js";
import TopBar from "@/components/TopBar.vue";
import { nextTick } from "vue";
import { getVideoCover } from "@/api/common.js"
import {addPrizeNum} from '@/api/prize.js'
export default {
   components: { TopBar, ActivityPopup },
   computed: {
@@ -354,12 +358,12 @@
         loading: false,  // 是否正在加载
         videoQuery: {
            pageNumber: 1,
            pageSize: 10,
            pageSize: 3,
            videoFrom: 'recommend'
         },
         goodsSimilarlyQuery: { // 相似视频查询
            pageNumber: 1,
            pageSize: 10,
            pageSize: 3,
            videoFrom: 'goodsSimilarly',
            goodsIds: [],
            currentVideoId: ''
@@ -368,10 +372,36 @@
         similarlyNomore: false, // 是否还有更多相似视频
         similaryVideoIndex: 0, // 相似视频的播放位置
         similarlyLoading: false, // 相似视频加载
         marginBottom: 0 // 底部安全区域
         marginBottom: 0 ,// 底部安全区域
         pageSessionNo:"",
         shareId:"",
         actionParam:{
               sessionId:'',
               actionType:"PAGE",
               joinType:"SELF",
               pageCode:"RECOMMEND_VIDEO",
               pageParams:"{}",
               pageStatus:"JOIN",
               pageType:"LIST"
            },
            shareParam:{
               pageCode:"RECOMMEND_VIDEO",
               shareOption:"{}",
               pageType:"LIST"
            },
      }
   },
   onShow() {
      getSessionId().then(res=>{
         console.log('res',JSON.stringify(res))
         this.pageSessionNo = res.data.data
         if(this.pageSessionNo){
         let   param = Object.assign({},this.actionParam);
         this.actionParam.sessionId = this.pageSessionNo
         param.sessionId = this.pageSessionNo
            userAction(param)
         }
      })
      this.openActivityPopup()
@@ -399,11 +429,32 @@
         this.totalHidenTime += duration
      }
   },
   onHide() {
      this.startHidenTime = Date.now()
   },
  onUnload() {
    let   param = Object.assign({},this.actionParam);
    if (this.sendOnShow)return
    param.pageStatus = "LEAVE"
    userAction(param)
  },
  onHide() {
    this.startHidenTime = Date.now()
    let   param = Object.assign({},this.actionParam);
    this.sendOnShow = true;
    param.pageStatus = "LEAVE"
    userAction(param)
  },
   onLoad(option) {
      if(option.shareId){
         console.log('触发onLoad')
         this.actionParam.shareId = option.shareId;
         this.actionParam.joinType = 'SHARE'
         uni.setStorage({
            key: 'shareId',
            data: option.shareId,
            success: function () {
               console.log('缓存shareId成功');
            }
         });
      }
      console.log('-----------分享出的数据---------->', option)
      //处理扫码出来的视频
      this.marginBottom = uni.getSystemInfoSync().safeAreaInsets.bottom
@@ -419,6 +470,9 @@
         const shareType = params.shareType;
         const videoId = params.videoId;
         queryParam.videoId = videoId
         this.actionParam.joinType = "SCAN";
         this.actionParam.pageParams = JSON.stringify(params);
         console.log('解析参数:', { shareType, videoId });
      }
      const token = storage.getAccessToken();
@@ -426,6 +480,8 @@
         this.wxSilentLogin(() => {
            // 判断是不是点击分享链接进来的
            if (option.userId && option.videoId) {
               this.actionParam.joinType = "SHARE";
               this.actionParam.pageParams = JSON.stringify(option);
               queryParam.videoId = option.videoId
               // 保存分享点击记录
               saveShareClickRecord({ refId: option.videoId, shareUserId: option.userId })
@@ -469,13 +525,47 @@
      //    }
      // })
      console.log(videoInfo)
      return {
         title: videoInfo.title,
         path: `/pages/tabbar/index/home?videoId=${videoInfo.id}&userId=${userInfo.id}`,
         imageUrl: videoInfo.coverUrl
      }
      // 保存分享记录
      // 返回一个Promise
      return new Promise((resolve) => {
               this.shareId = '';
               let shareObj ={
                  videoId:videoInfo.id,
                  userId:userInfo.id
               }
               this.shareParam.shareOption = JSON.stringify(shareObj)
               userShare(this.shareParam).then(res => {
                 this.shareId = res.data.data;
                 let param = {
                    addType:"SHARE_GOODS_VIDEO",
                    extend:"",
                 }
                 let extend = {shareId:this.shareId}
                 param.extend = JSON.stringify(extend)
                 addPrizeNum(param);
                 // 当获取到shareId后,再resolve分享配置
                 resolve({
                  title: videoInfo.title,
                  path: `/pages/tabbar/index/home?videoId=${videoInfo.id}&userId=${userInfo.id}&shareId=${this.shareId}`,
                  imageUrl: videoInfo.coverUrl,
                  success(e) {
                    console.log("分享成功", e);
                  },
                  fail(e) {
                    console.log('分享失败', e);
                  }
                 });
               }).catch(err => {
                 // 处理错误情况,例如使用默认参数
                 console.error('获取分享ID失败', err);
                 resolve({
                     title: videoInfo.title,
                     path: `/pages/tabbar/index/home?videoId=${videoInfo.id}&userId=${userInfo.id}`,
                     imageUrl: videoInfo.coverUrl
                 });
               });
      });
   },
   methods: {
      async openActivityPopup() {
@@ -965,7 +1055,8 @@
               const data = res.data.data.map(item => {
                  return {
                     ...item,
                     updateKey: item.id
                     updateKey: item.id,
                     videoUrl: item.videoUrl.replace('https://lmk-1356772813.cos.ap-chengdu.myqcloud.com/', 'https://media.meiyikuang.com/')
                  }
               })
               if (this.videoQuery.pageNumber === 1) {
@@ -995,7 +1086,8 @@
               const data = res.data.data.map(item => {
                  return {
                     ...item,
                     updateKey: item.id
                     updateKey: item.id,
                     videoUrl: item.videoUrl.replace('https://lmk-1356772813.cos.ap-chengdu.myqcloud.com/', 'https://media.meiyikuang.com/')
                  }
               })
               if (this.videoQuery.pageNumber === 1) {