diff --git a/apps/web/src/app/main/home/components/CategorySection.tsx b/apps/web/src/app/main/home/components/CategorySection.tsx index c2eff20..81b201a 100755 --- a/apps/web/src/app/main/home/components/CategorySection.tsx +++ b/apps/web/src/app/main/home/components/CategorySection.tsx @@ -84,9 +84,6 @@ const CategorySection = () => { // description: term.description // })) || []; // },[data]) - - - const handleMouseEnter = useCallback((index: number) => { setHoveredIndex(index); }, []); diff --git a/apps/web/src/app/main/home/components/CoursesSection.tsx b/apps/web/src/app/main/home/components/CoursesSection.tsx index 1b7edd7..efa7270 100755 --- a/apps/web/src/app/main/home/components/CoursesSection.tsx +++ b/apps/web/src/app/main/home/components/CoursesSection.tsx @@ -1,6 +1,6 @@ import React, { useState, useMemo, useEffect } from 'react'; import { useNavigate, useParams, useSearchParams } from 'react-router-dom'; -import { Button, Card, Typography, Tag, Progress, Spin } from 'antd'; +import { Button, Card, Typography, Tag, Progress, Spin, Empty } from 'antd'; import { PlayCircleOutlined, UserOutlined, @@ -17,7 +17,6 @@ interface GetTaxonomyProps { categories: string[]; isLoading: boolean; } - function useGetTaxonomy({ type }): GetTaxonomyProps { const { data, isLoading }: { data: TermDto[], isLoading: boolean } = api.term.findMany.useQuery({ where: { @@ -40,8 +39,11 @@ function useGetTaxonomy({ type }): GetTaxonomyProps { }, [data]); return { categories, isLoading } } +// 修改useGetName中的查询条件 +// 不同分类跳转 + const { Title, Text } = Typography; interface Course { @@ -63,6 +65,25 @@ interface CoursesSectionProps { isLoading:boolean initialVisibleCoursesCount?: number; } +function useFetchCoursesByCategory(category: string) { + const isAll = category === '全部'; + const { data, isLoading } = api.post.findMany.useQuery({ + where: isAll?{}:{ + terms: { + some: { + name:category + }, + }, + }, + take: 8, + include:{ + terms:true + } + }); + + return { data, isLoading }; +} + const CoursesSection: React.FC = ({ title, @@ -77,39 +98,22 @@ const CoursesSection: React.FC = ({ const gateGory: GetTaxonomyProps = useGetTaxonomy({ type: TaxonomySlug.CATEGORY, }) - // const { data } = api.post.findMany.useQuery({ - // where: {}, // 必选参数 - // include: { // 关联查询 - // instructors: true - // }, - // orderBy: { // 排序规则 - // createdAt: 'desc' - // }, - // take: 8 - // }) - // useEffect(() => { - // // 添加空值保护 - // if (data && data.length > 0) { - // console.log('有效数据:', data) - // // 执行后续操作 - // } else { - // console.log('无数据或加载中') - // } - // }, [data]) - // const formatted = data?.map(course => ({ - // id: course.id, - // title: course.title - // })); - const handleClick = (course: Course) => { - navigate(`/course?courseId=${course.id}/detail`); - } + const handleClick = (course: Course) => { + navigate(`/course/${course.id}/detail`); + } + const { data } = useFetchCoursesByCategory(selectedCategory); + + useEffect(()=>{ + console.log('data:', data) + }) const filteredCourses = useMemo(() => { return selectedCategory === '全部' ? courses : courses.filter((course) => course.category === selectedCategory); }, [selectedCategory, courses]); + const displayedCourses = isLoading ? [] : filteredCourses.slice(0, visibleCourses); return (
@@ -140,12 +144,22 @@ const CoursesSection: React.FC = ({ : 'bg-white text-gray-600 hover:bg-gray-100' }`} >全部 - { + {gateGory.categories.length === 0 && ( + + )}:{ gateGory.categories.map((category) => ( setSelectedCategory(category)} + onClick={() => { + setSelectedCategory(category) + // console.log(gateGory) + } + } + className={`px-6 py-2 text-base cursor-pointer rounded-full transition-all duration-300 ${selectedCategory === category ? 'bg-blue-600 text-white shadow-lg' : 'bg-white text-gray-600 hover:bg-gray-100' @@ -155,6 +169,7 @@ const CoursesSection: React.FC = ({ )) } + ) } @@ -229,7 +244,7 @@ const CoursesSection: React.FC = ({ - 观看次数{course.progress}次 + 观看次数{course.progress}
@@ -262,7 +277,7 @@ const CoursesSection: React.FC = ({
- )} +)}
); diff --git a/apps/web/src/app/main/home/page.tsx b/apps/web/src/app/main/home/page.tsx index 3a7b2af..b1a2b82 100755 --- a/apps/web/src/app/main/home/page.tsx +++ b/apps/web/src/app/main/home/page.tsx @@ -127,12 +127,10 @@ const HomePage = () => { }); useEffect(() => { if (data) { - console.log('mockCourses data:', data); + console.log('Courses data:', data); } }, [data]); - - // 数据处理逻辑 -// 修正依赖数组 + return (