course 变为嵌套路由

dashboard/src/Router.tsx

@@ -24,6 +24,7 @@ import LibraryPalicanon from "./pages/library/palicanon";
 import LibraryPalicanonByPath from "./pages/library/palicanon/bypath";
 import LibraryPalicanonChapter from "./pages/library/palicanon/chapter";
 import LibraryCourse from "./pages/library/course";
+import LibraryCourseList from "./pages/library/course/list";
 import LibraryCourseShow from "./pages/library/course/course";
 import LibraryLessonShow from "./pages/library/course/lesson";
 import LibraryTerm from "./pages/library/term/show";
@@ -35,6 +36,7 @@ import LibraryAnthologyShow from "./pages/library/anthology/show";
 import LibraryArticle from "./pages/library/anthology/article";
 
 import LibraryBlog from "./pages/library/blog";
+import LibraryBlogOverview from "./pages/library/blog/overview";
 import LibraryBlogTranslation from "./pages/library/blog/translation";
 import LibraryBlogCourse from "./pages/library/blog/course";
 import LibraryBlogAnthology from "./pages/library/blog/anthology";
@@ -105,9 +107,12 @@ const Widget = () => {
 				<Route path="chapter/:id" element={<LibraryPalicanonChapter />} />
 			</Route>
 
-			<Route path="course" element={<LibraryCourse />}></Route>
-			<Route path="course/show/:id" element={<LibraryCourseShow />}></Route>
-			<Route path="course/lesson/:id" element={<LibraryLessonShow />}></Route>
+			<Route path="course" element={<LibraryCourse />}>
+				<Route path="show/:id" element={<LibraryCourseShow />}></Route>
+				<Route path="lesson/:id" element={<LibraryLessonShow />}></Route>
+				<Route path="course/:id" element={<LibraryLessonShow />}></Route>
+				<Route path="list" element={<LibraryCourseList />}></Route>
+			</Route>
 
 			<Route path="term/:word" element={<LibraryTerm />} />
 
@@ -121,11 +126,13 @@ const Widget = () => {
 			<Route path="anthology/:id/by_channel/:tags" element={<LibraryAnthologyShow />} />
 			<Route path="article/show/:id" element={<LibraryArticle />} />
 
-			<Route path="blog/:studioname" element={<LibraryBlog />} />
-			<Route path="blog/:studioname/translation" element={<LibraryBlogTranslation />} />
-			<Route path="blog/:studioname/course" element={<LibraryBlogCourse />} />
-			<Route path="blog/:studioname/anthology" element={<LibraryBlogAnthology />} />
-			<Route path="blog/:studioname/term" element={<LibraryBlogTerm />} />
+			<Route path="blog/:studio" element={<LibraryBlog />}>
+				<Route path="overview" element={<LibraryBlogOverview />} />
+				<Route path="palicanon" element={<LibraryBlogTranslation />} />
+				<Route path="course" element={<LibraryBlogCourse />} />
+				<Route path="anthology" element={<LibraryBlogAnthology />} />
+				<Route path="term" element={<LibraryBlogTerm />} />
+			</Route>
 
 			<Route path="studio/:studioname" element={<StudioHome />}></Route>
 			<Route path="studio/:studioname/palicanon" element={<StudioPalicanon />}></Route>

dashboard/src/components/library/HeadBar.tsx

@@ -31,7 +31,7 @@ const Widget = ({ selectedKeys = "" }: IWidgetHeadBar) => {
 			key: "palicanon",
 		},
 		{
-			label: <Link to="/course">{intl.formatMessage({ id: "columns.library.course.title" })}</Link>,
+			label: <Link to="/course/list">{intl.formatMessage({ id: "columns.library.course.title" })}</Link>,
 			key: "course",
 		},
 		{

dashboard/src/pages/library/course/course.tsx

@@ -1,21 +1,15 @@
-import { Space } from "antd";
-import { useParams, Link } from "react-router-dom";
-import HeadBar from "../../../components/library/HeadBar";
-import FooterBar from "../../../components/library/FooterBar";
+import { Link } from "react-router-dom";
+import { useParams } from "react-router-dom";
 const Widget = () => {
 	// TODO
 	const { courseid } = useParams(); //url 参数
 	return (
 		<div>
-			<HeadBar selectedKeys="course" />
 			<div>课程{courseid} 详情</div>
 			<div>
-				<Space>
-					<Link to="/course/lesson/12345">lesson 1</Link>
-					<Link to="/course/lesson/23456">lesson 2</Link>
-				</Space>
+				<Link to="/course/lesson/12345">lesson 1</Link>
+				<Link to="/course/lesson/23456">lesson 2</Link>
 			</div>
-			<FooterBar />
 		</div>
 	);
 };

dashboard/src/pages/library/course/index.tsx

@@ -1,5 +1,4 @@
-import { Space } from "antd";
-import { Link } from "react-router-dom";
+import { Outlet } from "react-router-dom";
 import HeadBar from "../../../components/library/HeadBar";
 import FooterBar from "../../../components/library/FooterBar";
 
@@ -8,13 +7,7 @@ const Widget = () => {
 	return (
 		<div>
 			<HeadBar selectedKeys="course" />
-			<div>课程首页</div>
-			<div>
-				<Space>
-					<Link to="/course/show/12345">课程1</Link>
-					<Link to="/course/show/23456">课程2</Link>
-				</Space>
-			</div>
+			<Outlet />
 			<FooterBar />
 		</div>
 	);

dashboard/src/pages/library/course/lesson.tsx

@@ -1,7 +1,4 @@
-import { Space } from "antd";
 import { useParams } from "react-router-dom";
-import HeadBar from "../../../components/library/HeadBar";
-import FooterBar from "../../../components/library/FooterBar";
 
 const Widget = () => {
 	// TODO
@@ -9,12 +6,10 @@ const Widget = () => {
 
 	return (
 		<div>
-			<HeadBar selectedKeys="course" />
 			<div>课 {lessonid} 详情</div>
 			<div>
-				<Space>主显示区</Space>
+				主显示区
 			</div>
-			<FooterBar />
 		</div>
 	);
 };

dashboard/src/pages/library/course/list.tsx

@@ -0,0 +1,16 @@
+import { Link } from "react-router-dom";
+
+const Widget = () => {
+	// TODO
+	return (
+		<div>
+			<div>课程首页</div>
+			<div>
+				<Link to="/course/show/12345">课程1</Link>
+				<Link to="/course/show/23456">课程2</Link>
+			</div>
+		</div>
+	);
+};
+
+export default Widget;