From 4d8420e51aa39dd4c8bb49ae98c05aaf2479fcb1 Mon Sep 17 00:00:00 2001 From: cloudroam <cloudroam> Date: 星期五, 06 六月 2025 10:48:47 +0800 Subject: [PATCH] 用户信息 --- pages/home/home.vue | 70 ++++++++++++++++++++++++++++------ 1 files changed, 57 insertions(+), 13 deletions(-) diff --git a/pages/home/home.vue b/pages/home/home.vue index a71e374..a4f2ad9 100644 --- a/pages/home/home.vue +++ b/pages/home/home.vue @@ -43,7 +43,7 @@ <Community v-for="(item, index) in communitys" :key="index" :avatar="item.avatar" :nickname="item.nickname" :time="formatRelativeTime(item.createTime)" :image="item.coverUrl" :content="item.coverAlt" :likeCount="item.likeCount" :commentCount="item.commentCount" /> - + <up-loadmore :status="communityStatus" :line="true" /> <view style="height: 300rpx;"></view> </view> @@ -53,7 +53,7 @@ <script setup lang="ts"> import { ref, computed, onMounted } from 'vue' -import { onShow } from '@dcloudio/uni-app' +import { onShow, onPullDownRefresh, onReachBottom } from '@dcloudio/uni-app' import HomeMain from './home-main.vue' import TripCard from './trip-card.vue' @@ -62,11 +62,11 @@ import Community from './community.vue' import { SwiperChangeEvent } from '@dcloudio/uni-app' import { useGlobal } from '@/composables/useGlobal' -import { number } from 'uview-plus/libs/function/test' const { $http, $message, $store } = useGlobal() import { FilmWorks } from '@/types/index' import { formatRelativeTime } from '@/utils/time' import { FilmWorksCategory } from '@/enums/dict' + // 主题 const theme = ref('light') @@ -85,14 +85,18 @@ // 分页后的数组,每页3条 const pagedTripCards = computed(() => { const pages: FilmWorks[][] = [] - for (let i = 0; i < tripCardList.value.length; i += pageSize) { - pages.push(tripCardList.value.slice(i, i + pageSize)) + const list = tripCardList.value || [] // 安全兜底 + for (let i = 0; i < list.length; i += pageSize) { + pages.push(list.slice(i, i + pageSize)) } return pages }) // 总页数 -const totalPages = computed(() => Math.ceil(tripCardList.value.length / pageSize)) +const totalPages = computed(() => { + const list = tripCardList.value || [] // 安全兜底 + return Math.ceil(list.length / pageSize) +}) // 场景博物馆卡片数据 const cardList = ref([ @@ -135,22 +139,63 @@ getCommunitys() }); -async function getContentSelected() { - tripCardList.value = await getFilmWorks(FilmWorksCategory.CONTENT_SELECTED, 20); - console.log('内容精选', tripCardList.value); + +onPullDownRefresh(async () => { + console.log('用户下拉刷新了') + // 内容精选 + getContentSelected() + // 光影社区 + communityPage.value = 1 + getCommunitys() + uni.stopPullDownRefresh() // 停止下拉刷新动画 +}) + +onReachBottom(() => { + console.log('用户触底了') + getCommunitys() +}) + +const getContentSelected = async () => { + tripCardList.value = await getFilmWorks(FilmWorksCategory.CONTENT_SELECTED, 20, 1); } -async function getCommunitys() { - communitys.value = await getFilmWorks(FilmWorksCategory.COMMUNITY, 10); + +const communityPage = ref(1) +const communitySize = 10 +const communityStatus = ref('loading') +const getCommunitys = async () => { + if (communityStatus.value === 'nomore') return + + communityStatus.value = 'loading' + + const records = await getFilmWorks(FilmWorksCategory.COMMUNITY, communitySize, communityPage.value) + + if (records && records.length > 0) { + // 使用 Set 进行去重 + const existingIds = new Set(communitys.value.map(item => item.id)) + const uniqueRecords = records.filter(item => !existingIds.has(item.id)) + + communitys.value = [...communitys.value, ...uniqueRecords] + + // 如果返回的记录数少于请求的 size,说明没有更多数据 + if (records.length < communitySize) { + communityStatus.value = 'noMore' + } + + communityPage.value++ + } else { + communityStatus.value = 'noMore' + } } // 内容精选 -const getFilmWorks = async (type: String, pageSize: Number) => { +const getFilmWorks = async (type: String, pageSize: Number, currentPage: Number) => { const { code, data } = await $http.request('get', '/api/filmWorks/list', { params: { classify: type, size: pageSize, + current: currentPage } }) if (code == 0) { @@ -159,7 +204,6 @@ $message.showToast('系统异常,无法获取数据') return null; } - } // 下一页 -- Gitblit v1.9.3