'use client'; import { useEffect, useState } from 'react'; import { useRouter } from 'next/navigation'; import Link from 'next/link'; import MainLogoSvg from '../svgs/mainlogosvg'; import ChevronDownSvg from '../svgs/chevrondownsvg'; import apiService from '../lib/apiService'; // 아이콘 컴포넌트들 function BookIcon({ className }: { className?: string }) { return ( ); } function DocumentIcon({ className }: { className?: string }) { return ( ); } function CheckCircleIcon({ className }: { className?: string }) { return ( ); } function UserIcon({ className }: { className?: string }) { return ( ); } function ChevronRightIcon({ className }: { className?: string }) { return ( ); } type Activity = { id: string; userName: string; message: string; timestamp: string; }; export default function InstructorPage() { const router = useRouter(); const [userName, setUserName] = useState(''); const [userRole, setUserRole] = useState(''); const [totalCourses, setTotalCourses] = useState(5); const [submissionStatus, setSubmissionStatus] = useState<{ current: number; total: number }>({ current: 10, total: 50 }); const [completionStatus, setCompletionStatus] = useState<{ current: number; total: number }>({ current: 14, total: 50 }); const [activities, setActivities] = useState([ { id: '1', userName: '김하늘', message: '{강좌명} 문제를 제출했습니다.', timestamp: '2025-12-12 14:44' }, { id: '2', userName: '김하늘', message: '{강좌명} 문제를 제출했습니다.', timestamp: '2025-12-12 14:44' }, { id: '3', userName: '김하늘', message: '모든 강좌를 수강했습니다.', timestamp: '2025-12-12 14:44' }, ]); // 사용자 정보 가져오기 useEffect(() => { let isMounted = true; async function fetchUserInfo() { try { const localStorageToken = localStorage.getItem('token'); const cookieToken = document.cookie .split('; ') .find(row => row.startsWith('token=')) ?.split('=')[1]; const token = localStorageToken || cookieToken; if (!token) { router.push('/login'); return; } const response = await apiService.getCurrentUser(); if (response.status === 401) { localStorage.removeItem('token'); document.cookie = 'token=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;'; if (isMounted) { router.push('/login'); } return; } const data = response.data; if (isMounted) { const role = data.role || data.userRole || ''; setUserRole(role); // admin이 아니면 접근 불가 if (role !== 'ADMIN' && role !== 'admin') { router.push('/'); return; } if (data.name) { setUserName(data.name); } } } catch (error) { console.error('사용자 정보 조회 오류:', error); if (isMounted) { router.push('/login'); } } } fetchUserInfo(); return () => { isMounted = false; }; }, [router]); return (
{/* 강좌별 상세 내역 섹션 */}

강좌별 상세 내역

전체보기
{/* 총 강좌 수 카드 */}

총 강좌 수

{totalCourses}

{/* 학습자 문제 제출 현황 카드 */}

학습자 문제 제출 현황

{submissionStatus.current} / {submissionStatus.total}

{/* 학습자 수료 현황 카드 */}

학습자 수료 현황

{completionStatus.current} / {completionStatus.total}

{/* 최근 학습자 활동 섹션 */}

최근 학습자 활동

{activities.map((activity) => (
{activity.userName} {activity.message}

{activity.timestamp}

))}
); }