add

apps/web/src/components/models/course/detail/CourseDetailTitle.tsx

@@ -1,8 +1,15 @@
 import { useContext } from "react";
 import { CourseDetailContext } from "./CourseDetailContext";
 import { useNavigate } from "react-router-dom";
-import { BookOutlined, CalendarOutlined, EditTwoTone, EyeOutlined, ReloadOutlined } from "@ant-design/icons";
+import {
+	BookOutlined,
+	CalendarOutlined,
+	EditTwoTone,
+	EyeOutlined,
+	ReloadOutlined,
+} from "@ant-design/icons";
 import dayjs from "dayjs";
+import CourseOperationBtns from "./JoinLearingButton";
 
 export default function CourseDetailTitle() {
 	const {
@@ -19,14 +26,14 @@ export default function CourseDetailTitle() {
 			<div className="flex justify-start w-full text-2xl font-bold">
 				{course?.title}
 			</div>
-			<div className="text-gray-600 flex w-full justify-start gap-5">
+			<div className="text-gray-600 flex w-full justify-start items-center gap-5">
 				<div className="flex gap-1">
 					<CalendarOutlined></CalendarOutlined>
 					{"创建于:"}
 					{dayjs(course?.createdAt).format("YYYY年M月D日")}
 				</div>
 				<div className="flex gap-1">
-					<ReloadOutlined></ReloadOutlined>
+					<ReloadOutlined spin></ReloadOutlined>
 					{"更新于:"}
 					{dayjs(course?.updatedAt).format("YYYY年M月D日")}
 				</div>
@@ -38,19 +45,7 @@ export default function CourseDetailTitle() {
 					<BookOutlined />
 					<div>{`学习人数${course?.studentIds?.length || 0}`}</div>
 				</div>
-				{canEdit && (
-					<div
-						className="flex gap-1 text-primary hover:cursor-pointer"
-						onClick={() => {
-							const url = course?.id
-								? `/course/${course?.id}/editor`
-								: "/course/editor";
-							navigate(url);
-						}}>
-						<EditTwoTone></EditTwoTone>
-						{"点击编辑课程"}
-					</div>
-				)}
+				<CourseOperationBtns />
 			</div>
 		</div>
 	);