diff --git a/apps/web/src/components/models/course/detail/CourseDetailDescription.tsx b/apps/web/src/components/models/course/detail/CourseDetailDescription.tsx
index 75a5104..3b75ae9 100755
--- a/apps/web/src/components/models/course/detail/CourseDetailDescription.tsx
+++ b/apps/web/src/components/models/course/detail/CourseDetailDescription.tsx
@@ -2,6 +2,8 @@ import { Course } from "@nice/common";
 import React, { useContext } from "react";
 import { Typography, Skeleton } from "antd"; // 引入 antd 组件
 import { CourseDetailContext } from "./CourseDetailContext";
+import { CalendarOutlined, EyeOutlined } from "@ant-design/icons";
+import dayjs from "dayjs";
 
 interface CourseDetailProps {
 	course: Course;
@@ -18,8 +20,20 @@ export const CourseDetailDescription: React.FC<CourseDetailProps> = () => {
 				<Skeleton active paragraph={{ rows: 4 }} />
 			) : (
 				<div className="space-y-4">
-					<div className="text-lg font-bold">{"课程简介"}</div>
+					<div className="text-lg font-bold">{"课程简介:"}</div>
+					<div className="text-gray-600 flex justify-start gap-4">
+						<div>{course?.subTitle}</div>
+						<div className="flex gap-1">
+							<EyeOutlined></EyeOutlined>
+							<div>{course?.meta?.views}</div>
+						</div>
+						<div className="flex gap-1">
+							<CalendarOutlined></CalendarOutlined>
+							{dayjs(course?.createdAt).format("YYYY年M月D日")}
+						</div>
+					</div>
 					<Paragraph
+						className="text-gray-600"
 						ellipsis={{
 							rows: 3,
 							expandable: true,
@@ -27,7 +41,7 @@ export const CourseDetailDescription: React.FC<CourseDetailProps> = () => {
 							onExpand: () => console.log("展开"),
 							// collapseText: "收起",
 						}}>
-						{course.content}
+						{course?.content}
 					</Paragraph>
 				</div>
 			)}