From 23b72c261139bd43795f3e552fba19cdab2c556c Mon Sep 17 00:00:00 2001
From: Rao <1227431568@qq.com>
Date: Wed, 26 Feb 2025 10:19:17 +0800
Subject: [PATCH] rht02261019

---
 .../main/courses/components/CourseCard.tsx    |   1 +
 .../main/courses/components/FilterSection.tsx |  17 ++-
 .../app/main/home/components/HeroSection.tsx  | 104 +++++++++---------
 .../models/term/term-parent-selector.tsx      |  55 +++++++++
 apps/web/src/routes/index.tsx                 |  10 +-
 5 files changed, 126 insertions(+), 61 deletions(-)
 create mode 100644 apps/web/src/components/models/term/term-parent-selector.tsx

diff --git a/apps/web/src/app/main/courses/components/CourseCard.tsx b/apps/web/src/app/main/courses/components/CourseCard.tsx
index 45dc274..7b6cae1 100755
--- a/apps/web/src/app/main/courses/components/CourseCard.tsx
+++ b/apps/web/src/app/main/courses/components/CourseCard.tsx
@@ -16,6 +16,7 @@ export default function CourseCard({ course }: CourseCardProps) {
 	const navigate = useNavigate();
 	const handleClick = (course: CourseDto) => {
 		navigate(`/course/${course.id}/detail`);
+		window.scrollTo({top: 0,behavior: "smooth",})
 	};
 
 	return (
diff --git a/apps/web/src/app/main/courses/components/FilterSection.tsx b/apps/web/src/app/main/courses/components/FilterSection.tsx
index 203e1d1..01ffba6 100755
--- a/apps/web/src/app/main/courses/components/FilterSection.tsx
+++ b/apps/web/src/app/main/courses/components/FilterSection.tsx
@@ -7,6 +7,7 @@ import { api } from "@nice/client";
 import { useSearchParams } from "react-router-dom";
 import TermSelect from "@web/src/components/models/term/term-select";
 import { useMainContext } from "../../layout/MainProvider";
+import TermParentSelector from "@web/src/components/models/term/term-parent-selector";
 
 export default function FilterSection() {
 	const { data: taxonomies } = api.taxonomy.getAll.useQuery({});
@@ -28,7 +29,19 @@ export default function FilterSection() {
 						<h3 className="text-lg font-medium mb-4">
 							{tax?.name}
 						</h3>
-						<TermSelect
+						<TermParentSelector
+							value={items}
+							slug = {tax?.slug}
+							className="w-70 max-h-[500px] overscroll-contain overflow-x-hidden"
+							onChange={(selected) =>
+								handleTermChange(
+									tax?.slug,
+									selected as string[]
+								)
+							}
+							taxonomyId={tax?.id}
+						></TermParentSelector>
+						{/* <TermSelect
 							// open
 							className="w-72"
 							value={items}
@@ -46,7 +59,7 @@ export default function FilterSection() {
 							}></TermSelect>
 						{index < taxonomies.length - 1 && (
 							<Divider className="my-6" />
-						)}
+						)} */}
 					</div>
 				);
 			})}
diff --git a/apps/web/src/app/main/home/components/HeroSection.tsx b/apps/web/src/app/main/home/components/HeroSection.tsx
index 10ecbfe..17aa228 100755
--- a/apps/web/src/app/main/home/components/HeroSection.tsx
+++ b/apps/web/src/app/main/home/components/HeroSection.tsx
@@ -1,10 +1,9 @@
-import React, { useRef, useCallback, useEffect } from "react";
-import { Button, Carousel, Typography } from "antd";
+import React, { useRef, useCallback, useEffect, useMemo, useState } from "react";
+import { Carousel, Typography } from "antd";
 import {
 	TeamOutlined,
 	BookOutlined,
 	StarOutlined,
-	ClockCircleOutlined,
 	LeftOutlined,
 	RightOutlined,
 	EyeOutlined,
@@ -24,36 +23,22 @@ interface CarouselItem {
 
 interface PlatformStat {
 	icon: React.ReactNode;
-	value: string;
+	value: number;
 	label: string;
 }
 
-const carouselItems: CarouselItem[] = [
-	{
-		title: "探索编程世界",
-		desc: "从零开始学习编程，开启你的技术之旅",
-		image: "/images/banner1.jpg",
-		action: "立即开始",
-		color: "from-blue-600/90",
-	},
-	{
-		title: "人工智能课程",
-		desc: "掌握AI技术，引领未来发展",
-		image: "/images/banner2.jpg",
-		action: "了解更多",
-		color: "from-purple-600/90",
-	},
-];
-
 const HeroSection = () => {
 	const carouselRef = useRef<CarouselRef>(null);
-	const { statistics, baseSetting } = useAppConfig();
-	const platformStats: PlatformStat[] = [
-		{ icon: <TeamOutlined />, value: statistics.staffs.toString(), label: "注册学员" },
-		{ icon: <StarOutlined />, value: statistics.courses.toString(), label: "精品课程" },
-		{ icon: <BookOutlined />, value: statistics.lectures.toString(), label: '课程章节' },
-		{ icon: <EyeOutlined />, value: statistics.reads.toString(), label: "观看次数" },
-	];
+	const { statistics, slides } = useAppConfig();
+	const [countStatistics, setCountStatistics] = useState<number>(0)
+	const platformStats: PlatformStat[] = useMemo(() => {
+		return [
+			{ icon: <TeamOutlined />, value: statistics.staffs, label: "注册学员" },
+			{ icon: <StarOutlined />, value: statistics.courses, label: "精品课程" },
+			{ icon: <BookOutlined />, value: statistics.lectures, label: '课程章节' },
+			{ icon: <EyeOutlined />, value: statistics.reads, label: "观看次数" },
+		];
+	}, [statistics]);
 	const handlePrev = useCallback(() => {
 		carouselRef.current?.prev();
 	}, []);
@@ -61,11 +46,16 @@ const HeroSection = () => {
 	const handleNext = useCallback(() => {
 		carouselRef.current?.next();
 	}, []);
-	const { slides }  = useAppConfig()
+
+	const countNonZeroValues = (statistics: Record<string, number>): number => {
+		return Object.values(statistics).filter(value => value !== 0).length;
+	};
+
 	useEffect(() => {
-		//slides.push(('https://s.cn.bing.net/th?id=OHR.GiantCuttlefish_ZH-CN0670915878_1920x1080.webp&qlt=50'))
-		//console.log(slides)
-	}, [])
+		const count = countNonZeroValues(statistics);
+		console.log(count);
+		setCountStatistics(count);
+	}, [statistics]);
 	return (
 		<section className="relative ">
 			<div className="group">
@@ -77,7 +67,7 @@ const HeroSection = () => {
 					dots={{
 						className: "carousel-dots !bottom-32 !z-20",
 					}}>
-					{Array.isArray(slides)?
+					{Array.isArray(slides) ?
 						(slides.map((item, index) => (
 							<div key={index} className="relative h-[600px]">
 								<div
@@ -97,9 +87,9 @@ const HeroSection = () => {
 								<div className="relative h-full max-w-7xl mx-auto px-6 lg:px-8"></div>
 							</div>
 						))
-					) : (
-						<div></div>
-					)}
+						) : (
+							<div></div>
+						)}
 				</Carousel>
 
 				{/* Navigation Buttons */}
@@ -118,25 +108,31 @@ const HeroSection = () => {
 			</div>
 
 			{/* Stats Container */}
-			<div className="absolute -bottom-20 left-1/2 -translate-x-1/2 w-2/3 max-w-6xl px-4">
-				<div className="rounded-2xl grid grid-cols-2 md:grid-cols-4 gap-4 md:gap-8 p-6 md:p-8 bg-white border shadow-xl hover:shadow-2xl transition-shadow duration-500 will-change-[transform,box-shadow]">
-					{platformStats.map((stat, index) => (
-						<div
-							key={index}
-							className="text-center transform hover:-translate-y-1 hover:scale-105 transition-transform duration-300 ease-out">
-							<div className="inline-flex items-center justify-center w-16 h-16 mb-4 rounded-full bg-primary-50 text-primary-600 text-3xl transition-colors duration-300 group-hover:text-primary-700">
-								{stat.icon}
-							</div>
-							<div className="text-2xl font-bold bg-gradient-to-r from-gray-800 to-gray-600 bg-clip-text text-transparent mb-1.5">
-								{stat.value}
-							</div>
-							<div className="text-gray-600 font-medium">
-								{stat.label}
-							</div>
+			{
+				countStatistics > 1 && (
+					<div className="absolute -bottom-20 left-1/2 -translate-x-1/2 w-3/5 max-w-6xl px-4">
+						<div className={`rounded-2xl grid grid-cols-${countStatistics} md:grid-cols-${countStatistics} gap-4 md:gap-8 p-6 md:p-8 bg-white border shadow-xl hover:shadow-2xl transition-shadow duration-500 will-change-[transform,box-shadow]`}>
+							{platformStats.map((stat, index) => {
+								return stat.value
+									? (<div
+										key={index}
+										className="text-center transform hover:-translate-y-1 hover:scale-105 transition-transform duration-300 ease-out">
+										<div className="inline-flex items-center justify-center w-16 h-16 mb-4 rounded-full bg-primary-50 text-primary-600 text-3xl transition-colors duration-300 group-hover:text-primary-700">
+											{stat.icon}
+										</div>
+										<div className="text-2xl font-bold bg-gradient-to-r from-gray-800 to-gray-600 bg-clip-text text-transparent mb-1.5">
+											{stat.value}
+										</div>
+										<div className="text-gray-600 font-medium">
+											{stat.label}
+										</div>
+									</div>
+									) : null
+							})}
 						</div>
-					))}
-				</div>
-			</div>
+					</div>
+				)
+			}
 		</section>
 	);
 };
diff --git a/apps/web/src/components/models/term/term-parent-selector.tsx b/apps/web/src/components/models/term/term-parent-selector.tsx
new file mode 100644
index 0000000..f4b365d
--- /dev/null
+++ b/apps/web/src/components/models/term/term-parent-selector.tsx
@@ -0,0 +1,55 @@
+import { api } from "@nice/client/";
+import { Checkbox, Form } from "antd";
+import { TermDto } from "@nice/common";
+import { useCallback, useEffect, useState } from "react";
+
+export default function TermParentSelector({
+    value,
+    onChange,
+    className,
+    placeholder = "选择分类",
+    multiple = true,
+    taxonomyId,
+    domainId,
+    style,
+}: any) {
+    const utils = api.useUtils();
+    const [selectedValues, setSelectedValues] = useState<string[]>([]); // 用于存储选中的值
+    const [termsData, setTermsData] = useState<any[]>([]);
+
+
+    const {
+        data,
+        isLoading,
+    }: { data: TermDto[]; isLoading: boolean } = api.term.findMany.useQuery({
+        where: {
+            taxonomy: {
+                id: taxonomyId,
+            },
+            parentId: null
+        },
+    });
+    const handleCheckboxChange = (checkedValues: string[]) => {
+        setSelectedValues(checkedValues); // 更新选中的值
+        if (onChange) {
+            onChange(checkedValues); // 调用外部传入的 onChange 回调
+        }
+    };
+    return (
+        <div className={className} style={style}>
+            <Form onFinish={null}>
+                <Form.Item name="categories">
+                    <Checkbox.Group onChange={handleCheckboxChange}>
+                        {data?.map((category) => (
+                            <div className="w-full h-9 p-2 my-1">
+                                <Checkbox className="text-base text-slate-700"  key={category.id} value={category.id}>
+                                    {category.name}
+                                </Checkbox>
+                            </div>
+                        ))}
+                    </Checkbox.Group>
+                </Form.Item>
+            </Form>
+        </div>
+    )
+}
\ No newline at end of file
diff --git a/apps/web/src/routes/index.tsx b/apps/web/src/routes/index.tsx
index 07c7c9c..7592489 100755
--- a/apps/web/src/routes/index.tsx
+++ b/apps/web/src/routes/index.tsx
@@ -68,11 +68,11 @@ export const routes: CustomRouteObject[] = [
 						path: "profiles",
 					},
 
-					// 课程预览页面
-					{
-						path: "coursePreview/:id?",
-						element: <CoursePreview></CoursePreview>,
-					},
+					// // 课程预览页面
+					// {
+					// 	path: "coursePreview/:id?",
+					// 	element: <CoursePreview></CoursePreview>,
+					// },
 				],
 			},
 			{