diff --git a/apps/web/src/app/main/home/components/CoursesSection.tsx b/apps/web/src/app/main/home/components/CoursesSection.tsx index fc7e3a9..b4938b0 100755 --- a/apps/web/src/app/main/home/components/CoursesSection.tsx +++ b/apps/web/src/app/main/home/components/CoursesSection.tsx @@ -39,28 +39,27 @@ function useGetTaxonomy({ type }): GetTaxonomyProps { }, [data]); return { categories, isLoading } } -// 修改useGetName中的查询条件 - +// 不同分类跳转 function useFetchCoursesByCategory(category: string) { const isAll = category === '全部'; - const { data, isLoading}:{data:CourseDto[],isLoading:boolean} = api.post.findMany.useQuery({ - where: isAll?{}:{ + const { data, isLoading }: { data: CourseDto[], isLoading: boolean } = api.post.findMany.useQuery({ + where: isAll ? {} : { terms: { some: { - name:category + name: category }, }, }, take: 8, - include:{ - terms:true + include: { + terms: true } }); - return { data, isLoading}; + return { data, isLoading }; } -// 不同分类跳转 + const { Title, Text } = Typography; @@ -80,7 +79,7 @@ interface CoursesSectionProps { title: string; description: string; courses: Course[]; - isLoading:boolean + isLoading: boolean initialVisibleCoursesCount?: number; } @@ -98,38 +97,15 @@ const CoursesSection: React.FC = ({ const gateGory: GetTaxonomyProps = useGetTaxonomy({ type: TaxonomySlug.CATEGORY, }) - const { data ,isLoading : isDataLoading} = useFetchCoursesByCategory(selectedCategory); - useEffect(()=>{ + const { data, isLoading: isDataLoading } = useFetchCoursesByCategory(selectedCategory); + useEffect(() => { console.log('data:', data) }) - // 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: CourseDto) => { navigate(`/course/${course.id}/detail`); } - useEffect(()=>{ + useEffect(() => { console.log('data:', data) }) const filteredCourses = useMemo(() => { @@ -168,38 +144,37 @@ const CoursesSection: React.FC = ({ : 'bg-white text-gray-600 hover:bg-gray-100' }`} >全部 - {gateGory.categories.length === 0 && ( - - )}:{ - gateGory.categories.map((category) => ( - { - setSelectedCategory(category) - console.log(category) - }} - 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' - }`} - - > - {category} - - )) + {gateGory.categories.map((category) => ( + { + setSelectedCategory(category) + console.log(category) + }} + 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' + }`} + + > + {category} + + + )) } - + ) }
- {displayedCourses?.map((course) => ( + {displayedCourses.length=== 0 ? ( +
+ +
+ ) : displayedCourses?.map((course) => ( handleClick(course)} key={course.id} @@ -249,7 +224,6 @@ const CoursesSection: React.FC = ({
- {/* {course.} */}
@@ -287,7 +261,7 @@ const CoursesSection: React.FC = ({
-)} + )} );