diff --git a/app/lecturelist/page.tsx b/app/lecturelist/page.tsx new file mode 100644 index 0000000..e69de29 diff --git a/app/mylecture/page.tsx b/app/mylecture/page.tsx new file mode 100644 index 0000000..e69de29 diff --git a/app/page.tsx b/app/page.tsx index e637e42..1ca812d 100644 --- a/app/page.tsx +++ b/app/page.tsx @@ -2,13 +2,53 @@ import { useEffect, useState } from 'react'; import { useRouter } from 'next/navigation'; +import Image from 'next/image'; import LoginPage from './login/page'; +import logo from './logo.svg'; + +const imgImage2 = "http://localhost:3845/assets/89fda8e949171025b1232bae70fc9d442e4e70c8.png"; +const imgImage7 = "http://localhost:3845/assets/a4e4d09643b890b56084560cc24d6e532a03487b.png"; +const imgLine2 = "http://localhost:3845/assets/6ee8cf4ebb6bc2adb14aab8c9940b3002c20af35.svg"; +const imgFrame2616314 = "http://localhost:3845/assets/17f021e324ee315bdf2fe96554a2260813957042.svg"; +const imgRectangle1737 = "http://localhost:3845/assets/ae523ea10901c105fdbfda27ed21dd658fc4a7c2.png"; +const imgRectangle1738 = "http://localhost:3845/assets/50e850999bbdd551763a187d402169c28ffecec5.png"; export default function HomePage() { const router = useRouter(); const [isLoggedIn, setIsLoggedIn] = useState(false); const [isLoading, setIsLoading] = useState(true); + // 임시 데이터 - 실제로는 API에서 가져올 데이터 + const [courses, setCourses] = useState([ + { id: 1, title: '원자로 운전 및 계통', image: imgRectangle1737 }, + { id: 2, title: '핵 연료', image: imgRectangle1738 }, + { id: 3, title: '방사선 안전', image: imgRectangle1737 }, + { id: 4, title: '방사성 폐기물', image: imgRectangle1737 }, + ]); + + const [myCourses, setMyCourses] = useState([ + { id: 1, title: '원자로 기본 원리와 주요 계통 이해 - 이론 1', date: '2025-12-12(화)' }, + { id: 2, title: '원자로 기동 및 정상운전 절차 - 이론2', date: '2025-12-12(화)' }, + { id: 3, title: '비상 시 운전원 조치와 안전 계통 운용', date: '2025-12-12(화)' }, + { id: 4, title: '운전 사례 분석 및 시뮬레이션 실습', date: '2025-12-12(화)' }, + { id: 5, title: '핵분열과 핵연로 주기 이해', date: '2025-12-12(화)' }, + { id: 6, title: '핵연료 제조 공정 및 특성', date: '2025-12-12(화)' }, + { id: 7, title: '핵연로 성능 평가와 열수력 해석', date: '2025-12-12(화)' }, + ]); + + const [notices, setNotices] = useState([ + { id: 1, title: '[점검] 방사선 폐기 VR 실습 서버 정기점검 안내', date: '2025-12-12(화)' }, + { id: 2, title: '[점검] 방사선 폐기 VR 실습 서버 정기점검 안내', date: '2025-12-12(화)' }, + { id: 3, title: '[점검] 방사선 폐기 VR 실습 서버 정기점검 안내', date: '2025-12-12(화)' }, + { id: 4, title: '[점검] 방사선 폐기 VR 실습 서버 정기점검 안내', date: '2025-12-12(화)' }, + { id: 5, title: '[점검] 방사선 폐기 VR 실습 서버 정기점검 안내', date: '2025-12-12(화)' }, + { id: 6, title: '[점검] 방사선 폐기 VR 실습 서버 정기점검 안내', date: '2025-12-12(화)' }, + { id: 7, title: '[점검] 방사선 폐기 VR 실습 서버 정기점검 안내', date: '2025-12-12(화)' }, + { id: 8, title: '[점검] 방사선 폐기 VR 실습 서버 정기점검 안내', date: '2025-12-12(화)' }, + { id: 9, title: '[점검] 방사선 폐기 VR 실습 서버 정기점검 안내', date: '2025-12-12(화)' }, + { id: 10, title: '[점검] 방사선 폐기 VR 실습 서버 정기점검 안내', date: '2025-12-12(화)' }, + ]); + useEffect(() => { // 로그인 상태 확인 const loginStatus = localStorage.getItem('isLoggedIn') === 'true'; @@ -27,21 +67,178 @@ export default function HomePage() { // 로그인되었으면 메인 페이지 표시 return ( -
-
-

메인 페이지

-

로그인 후 메인 페이지입니다.

+
+ {/* 헤더 */} +
+
+ {/* 로고 */} +
+
+ +
+
+ {/* 메뉴 */} +
+
+
+

+ 교육 과정 목록 +

+
+
+
+
+

+ 학습 자료실 +

+
+
+
+
+

+ 공지사항 +

+
+
+
+
+ {/* 사용자 메뉴 */} +
+ + +
+
- {/* 로그아웃 버튼 */} - + {/* 구분선 */} +
+
+ +
+
+ + {/* Hero 배너 */} +
+
+ +
+
+ + {/* 전체 교육 과정 (4개) */} +
+
+
+

+ 전체 교육 과정 ({courses.length}개) +

+
+
+
+ + {/* 지도보기 아이콘 */} +
+ +
+ + {/* 교육 과정 카드들 - 데이터가 있을 때 */} + {courses.length > 0 ? ( +
+ {courses.map((course) => ( +
+
+ +
+
+

+ {course.title} +

+
+
+ ))} +
+ ) : ( + /* 등록된 교육 과정이 없습니다 메시지 - 데이터가 없을 때 */ +

+ 등록된 교육 과정이 없습니다. +

+ )} + + {/* 나의 수강 강좌 목록 */} +
+
+
+

+ 나의 수강 강좌 목록 ({myCourses.length}개) +

+
+
+
+ {myCourses.length > 0 ? ( + myCourses.map((course) => ( +
+

+ {course.title} +

+

+ {course.date} +

+
+ )) + ) : ( +
+

+ 수강 중인 강좌가 없습니다. +

+
+ )} +
+
+ + {/* 공지사항 */} +
+
+
+

+ 공지사항 +

+
+
+
+ {notices.length > 0 ? ( + notices.map((notice) => ( +
+

+ {notice.title} +

+

+ {notice.date} +

+
+ )) + ) : ( +
+

+ 등록된 공지사항이 없습니다. +

+
+ )} +
); diff --git a/app/registeragreement/page.tsx b/app/registeragreement/page.tsx deleted file mode 100644 index 9bc534d..0000000 --- a/app/registeragreement/page.tsx +++ /dev/null @@ -1,172 +0,0 @@ -'use client'; - -import { useState } from 'react'; -import Link from 'next/link'; - -export default function RegisterAgreementPage() { - const [allAgreed, setAllAgreed] = useState(false); - const [ageAgreed, setAgeAgreed] = useState(false); - const [termsAgreed, setTermsAgreed] = useState(false); - const [privacyAgreed, setPrivacyAgreed] = useState(false); - - // 전체 동의 핸들러 - const handleAllAgreed = (checked: boolean) => { - setAllAgreed(checked); - setAgeAgreed(checked); - setTermsAgreed(checked); - setPrivacyAgreed(checked); - }; - - // 개별 체크박스 변경 시 전체 동의 상태 업데이트 - const updateAllAgreed = () => { - if (ageAgreed && termsAgreed && privacyAgreed) { - setAllAgreed(true); - } else { - setAllAgreed(false); - } - }; - - // 개별 체크박스 핸들러 - const handleAgeAgreed = (checked: boolean) => { - setAgeAgreed(checked); - updateAllAgreed(); - }; - - const handleTermsAgreed = (checked: boolean) => { - setTermsAgreed(checked); - updateAllAgreed(); - }; - - const handlePrivacyAgreed = (checked: boolean) => { - setPrivacyAgreed(checked); - updateAllAgreed(); - }; - - // 다음 단계 진행 가능 여부 - const canProceed = ageAgreed && termsAgreed && privacyAgreed; - - return ( -
-
- {/* 회원가입 카드 */} -
- {/* 제목 */} -

회원가입

- - {/* 단계 표시 */} -
-
- - 01 약관 동의 - - > - 02 회원정보입력 - > - 03 회원가입완료 -
-
- - {/* 약관 동의 섹션 */} -
- {/* 전체 동의 */} -
- -
- - {/* 개별 약관 */} -
- {/* 만 14세 이상 */} -
- - -
- - {/* 이용 약관 */} -
- - -
- - {/* 개인정보 수집 및 이용 */} -
- - -
-
-
- - {/* 버튼 영역 */} -
- - 돌아가기 - - !canProceed && e.preventDefault()} - > - 동의 후 가입하기 - -
-
- - {/* 카피라이트 */} -
- Copyright © 2025 XL LMS. All rights reserved -
-
-
- ); -} -