From d50a3ed44e2edab2a7a661c43491c3aa42c57794 Mon Sep 17 00:00:00 2001 From: peng <peng.com> Date: 星期四, 25 九月 2025 14:17:05 +0800 Subject: [PATCH] 用户行为分享基础埋点 --- pages/mine/activity/reportActivity.vue | 141 +++++++++++++++++++++++++++++------------------ 1 files changed, 87 insertions(+), 54 deletions(-) diff --git a/pages/mine/activity/reportActivity.vue b/pages/mine/activity/reportActivity.vue index a1051f6..adc28a9 100644 --- a/pages/mine/activity/reportActivity.vue +++ b/pages/mine/activity/reportActivity.vue @@ -1,10 +1,14 @@ <template> <view class="wrapper"> + <top-bar selectedTitleIndex="activity" textColor="black" @changeTab="topBarChange" class="topBar"></top-bar> - - <view style="height: 100rpx"></view> + <view style="height: 50rpx;margin-top: 150rpx"></view> + <u-empty v-if="mockData.length === 0 && !loading" style="margin-top: 130rpx;" + mode="data" + icon="http://cdn.uviewui.com/uview/empty/data.png"> + </u-empty> <!-- 鍐呭鍖哄煙 --> - <scroll-view scroll-y class="content" style="height: 40vh;" @scrolltolower="loadMore" :lower-threshold="100"> + <scroll-view scroll-y class="scroll-view-container" style="height: 40vh;" @scrolltolower="loadMore" :lower-threshold="100"> <view class="waterfall"> <view class="column" v-for="(column, index) in columns" :key="index"> <!-- 閬嶅巻姣忓垪鍐呭 --> @@ -26,7 +30,8 @@ </view> </view> </view> - <!-- <view style="height: 150rpx;"></view> --> + + <!-- 鏀硅繘鐨勫姞杞芥洿澶氭彁绀� --> <view class="load-more"> <u-loadmore v-if="mockData.length > 0" :status="loading ? 'loading' : noMore ? 'nomore' : 'loadmore'" @@ -47,9 +52,12 @@ </template> <script> + import TopBar from "@/components/TopBar.vue"; import '@/components/uview-components/uview-ui'; import {getActivityReportList} from '@/api/activity.js'; + import { getSessionId, userAction } from "@/api/userAction.js"; export default { + components: {TopBar}, data() { return { columns: [ @@ -68,13 +76,58 @@ }, loading: false, // 鏄惁姝e湪鍔犺浇 noMore: false, // 鏄惁娌℃湁鏇村鏁版嵁 - total: 0 // 鎬绘暟鎹噺 + total: 0 ,// 鎬绘暟鎹噺 + pageSessionNo:"", + actionParam:{ + sessionId:'', + actionType:"PAGE", + joinType:"SELF", + pageCode:"ACTIVITY_LIST", + pageParams:"{}", + pageStatus:"JOIN", + pageType:"LIST" + } }; }, - onLoad() { + onUnload() { + let param = this.actionParam; + if (this.sendOnShow)return + param.pageStatus = "LEAVE" + userAction(param) + }, + onHide() { + this.startHidenTime = Date.now() + let param = this.actionParam; + this.sendOnShow = true; + param.pageStatus = "LEAVE" + userAction(param) + }, + onShow() { + getSessionId().then(res=>{ + this.pageSessionNo = res.data.data + if(this.pageSessionNo){ + let param = this.actionParam; + param.sessionId = this.pageSessionNo + userAction(param) + } + }) + }, + onLoad(options) { + this.actionParam.pageParams = JSON.stringify(options) this.getActivityList(); }, methods: { + topBarChange(titleObj) { + if (titleObj.index === 'home') { + uni.switchTab({ + url: titleObj.pagePath + }); + } else { + uni.redirectTo({ + url: titleObj.pagePath + }); + } + }, /** * 涓嬫媺鍒锋柊鏃� */ @@ -95,7 +148,10 @@ }, 300); }, async getActivityList() { - + if (this.noMore) { + this.loading = false; + return + } try { const res = await getActivityReportList(this.query); @@ -149,7 +205,7 @@ [] ]; this.colHeight = [0, 0]; - + this.mockData.forEach(item => { const minIndex = this.colHeight.indexOf(Math.min(...this.colHeight)); this.columns[minIndex].push(item); //鑾峰緱楂樺害鏇村皬鐨� 鏀惧叆鍏冪礌 @@ -199,38 +255,26 @@ </script> <style lang="scss"> - /* 鏂板鍔犺浇鏇村鏍峰紡 */ + + /*鏂板鍔犺浇鏇村鏍峰紡 */ .load-more { padding: 20rpx 0; text-align: center; color: #999; font-size: 26rpx; - background-color: #f7f8fa; + background-color: #f8f9fa; } - - .btn-container { - display: flex; - justify-content: center; - align-items: center; - margin-top: 8px; - /* 涓庝笂鏂规爣棰樹繚鎸侀棿璺� */ - } - /* 鍏ㄥ眬鏍峰紡浼樺寲 */ .wrapper { height: 100vh; display: flex; flex-direction: column; - background-color: #f7f8fa; + background-color: #f8f9fa; } - /* 瀵艰埅鏍忎紭鍖� */ - .u-navbar { - box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05); - } /* 鍐呭鍖哄煙浼樺寲 */ - .content { + .scroll-view-container { flex: 1; overflow: hidden; padding: 0 20rpx; @@ -253,17 +297,19 @@ gap: 20rpx; } - /* 鍗$墖椤逛紭鍖� */ + /* 鍗$墖椤逛紭鍖� - 浣跨敤缁胯壊涓婚 */ .item { - background: #fff; + background: #ffffff; border-radius: 16rpx; overflow: hidden; box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.08); transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1); + border: 1px solid #e0f2e9; &:active { transform: scale(0.98); box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.12); + background-color: #f0faf5; } } @@ -272,7 +318,7 @@ width: 100%; display: block; border-radius: 16rpx 16rpx 0 0; - background-color: #f5f5f5; + background-color: #f0faf5; &[mode="widthFix"] { height: auto; @@ -284,17 +330,16 @@ object-fit: cover; } - /* 鏂囧瓧鍐呭鏍峰紡 */ + /* 鏂囧瓧鍐呭鏍峰紡 - 浣跨敤缁胯壊娓愬彉 */ .text-content { padding: 24rpx; - background: linear-gradient(135deg, #6a11cb 0%, #2575fc 100%); + // background: linear-gradient(135deg, #38a169 0%, #48bb78 100%); min-height: 160rpx; display: flex; align-items: center; justify-content: center; .title { - color: #fff; font-size: 32rpx; font-weight: 500; line-height: 1.4; @@ -306,11 +351,11 @@ } } - /* 鏍囬鏍峰紡浼樺寲 */ + /* 鏍囬鏍峰紡浼樺寲 - 浣跨敤娣辩豢鑹� */ .title { padding: 20rpx 24rpx; font-size: 28rpx; - color: #333; + color: #2c7a7b; line-height: 1.5; display: -webkit-box; -webkit-box-orient: vertical; @@ -319,7 +364,7 @@ font-weight: 500; &:not(.text-content .title) { - border-top: 1rpx solid #f0f0f0; + border-top: 1rpx solid #e0f2e9; } } @@ -347,24 +392,12 @@ } } - /* 绌虹姸鎬佹牱寮� */ - .empty-state { - display: flex; - flex-direction: column; - align-items: center; - justify-content: center; - height: 60vh; - text-align: center; - - image { - width: 240rpx; - opacity: 0.6; - margin-bottom: 30rpx; - } - - text { - color: #c0c4cc; - font-size: 28rpx; - } + + .topBar { + position: fixed; + top: 20rpx; + left: 20rpx; + z-index: 1000; + background-color: #ffffff; } -</style> \ No newline at end of file +</style> -- Gitblit v1.8.0