hookehuyr

feat(活动排行榜): 添加家庭活动排行榜页面及导航入口

- 创建活动排行榜页面,包含黄埔榜和上海榜两个榜单
- 实现排行榜前三名特殊展示样式和其他排名列表
- 在Dashboard页面添加排行榜入口按钮
- 更新app.config.js添加新页面路由
/*
* @Date: 2025-06-28 10:33:00
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2025-08-29 15:56:45
* @LastEditTime: 2025-09-01 13:08:15
* @FilePath: /lls_program/src/app.config.js
* @Description: 文件描述
*/
......@@ -32,6 +32,7 @@ export default {
'pages/ActivitiesCover/index',
'pages/PointsList/index',
'pages/UploadMedia/index',
'pages/FamilyRank/index',
],
window: {
backgroundTextStyle: 'light',
......
......@@ -79,6 +79,15 @@
</template>
</WeRunAuth>
<!-- 活动排行榜 -->
<view class="px-5 mb-4 mt-4">
<view @tap="openFamilyRank" class="w-full bg-blue-500 text-white py-3 rounded-lg flex flex-col items-center justify-center">
<view class="flex items-center justify-center">
活动排行榜
</view>
</view>
</view>
<!-- Family album -->
<view class="p-5 mt-4 mb-6 bg-white rounded-xl shadow-md mx-4">
<view class="flex justify-between items-center mb-2">
......@@ -89,16 +98,16 @@
</view>
<p class="text-sm text-gray-500 mb-3">记录每一个家庭活动瞬间</p>
<view class="grid grid-cols-2 gap-3">
<view
v-for="(item, index) in albumData"
<view
v-for="(item, index) in albumData"
:key="index"
class="rounded-lg overflow-hidden h-32 relative cursor-pointer"
@click="handleMediaClick(item, albumData)"
>
<image
:src="item.type === 'video' ? item.thumbnail : item.url"
alt="家庭活动照片"
class="w-full h-full object-cover rounded-lg"
<image
:src="item.type === 'video' ? item.thumbnail : item.url"
alt="家庭活动照片"
class="w-full h-full object-cover rounded-lg"
/>
<!-- 视频标识 -->
<view
......@@ -112,7 +121,7 @@
</view>
<BottomNav />
<!-- 图片预览 -->
<nut-image-preview
v-model:show="previewVisible"
......@@ -307,6 +316,13 @@ const openCamera = () => {
Taro.navigateTo({ url: '/pages/UploadMedia/index' });
}
/**
* 打开活动排行榜
*/
const openFamilyRank = () => {
Taro.navigateTo({ url: '/pages/FamilyRank/index' });
}
const initPageData = async () => {
// 获取用户信息
familyName.value = '张爷爷的家庭'
......
export default {
navigationBarTitleText: '活动排行榜',
usingComponents: {
},
}
This diff is collapsed. Click to expand it.