// My Dashboard - 나의 대시보드 JavaScript import './api-config.js'; // 전역 변수 let currentYear = new Date().getFullYear(); let currentMonth = new Date().getMonth() + 1; // 페이지 초기화 document.addEventListener('DOMContentLoaded', async () => { console.log('📊 나의 대시보드 초기화 시작'); await loadUserInfo(); await loadVacationBalance(); await loadMonthlyCalendar(); await loadWorkHoursStats(); await loadRecentReports(); console.log('✅ 나의 대시보드 초기화 완료'); }); // 사용자 정보 로드 async function loadUserInfo() { try { const response = await apiCall('/users/me', 'GET'); const user = response.data || response; document.getElementById('userName').textContent = user.name || '사용자'; document.getElementById('department').textContent = user.department || '-'; document.getElementById('jobType').textContent = user.job_type || '-'; document.getElementById('hireDate').textContent = user.hire_date || '-'; } catch (error) { console.error('사용자 정보 로드 실패:', error); } } // 연차 정보 로드 async function loadVacationBalance() { try { const response = await apiCall('/users/me/vacation-balance', 'GET'); const balance = response.data || response; const total = balance.total_annual_leave || 15; const used = balance.used_annual_leave || 0; const remaining = total - used; document.getElementById('totalLeave').textContent = total; document.getElementById('usedLeave').textContent = used; document.getElementById('remainingLeave').textContent = remaining; // 프로그레스 바 업데이트 const percentage = (used / total) * 100; document.getElementById('vacationProgress').style.width = `${percentage}%`; } catch (error) { console.error('연차 정보 로드 실패:', error); } } // 월별 캘린더 로드 async function loadMonthlyCalendar() { try { const response = await apiCall( `/users/me/attendance-records?year=${currentYear}&month=${currentMonth}`, 'GET' ); const records = response.data || response; renderCalendar(currentYear, currentMonth, records); document.getElementById('currentMonth').textContent = `${currentYear}년 ${currentMonth}월`; } catch (error) { console.error('캘린더 로드 실패:', error); renderCalendar(currentYear, currentMonth, []); } } // 캘린더 렌더링 function renderCalendar(year, month, records) { const calendar = document.getElementById('calendar'); const firstDay = new Date(year, month - 1, 1).getDay(); const daysInMonth = new Date(year, month, 0).getDate(); let html = ''; // 요일 헤더 const weekdays = ['일', '월', '화', '수', '목', '금', '토']; weekdays.forEach(day => { html += `
${day}
`; }); // 빈 칸 for (let i = 0; i < firstDay; i++) { html += '
'; } // 날짜 for (let day = 1; day <= daysInMonth; day++) { const dateStr = `${year}-${String(month).padStart(2, '0')}-${String(day).padStart(2, '0')}`; const record = Array.isArray(records) ? records.find(r => r.record_date === dateStr) : null; let statusClass = ''; if (record) { const typeCode = record.attendance_type_code || record.type_code || ''; statusClass = typeCode.toLowerCase(); } html += `
${day}
`; } calendar.innerHTML = html; } // 근무 시간 통계 로드 async function loadWorkHoursStats() { try { const response = await apiCall( `/users/me/monthly-stats?year=${currentYear}&month=${currentMonth}`, 'GET' ); const stats = response.data || response; document.getElementById('monthHours').textContent = stats.month_hours || 0; document.getElementById('workDays').textContent = stats.work_days || 0; } catch (error) { console.error('근무 시간 통계 로드 실패:', error); } } // 최근 작업 보고서 로드 async function loadRecentReports() { try { const endDate = new Date().toISOString().split('T')[0]; const startDate = new Date(Date.now() - 7 * 24 * 60 * 60 * 1000) .toISOString().split('T')[0]; const response = await apiCall( `/users/me/work-reports?startDate=${startDate}&endDate=${endDate}`, 'GET' ); const reports = response.data || response; const list = document.getElementById('recentReportsList'); if (!Array.isArray(reports) || reports.length === 0) { list.innerHTML = '

최근 7일간의 작업 보고서가 없습니다.

'; return; } list.innerHTML = reports.map(r => `
${r.report_date} ${r.project_name || 'N/A'} ${r.work_hours}시간
`).join(''); } catch (error) { console.error('최근 작업 보고서 로드 실패:', error); } } // 이전 달 function previousMonth() { currentMonth--; if (currentMonth < 1) { currentMonth = 12; currentYear--; } loadMonthlyCalendar(); loadWorkHoursStats(); } // 다음 달 function nextMonth() { currentMonth++; if (currentMonth > 12) { currentMonth = 1; currentYear++; } loadMonthlyCalendar(); loadWorkHoursStats(); } // 전역 함수 노출 window.previousMonth = previousMonth; window.nextMonth = nextMonth; window.loadMonthlyCalendar = loadMonthlyCalendar;