From f8f508676a103b6061d25c230dc15518b39baefe Mon Sep 17 00:00:00 2001
From: ditiqi <ditiqi@163.com>
Date: Mon, 24 Feb 2025 09:33:09 +0800
Subject: [PATCH] asddsa

---
 .../detail/CourseSyllabus/CourseSyllabus.tsx  | 99 ++++++++-----------
 1 file changed, 40 insertions(+), 59 deletions(-)

diff --git a/apps/web/src/components/models/course/detail/CourseSyllabus/CourseSyllabus.tsx b/apps/web/src/components/models/course/detail/CourseSyllabus/CourseSyllabus.tsx
index 3b04395..36eb086 100755
--- a/apps/web/src/components/models/course/detail/CourseSyllabus/CourseSyllabus.tsx
+++ b/apps/web/src/components/models/course/detail/CourseSyllabus/CourseSyllabus.tsx
@@ -6,7 +6,6 @@ import {
 } from "@heroicons/react/24/outline";
 import { ChevronLeftIcon, ChevronRightIcon } from "@heroicons/react/24/outline";
 import React, { useState, useRef, useContext } from "react";
-import { motion, AnimatePresence } from "framer-motion";
 import { SectionDto, TaxonomySlug } from "@nice/common";
 import { SyllabusHeader } from "./SyllabusHeader";
 import { SectionItem } from "./SectionItem";
@@ -30,11 +29,7 @@ export const CourseSyllabus: React.FC<CourseSyllabusProps> = ({
 	const { isHeaderVisible } = useContext(CourseDetailContext);
 	const [expandedSections, setExpandedSections] = useState<string[]>([]);
 	const sectionRefs = useRef<{ [key: string]: HTMLDivElement | null }>({});
-	// api.term.findMany.useQuery({
-	// 	where: {
-	// 		taxonomy: { slug: TaxonomySlug.CATEGORY },
-	// 	},
-	// });
+
 	const toggleSection = (sectionId: string) => {
 		setExpandedSections((prev) =>
 			prev.includes(sectionId)
@@ -42,70 +37,56 @@ export const CourseSyllabus: React.FC<CourseSyllabusProps> = ({
 				: [...prev, sectionId]
 		);
 
-		setTimeout(() => {
-			sectionRefs.current[sectionId]?.scrollIntoView({
-				behavior: "smooth",
-				block: "start",
-			});
-		}, 100);
+		// 直接滚动，无需延迟
+		sectionRefs.current[sectionId]?.scrollIntoView({
+			behavior: "smooth",
+			block: "start",
+		});
 	};
 
 	return (
 		<>
-			<AnimatePresence>
-				{/* 收起时的悬浮按钮 */}
-				{!isOpen && (
-					<motion.div
-						initial={{ opacity: 0 }}
-						animate={{ opacity: 1 }}
-						exit={{ opacity: 0 }}
-						className="fixed top-1/3 right-0 -translate-y-1/2 z-20">
-						<CollapsedButton onToggle={onToggle} />
-					</motion.div>
-				)}
-			</AnimatePresence>
-			<motion.div
-				initial={false}
-				animate={{
+			{/* 收起按钮直接显示 */}
+			{!isOpen && (
+				<div className="fixed top-1/3 right-0 -translate-y-1/2 z-20">
+					<CollapsedButton onToggle={onToggle} />
+				</div>
+			)}
+
+			<div
+				style={{
 					width: isOpen ? "25%" : "0",
 					right: 0,
 					top: isHeaderVisible ? "64px" : "0",
 				}}
 				className="fixed top-0 bottom-0 z-20 bg-white shadow-xl">
-				<AnimatePresence>
-					{isOpen && (
-						<motion.div
-							initial={{ opacity: 0, x: 20 }}
-							animate={{ opacity: 1, x: 0 }}
-							exit={{ opacity: 0, x: 20 }}
-							className="h-full flex flex-col">
-							<SyllabusHeader onToggle={onToggle} />
+				{isOpen && (
+					<div className="h-full flex flex-col">
+						<SyllabusHeader onToggle={onToggle} />
 
-							<div className="flex-1 overflow-y-auto p-4">
-								<div className="space-y-4">
-									{sections.map((section, index) => (
-										<SectionItem
-											key={section.id}
-											ref={(el) =>
-												(sectionRefs.current[
-													section.id
-												] = el)
-											}
-											index={index + 1}
-											section={section}
-											isExpanded={expandedSections.includes(
-												section.id
-											)}
-											onToggle={toggleSection}
-											onLectureClick={onLectureClick}
-										/>
-									))}
-								</div>
+						<div className="flex-1 overflow-y-auto p-4">
+							<div className="space-y-4">
+								{sections.map((section, index) => (
+									<SectionItem
+										key={section.id}
+										ref={(el) =>
+											(sectionRefs.current[section.id] =
+												el)
+										}
+										index={index + 1}
+										section={section}
+										isExpanded={expandedSections.includes(
+											section.id
+										)}
+										onToggle={toggleSection}
+										onLectureClick={onLectureClick}
+									/>
+								))}
 							</div>
-						</motion.div>
-					)}
-				</AnimatePresence>
-			</motion.div>
+						</div>
+					</div>
+				)}
+			</div>
 		</>
 	);
 };