This commit is contained in:
Li1304553726 2025-02-25 17:45:18 +08:00
commit 9c717a10df
2 changed files with 29 additions and 39 deletions

View File

@ -14,6 +14,7 @@ import {
} from "@nice/common"; } from "@nice/common";
import { api } from "@nice/client"; import { api } from "@nice/client";
import CourseCard from "../../courses/components/CourseCard"; import CourseCard from "../../courses/components/CourseCard";
import { CoursesSectionTag } from "./CoursesSectionTag";
interface GetTaxonomyProps { interface GetTaxonomyProps {
categories: string[]; categories: string[];
isLoading: boolean; isLoading: boolean;
@ -111,51 +112,16 @@ const CoursesSection: React.FC<CoursesSectionProps> = ({
<Spin className="m-3" /> <Spin className="m-3" />
) : ( ) : (
<> <>
<Tag {['全部',...gateGory.categories].map((category) => (
color={ <CoursesSectionTag category= {category} selectedCategory={selectedCategory} setSelectedCategory={setSelectedCategory}/>
selectedCategory === "全部"
? "blue"
: "default"
}
onClick={() => setSelectedCategory("全部")}
className={`px-6 py-2 text-base cursor-pointer rounded-full transition-all duration-300 ${
selectedCategory === "全部"
? "bg-blue-600 text-white shadow-lg"
: "bg-white text-gray-600 hover:bg-gray-100"
}`}>
</Tag>
{gateGory.categories.map((category) => (
<Tag
key={category}
color={
selectedCategory === category
? "blue"
: "default"
}
onClick={() => {
setSelectedCategory(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}
</Tag>
))} ))}
</> </>
)} )}
</div> </div>
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-8"> <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-8">
{displayedCourses.length === 0 ? ( {isDataLoading ? (
<div className="col-span-full"> <Spin className="m-3" />
<Empty
description="暂无课程"
image={Empty.PRESENTED_IMAGE_DEFAULT}
/>
</div>
) : ( ) : (
displayedCourses?.map((course) => ( displayedCourses?.map((course) => (
<CourseCard course={course}></CourseCard> <CourseCard course={course}></CourseCard>

View File

@ -0,0 +1,24 @@
import { Tag } from "antd";
export function CoursesSectionTag({category, selectedCategory, setSelectedCategory}) {
return (
<>
<Tag
key={category}
color={
selectedCategory === category
? "blue"
: "default"
}
onClick={() => {
setSelectedCategory(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}
</Tag>
</>
)
}