From e262ca34ff6b833c504efcf2d46b6b139623fd20 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E7=A6=BA=E7=8B=A8?= <18119604035@163.com>
Date: Thu, 29 Jun 2023 16:52:00 +0800
Subject: [PATCH] =?UTF-8?q?=E8=AF=BE=E7=A8=8B=E8=AF=A6=E6=83=85=E9=A1=B5?=
 =?UTF-8?q?=E5=88=9D=E6=AD=A5?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/pages/change-department/index.tsx |  6 ++-
 src/pages/course/index.module.scss    |  8 ++++
 src/pages/course/index.tsx            | 58 +++++++++++++++++++++++++++
 src/routes/index.tsx                  |  5 +++
 4 files changed, 76 insertions(+), 1 deletion(-)
 create mode 100644 src/pages/course/index.module.scss
 create mode 100644 src/pages/course/index.tsx

diff --git a/src/pages/change-department/index.tsx b/src/pages/change-department/index.tsx
index aed96c1..28bb3f4 100644
--- a/src/pages/change-department/index.tsx
+++ b/src/pages/change-department/index.tsx
@@ -1,4 +1,4 @@
-import { useState } from "react";
+import { useState, useEffect } from "react";
 import { Radio, Image } from "antd-mobile";
 import styles from "./index.module.scss";
 import { useNavigate } from "react-router-dom";
@@ -18,6 +18,10 @@ const ChangeDepartmentPage = () => {
     (state: any) => state.loginUser.value.currentDepId
   );
 
+  useEffect(() => {
+    document.title = "切换部门";
+  }, []);
+
   const onDepClick = (value: any) => {
     let it = departments.find((o: any) => o.id === value);
     if (it) {
diff --git a/src/pages/course/index.module.scss b/src/pages/course/index.module.scss
new file mode 100644
index 0000000..6cb2518
--- /dev/null
+++ b/src/pages/course/index.module.scss
@@ -0,0 +1,8 @@
+.top-content {
+  width: 100%;
+  float: left;
+  height: auto;
+  background-color: #ff4d4f;
+  box-sizing: border-box;
+  padding: 8px 20px 20px 20px;
+}
diff --git a/src/pages/course/index.tsx b/src/pages/course/index.tsx
new file mode 100644
index 0000000..14053aa
--- /dev/null
+++ b/src/pages/course/index.tsx
@@ -0,0 +1,58 @@
+import { useEffect, useState } from "react";
+import { Image, ProgressBar, SpinLoading } from "antd-mobile";
+import styles from "./index.module.scss";
+import { useNavigate, useParams } from "react-router-dom";
+import backIcon from "../../assets/images/commen/icon-back-n.png";
+import { course as Course } from "../../api/index";
+import { Empty } from "../../components";
+
+const CoursePage = () => {
+  const params = useParams();
+  const navigate = useNavigate();
+  const [loading, setLoading] = useState<boolean>(false);
+  const [course, setCourse] = useState<any>({});
+  const [chapters, setChapters] = useState<any>([]);
+  const [hours, setHours] = useState<any>({});
+  const [learnRecord, setLearnRecord] = useState<any>({});
+  const [learnHourRecord, setLearnHourRecord] = useState<any>({});
+
+  useEffect(() => {
+    getDetail();
+  }, [params.courseId]);
+
+  const getDetail = () => {
+    setLoading(true);
+    Course.detail(Number(params.courseId))
+      .then((res: any) => {
+        document.title = res.data.course.title;
+        setCourse(res.data.course);
+        setChapters(res.data.chapters);
+        setHours(res.data.hours);
+        if (res.data.learn_record) {
+          setLearnRecord(res.data.learn_record);
+        }
+        if (res.data.learn_hour_records) {
+          setLearnHourRecord(res.data.learn_hour_records);
+        }
+        setLoading(false);
+      })
+      .catch((e) => {
+        setLoading(false);
+      });
+  };
+
+  return (
+    <div className="main-body">
+      <div className="main-header" style={{ backgroundColor: "#FF4D4F" }}>
+        <Image
+          className="back-icon"
+          src={backIcon}
+          onClick={() => navigate(-1)}
+        />
+      </div>
+      <div className={styles["top-content"]}></div>
+    </div>
+  );
+};
+
+export default CoursePage;
diff --git a/src/routes/index.tsx b/src/routes/index.tsx
index 4fc40af..ac0416c 100644
--- a/src/routes/index.tsx
+++ b/src/routes/index.tsx
@@ -10,6 +10,7 @@ import MemberPage from "../pages/member/index";
 import ChangePasswordPage from "../pages/change-password/index";
 import ChangeDepartmentPage from "../pages/change-department/index";
 import StudyPage from "../pages/study/index";
+import CoursePage from "../pages/course/index";
 import PrivateRoute from "../components/private-route";
 
 let RootPage: any = null;
@@ -62,6 +63,10 @@ const routes: RouteObject[] = [
         path: "/change-department",
         element: <PrivateRoute Component={<ChangeDepartmentPage />} />,
       },
+      {
+        path: "/course/:courseId",
+        element: <PrivateRoute Component={<CoursePage />} />,
+      },
     ],
   },
 ];