From 6ad65b1e717dbf28dc7d3a07bed8b7d2ccfcdccc Mon Sep 17 00:00:00 2001 From: Li1304553726 <1304553726@qq.com> Date: Wed, 26 Feb 2025 10:25:25 +0800 Subject: [PATCH] add . --- .../main/courses/components/CourseCard.tsx | 21 --- .../main/home/components/CategorySection.tsx | 2 +- .../main/home/components/CoursesSection.tsx | 170 +++++++++--------- apps/web/src/app/main/layout/MainLayout.tsx | 4 +- 4 files changed, 88 insertions(+), 109 deletions(-) diff --git a/apps/web/src/app/main/courses/components/CourseCard.tsx b/apps/web/src/app/main/courses/components/CourseCard.tsx index 963c691..40aa8da 100755 --- a/apps/web/src/app/main/courses/components/CourseCard.tsx +++ b/apps/web/src/app/main/courses/components/CourseCard.tsx @@ -58,24 +58,6 @@ export default function CourseCard({ course }: CourseCardProps) { ); })} - {/* - {course.terms?.[0].name} - - - - - {course.terms?.[1].name} - */} 1 ?`${course.depts[0].name}等`:course.depts[0].name } - {/* {course?.depts?.map((dept) => {return dept.name.length > 1 ?`${dept.name.slice}等`: dept.name})} */} - {/* {course?.depts?.map((dept)=>{return dept.name})} */} </Text> </div> <span className="text-xs font-medium text-gray-500"> {course?.meta?.views ? `观看次数 ${course?.meta?.views}` : null} </span> </div> - <div className="pt-4 border-t border-gray-100 text-center"> <Button type="primary" diff --git a/apps/web/src/app/main/home/components/CategorySection.tsx b/apps/web/src/app/main/home/components/CategorySection.tsx index f3ed9ec..40043a3 100755 --- a/apps/web/src/app/main/home/components/CategorySection.tsx +++ b/apps/web/src/app/main/home/components/CategorySection.tsx @@ -41,7 +41,7 @@ const CategorySection = () => { window.scrollTo({top: 0,behavior: "smooth",}) },[]); return ( - <section className="py-32 relative overflow-hidden"> + <section className="py-8 relative overflow-hidden"> <div className="max-w-screen-2xl mx-auto px-4 relative"> <div className="text-center mb-24"> <Title diff --git a/apps/web/src/app/main/home/components/CoursesSection.tsx b/apps/web/src/app/main/home/components/CoursesSection.tsx index aa2bf07..e78bc48 100755 --- a/apps/web/src/app/main/home/components/CoursesSection.tsx +++ b/apps/web/src/app/main/home/components/CoursesSection.tsx @@ -6,98 +6,98 @@ import { CoursesSectionTag } from "./CoursesSectionTag"; import CourseList from "@web/src/components/models/course/list/CourseList"; import LookForMore from "./LookForMore"; interface GetTaxonomyProps { - categories: string[]; - isLoading: boolean; + categories: string[]; + isLoading: boolean; } function useGetTaxonomy({ type }): GetTaxonomyProps { - const { data, isLoading }: { data: TermDto[]; isLoading: boolean } = - api.term.findMany.useQuery({ - where: { - taxonomy: { - slug: type, - }, - }, - take: 10, // 只取前10个 - }); - const categories = useMemo(() => { - const allCategories = isLoading - ? [] - : data?.map((course) => course.name); - return [...Array.from(new Set(allCategories))]; - }, [data]); - return { categories, isLoading }; + const { data, isLoading }: { data: TermDto[]; isLoading: boolean } = + api.term.findMany.useQuery({ + where: { + taxonomy: { + slug: type, + }, + }, + take: 10, // 只取前10个 + }); + const categories = useMemo(() => { + const allCategories = isLoading + ? [] + : data?.map((course) => course.name); + return [...Array.from(new Set(allCategories))]; + }, [data]); + return { categories, isLoading }; } const { Title, Text } = Typography; interface CoursesSectionProps { - title: string; - description: string; - initialVisibleCoursesCount?: number; + title: string; + description: string; + initialVisibleCoursesCount?: number; } const CoursesSection: React.FC<CoursesSectionProps> = ({ - title, - description, - initialVisibleCoursesCount = 8, + title, + description, + initialVisibleCoursesCount = 8, }) => { - const [selectedCategory, setSelectedCategory] = useState<string>("全部"); - const gateGory: GetTaxonomyProps = useGetTaxonomy({ - type: TaxonomySlug.CATEGORY, - }); - return ( - <section className="relative py-20 overflow-hidden bg-gradient-to-b from-gray-50 to-white"> - <div className="max-w-screen-2xl mx-auto px-6 relative"> - <div className="flex justify-between items-end mb-16"> - <div> - <Title - level={2} - className="font-bold text-5xl mb-6 bg-gradient-to-r from-blue-600 to-purple-600 bg-clip-text text-transparent"> - {title} - - - {description} - - - -
- {gateGory.isLoading ? ( - - ) : ( - <> - {["全部", ...gateGory.categories].map( - (category, idx) => ( - - ) - )} - - )} -
- - - - - ); + const [selectedCategory, setSelectedCategory] = useState("全部"); + const gateGory: GetTaxonomyProps = useGetTaxonomy({ + type: TaxonomySlug.CATEGORY, + }); + return ( +
+
+
+
+ + {title} + + + {description} + +
+
+
+ {gateGory.isLoading ? ( + + ) : ( + <> + {["全部", ...gateGory.categories].map( + (category, idx) => ( + + ) + )} + + )} +
+ + +
+
+ ); }; export default CoursesSection; diff --git a/apps/web/src/app/main/layout/MainLayout.tsx b/apps/web/src/app/main/layout/MainLayout.tsx index 0a0074b..b573e2f 100755 --- a/apps/web/src/app/main/layout/MainLayout.tsx +++ b/apps/web/src/app/main/layout/MainLayout.tsx @@ -9,9 +9,9 @@ const { Content } = Layout; export function MainLayout() { return ( - + - +