From da748b7c5896dc85035e709dbf01f0b620e0ca9f Mon Sep 17 00:00:00 2001 From: Son Ahyun Date: Sat, 16 Aug 2025 13:35:30 +0900 Subject: [PATCH 1/8] =?UTF-8?q?=E2=99=BB=EF=B8=8F=20(#280)=20=ED=81=B4?= =?UTF-8?q?=EB=9E=98=EC=8A=A4=20=EB=AA=A9=EB=A1=9D=20=EC=84=B9=EC=85=98?= =?UTF-8?q?=EC=97=90=EC=84=9C=20Next.js=EC=9D=98=20useRouter=20=ED=9B=85?= =?UTF-8?q?=EC=9D=84=20=EC=82=AC=EC=9A=A9=ED=95=98=EB=8F=84=EB=A1=9D=20?= =?UTF-8?q?=EB=B3=80=EA=B2=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../class/_components/ClassListSection/ClassListSection.tsx | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/frontend/app/student/class/_components/ClassListSection/ClassListSection.tsx b/frontend/app/student/class/_components/ClassListSection/ClassListSection.tsx index 7dd3c654..3d12675d 100644 --- a/frontend/app/student/class/_components/ClassListSection/ClassListSection.tsx +++ b/frontend/app/student/class/_components/ClassListSection/ClassListSection.tsx @@ -1,18 +1,19 @@ "use client"; - import React, { useEffect, useState } from "react"; import styles from "./ClassListSection.module.scss"; import { fetchMyClassList } from "@/api/student-classes/fetchMyClassList"; import { FetchMyClassListResult } from "@/types/classes/fetchMyClassListTypes"; import { Calendar, Clock, ChevronRight } from "lucide-react"; import { ROUTES } from "@/constants/routes"; -import router from "next/router"; +import { useRouter } from "next/navigation"; export default function ClassListSection() { const [classList, setClassList] = useState([]); const [isLoading, setIsLoading] = useState(true); const [error, setError] = useState(null); + const router = useRouter(); + useEffect(() => { const loadClassList = async () => { try { From 2a5697213015e2eba2fc523ba9492d66ee6fdae1 Mon Sep 17 00:00:00 2001 From: Son Ahyun Date: Sat, 16 Aug 2025 14:42:16 +0900 Subject: [PATCH 2/8] =?UTF-8?q?=E2=9C=A8=20(#280)=20=ED=81=B4=EB=9E=98?= =?UTF-8?q?=EC=8A=A4=20=EC=A0=95=EB=B3=B4=20=EC=BB=B4=ED=8F=AC=EB=84=8C?= =?UTF-8?q?=ED=8A=B8=20=EC=B6=94=EA=B0=80=20=EB=B0=8F=20api=20=EC=97=B0?= =?UTF-8?q?=EA=B2=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../ClassInfoSection.module.scss | 37 ++++++++++++++++ .../ClassInfoSection/ClassInfoSection.tsx | 44 +++++++++++++++++++ .../LectureListAndNote.module.scss | 0 .../LectureListAndNote/LectureListAndNote.tsx | 6 +++ .../student/class-detail/[classId]/page.tsx | 10 ++++- .../BackWithProfileHeader.module.scss | 2 +- 6 files changed, 97 insertions(+), 2 deletions(-) create mode 100644 frontend/app/student/class-detail/[classId]/_components/ClassInfoSection/ClassInfoSection.module.scss create mode 100644 frontend/app/student/class-detail/[classId]/_components/ClassInfoSection/ClassInfoSection.tsx create mode 100644 frontend/app/student/class-detail/[classId]/_components/LectureListAndNote/LectureListAndNote.module.scss create mode 100644 frontend/app/student/class-detail/[classId]/_components/LectureListAndNote/LectureListAndNote.tsx diff --git a/frontend/app/student/class-detail/[classId]/_components/ClassInfoSection/ClassInfoSection.module.scss b/frontend/app/student/class-detail/[classId]/_components/ClassInfoSection/ClassInfoSection.module.scss new file mode 100644 index 00000000..10d340dd --- /dev/null +++ b/frontend/app/student/class-detail/[classId]/_components/ClassInfoSection/ClassInfoSection.module.scss @@ -0,0 +1,37 @@ +.container { + display: flex; + flex-direction: column; + gap: 10px; + background-color: $color-blue; + padding: $spacing-3xl $spacing-xl; + color: $color-white; +} + +.classInfo { + display: flex; + flex-direction: column; + gap: $spacing-sm; +} + +.classInfoTitleContainer { + display: flex; + flex-direction: row; + gap: $spacing-sm; + align-items: center; + + .classInfoTitle { + font-size: $font-size-2xl; + } + + .classInfoProfessor { + font-size: $font-size-lg; + } +} + +.classInfoDate { + display: flex; + flex-direction: row; + gap: $spacing-sm; + align-items: center; + font-size: $font-size-lg; +} diff --git a/frontend/app/student/class-detail/[classId]/_components/ClassInfoSection/ClassInfoSection.tsx b/frontend/app/student/class-detail/[classId]/_components/ClassInfoSection/ClassInfoSection.tsx new file mode 100644 index 00000000..b116c311 --- /dev/null +++ b/frontend/app/student/class-detail/[classId]/_components/ClassInfoSection/ClassInfoSection.tsx @@ -0,0 +1,44 @@ +"use client"; + +import React, { useEffect, useState } from "react"; +import styles from "./ClassInfoSection.module.scss"; +import { useParams } from "next/navigation"; +import { fetchClassInfoByClassId } from "@/api/classes/fetchClassInfoByClassId"; +import { FetchClassInfoByClassIdResult } from "@/types/classes/fetchClassInfoByClassIdTypes"; +import { Calendar, Clock } from "lucide-react"; + +export default function ClassInfoSection() { + const { classId } = useParams(); + + const [classInfo, setClassInfo] = + useState(null); + + useEffect(() => { + fetchClassInfoByClassId(classId as string).then((res) => { + if (res.isSuccess) { + setClassInfo(res.result || null); + } + }); + }, [classId]); + + return ( +
+
+
+
{classInfo?.className}
+
+ {classInfo?.professorName} +
+
+
+ + {classInfo?.classDate} +
+
+ + {classInfo?.startDate} ~ {classInfo?.endDate} +
+
+
+ ); +} diff --git a/frontend/app/student/class-detail/[classId]/_components/LectureListAndNote/LectureListAndNote.module.scss b/frontend/app/student/class-detail/[classId]/_components/LectureListAndNote/LectureListAndNote.module.scss new file mode 100644 index 00000000..e69de29b diff --git a/frontend/app/student/class-detail/[classId]/_components/LectureListAndNote/LectureListAndNote.tsx b/frontend/app/student/class-detail/[classId]/_components/LectureListAndNote/LectureListAndNote.tsx new file mode 100644 index 00000000..90604a8b --- /dev/null +++ b/frontend/app/student/class-detail/[classId]/_components/LectureListAndNote/LectureListAndNote.tsx @@ -0,0 +1,6 @@ +import React from "react"; +import styles from "./LectureListAndNote.module.scss"; + +export default function LectureListAndNote() { + return
강의 목록 및 자료
; +} diff --git a/frontend/app/student/class-detail/[classId]/page.tsx b/frontend/app/student/class-detail/[classId]/page.tsx index 89c6f3ab..b128bec2 100644 --- a/frontend/app/student/class-detail/[classId]/page.tsx +++ b/frontend/app/student/class-detail/[classId]/page.tsx @@ -1,3 +1,11 @@ +import ClassInfoSection from "./_components/ClassInfoSection/ClassInfoSection"; +import LectureListAndNote from "./_components/LectureListAndNote/LectureListAndNote"; + export default function StudentClassDetailPage() { - return
클래스 상세
; + return ( +
+ + +
+ ); } diff --git a/frontend/components/Header/Student/BackWithProfileHeader/BackWithProfileHeader.module.scss b/frontend/components/Header/Student/BackWithProfileHeader/BackWithProfileHeader.module.scss index cf204cbe..2f232245 100644 --- a/frontend/components/Header/Student/BackWithProfileHeader/BackWithProfileHeader.module.scss +++ b/frontend/components/Header/Student/BackWithProfileHeader/BackWithProfileHeader.module.scss @@ -7,7 +7,7 @@ height: 6vh; margin: 0 auto; background-color: $color-blue; - border-bottom: 1px solid $color-neutral-7; + padding: 0 10px; position: fixed; From 1ed4788a30c0ce73d117a750ead992d1792c6f75 Mon Sep 17 00:00:00 2001 From: Son Ahyun Date: Sat, 16 Aug 2025 14:53:07 +0900 Subject: [PATCH 3/8] =?UTF-8?q?=E2=9C=A8=20(#280)=20=EA=B0=95=EC=9D=98=20?= =?UTF-8?q?=EB=AA=A9=EB=A1=9D=20=EB=B0=8F=20=EC=9E=90=EB=A3=8C=20=EC=BB=B4?= =?UTF-8?q?=ED=8F=AC=EB=84=8C=ED=8A=B8=20=EC=B6=94=EA=B0=80,=20=ED=83=AD?= =?UTF-8?q?=20=EA=B8=B0=EB=8A=A5=20=EA=B5=AC=ED=98=84=20=EB=B0=8F=20?= =?UTF-8?q?=EC=8A=A4=ED=83=80=EC=9D=BC=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../LectureList/LectureList.module.scss | 0 .../_components/LectureList/LectureList.tsx | 6 +++++ .../LectureListAndNote.module.scss | 10 ++++++++ .../LectureListAndNote/LectureListAndNote.tsx | 23 +++++++++++++++++-- .../LectureNote/LectureNote.module.scss | 0 .../_components/LectureNote/LectureNote.tsx | 6 +++++ frontend/components/Tab/Tab.module.scss | 2 +- 7 files changed, 44 insertions(+), 3 deletions(-) create mode 100644 frontend/app/student/class-detail/[classId]/_components/LectureList/LectureList.module.scss create mode 100644 frontend/app/student/class-detail/[classId]/_components/LectureList/LectureList.tsx create mode 100644 frontend/app/student/class-detail/[classId]/_components/LectureNote/LectureNote.module.scss create mode 100644 frontend/app/student/class-detail/[classId]/_components/LectureNote/LectureNote.tsx diff --git a/frontend/app/student/class-detail/[classId]/_components/LectureList/LectureList.module.scss b/frontend/app/student/class-detail/[classId]/_components/LectureList/LectureList.module.scss new file mode 100644 index 00000000..e69de29b diff --git a/frontend/app/student/class-detail/[classId]/_components/LectureList/LectureList.tsx b/frontend/app/student/class-detail/[classId]/_components/LectureList/LectureList.tsx new file mode 100644 index 00000000..267bb588 --- /dev/null +++ b/frontend/app/student/class-detail/[classId]/_components/LectureList/LectureList.tsx @@ -0,0 +1,6 @@ +import React from "react"; +import styles from "./LectureList.module.scss"; + +export default function LectureList() { + return
강의 목록
; +} diff --git a/frontend/app/student/class-detail/[classId]/_components/LectureListAndNote/LectureListAndNote.module.scss b/frontend/app/student/class-detail/[classId]/_components/LectureListAndNote/LectureListAndNote.module.scss index e69de29b..2925b001 100644 --- a/frontend/app/student/class-detail/[classId]/_components/LectureListAndNote/LectureListAndNote.module.scss +++ b/frontend/app/student/class-detail/[classId]/_components/LectureListAndNote/LectureListAndNote.module.scss @@ -0,0 +1,10 @@ +.container { + width: 100%; + display: flex; + flex-direction: column; + gap: $spacing-xl; +} + +.content { + width: 100%; +} diff --git a/frontend/app/student/class-detail/[classId]/_components/LectureListAndNote/LectureListAndNote.tsx b/frontend/app/student/class-detail/[classId]/_components/LectureListAndNote/LectureListAndNote.tsx index 90604a8b..0cf671cb 100644 --- a/frontend/app/student/class-detail/[classId]/_components/LectureListAndNote/LectureListAndNote.tsx +++ b/frontend/app/student/class-detail/[classId]/_components/LectureListAndNote/LectureListAndNote.tsx @@ -1,6 +1,25 @@ -import React from "react"; +"use client"; +import React, { useState } from "react"; import styles from "./LectureListAndNote.module.scss"; +import LectureList from "../LectureList/LectureList"; +import LectureNote from "../LectureNote/LectureNote"; +import Tab from "../../../../../../components/Tab/Tab"; export default function LectureListAndNote() { - return
강의 목록 및 자료
; + const [selectedTab, setSelectedTab] = useState("강의 목록"); + + const tabs = ["강의 목록", "강의자료"]; + + const handleTabSelect = (tab: string) => { + setSelectedTab(tab); + }; + + return ( +
+ +
+ {selectedTab === "강의 목록" ? : } +
+
+ ); } diff --git a/frontend/app/student/class-detail/[classId]/_components/LectureNote/LectureNote.module.scss b/frontend/app/student/class-detail/[classId]/_components/LectureNote/LectureNote.module.scss new file mode 100644 index 00000000..e69de29b diff --git a/frontend/app/student/class-detail/[classId]/_components/LectureNote/LectureNote.tsx b/frontend/app/student/class-detail/[classId]/_components/LectureNote/LectureNote.tsx new file mode 100644 index 00000000..b37a06a2 --- /dev/null +++ b/frontend/app/student/class-detail/[classId]/_components/LectureNote/LectureNote.tsx @@ -0,0 +1,6 @@ +import React from "react"; +import styles from "./LectureNote.module.scss"; + +export default function LectureNote() { + return
강의 자료
; +} diff --git a/frontend/components/Tab/Tab.module.scss b/frontend/components/Tab/Tab.module.scss index a3993ef5..7e69e09f 100644 --- a/frontend/components/Tab/Tab.module.scss +++ b/frontend/components/Tab/Tab.module.scss @@ -6,7 +6,7 @@ position: relative; .tabItem { - font-size: $font-size-md; + font-size: $font-size-lg; cursor: pointer; width: 100%; padding: $spacing-md 0; From 214db9fd3f914433868c21aa74463dd8508b6c2b Mon Sep 17 00:00:00 2001 From: Son Ahyun Date: Sun, 17 Aug 2025 22:40:55 +0900 Subject: [PATCH 4/8] =?UTF-8?q?=E2=9C=A8=20(#280)=20=EA=B0=95=EC=9D=98=20?= =?UTF-8?q?=EB=AA=A9=EB=A1=9D=20=EC=BB=B4=ED=8F=AC=EB=84=8C=ED=8A=B8=20?= =?UTF-8?q?=EA=B5=AC=ED=98=84=20=EB=B0=8F=20=EC=8A=A4=ED=83=80=EC=9D=BC=20?= =?UTF-8?q?=EC=B6=94=EA=B0=80,=20=EA=B0=95=EC=9D=98=20=EB=8D=B0=EC=9D=B4?= =?UTF-8?q?=ED=84=B0=20=EB=A1=9C=EB=94=A9=20=EB=B0=8F=20=EC=83=81=ED=83=9C?= =?UTF-8?q?=20=ED=91=9C=EC=8B=9C=20=EA=B8=B0=EB=8A=A5=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../LectureList/LectureList.module.scss | 88 +++++++++++++++++ .../_components/LectureList/LectureList.tsx | 94 ++++++++++++++++++- .../LectureListAndNote.module.scss | 1 - 3 files changed, 180 insertions(+), 3 deletions(-) diff --git a/frontend/app/student/class-detail/[classId]/_components/LectureList/LectureList.module.scss b/frontend/app/student/class-detail/[classId]/_components/LectureList/LectureList.module.scss index e69de29b..b6d037e2 100644 --- a/frontend/app/student/class-detail/[classId]/_components/LectureList/LectureList.module.scss +++ b/frontend/app/student/class-detail/[classId]/_components/LectureList/LectureList.module.scss @@ -0,0 +1,88 @@ +.container { + width: 100%; + padding: $spacing-lg; +} + +.lectureList { + display: flex; + flex-direction: column; + gap: $spacing-md; +} + +.lectureCard { + display: flex; + justify-content: space-between; + align-items: center; + background: $color-white; + border-radius: $radius-md; + padding: $spacing-xl; + box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); + transition: all 0.2s ease; + cursor: pointer; + + &:hover { + box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15); + transform: translateY(-2px); + } +} + +.lectureInfo { + flex: 1; + display: flex; + flex-direction: column; + gap: $spacing-sm; +} + +.lectureTitle { + font-size: $font-size-xl; + display: flex; + justify-content: space-between; + align-items: center; + color: $color-black; + line-height: 1.4; + border-bottom: 1px solid $color-neutral-7; + padding-bottom: $spacing-sm; +} + +.lectureDetails { + display: flex; + gap: $spacing-md; + color: $color-mutedblue; + font-size: $font-size-sm; +} + +.status { + margin-left: $spacing-sm; + color: $color-mutedblue; + font-size: $font-size-sm; +} + +.dateInfo, +.timeInfo { + display: flex; + align-items: center; + gap: $spacing-sm; + + svg { + color: $color-mutedblue; + } +} + +.viewButton { + width: 40px; + height: 40px; + border-radius: 50%; + background: $color-skyblue; + border: none; + display: flex; + align-items: center; + justify-content: center; + cursor: pointer; + transition: all 0.2s ease; + + svg { + color: $color-blue; + width: 16px; + height: 16px; + } +} diff --git a/frontend/app/student/class-detail/[classId]/_components/LectureList/LectureList.tsx b/frontend/app/student/class-detail/[classId]/_components/LectureList/LectureList.tsx index 267bb588..d811c30b 100644 --- a/frontend/app/student/class-detail/[classId]/_components/LectureList/LectureList.tsx +++ b/frontend/app/student/class-detail/[classId]/_components/LectureList/LectureList.tsx @@ -1,6 +1,96 @@ -import React from "react"; +import React, { useEffect, useState } from "react"; import styles from "./LectureList.module.scss"; +import { useParams } from "next/navigation"; +import { fetchLecturesByClass } from "@/api/classes/fetchLecturesByClass"; +import { FetchLecturesByClassResult } from "@/types/classes/fetchLecturesByClassTypes"; +import { Calendar, ChevronRight, Clock } from "lucide-react"; +import { useRouter } from "next/navigation"; +import { ROUTES } from "@/constants/routes"; export default function LectureList() { - return
강의 목록
; + const { classId } = useParams(); + const [lectures, setLectures] = useState([]); + const [loading, setLoading] = useState(true); + const router = useRouter(); + + useEffect(() => { + const fetchLectures = async () => { + try { + setLoading(true); + const response = await fetchLecturesByClass(classId as string); + if (response.isSuccess && response.result) { + setLectures(response.result); + } + } catch (error) { + console.error("강의 목록을 불러오는데 실패했습니다:", error); + } finally { + setLoading(false); + } + }; + fetchLectures(); + }, [classId]); + + const getStatusText = (status: string) => { + switch (status) { + case "beforeLecture": + return "강의 전"; + case "onLecture": + return "강의 중"; + case "afterLecture": + return "강의 종료"; + default: + return "알 수 없음"; + } + }; + + if (loading) { + return
로딩 중...
; + } + + if (lectures.length === 0) { + return
등록된 강의가 없습니다.
; + } + + return ( +
+
+ {lectures.map((lecture) => ( +
{ + router.push(ROUTES.studentLectureDetail(lecture.lectureId)); + }} + > +
+
+
+ {String(lecture.session).padStart(2, "0")}. + {lecture.lectureName} + + {getStatusText(lecture.status)} + +
+ +
+
+
+ + {lecture.lectureDate} +
+
+ + + {lecture.startTime} ~ {lecture.endTime} + +
+
+
+
+ ))} +
+
+ ); } diff --git a/frontend/app/student/class-detail/[classId]/_components/LectureListAndNote/LectureListAndNote.module.scss b/frontend/app/student/class-detail/[classId]/_components/LectureListAndNote/LectureListAndNote.module.scss index 2925b001..3baf207c 100644 --- a/frontend/app/student/class-detail/[classId]/_components/LectureListAndNote/LectureListAndNote.module.scss +++ b/frontend/app/student/class-detail/[classId]/_components/LectureListAndNote/LectureListAndNote.module.scss @@ -2,7 +2,6 @@ width: 100%; display: flex; flex-direction: column; - gap: $spacing-xl; } .content { From fa7f090795f083416a2494133af7dbfccb71b54f Mon Sep 17 00:00:00 2001 From: Son Ahyun Date: Sun, 17 Aug 2025 23:30:36 +0900 Subject: [PATCH 5/8] =?UTF-8?q?=E2=9C=A8=20(#280)=20=EA=B0=95=EC=9D=98?= =?UTF-8?q?=EC=9E=90=EB=A3=8C=20=EB=AA=A9=EB=A1=9D?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../LectureNote/LectureNote.module.scss | 55 ++++++++++++++++ .../_components/LectureNote/LectureNote.tsx | 63 ++++++++++++++++++- 2 files changed, 116 insertions(+), 2 deletions(-) diff --git a/frontend/app/student/class-detail/[classId]/_components/LectureNote/LectureNote.module.scss b/frontend/app/student/class-detail/[classId]/_components/LectureNote/LectureNote.module.scss index e69de29b..227cdf17 100644 --- a/frontend/app/student/class-detail/[classId]/_components/LectureNote/LectureNote.module.scss +++ b/frontend/app/student/class-detail/[classId]/_components/LectureNote/LectureNote.module.scss @@ -0,0 +1,55 @@ +.container { + width: 100%; + padding: $spacing-lg; +} + +.title { + font-size: $font-size-xl; + font-weight: $font-weight-bold; + margin-bottom: $spacing-lg; + color: $color-black; +} + +.fileList { + display: flex; + flex-direction: column; + gap: $spacing-md; +} + +.fileItem { + display: flex; + align-items: center; + justify-content: space-between; + padding: $spacing-md; + border: 1px solid $color-neutral-7; + border-radius: $radius-md; + background-color: $color-white; +} + +.fileItem > :first-child { + flex: 1; + min-width: 0; + overflow: hidden; +} + +.fileItem > :first-child > span { + display: block; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + max-width: 100%; +} + +.fileInfo { + display: flex; + flex-direction: column; + align-items: flex-end; + gap: $spacing-xs; + flex-shrink: 0; + margin-left: $spacing-md; +} + +.fileSize { + font-size: $font-size-sm; + color: $color-mutedblue; +} diff --git a/frontend/app/student/class-detail/[classId]/_components/LectureNote/LectureNote.tsx b/frontend/app/student/class-detail/[classId]/_components/LectureNote/LectureNote.tsx index b37a06a2..b2fbb404 100644 --- a/frontend/app/student/class-detail/[classId]/_components/LectureNote/LectureNote.tsx +++ b/frontend/app/student/class-detail/[classId]/_components/LectureNote/LectureNote.tsx @@ -1,6 +1,65 @@ -import React from "react"; +import React, { useEffect, useState } from "react"; import styles from "./LectureNote.module.scss"; +import { useParams } from "next/navigation"; +import { fetchLectureNotesByClass } from "@/api/lectures/fetchLectureNotesByClass"; +import FileDisplay from "@/components/FileDisplay/FileDisplay"; +import LoadingSpinner from "@/components/LoadingSpinner/LoadingSpinner"; + +interface LectureNote { + lectureNoteId: string; + classId: string; + lectureNoteUrl: string; + lectureNoteName: string; + fileSize: string; + session: number[]; +} export default function LectureNote() { - return
강의 자료
; + const { classId } = useParams(); + const [lectureNotes, setLectureNotes] = useState([]); + const [loading, setLoading] = useState(true); + + useEffect(() => { + const fetchLectureNote = async () => { + try { + setLoading(true); + const response = await fetchLectureNotesByClass(classId as string); + if (response.isSuccess && response.result) { + setLectureNotes(response.result); + } + } catch (error) { + console.error("강의 자료를 불러오는데 실패했습니다:", error); + } finally { + setLoading(false); + } + }; + fetchLectureNote(); + }, [classId]); + + if (loading) { + return ( +
+ +
+ ); + } + + return ( +
+ {lectureNotes.length > 0 ? ( +
+ {lectureNotes.map((note) => ( +
+ +
+ {note.fileSize} +
+
+ ))} +
+ ) : ( +
등록된 강의 자료가 없습니다.
+ )} +
+ ); } From d587eb1dfd31e4bc36a709aeac03e6c840bb8e3c Mon Sep 17 00:00:00 2001 From: Son Ahyun Date: Sun, 17 Aug 2025 23:31:11 +0900 Subject: [PATCH 6/8] =?UTF-8?q?=E2=9C=A8=20(#280)=20=EB=A1=9C=EB=94=A9?= =?UTF-8?q?=EC=8A=A4=ED=94=BC=EB=84=88=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../[classId]/_components/LectureList/LectureList.tsx | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/frontend/app/student/class-detail/[classId]/_components/LectureList/LectureList.tsx b/frontend/app/student/class-detail/[classId]/_components/LectureList/LectureList.tsx index d811c30b..6e891d4e 100644 --- a/frontend/app/student/class-detail/[classId]/_components/LectureList/LectureList.tsx +++ b/frontend/app/student/class-detail/[classId]/_components/LectureList/LectureList.tsx @@ -6,6 +6,7 @@ import { FetchLecturesByClassResult } from "@/types/classes/fetchLecturesByClass import { Calendar, ChevronRight, Clock } from "lucide-react"; import { useRouter } from "next/navigation"; import { ROUTES } from "@/constants/routes"; +import LoadingSpinner from "@/components/LoadingSpinner/LoadingSpinner"; export default function LectureList() { const { classId } = useParams(); @@ -44,7 +45,11 @@ export default function LectureList() { }; if (loading) { - return
로딩 중...
; + return ( +
+ +
+ ); } if (lectures.length === 0) { From 8b0dcec66f052afe4b04101b11e9bf5595d5dc91 Mon Sep 17 00:00:00 2001 From: Son Ahyun Date: Wed, 20 Aug 2025 20:43:21 +0900 Subject: [PATCH 7/8] =?UTF-8?q?=E2=9C=A8=20(#280)=20=EB=A1=9C=EB=94=A9?= =?UTF-8?q?=EC=8A=A4=ED=94=BC=EB=84=88=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../class/_components/ClassListSection/ClassListSection.tsx | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/frontend/app/student/class/_components/ClassListSection/ClassListSection.tsx b/frontend/app/student/class/_components/ClassListSection/ClassListSection.tsx index 3d12675d..e7d198b2 100644 --- a/frontend/app/student/class/_components/ClassListSection/ClassListSection.tsx +++ b/frontend/app/student/class/_components/ClassListSection/ClassListSection.tsx @@ -6,6 +6,7 @@ import { FetchMyClassListResult } from "@/types/classes/fetchMyClassListTypes"; import { Calendar, Clock, ChevronRight } from "lucide-react"; import { ROUTES } from "@/constants/routes"; import { useRouter } from "next/navigation"; +import LoadingSpinner from "@/components/LoadingSpinner/LoadingSpinner"; export default function ClassListSection() { const [classList, setClassList] = useState([]); @@ -47,9 +48,7 @@ export default function ClassListSection() { if (isLoading) { return (
-
-

클래스 목록을 불러오는 중...

-
+
); } From 2db15aa5fd786a2e96b85f92735d12eadc01a15e Mon Sep 17 00:00:00 2001 From: Son Ahyun Date: Sat, 6 Sep 2025 08:50:07 +0900 Subject: [PATCH 8/8] =?UTF-8?q?=E2=9C=A8=20(#280)=20=EA=B0=95=EC=9D=98=20?= =?UTF-8?q?=EB=85=B8=ED=8A=B8=20=ED=81=B4=EB=A6=AD=20=EC=8B=9C=20=EC=83=88?= =?UTF-8?q?=20=ED=83=AD=EC=97=90=EC=84=9C=20=EC=97=B4=EA=B8=B0=20=EA=B8=B0?= =?UTF-8?q?=EB=8A=A5=20=EC=B6=94=EA=B0=80=20=EB=B0=8F=20=EC=8A=A4=ED=83=80?= =?UTF-8?q?=EC=9D=BC=20=EA=B0=9C=EC=84=A0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../_components/LectureNote/LectureNote.module.scss | 5 +++++ .../[classId]/_components/LectureNote/LectureNote.tsx | 10 +++++++++- 2 files changed, 14 insertions(+), 1 deletion(-) diff --git a/frontend/app/student/class-detail/[classId]/_components/LectureNote/LectureNote.module.scss b/frontend/app/student/class-detail/[classId]/_components/LectureNote/LectureNote.module.scss index 227cdf17..53ba5fa5 100644 --- a/frontend/app/student/class-detail/[classId]/_components/LectureNote/LectureNote.module.scss +++ b/frontend/app/student/class-detail/[classId]/_components/LectureNote/LectureNote.module.scss @@ -24,6 +24,11 @@ border: 1px solid $color-neutral-7; border-radius: $radius-md; background-color: $color-white; + cursor: pointer; + transition: background-color 0.3s ease; + &:hover { + background-color: $color-skyblue; + } } .fileItem > :first-child { diff --git a/frontend/app/student/class-detail/[classId]/_components/LectureNote/LectureNote.tsx b/frontend/app/student/class-detail/[classId]/_components/LectureNote/LectureNote.tsx index b2fbb404..dce67792 100644 --- a/frontend/app/student/class-detail/[classId]/_components/LectureNote/LectureNote.tsx +++ b/frontend/app/student/class-detail/[classId]/_components/LectureNote/LectureNote.tsx @@ -44,12 +44,20 @@ export default function LectureNote() { ); } + const handleNoteClick = (lectureNoteUrl: string) => { + window.open(lectureNoteUrl, "_blank"); + }; + return (
{lectureNotes.length > 0 ? (
{lectureNotes.map((note) => ( -
+
handleNoteClick(note.lectureNoteUrl)} + >
{note.fileSize}