From 89efee9a2e20fc04b4537d859917b47cf68a814c Mon Sep 17 00:00:00 2001 From: peng <peng.com> Date: 星期五, 26 九月 2025 18:28:40 +0800 Subject: [PATCH] 用户行为分享基础埋点 --- pages/health/healthVideo.vue | 234 ++++++++++++++++++++++++++++++++++++++++++++++++++++++---- 1 files changed, 216 insertions(+), 18 deletions(-) diff --git a/pages/health/healthVideo.vue b/pages/health/healthVideo.vue index 369fea2..cb9bc81 100644 --- a/pages/health/healthVideo.vue +++ b/pages/health/healthVideo.vue @@ -26,7 +26,7 @@ @click="togglePlay(index)" v-show="!currentVideoIsPlaying" > - <image src="/static/video/play.png" style="width: 45px;height: 45px" mode="aspectFit"></image> + <image src="/pages/subComponents/static/video/play.png" style="width: 45px;height: 45px" mode="aspectFit"></image> </view> <video v-if="index >= currentIndex - videoLiveOffset && index <= currentIndex + videoLiveOffset" @@ -132,9 +132,9 @@ <!-- 鍙充晶浜掑姩鎸夐挳 --> <view class="action-buttons" v-if="false"> <view class="avatar-container"> - <image class="avatar" @click="jumpToHomePage(item.authorId)" :src="item.authorAvatar" mode="aspectFill"></image> + <image class="avatar" @click="jumpToHomePage(item.authorId)" @touchend.stop :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" @touchend.stop @click="subscribeAuth(index, item.authorId)"> <text class="iconfont"></text> </view> </view> @@ -256,13 +256,15 @@ addVideoComment, thubmsUpComment, cancelThubmsUpComment, - changeThumbsUp + changeThumbsUp, + getGoodsSimilarlyVideos } from "@/api/video.js"; import { changeCollect } from "@/api/collect.js"; import { saveShare, saveShareClickRecord } from "@/api/share.js"; import { silentLogin } from "@/api/connect.js"; import { getUserInfo } from "@/api/members"; import storage from "@/utils/storage.js"; +import { getSessionId, userAction } from "@/api/userAction.js"; export default { components: {TopBar}, computed: { @@ -336,14 +338,44 @@ }, loading: false, // 鏄惁姝e湪鍔犺浇 videoQuery: { + source:'system', pageNumber: 1, pageSize: 10, videoFrom: 'recommend' }, - marginBottom: 0 // 搴曢儴瀹夊叏鍖哄煙 + goodsSimilarlyQuery: { // 鐩镐技瑙嗛鏌ヨ + pageNumber: 1, + pageSize: 10, + videoFrom: 'goodsSimilarly', + goodsIds: [], + currentVideoId: '' + }, + similarlyVideoList: [], // 鐩镐技瑙嗛 + similarlyNomore: false, // 鏄惁杩樻湁鏇村鐩镐技瑙嗛 + similaryVideoIndex: 0, // 鐩镐技瑙嗛鐨勬挱鏀句綅缃� + similarlyLoading: false, // 鐩镐技瑙嗛鍔犺浇 + marginBottom: 0 ,// 搴曢儴瀹夊叏鍖哄煙 + pageSessionNo:"", + actionParam:{ + sessionId:'', + actionType:"PAGE", + joinType:"SELF", + pageCode:"HEALTH_VIDEO", + pageParams:"{}", + pageStatus:"JOIN", + pageType:"DETAIL" + } } }, onShow() { + getSessionId().then(res=>{ + this.pageSessionNo = res.data.data + if(this.pageSessionNo){ + let param = this.actionParam; + param.sessionId = this.pageSessionNo + userAction(param) + } + }) // const token = storage.getAccessToken(); // if (! token) { // this.wxSilentLogin(() => { @@ -358,23 +390,60 @@ this.totalHidenTime += duration } }, + onUnload() { + let param = this.actionParam; + if (this.sendOnShow)return + param.pageStatus = "LEAVE" + userAction(param) + }, onHide() { - this.startHidenTime = Date.now() + this.startHidenTime = Date.now() + let param = this.actionParam; + this.sendOnShow = true; + param.pageStatus = "LEAVE" + userAction(param) }, onLoad(option) { this.marginBottom = uni.getSystemInfoSync().safeAreaInsets.bottom + let queryParam = this.videoQuery; + if (option.q) { + // 鍙岄噸瑙g爜锛氬井淇″URL杩涜浜嗕袱娆$紪鐮� + const decodedUrl = decodeURIComponent(decodeURIComponent(option.q)); + console.log('鍘熷URL:', decodedUrl); + + // 瑙f瀽URL涓殑鏌ヨ鍙傛暟 + const params = this.parseUrlParams(decodedUrl); + const shareType = params.shareType; + const videoId = params.videoId; + const source = params.source + + queryParam.videoId = videoId + queryParam.shareType = shareType + queryParam.source = source + console.log('瑙f瀽鍙傛暟:', { shareType, videoId,source }); + this.actionParam.pageParams = JSON.stringify(params) + this.actionParam.joinType = 'SHARE' + } const token = storage.getAccessToken(); if (! token) { this.wxSilentLogin(() => { - this.loadVideos(); // 鍒ゆ柇鏄笉鏄偣鍑诲垎浜摼鎺ヨ繘鏉ョ殑 if (option.userId && option.videoId) { + this.actionParam.pageParams = JSON.stringify(option) + this.actionParam.joinType = 'SCAN' + queryParam.videoId = option.videoId // 淇濆瓨鍒嗕韩鐐瑰嚮璁板綍 saveShareClickRecord({refId: option.videoId, shareUserId: option.userId}) } + this.loadVideos(queryParam); }) } else { - this.loadVideos(); + if (option.userId && option.videoId) { + queryParam.videoId = option.videoId + // 淇濆瓨鍒嗕韩鐐瑰嚮璁板綍 + saveShareClickRecord({refId: option.videoId, shareUserId: option.userId}) + } + this.loadVideos(queryParam); } }, onShareAppMessage(e) { @@ -398,6 +467,52 @@ } }, methods: { + // 瑙f瀽URL鍙傛暟 + parseUrlParams(url) { + const params = {}; + // 澶勭悊鍙兘瀛樺湪鐨刪ash锛堝鏋滄湁鐨勮瘽锛� + const cleanUrl = url.split('#')[0]; + const queryStr = cleanUrl.split('?')[1] || ''; + + queryStr.split('&').forEach(pair => { + const [key, value] = pair.split('='); + if (key) { + // 濡傛灉鍊煎瓨鍦紝鍒欒В鐮侊紝鍚﹀垯璁句负绌哄瓧绗︿覆 + params[key] = value ? decodeURIComponent(value) : ''; + } + }); + + return params; + }, + // 鏌ヨ褰撳墠瑙嗛鐨勫叧鑱旇棰戯紙鎸備簡鍚屼竴鍟嗗搧鐨勶級 + async getGoodsSimilarly() { + if (this.similarlyLoading || this.similarlyNomore) return Promise.resolve();; + const video = this.videoList[this.currentIndex]; + if (video.goodsList && video.goodsList.length > 0) { + this.goodsSimilarlyQuery.goodsIds = video.goodsList.map(goods => goods.goodsId); + this.goodsSimilarlyQuery.currentVideoId = video.id; + if (this.similarlyVideoList.length < 1) { + this.similarlyVideoList.push(video); // 纭繚鍘熻棰戞槸妯悜瑙嗛鐨勭涓�涓厓绱� + } + this.similarlyLoading = true; + return getGoodsSimilarlyVideos(this.goodsSimilarlyQuery).then(res => { + + this.similarlyVideoList = [ + ...this.similarlyVideoList, + ...res.data.data.filter( + (newItem) => !this.similarlyVideoList.some((oldItem) => oldItem.id === newItem.id) + ), + ]; + + this.similarlyLoading = false; + if(res.data.data.length < this.goodsSimilarlyQuery.pageSize) { + this.similarlyNomore = true; + return; + } + this.goodsSimilarlyQuery.pageNumber++; + }) + } + }, topBarChange(titleObj) { if (titleObj.index === 'home') { uni.switchTab({ @@ -698,30 +813,70 @@ }, // 鍔犺浇瑙嗛鏁版嵁 - async loadVideos() { + async loadVideos(param) { if (this.loading || this.videoNoMore) return; this.loading = true; + if(param){ + console.log("浜岀淮鐮佹壂鐮佹暟鎹墽琛屽湪姝ゅ1") + console.log(this.videoQuery) + getHealthRecommendVideos(this.videoQuery).then(res => { + console.log(res) + // 鏂板涓�涓瓧娈电敤浜庡惊鐜椂鐨刱ey + const data = res.data.data.map(item => { + return { + ...item, + updateKey: item.id + } + }) + if (this.videoQuery.pageNumber === 1) { + this.videoList = data; + } else { + this.videoList = [ + ...this.videoList, + ...data.filter( + (newItem) => !this.videoList.some((oldItem) => oldItem.id === newItem.id) + ), + ]; + } + this.loading = false; + if(data.length < this.videoQuery.pageSize) { + this.videoNoMore = true; + return; + } + this.videoQuery.pageNumber++; + + }) + }else{ + console.log("浜岀淮鐮佹壂鐮佹暟鎹墽琛屽湪姝ゅ2") + console.log(this.videoQuery) getHealthRecommendVideos(this.videoQuery).then(res => { - console.log(res, "瑙嗛鏁版嵁"); + console.log(res) + // 鏂板涓�涓瓧娈电敤浜庡惊鐜椂鐨刱ey + const data = res.data.data.map(item => { + return { + ...item, + updateKey: item.id + } + }) if (this.videoQuery.pageNumber === 1) { - this.videoList = res.data.data; + this.videoList = data; } else { this.videoList = [ ...this.videoList, - ...res.data.data.filter( + ...data.filter( (newItem) => !this.videoList.some((oldItem) => oldItem.id === newItem.id) ), ]; } this.loading = false; - if(res.data.data.length < this.videoQuery.pageSize) { + if(data.length < this.videoQuery.pageSize) { this.videoNoMore = true; return; } this.videoQuery.pageNumber++; - }) + })} }, // 婊戝姩鍒囨崲瑙嗛 @@ -750,6 +905,23 @@ // 鎾斁褰撳墠瑙嗛 const videoContext1 = uni.createVideoContext(`video${this.currentIndex}`, this); videoContext1.play() + + // 涓嬫粦鏃讹紝闇�瑕佸皢涓婁竴涓棰戦噸缃负鍘熷瑙嗛(濡傛灉妯悜婊戝姩浜嗙浉鍏宠棰�) + if (this.similaryVideoIndex !== 0) { + this.videoList[oldIndex] = this.similarlyVideoList[0] + } + this.similarlyVideoList = []; + this.similaryVideoIndex = 0; + this.similarlyNomore = false; + this.similarlyLoading = false; + this.goodsSimilarlyQuery = { + pageNumber: 1, + pageSize: 6, + videoFrom: 'goodsSimilarly', + goodsIds: [], + currentVideoId: '' + } + // 濡傛灉鍓╀綑瑙嗛涓嶈冻锛岃Е鍙戣姹傝幏鍙栨洿澶氳棰� if (this.videoList.length - 1 < this.currentIndex + this.videoLiveOffset) { this.loadVideos() @@ -768,7 +940,7 @@ this.touchXY.endY = e.touches[0].pageY }, // 缁撴潫瑙︽懜 - handleSwiperEnd(item) { + async handleSwiperEnd(item) { // 闃叉婊戝姩婊氬姩鏉′篃瑙﹀彂璺宠浆 if (this.showProcess) { return @@ -780,11 +952,37 @@ if (Math.abs(diffX) > Math.abs(diffY)) { if (diffX > 0) { console.log('鍙虫粦') - if (item.goodsList && item.goodsList.length > 0) { - this.jumpToPay(item.id) - } + if (this.similaryVideoIndex !== 0) { + // 濡傛灉婊戝姩浜嗘í鍚戣棰戯紝閭d箞鍙虫粦灏卞仛瑙嗛鍒囨崲鑰屼笉鏄烦杞晢鍝侀〉 + // 鍒囨崲涓嬩竴涓棰� + const oldIndex = this.similaryVideoIndex; + this.similaryVideoIndex = Math.max(this.similaryVideoIndex - 1, 0); + if (this.similaryVideoIndex < oldIndex) { + // 鎶婄珫鍚戣棰戠殑褰撳墠鎾斁浣嶇疆鏇挎崲涓烘í鍚戣棰戠殑褰撳墠绱㈠紩鍏冪礌 + const video = this.similarlyVideoList[this.similaryVideoIndex]; + video["updateKey"] = video.id + this.similaryVideoIndex + this.videoList.splice(this.currentIndex, 1, video); + // this.videoList[this.currentIndex] = video + } + } + else if (item.goodsList && item.goodsList.length > 0) { + this.jumpToPay(item.id) + } } else { console.log('宸︽粦') + if (this.similarlyVideoList.length < 1 || this.similarlyVideoList.length - this.similaryVideoIndex - 1 <= 3) { + // 鐩稿叧瑙嗛涓虹┖鎴栬�呭墿浣欒棰戜笉瓒筹紝瑙﹀彂鍔犺浇鐩稿叧瑙嗛 + await this.getGoodsSimilarly() + } + // 鍒囨崲涓嬩竴涓棰� + const oldIndex = this.similaryVideoIndex; + this.similaryVideoIndex = Math.min(this.similaryVideoIndex + 1, this.similarlyVideoList.length - 1); + if (this.similaryVideoIndex > oldIndex) { + // 鎶婄珫鍚戣棰戠殑褰撳墠鎾斁浣嶇疆鏇挎崲涓烘í鍚戣棰戠殑褰撳墠绱㈠紩鍏冪礌 + const video = this.similarlyVideoList[this.similaryVideoIndex]; + video["updateKey"] = video.id + this.similaryVideoIndex + this.videoList.splice(this.currentIndex, 1, video); + } } } // 閲嶇疆鍧愭爣 -- Gitblit v1.8.0