diff --git a/api/topic.js b/api/topic.js index ca07c7e..38c9889 100644 --- a/api/topic.js +++ b/api/topic.js @@ -13,4 +13,11 @@ export const fetchTopicCategories = async (data) => { url: "/api/rating/topic/category/list", method: "GET", }); -}; \ No newline at end of file +}; + +export const fetchTopicList = async (categoryId, page = 1) => { + return request({ + url: `/api/rating/topic/list/${categoryId}?page=${page}`, + method: "GET", + }); +}; diff --git a/pages/index/index.vue b/pages/index/index.vue index 8daddf2..cb54ddc 100644 --- a/pages/index/index.vue +++ b/pages/index/index.vue @@ -20,13 +20,13 @@ - {{ category.name }} - + {{ category.title }} + @@ -109,6 +109,7 @@ import { } from "@dcloudio/uni-app"; import { useUserStore } from "@/stores/user"; import { getShareReward } from "@/api/system"; +import { fetchTopicList, fetchTopicCategories } from "@/api/topic"; import { getShareToken, saveViewRequest } from "@/utils/common.js"; import LoginPopup from "@/components/LoginPopup/LoginPopup.vue"; import adManager from "@/utils/adManager.js"; @@ -119,36 +120,68 @@ const userInfo = computed(() => userStore?.userInfo || {}); const loading = ref(false); const hasMore = ref(true); -const currentCategory = ref(0); +const currentCategoryId = ref(''); +const categories = ref([]); +const currentPage = ref(1); -const categories = ref([ - { id: 0, name: '全部' }, - { id: 1, name: '历史' }, - { id: 2, name: '皇帝' }, - { id: 3, name: '数码' }, - { id: 4, name: '手机' }, - { id: 5, name: '城市' }, - { id: 6, name: '生活' }, -]); +const loadCategories = async () => { + try { + const res = await fetchTopicCategories(); + // 提取真实数据数组 + const list = res?.data?.list || res?.list || res || []; + + // 增加一个“全部”的默认选项,id 置空 + categories.value = [{ id: '', title: '全部' }, ...list]; + + // 初始化选中的ID为“全部” + if (!currentCategoryId.value && categories.value.length > 0) { + currentCategoryId.value = categories.value[0].id; + } + + // 加载初始列表 + loadTopicList(currentCategoryId.value, currentPage.value); + } catch (error) { + console.error("获取分类失败:", error); + // 兜底数据 + categories.value = [ + { id: '', title: '全部' }, + { id: 1, title: '历史' }, + { id: 2, title: '数码' }, + ]; + // 使用兜底也尝试加载一次 + loadTopicList(currentCategoryId.value, currentPage.value); + } +}; -const switchCategory = (index) => { - if (currentCategory.value === index) return; - currentCategory.value = index; - // 切换分类时重新加载数据 - topicList.value = []; - loading.value = true; - hasMore.value = true; - setTimeout(() => { - // 模拟根据分类筛选数据 - const filteredData = mockData.filter(item => { - if (index === 0) return true; - const categoryName = categories.value[index].name; - return item.tags.includes(categoryName); - }); - topicList.value = [...filteredData]; +const loadTopicList = async (categoryId, page = 1) => { + if (page === 1) { + topicList.value = []; + } + try { + loading.value = true; + const res = await fetchTopicList(categoryId, page); + // 提取真实数据数组 + const list = res?.list || []; + + // 合并数据 + topicList.value = [...topicList.value, ...list]; + hasMore.value = list.length >= 5; + } catch (error) { + console.error("获取主题列表失败:", error); + hasMore.value = false; + } finally { loading.value = false; - hasMore.value = filteredData.length >= 10 ? true : false; - }, 500); + } +}; + +const switchCategory = (categoryId) => { + if (currentCategoryId.value === categoryId) return; + currentCategoryId.value = categoryId; + + // 切换分类时重新加载数据 + currentPage.value = 1; + hasMore.value = true; + loadTopicList(categoryId, currentPage.value); }; const mockData = [ @@ -213,7 +246,7 @@ const initData = () => { if (adManager.isAdShowing) return; // 防止广告页返回时立即重新渲染引发 insertTextView:fail }; -onLoad((options) => { +onLoad(async (options) => { uni.$trackRecord({ eventName: "index_page_visit", eventType: `visit`, @@ -221,6 +254,8 @@ onLoad((options) => { if (options.shareToken) { saveViewRequest(options.shareToken, "index"); } + await loadCategories(); // 初始化时加载分类 + await loadTopicList(currentCategoryId.value); // 初始化时加载主题列表 initData(); }); @@ -236,26 +271,18 @@ const handleLoginSuccess = () => { }; // 下拉刷新 -onPullDownRefresh(() => { - setTimeout(() => { - topicList.value = [...mockData]; - hasMore.value = true; - uni.stopPullDownRefresh(); - }, 1000); +onPullDownRefresh(async () => { + currentPage.value = 1; + hasMore.value = true; + await loadTopicList(currentCategoryId.value, currentPage.value); + uni.stopPullDownRefresh(); }); // 上拉加载更多 onReachBottom(() => { if (!hasMore.value || loading.value) return; - loading.value = true; - setTimeout(() => { - const newData = mockData.map(item => ({ ...item, id: item.id + topicList.value.length })); - topicList.value.push(...newData); - loading.value = false; - if (topicList.value.length >= 10) { - hasMore.value = false; - } - }, 1000); + currentPage.value += 1; + loadTopicList(currentCategoryId.value, currentPage.value); }); onShareAppMessage(async () => {