93 lines
3.4 KiB
JavaScript
93 lines
3.4 KiB
JavaScript
// /js/user-dashboard.js
|
|
import { getUser } from './auth.js';
|
|
import { apiGet } from './api-helper.js'; // 개선된 api-helper를 사용합니다.
|
|
|
|
/**
|
|
* API를 호출하여 오늘의 작업 일정을 불러와 화면에 표시합니다.
|
|
*/
|
|
async function loadTodaySchedule() {
|
|
const scheduleContainer = document.getElementById('today-schedule');
|
|
scheduleContainer.innerHTML = '<p>📅 오늘의 작업 일정을 불러오는 중...</p>';
|
|
|
|
try {
|
|
// 예시: /api/dashboard/today-schedule 엔드포인트에서 데이터를 가져옵니다.
|
|
// 실제 엔드포인트는 백엔드 구현에 따라 달라질 수 있습니다.
|
|
const scheduleData = await apiGet('/dashboard/today-schedule');
|
|
|
|
if (scheduleData && scheduleData.length > 0) {
|
|
const scheduleHtml = scheduleData.map(item => `
|
|
<div class="schedule-item">
|
|
<span class="time">${item.time}</span>
|
|
<span class="task">${item.task_name}</span>
|
|
<span class="status ${item.status}">${item.status_kor}</span>
|
|
</div>
|
|
`).join('');
|
|
scheduleContainer.innerHTML = scheduleHtml;
|
|
} else {
|
|
scheduleContainer.innerHTML = '<p>오늘 예정된 작업이 없습니다.</p>';
|
|
}
|
|
} catch (error) {
|
|
console.error('오늘의 작업 일정 로드 실패:', error);
|
|
scheduleContainer.innerHTML = '<p class="error">일정 정보를 불러오는 데 실패했습니다.</p>';
|
|
}
|
|
}
|
|
|
|
/**
|
|
* API를 호출하여 현재 사용자의 작업 통계를 불러와 화면에 표시합니다.
|
|
*/
|
|
async function loadWorkStats() {
|
|
const statsContainer = document.getElementById('work-stats');
|
|
statsContainer.innerHTML = '<p>📈 내 작업 현황을 불러오는 중...</p>';
|
|
|
|
try {
|
|
// 예시: /api/dashboard/my-stats 엔드포인트에서 데이터를 가져옵니다.
|
|
const statsData = await apiGet('/dashboard/my-stats');
|
|
|
|
if (statsData) {
|
|
const statsHtml = `
|
|
<div class="stat-item">
|
|
<span>이번 주 작업 시간:</span>
|
|
<strong>${statsData.weekly_hours || 0} 시간</strong>
|
|
</div>
|
|
<div class="stat-item">
|
|
<span>이번 달 작업 시간:</span>
|
|
<strong>${statsData.monthly_hours || 0} 시간</strong>
|
|
</div>
|
|
<div class="stat-item">
|
|
<span>완료한 작업 수:</span>
|
|
<strong>${statsData.completed_tasks || 0} 건</strong>
|
|
</div>
|
|
`;
|
|
statsContainer.innerHTML = statsHtml;
|
|
} else {
|
|
statsContainer.innerHTML = '<p>표시할 통계 정보가 없습니다.</p>';
|
|
}
|
|
} catch (error) {
|
|
console.error('작업 통계 로드 실패:', error);
|
|
statsContainer.innerHTML = '<p class="error">통계 정보를 불러오는 데 실패했습니다.</p>';
|
|
}
|
|
}
|
|
|
|
/**
|
|
* 환영 메시지를 사용자 이름으로 개인화합니다.
|
|
*/
|
|
function personalizeWelcome() {
|
|
// 전역 변수 대신 auth.js 모듈을 통해 사용자 정보를 가져옵니다.
|
|
const user = getUser();
|
|
if (user) {
|
|
const welcomeEl = document.getElementById('welcome-message');
|
|
if (welcomeEl) {
|
|
welcomeEl.textContent = `${user.name || user.username}님, 환영합니다! 오늘 하루도 안전하게 작업하세요.`;
|
|
}
|
|
}
|
|
}
|
|
|
|
// 페이지 초기화 함수
|
|
function initializeDashboard() {
|
|
personalizeWelcome();
|
|
loadTodaySchedule();
|
|
loadWorkStats();
|
|
}
|
|
|
|
// DOM이 로드되면 대시보드 초기화를 시작합니다.
|
|
document.addEventListener('DOMContentLoaded', initializeDashboard); |