From 5faa33dedae700ab70ee4405f4a4b0cba5321519 Mon Sep 17 00:00:00 2001 From: mayiming <1627832236@qq.com> Date: Sun, 28 Sep 2025 01:01:21 +0800 Subject: [PATCH] =?UTF-8?q?=E6=B7=BB=E5=8A=A0=E6=B4=BB=E5=8A=A8=E5=88=97?= =?UTF-8?q?=E8=A1=A8=E9=A1=B5=E9=9D=A2?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- miniprogram/app.json | 3 +- miniprogram/pages/activities/activities.json | 6 + miniprogram/pages/activities/activities.ts | 191 +++++++++++++++++ miniprogram/pages/activities/activities.wxml | 87 ++++++++ miniprogram/pages/activities/activities.wxss | 207 +++++++++++++++++++ miniprogram/pages/user/user.wxml | 4 +- 6 files changed, 495 insertions(+), 3 deletions(-) create mode 100644 miniprogram/pages/activities/activities.json create mode 100644 miniprogram/pages/activities/activities.ts create mode 100644 miniprogram/pages/activities/activities.wxml create mode 100644 miniprogram/pages/activities/activities.wxss diff --git a/miniprogram/app.json b/miniprogram/app.json index 8a98d1b..6db1683 100644 --- a/miniprogram/app.json +++ b/miniprogram/app.json @@ -11,7 +11,8 @@ "pages/notifications/notifications", "pages/setting/setting", "pages/opinion/opinion", - "pages/helpcenter/helpcenter" + "pages/helpcenter/helpcenter", + "pages/activities/activities" ], "window": { "navigationBarTextStyle": "black", diff --git a/miniprogram/pages/activities/activities.json b/miniprogram/pages/activities/activities.json new file mode 100644 index 0000000..3bd5dd3 --- /dev/null +++ b/miniprogram/pages/activities/activities.json @@ -0,0 +1,6 @@ +{ + "component": true, + "usingComponents": { + + } +} \ No newline at end of file diff --git a/miniprogram/pages/activities/activities.ts b/miniprogram/pages/activities/activities.ts new file mode 100644 index 0000000..6067931 --- /dev/null +++ b/miniprogram/pages/activities/activities.ts @@ -0,0 +1,191 @@ +// 定义活动数据类型 +interface Activity { + id: number; + title: string; + description: string; + imageUrl: string; + startTime: string; + endTime: string; + participants: number; + category: string; + status: 'ongoing' | 'upcoming'; +} + +// 定义分类数据类型 +interface Category { + id: string; + name: string; +} + +Page({ + data: { + // 搜索关键词 + searchKeyword: '', + + // 当前选中的分类 + currentCategory: 'all', + + // 活动分类 + categories: [] as Category[], + + // 所有活动数据 + activities: [] as Activity[], + + // 过滤后的活动列表 + filteredActivities: [] as Activity[] + }, + + onLoad() { + // 初始化分类 + this.initCategories(); + + // 初始化活动数据 + this.initActivities(); + }, + + // 初始化分类 + initCategories() { + const categories: Category[] = [ + { id: 'all', name: '全部活动' }, + { id: 'online', name: '线上活动' }, + { id: 'offline', name: '线下活动' }, + { id: 'exhibition', name: '展览活动' }, + { id: 'lecture', name: '讲座活动' } + ]; + + this.setData({ + categories + }); + }, + + // 初始化活动数据 + initActivities() { + const activities: Activity[] = [ + { + id: 1, + title: '2023年度科技创新峰会', + description: '汇聚行业精英，探讨科技创新趋势与未来发展方向', + imageUrl: 'https://picsum.photos/400/300?random=1', + startTime: '2023-10-15', + endTime: '2023-10-17', + participants: 356, + category: 'offline', + status: 'ongoing' + }, + { + id: 2, + title: '数字艺术线上展览', + description: '探索数字艺术的无限可能，足不出户欣赏艺术盛宴', + imageUrl: 'https://picsum.photos/400/300?random=2', + startTime: '2023-10-10', + endTime: '2023-11-10', + participants: 1243, + category: 'online', + status: 'ongoing' + }, + { + id: 3, + title: '环保志愿者招募活动', + description: '一起参与环保行动，为城市绿化贡献一份力量', + imageUrl: 'https://picsum.photos/400/300?random=3', + startTime: '2023-10-20', + endTime: '2023-10-20', + participants: 89, + category: 'offline', + status: 'upcoming' + }, + { + id: 4, + title: '现代艺术作品展', + description: '展示当代艺术家的最新创作，感受艺术的多元魅力', + imageUrl: 'https://picsum.photos/400/300?random=4', + startTime: '2023-10-05', + endTime: '2023-10-25', + participants: 752, + category: 'exhibition', + status: 'ongoing' + }, + { + id: 5, + title: '人工智能前沿讲座', + description: '知名专家解析AI发展现状与未来应用场景', + imageUrl: 'https://picsum.photos/400/300?random=5', + startTime: '2023-10-22', + endTime: '2023-10-22', + participants: 156, + category: 'lecture', + status: 'upcoming' + }, + { + id: 6, + title: '创意写作工作坊', + description: '提升写作技巧，激发创作灵感，适合各类写作爱好者', + imageUrl: 'https://picsum.photos/400/300?random=6', + startTime: '2023-10-18', + endTime: '2023-10-25', + participants: 68, + category: 'offline', + status: 'upcoming' + } + ]; + + this.setData({ + activities, + filteredActivities: activities + }); + }, + + // 切换分类 + switchCategory(e: { currentTarget: { dataset: { category: string } } }) { + const category = e.currentTarget.dataset.category; + this.setData({ + currentCategory: category + }, () => { + this.filterActivities(); + }); + }, + + // 搜索输入变化 + onSearchInput(e: { detail: { value: string } }) { + const keyword = e.detail.value.trim(); + this.setData({ + searchKeyword: keyword + }, () => { + this.filterActivities(); + }); + }, + + // 过滤活动列表 + filterActivities() { + const { activities, currentCategory, searchKeyword } = this.data; + + let filtered = [...activities]; + + // 按分类过滤 + if (currentCategory !== 'all') { + filtered = filtered.filter(activity => activity.category === currentCategory); + } + + // 按搜索关键词过滤 + if (searchKeyword) { + const keyword = searchKeyword.toLowerCase(); + filtered = filtered.filter(activity => + activity.title.toLowerCase().includes(keyword) || + activity.description.toLowerCase().includes(keyword) + ); + } + + this.setData({ + filteredActivities: filtered + }); + }, + + // 跳转到活动详情页 + navigateToDetail(e: { currentTarget: { dataset: { id: number } } }) { + const id = e.currentTarget.dataset.id; + wx.navigateTo({ + url: `/pages/activityDetail/activityDetail?id=${id}` + }); + } +}); + \ No newline at end of file diff --git a/miniprogram/pages/activities/activities.wxml b/miniprogram/pages/activities/activities.wxml new file mode 100644 index 0000000..54086f5 --- /dev/null +++ b/miniprogram/pages/activities/activities.wxml @@ -0,0 +1,87 @@ + + + + 最新活动 + {{filteredActivities.length}}个活动正在进行中 + + + + + + + + + + + + + + {{item.name}} + + + + + + + + + + + + {{item.status === 'ongoing' ? '进行中' : '即将开始'}} + + + + + + {{item.title}} + + + + + + {{item.startTime}} - {{item.endTime}} + + + + + {{item.description}} + + + + + {{item.participants}}人已参与 + + + + + + + + + 暂无相关活动 + + + \ No newline at end of file diff --git a/miniprogram/pages/activities/activities.wxss b/miniprogram/pages/activities/activities.wxss new file mode 100644 index 0000000..903da9b --- /dev/null +++ b/miniprogram/pages/activities/activities.wxss @@ -0,0 +1,207 @@ +/* 页面容器 */ +.activity-list-container { + padding: 20rpx 30rpx; + background-color: #f8f9fa; + min-height: 100vh; + box-sizing: border-box; +} + +/* 页面标题 */ +.page-header { + margin-bottom: 30rpx; + text-align: center; +} + +.page-title { + font-size: 36rpx; + font-weight: bold; + color: #333; + margin-bottom: 10rpx; + display: inline-block; +} + +.page-subtitle { + font-size: 24rpx; + color: #666; +} + +/* 搜索框 */ +.search-box { + display: flex; + align-items: center; + background-color: #fff; + border-radius: 60rpx; + padding: 15rpx 25rpx; + margin-bottom: 30rpx; + box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.05); +} + +.search-icon { + margin-right: 15rpx; +} + +.search-input { + flex: 1; + font-size: 28rpx; + height: 50rpx; + line-height: 50rpx; +} + +/* 分类标签 */ +.category-tabs { + display: flex; + overflow-x: auto; + padding-bottom: 10rpx; + margin-bottom: 30rpx; + scrollbar-width: none; /* 隐藏滚动条 */ +} + +.category-tabs::-webkit-scrollbar { + display: none; /* 隐藏滚动条 */ +} + +.category-tab { + padding: 12rpx 30rpx; + background-color: #fff; + border-radius: 60rpx; + font-size: 26rpx; + color: #666; + margin-right: 15rpx; + white-space: nowrap; + box-shadow: 0 2rpx 5rpx rgba(0, 0, 0, 0.03); +} + +.category-tab.active { + background-color: #51bdb6; + color: #fff; +} + +/* 活动列表 */ +.activities-grid { + display: grid; + grid-template-columns: 1fr 1fr; + gap: 25rpx; +} + +/* 活动卡片 */ +.activity-card { + background-color: #fff; + border-radius: 18rpx; + overflow: hidden; + box-shadow: 0 3rpx 15rpx rgba(0, 0, 0, 0.05); + transition: transform 0.3s ease, box-shadow 0.3s ease; +} + +.activity-card:active { + transform: translateY(2rpx); + box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.03); +} + +/* 活动图片 */ +.activity-image-container { + position: relative; + width: 100%; +} + +.activity-image { + width: 100%; + height: 200rpx; + object-fit: cover; +} + +/* 活动状态标签 */ +.activity-tag { + position: absolute; + top: 15rpx; + right: 15rpx; + padding: 5rpx 15rpx; + border-radius: 20rpx; + font-size: 22rpx; + color: #fff; +} + +.activity-tag.ongoing { + background-color: #51bdb6; +} + +.activity-tag.upcoming { + background-color: #f5a623; +} + +/* 活动信息 */ +.activity-info { + padding: 20rpx; +} + +.activity-title { + font-size: 28rpx; + font-weight: bold; + color: #333; + margin-bottom: 15rpx; + display: -webkit-box; + -webkit-line-clamp: 2; + -webkit-box-orient: vertical; + overflow: hidden; + line-height: 1.4; +} + +/* 时间信息 */ +.activity-time { + display: flex; + align-items: center; + margin-bottom: 12rpx; + font-size: 22rpx; + color: #666; +} + +.time-text { + margin-left: 8rpx; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; +} + +/* 活动简介 */ +.activity-desc { + font-size: 24rpx; + color: #999; + margin-bottom: 15rpx; + display: -webkit-box; + -webkit-line-clamp: 2; + -webkit-box-orient: vertical; + overflow: hidden; + line-height: 1.4; +} + +/* 参与人数 */ +.activity-participants { + display: flex; + align-items: center; + font-size: 22rpx; + color: #666; +} + +.participants-text { + margin-left: 8rpx; +} + +/* 空状态 */ +.empty-state { + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + margin-top: 200rpx; +} + +.empty-image { + width: 300rpx; + height: 300rpx; + margin-bottom: 30rpx; +} + +.empty-text { + font-size: 28rpx; + color: #999; +} + \ No newline at end of file diff --git a/miniprogram/pages/user/user.wxml b/miniprogram/pages/user/user.wxml index ef37c33..473aeaa 100644 --- a/miniprogram/pages/user/user.wxml +++ b/miniprogram/pages/user/user.wxml @@ -50,7 +50,7 @@ - 我的订单 + 我的兑换 @@ -104,7 +104,7 @@ - +