fix: 修复活动列表点击事件处理方法名称不一致的问题

components/ActivityItem.vue

@@ -1,28 +1,29 @@
 <template>
-	<view class="activity-item flex" @click="handleClick">
-		<view class="left flex flex-col justify-between align-center">
-			<image :src="item.brandLogo" style="width: 140rpx;height: 140rpx;border-radius: 6rpx;"></image>
-			<text style="color: #606060;font-size: 24rpx;font-weight: bold;white-space: nowrap;">
-				<block v-if="activityState === 'recruiting'">活动招募还剩</block>
-				<block v-else-if="activityState === 'inProgress'">距离达成还剩</block>
-			</text>
-			<view class="status-box">
-				<block v-if="activityState === 'recruiting'">
-					<view class="days-left">
-						<text style="font-size: 72rpx; color: #DE3C4B;">{{item.remainingDays}}</text>
-						<text style="font-size: 24rpx;color: #606060;">天</text>
-					</view>
-				</block>
-				<block v-else-if="activityState === 'inProgress'">
-					<view v-if="item.remainingBeerCount > 0">
-						<text style="font-size: 24rpx;color: #0B0E26;">{{item.remainingBeerCount}}</text>
-						<text style="font-size: 24rpx;color: #0B0E26;">桶</text>
-					</view>
-				</block>
-				<block v-else-if="activityState === 'completed'">
-					<view v-if="!item.barAwardStatus" style="font-size: 24rpx;color: #19367A;font-weight: bold;">待兑付</view>
-					<view v-else style="font-size: 24rpx;color: #19367A;font-weight: bold;">已完成</view>
-				</block>
+	<view class="activity-item flex" v-if="isActivityVisible" @click="handleClick">
+		<view class="left">
+			<image :src="item.brandLogo"></image>
+			<view class="status-content">
+				<text v-if="activityState === 'recruiting'">招募剩余天数</text>
+				<text v-else-if="activityState === 'inProgress'">距离达成还剩</text>
+				<view class="status-box">
+					<template v-if="activityState === 'recruiting'">
+						<view class="days-left">
+							<text class="days-num">{{item.remainingDays}}</text>
+							<text class="days-unit">天</text>
+						</view>
+					</template>
+					<template v-else-if="activityState === 'inProgress'">
+						<view v-if="item.remainingBeerCount > 0" class="beer-count">
+							<text>{{item.remainingBeerCount}}</text>
+							<text>桶</text>
+						</view>
+					</template>
+					<template v-else-if="activityState === 'completed'">
+						<view class="status-text">
+							{{!item.barAwardStatus ? '待兑付' : '已完成'}}
+						</view>
+					</template>
+				</view>
 			</view>
 		</view>
 		<view class="right">
@@ -53,7 +54,24 @@ export default {
 			required: true
 		}
 	},
+	created() {
+		console.log('ActivityItem created', this.item)
+	},
+	mounted() {
+		console.log('ActivityItem mounted', this.item)
+	},
 	computed: {
+		// 判断活动是否可显示
+		isActivityVisible() {
+			// 获取用户所在城市
+			const userCity = uni.getStorageSync('userCity');
+			// 未登录用户或未设置城市的用户，只显示全国活动
+			if (!userCity) {
+				return this.item.city === '全国';
+			}
+			// 已登录用户，显示全国活动和所在城市的活动
+			return this.item.city === '全国' || this.item.city === userCity;
+		},
 		activityState() {
 			if (this.item.activityStatus === 1) {
 				return 'recruiting';
@@ -67,9 +85,11 @@ export default {
 	},
 	methods: {
 		handleClick() {
+			console.log('ActivityItem clicked', this.item)
 			this.$emit('click', this.item)
 		},
 		handleReview(beer) {
+			console.log('ActivityItem review clicked', beer)
 			this.$emit('review', beer)
 		}
 	}
@@ -155,7 +175,7 @@ export default {
 		top: -12rpx;
 		height: calc(100% + 24rpx);
 		width: 180rpx;
-		padding: 24rpx 16rpx;
+		padding: 40rpx 24rpx;
 		background: #FFFFFF;
 		border-radius: 20rpx;
 		box-sizing: border-box;
@@ -165,49 +185,66 @@ export default {
 		display: flex;
 		flex-direction: column;
 		align-items: center;
-		justify-content: space-between;
 
-		.brand-logo {
-			width: 148rpx;
-			height: 148rpx;
-			border-radius: 12rpx;
-			margin-bottom: 16rpx;
+		image {
+			width: 132rpx;
+			height: 132rpx;
+			border-radius: 6rpx;
+			margin-bottom: 40rpx;
 		}
 
-		.brewery-name {
-			font-size: 24rpx;
-			font-weight: bold;
-			color: #0B0E26;
-			text-align: center;
-			margin-bottom: 8rpx;
-		}
+		.status-content {
+			display: flex;
+			flex-direction: column;
+			align-items: center;
+			
+			text {
+				color: #606060;
+				font-size: 24rpx;
+				font-weight: bold;
+				white-space: nowrap;
+				margin-bottom: 46rpx;
+			}
 
-		.city {
-			font-size: 20rpx;
-			color: #9D9D9D;
-			text-align: center;
-			margin-bottom: 16rpx;
-		}
-
-		.status-text {
-			font-size: 20rpx;
-			color: #0B0E26;
-			text-align: center;
-			margin-bottom: 8rpx;
-		}
-
-		.remaining-days {
-			font-size: 40rpx;
-			font-weight: bold;
-			color: #D42E78;
-			text-align: center;
-			margin-bottom: 8rpx;
-		}
-
-		.days-unit {
-			font-size: 20rpx;
-			color: #D42E78;
-			text-align: center;
+			.status-box {
+				text-align: center;
+				
+				.days-left {
+					display: flex;
+					align-items: baseline;
+					justify-content: center;
+					
+					.days-num {
+						font-size: 72rpx;
+						color: #D42E78;
+						font-weight: bold;
+						line-height: 1;
+					}
+					
+					.days-unit {
+						font-size: 24rpx;
+						color: #606060;
+						margin-left: 4rpx;
+					}
+				}
+				
+				.beer-count {
+					text {
+						font-size: 24rpx;
+						color: #0B0E26;
+						
+						&:last-child {
+							margin-left: 4rpx;
+						}
+					}
+				}
+				
+				.status-text {
+					font-size: 24rpx;
+					color: #19367A;
+					font-weight: bold;
+				}
+			}
 		}
 	}
 }

pages/index/index.vue

@@ -67,15 +67,13 @@
 				scroll-y="true" 
 				@scrolltolower="changePage"
 				:scroll-anchoring="true"
-				:refresher-enabled="true"
-				@refresherrefresh="onRefresh"
 			>
 				<view class="activity-list" style="margin-top: 16rpx;">
 					<activity-item 
 						v-for="(item, index) in featurePageList" 
 						:key="index"
 						:item="item"
-						@click="toDetail"
+						@click="handleActivityClick"
 						@review="toReview"
 					/>
 				</view>
@@ -147,6 +145,27 @@
 				finished: false,
 			};
 		},
+		created() {
+			console.log('Index page created')
+		},
+		mounted() {
+			console.log('Index page mounted')
+		},
+		onReady() {
+			console.log('Index page ready')
+			// 确保数据已加载
+			if (this.featurePageList.length === 0) {
+				this.getActivityList()
+			}
+		},
+		watch: {
+			featurePageList: {
+				handler(newVal) {
+					console.log('featurePageList changed', newVal)
+				},
+				deep: true
+			}
+		},
 		onLoad() {
 			// setTimeout(() => {
 			// 	uni.setNavigationBarColor({
@@ -163,7 +182,8 @@
 			uni.showShareMenu({
 				menus: ['shareAppMessage', 'shareTimeline']
 			})
-			
+			// 禁用页面下拉刷新
+			uni.stopPullDownRefresh()
 		},
 		onShow() {
 			this.userInfo = uni.getStorageSync('userInfo')
@@ -181,7 +201,10 @@
 		// onPullDownRefresh(){
 		// 	this.getFeaturePageListFun() // 专辑页列表
 		// },
-
+		onPullDownRefresh() {
+			// 禁用页面下拉刷新效果
+			uni.stopPullDownRefresh()
+		},
 		methods: {
 			loginSuccess() {
 				this.userInfo = uni.getStorageSync('userInfo')
@@ -313,14 +336,6 @@
 				// 实现搜索逻辑
 				console.log('搜索关键词:', this.keyword);
 			},
-			// 下拉刷新
-			async onRefresh() {
-				this.pageNum = 1
-				this.finished = false
-				this.featurePageList = []
-				await this.getActivityList()
-				uni.stopPullDownRefresh()
-			},
 			// 获取活动列表
 			async getActivityList() {
 				if (this.loading || this.finished) return
@@ -332,14 +347,48 @@
 					})
 					if (res.code === 200) {
 						const { rows, total } = res
+						
+						// 处理数据，计算剩余天数和状态
+						const processedRows = rows.map(it => {
+							// 计算剩余天数
+							const targetDate = new Date(it.endDate);
+							const currentDate = new Date();
+							const timeDiff = targetDate.getTime() - currentDate.getTime();
+							const remainingDays = Math.ceil(timeDiff / (1000 * 3600 * 24));
+							
+							// 设置活动状态
+							let activityState = 'recruiting';
+							if (it.activityStatus === 2) {
+								activityState = 'in_progress';
+							} else if (it.activityStatus === 3) {
+								activityState = 'completed';
+							}
+							
+							return {
+								...it,
+								remainingDays,
+								activityState,
+								remainingBeerCount: it.remainingBeerCount || 0,
+								barAwardStatus: it.barAwardStatus || 0
+							};
+						});
+						
+						// 过滤掉招募剩余天数为负数的活动
+						const filteredRows = processedRows.filter(item => {
+							if (item.activityState === 'recruiting') {
+								return item.remainingDays >= 0
+							}
+							return true
+						});
+						
 						if (this.pageNum === 1) {
-							this.featurePageList = rows
+							this.featurePageList = filteredRows;
 						} else {
-							this.featurePageList = [...this.featurePageList, ...rows]
+							this.featurePageList = [...this.featurePageList, ...filteredRows];
 						}
-						this.total = total
-						this.finished = this.featurePageList.length >= total
-						this.pageNum++
+						this.total = total;
+						this.finished = this.featurePageList.length >= total;
+						this.pageNum++;
 					}
 				} catch (error) {
 					console.error('获取活动列表失败:', error)
@@ -347,13 +396,20 @@
 					this.loading = false
 				}
 			},
-
+			
 			// 修改页面加载更多方法
 			async changePage() {
 				if (!this.finished) {
 					await this.getActivityList()
 				}
 			},
+			// 处理活动项点击
+			handleActivityClick(item) {
+				console.log('handleActivityClick called', item)
+				uni.navigateTo({
+					url: "/pagesActivity/activityDetail?id=" + item.id
+				})
+			},
 		}
 	}
 </script>
@@ -585,6 +641,6 @@
 	}
 
 	.activity-item {
-		display: none;
+		display: block;
 	}
 </style>