- 순찰/점검 기능 개선 (zone-detail 페이지 추가) - 출근/근태 시스템 개선 (연차 조회, 근무현황) - 작업분석 대분류 그룹화 및 마이그레이션 스크립트 - 모바일 네비게이션 UI 추가 - NAS 배포 도구 및 문서 추가 Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
1399 lines
49 KiB
JavaScript
1399 lines
49 KiB
JavaScript
// ✅ modern-dashboard.js - 모던 대시보드 JavaScript
|
||
|
||
// API 설정 및 함수들은 api-config.js에서 로드됨
|
||
// window.API, window.apiCall, window.getAuthHeaders 사용
|
||
|
||
// 인증 관련 함수들
|
||
function getAuthData() {
|
||
const token = localStorage.getItem('token');
|
||
const user = localStorage.getItem('user');
|
||
return {
|
||
token,
|
||
user: user ? JSON.parse(user) : null
|
||
};
|
||
}
|
||
|
||
// 전역 변수
|
||
let currentUser = null;
|
||
let workersData = [];
|
||
let workData = [];
|
||
let selectedDate = new Date().toISOString().split('T')[0];
|
||
|
||
// 모달 관련 변수
|
||
let currentModalWorker = null;
|
||
let modalWorkTypes = [];
|
||
let modalWorkStatusTypes = [];
|
||
let modalErrorTypes = [];
|
||
let modalProjects = [];
|
||
let modalExistingWork = [];
|
||
|
||
// DOM 요소
|
||
const elements = {
|
||
currentTime: document.getElementById('currentTime'),
|
||
timeValue: document.getElementById('timeValue'),
|
||
userName: document.getElementById('userName'),
|
||
userRole: document.getElementById('userRole'),
|
||
userInitial: document.getElementById('userInitial'),
|
||
selectedDate: document.getElementById('selectedDate'), // 작업장 현황으로 교체되어 없을 수 있음
|
||
refreshBtn: document.getElementById('refreshBtn'), // 작업장 현황으로 교체되어 없을 수 있음
|
||
logoutBtn: document.getElementById('logoutBtn'),
|
||
|
||
// 요약 카드
|
||
todayWorkers: document.getElementById('todayWorkers'),
|
||
totalHours: document.getElementById('totalHours'),
|
||
activeProjects: document.getElementById('activeProjects'),
|
||
errorCount: document.getElementById('errorCount'),
|
||
|
||
// 컨테이너
|
||
workStatusContainer: document.getElementById('workStatusContainer'), // 작업장 현황으로 교체되어 없을 수 있음
|
||
workersContainer: document.getElementById('workersContainer'),
|
||
toastContainer: document.getElementById('toastContainer')
|
||
};
|
||
|
||
// ========== 초기화 ========== //
|
||
document.addEventListener('DOMContentLoaded', async () => {
|
||
// API 함수가 로드될 때까지 기다림
|
||
let retryCount = 0;
|
||
const maxRetries = 50; // 5초 대기
|
||
|
||
while (!window.apiCall && retryCount < maxRetries) {
|
||
await new Promise(resolve => setTimeout(resolve, 100));
|
||
retryCount++;
|
||
}
|
||
|
||
if (!window.apiCall) {
|
||
console.error('❌ API 함수를 로드할 수 없습니다.');
|
||
showToast('시스템을 초기화할 수 없습니다. 페이지를 새로고침해주세요.', 'error');
|
||
return;
|
||
}
|
||
|
||
try {
|
||
await initializeDashboard();
|
||
} catch (error) {
|
||
console.error('대시보드 초기화 오류:', error);
|
||
showToast('대시보드를 불러오는 중 오류가 발생했습니다.', 'error');
|
||
}
|
||
});
|
||
|
||
async function initializeDashboard() {
|
||
console.log('🚀 모던 대시보드 초기화 시작');
|
||
|
||
// 사용자 정보 설정
|
||
setupUserInfo();
|
||
|
||
// 시간 업데이트 시작
|
||
updateCurrentTime();
|
||
setInterval(updateCurrentTime, 1000);
|
||
|
||
// 날짜 설정 (요소가 있을 때만)
|
||
if (elements.selectedDate) {
|
||
elements.selectedDate.value = selectedDate;
|
||
}
|
||
|
||
// 이벤트 리스너 설정
|
||
setupEventListeners();
|
||
|
||
// 데이터 로드 (작업 현황 컨테이너가 있을 때만)
|
||
if (elements.workStatusContainer) {
|
||
await loadDashboardData();
|
||
}
|
||
|
||
// 관리자 권한 확인
|
||
checkAdminAccess();
|
||
|
||
// TBM 페이지 접근 권한 확인
|
||
checkTbmPageAccess();
|
||
|
||
console.log('✅ 모던 대시보드 초기화 완료');
|
||
}
|
||
|
||
// ========== 사용자 정보 설정 ========== //
|
||
// navbar/sidebar는 app-init.js에서 공통 처리하므로 여기서는 currentUser만 설정
|
||
function setupUserInfo() {
|
||
const authData = getAuthData();
|
||
if (authData && authData.user) {
|
||
currentUser = authData.user;
|
||
console.log('👤 사용자 정보 로드 완료:', currentUser.name, currentUser.role);
|
||
}
|
||
}
|
||
|
||
// ========== 시간 업데이트 ========== //
|
||
function updateCurrentTime() {
|
||
// Navbar 컴포넌트가 시간을 처리하므로 여기서는 timeValue가 있을 때만 업데이트
|
||
if (elements.timeValue) {
|
||
const now = new Date();
|
||
const hours = String(now.getHours()).padStart(2, '0');
|
||
const minutes = String(now.getMinutes()).padStart(2, '0');
|
||
const seconds = String(now.getSeconds()).padStart(2, '0');
|
||
elements.timeValue.textContent = `${hours}시 ${minutes}분 ${seconds}초`;
|
||
}
|
||
}
|
||
|
||
// ========== 이벤트 리스너 ========== //
|
||
function setupEventListeners() {
|
||
// 날짜 변경 (요소가 있을 때만)
|
||
if (elements.selectedDate) {
|
||
elements.selectedDate.addEventListener('change', (e) => {
|
||
selectedDate = e.target.value;
|
||
loadDashboardData();
|
||
});
|
||
}
|
||
|
||
// 새로고침 버튼 (요소가 있을 때만)
|
||
if (elements.refreshBtn) {
|
||
elements.refreshBtn.addEventListener('click', () => {
|
||
loadDashboardData();
|
||
showToast('데이터를 새로고침했습니다.', 'success');
|
||
});
|
||
}
|
||
|
||
// 로그아웃 버튼 (navbar 컴포넌트가 이미 처리하므로 버튼이 있을 때만)
|
||
if (elements.logoutBtn) {
|
||
elements.logoutBtn.addEventListener('click', () => {
|
||
if (confirm('로그아웃하시겠습니까?')) {
|
||
localStorage.clear();
|
||
window.location.href = '/index.html';
|
||
}
|
||
});
|
||
}
|
||
|
||
// 뷰 컨트롤 버튼들
|
||
const listViewBtn = document.getElementById('listViewBtn');
|
||
const cardViewBtn = document.getElementById('cardViewBtn');
|
||
|
||
if (listViewBtn) {
|
||
listViewBtn.addEventListener('click', () => {
|
||
displayWorkers(workersData, 'list');
|
||
updateViewButtons('list');
|
||
});
|
||
}
|
||
|
||
if (cardViewBtn) {
|
||
cardViewBtn.addEventListener('click', () => {
|
||
displayWorkers(workersData, 'card');
|
||
updateViewButtons('card');
|
||
});
|
||
}
|
||
}
|
||
|
||
// ========== 데이터 로드 ========== //
|
||
async function loadDashboardData() {
|
||
console.log('📊 대시보드 데이터 로딩 시작');
|
||
|
||
try {
|
||
// 로딩 상태 표시
|
||
showLoadingState();
|
||
|
||
// 병렬로 데이터 로드
|
||
const [workersResult, workResult] = await Promise.all([
|
||
loadWorkers(),
|
||
loadWorkData(selectedDate)
|
||
]);
|
||
|
||
// 요약 데이터 업데이트
|
||
updateSummaryCards();
|
||
|
||
// 작업 현황 표시
|
||
displayWorkStatus();
|
||
|
||
// 작업자 현황 표시
|
||
displayWorkers(workersData, 'card');
|
||
|
||
console.log('✅ 대시보드 데이터 로딩 완료');
|
||
|
||
} catch (error) {
|
||
console.error('❌ 대시보드 데이터 로딩 오류:', error);
|
||
showErrorState();
|
||
showToast('데이터를 불러오는 중 오류가 발생했습니다.', 'error');
|
||
}
|
||
}
|
||
|
||
async function loadWorkers() {
|
||
try {
|
||
console.log('👥 작업자 데이터 로딩...');
|
||
const response = await window.apiCall('/workers');
|
||
const allWorkers = Array.isArray(response) ? response : (response.data || []);
|
||
|
||
// 활성화된 작업자만 필터링
|
||
workersData = allWorkers.filter(worker => {
|
||
return worker.status === 'active' || worker.is_active === 1 || worker.is_active === true;
|
||
});
|
||
|
||
console.log(`✅ 작업자 ${workersData.length}명 로드 완료 (전체: ${allWorkers.length}명)`);
|
||
return workersData;
|
||
} catch (error) {
|
||
console.error('작업자 데이터 로딩 오류:', error);
|
||
workersData = [];
|
||
throw error;
|
||
}
|
||
}
|
||
|
||
async function loadWorkData(date) {
|
||
try {
|
||
console.log(`📋 ${date} 작업 데이터 로딩...`);
|
||
const response = await window.apiCall(`/daily-work-reports?date=${date}&view_all=true`);
|
||
workData = Array.isArray(response) ? response : (response.data || []);
|
||
console.log(`✅ 작업 데이터 ${workData.length}건 로드 완료`);
|
||
return workData;
|
||
} catch (error) {
|
||
console.error('작업 데이터 로딩 오류:', error);
|
||
workData = [];
|
||
throw error;
|
||
}
|
||
}
|
||
|
||
// ========== 요약 카드 업데이트 ========== //
|
||
function updateSummaryCards() {
|
||
// 오늘 작업자 수
|
||
const todayWorkersCount = new Set(workData.map(w => w.worker_id)).size;
|
||
updateSummaryCard(elements.todayWorkers, todayWorkersCount, '명');
|
||
|
||
// 총 작업 시간
|
||
const totalHours = workData.reduce((sum, work) => sum + parseFloat(work.work_hours || 0), 0);
|
||
updateSummaryCard(elements.totalHours, totalHours.toFixed(1), '시간');
|
||
|
||
// 진행 중인 프로젝트
|
||
const activeProjectsCount = new Set(workData.map(w => w.project_id)).size;
|
||
updateSummaryCard(elements.activeProjects, activeProjectsCount, '개');
|
||
|
||
// 오류 발생 건수
|
||
const errorCount = workData.filter(w => w.work_status_id === 2).length;
|
||
updateSummaryCard(elements.errorCount, errorCount, '건');
|
||
}
|
||
|
||
function updateSummaryCard(element, value, unit) {
|
||
if (element) {
|
||
const numberElement = element.querySelector('.value-number');
|
||
const unitElement = element.querySelector('.value-unit');
|
||
|
||
if (numberElement) numberElement.textContent = value;
|
||
if (unitElement) unitElement.textContent = unit;
|
||
}
|
||
}
|
||
|
||
// ========== SVG 아이콘 정의 ========== //
|
||
const SVG_ICONS = {
|
||
complete: `<svg class="status-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
||
<polyline points="20 6 9 17 4 12"></polyline>
|
||
</svg>`,
|
||
|
||
overtime: `<svg class="status-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
||
<circle cx="12" cy="12" r="10"></circle>
|
||
<polyline points="12 6 12 12 16 14"></polyline>
|
||
</svg>`,
|
||
|
||
vacation: `<svg class="status-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
||
<path d="M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z"></path>
|
||
<circle cx="12" cy="10" r="3"></circle>
|
||
</svg>`,
|
||
|
||
partial: `<svg class="status-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
||
<path d="M12 2v20M17 5H9.5a3.5 3.5 0 0 0 0 7h5a3.5 3.5 0 0 1 0 7H6"></path>
|
||
</svg>`,
|
||
|
||
incomplete: `<svg class="status-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
||
<circle cx="12" cy="12" r="10"></circle>
|
||
<line x1="15" y1="9" x2="9" y2="15"></line>
|
||
<line x1="9" y1="9" x2="15" y2="15"></line>
|
||
</svg>`,
|
||
|
||
warning: `<svg class="status-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
||
<path d="M10.29 3.86L1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z"></path>
|
||
<line x1="12" y1="9" x2="12" y2="13"></line>
|
||
<line x1="12" y1="17" x2="12.01" y2="17"></line>
|
||
</svg>`
|
||
};
|
||
|
||
// ========== 작업 현황 표시 (작업자 중심) ========== //
|
||
function displayWorkStatus() {
|
||
const tableBody = document.getElementById('workStatusTableBody');
|
||
if (!tableBody) return;
|
||
|
||
// 모든 작업자 데이터 가져오기 (작업이 없는 작업자도 포함)
|
||
const allWorkers = workersData || [];
|
||
|
||
if (allWorkers.length === 0) {
|
||
tableBody.innerHTML = `
|
||
<tr>
|
||
<td colspan="5" class="empty-state">
|
||
<p>등록된 작업자가 없습니다</p>
|
||
</td>
|
||
</tr>
|
||
`;
|
||
return;
|
||
}
|
||
|
||
// 작업자별 상황 분석
|
||
const workerStatusList = allWorkers.map(worker => {
|
||
const todayWork = workData.filter(w => w.worker_id === worker.worker_id);
|
||
const totalHours = todayWork.reduce((sum, w) => sum + parseFloat(w.work_hours || 0), 0);
|
||
|
||
// 휴가/연차 제외한 실제 작업시간 계산
|
||
const actualWorkHours = todayWork
|
||
.filter(w => w.project_id !== 13) // 연차/휴무 프로젝트 제외
|
||
.reduce((sum, w) => sum + parseFloat(w.work_hours || 0), 0);
|
||
|
||
const hasError = todayWork.some(w => w.work_status_id === 2);
|
||
|
||
// 정규 작업과 에러 작업 건수 분리
|
||
const regularWorkCount = todayWork.filter(w => w.project_id !== 13 && w.work_status_id !== 2).length;
|
||
const errorWorkCount = todayWork.filter(w => w.project_id !== 13 && w.work_status_id === 2).length;
|
||
|
||
// 상태 판단 로직 (개선된 버전)
|
||
let status = 'incomplete';
|
||
let statusText = '미입력';
|
||
let statusBadge = '미입력';
|
||
let statusClass = 'incomplete';
|
||
let vacationType = null;
|
||
|
||
// 휴가 처리된 경우 확인 (프로젝트 ID 13 = "연차/휴무" 또는 설명에 휴가 키워드)
|
||
const hasVacationRecord = todayWork.some(w =>
|
||
w.project_id === 13 || // 연차/휴무 프로젝트
|
||
(w.description && (
|
||
w.description.includes('연차') ||
|
||
w.description.includes('반차') ||
|
||
w.description.includes('휴가')
|
||
))
|
||
);
|
||
|
||
// 연차/휴무 프로젝트의 시간 계산
|
||
const vacationHours = todayWork
|
||
.filter(w => w.project_id === 13)
|
||
.reduce((sum, w) => sum + parseFloat(w.work_hours || 0), 0);
|
||
|
||
if (totalHours > 12) {
|
||
status = 'overtime-warning';
|
||
statusText = '초과근무 확인필요';
|
||
statusBadge = '확인필요';
|
||
statusClass = 'warning';
|
||
} else if (hasVacationRecord && vacationHours > 0) {
|
||
// 연차/휴무 시간에 따른 상태 결정
|
||
if (vacationHours === 8) {
|
||
status = 'vacation-full';
|
||
statusText = '연차';
|
||
statusBadge = '연차';
|
||
statusClass = 'vacation';
|
||
} else if (vacationHours === 6) {
|
||
status = 'vacation-half-half';
|
||
statusText = '조퇴';
|
||
statusBadge = '조퇴';
|
||
statusClass = 'vacation';
|
||
} else if (vacationHours === 4) {
|
||
status = 'vacation-half';
|
||
statusText = '반차';
|
||
statusBadge = '반차';
|
||
statusClass = 'vacation';
|
||
} else if (vacationHours === 2) {
|
||
status = 'vacation-quarter';
|
||
statusText = '반반차';
|
||
statusBadge = '반반차';
|
||
statusClass = 'vacation';
|
||
}
|
||
} else if (totalHours > 8) {
|
||
// 8시간 초과 - 연장근로
|
||
status = 'overtime';
|
||
statusText = '연장근로';
|
||
statusBadge = '연장근로';
|
||
statusClass = 'overtime';
|
||
} else if (totalHours === 8) {
|
||
// 정확히 8시간 - 정시근로
|
||
status = 'complete';
|
||
statusText = '정시근로';
|
||
statusBadge = '정시근로';
|
||
statusClass = 'success';
|
||
} else if (totalHours > 0) {
|
||
// 0시간 초과 8시간 미만 - 부분 입력
|
||
status = 'partial';
|
||
statusText = '부분 입력';
|
||
statusBadge = '부분입력';
|
||
statusClass = 'info';
|
||
|
||
// 휴가 처리 필요 여부 판단
|
||
if (totalHours === 0) {
|
||
vacationType = 'full';
|
||
} else if (totalHours === 4) {
|
||
vacationType = 'half';
|
||
} else if (totalHours === 6) {
|
||
vacationType = 'half-half'; // 2시간 더 추가해서 조퇴 처리
|
||
}
|
||
} else {
|
||
// 0시간 - 미입력
|
||
status = 'incomplete';
|
||
statusText = '미입력';
|
||
statusBadge = '미입력';
|
||
statusClass = 'incomplete';
|
||
vacationType = 'full';
|
||
}
|
||
|
||
return {
|
||
...worker,
|
||
todayWork,
|
||
totalHours,
|
||
actualWorkHours,
|
||
regularWorkCount,
|
||
errorWorkCount,
|
||
hasError,
|
||
status,
|
||
statusText,
|
||
statusBadge,
|
||
statusClass,
|
||
vacationType
|
||
};
|
||
});
|
||
|
||
// 테이블 행 렌더링
|
||
tableBody.innerHTML = workerStatusList.map(worker => {
|
||
// 상태에 따른 SVG 아이콘 선택
|
||
let iconKey = 'incomplete';
|
||
if (worker.status === 'overtime-warning') iconKey = 'warning';
|
||
else if (worker.status.startsWith('vacation')) iconKey = 'vacation';
|
||
else if (worker.status === 'overtime') iconKey = 'overtime';
|
||
else if (worker.status === 'complete') iconKey = 'complete';
|
||
else if (worker.status === 'partial') iconKey = 'partial';
|
||
|
||
return `
|
||
<tr data-worker-id="${worker.worker_id}">
|
||
<td data-label="작업자" class="worker-info">
|
||
<div class="worker-avatar">
|
||
<span>${worker.worker_name.charAt(0)}</span>
|
||
</div>
|
||
<div class="worker-details">
|
||
<div class="worker-name">${worker.worker_name}</div>
|
||
<div class="worker-job">${worker.job_type || '작업자'}</div>
|
||
</div>
|
||
</td>
|
||
|
||
<td data-label="상태" class="worker-status">
|
||
<span class="status-badge status-${worker.statusClass}">
|
||
${SVG_ICONS[iconKey]}
|
||
<span class="status-text">${worker.statusBadge}</span>
|
||
</span>
|
||
</td>
|
||
|
||
<td data-label="작업시간" class="worker-hours">
|
||
<span class="hours-value ${worker.actualWorkHours > 12 ? 'hours-warning' : ''}">${worker.actualWorkHours.toFixed(1)}h</span>
|
||
</td>
|
||
|
||
<td data-label="작업건수" class="worker-tasks">
|
||
<div class="tasks-summary">
|
||
<span class="task-count">
|
||
<span class="task-label">정규:</span>
|
||
<span class="task-value">${worker.regularWorkCount}건</span>
|
||
</span>
|
||
${worker.errorWorkCount > 0 ? `
|
||
<span class="task-count task-error">
|
||
<span class="task-label">에러:</span>
|
||
<span class="task-value">${worker.errorWorkCount}건</span>
|
||
</span>
|
||
` : ''}
|
||
</div>
|
||
</td>
|
||
|
||
<td data-label="액션" class="worker-actions">
|
||
<div class="action-buttons">
|
||
<button class="action-btn btn-edit" onclick="openWorkerModal(${worker.worker_id}, '${worker.worker_name}')" title="작업입력">
|
||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
||
<path d="M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7"></path>
|
||
<path d="M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z"></path>
|
||
</svg>
|
||
<span class="action-text">작업입력</span>
|
||
</button>
|
||
${worker.vacationType ? `
|
||
<button class="action-btn btn-vacation" onclick="handleVacation(${worker.worker_id}, '${worker.vacationType}')" title="${worker.vacationType === 'full' ? '연차처리' : worker.vacationType === 'half' ? '반차처리' : '반반차처리'}">
|
||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
||
<rect x="3" y="4" width="18" height="18" rx="2" ry="2"></rect>
|
||
<line x1="16" y1="2" x2="16" y2="6"></line>
|
||
<line x1="8" y1="2" x2="8" y2="6"></line>
|
||
<line x1="3" y1="10" x2="21" y2="10"></line>
|
||
</svg>
|
||
<span class="action-text">${worker.vacationType === 'full' ? '연차' : worker.vacationType === 'half' ? '반차' : '반반차'}</span>
|
||
</button>
|
||
` : ''}
|
||
${worker.status === 'overtime-warning' ? `
|
||
<button class="action-btn btn-confirm" onclick="confirmOvertime(${worker.worker_id})" title="정상확인">
|
||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
||
<polyline points="20 6 9 17 4 12"></polyline>
|
||
</svg>
|
||
<span class="action-text">정상확인</span>
|
||
</button>
|
||
` : ''}
|
||
</div>
|
||
</td>
|
||
</tr>
|
||
`;
|
||
}).join('');
|
||
}
|
||
|
||
function groupWorkDataByProject() {
|
||
const groups = {};
|
||
workData.forEach(work => {
|
||
const projectName = work.project_name || '미지정 프로젝트';
|
||
if (!groups[projectName]) {
|
||
groups[projectName] = [];
|
||
}
|
||
groups[projectName].push(work);
|
||
});
|
||
return groups;
|
||
}
|
||
|
||
// ========== 작업자 현황 표시 ========== //
|
||
function displayWorkers(workers, viewType = 'card') {
|
||
if (!elements.workersContainer) return;
|
||
|
||
if (workers.length === 0) {
|
||
elements.workersContainer.innerHTML = `
|
||
<div class="empty-state">
|
||
<div class="empty-icon">👥</div>
|
||
<h3>작업자 데이터가 없습니다</h3>
|
||
<p>등록된 작업자가 없습니다.</p>
|
||
</div>
|
||
`;
|
||
return;
|
||
}
|
||
|
||
if (viewType === 'list') {
|
||
displayWorkersAsList(workers);
|
||
} else {
|
||
displayWorkersAsCards(workers);
|
||
}
|
||
}
|
||
|
||
function displayWorkersAsCards(workers) {
|
||
elements.workersContainer.innerHTML = `
|
||
<div class="workers-grid grid grid-cols-4">
|
||
${workers.map(worker => {
|
||
const todayWork = workData.filter(w => w.worker_id === worker.worker_id);
|
||
const totalHours = todayWork.reduce((sum, w) => sum + parseFloat(w.work_hours || 0), 0);
|
||
|
||
// 휴가/연차 제외한 실제 작업시간 계산
|
||
const actualWorkHours = todayWork
|
||
.filter(w => w.project_id !== 13) // 연차/휴무 프로젝트 제외
|
||
.reduce((sum, w) => sum + parseFloat(w.work_hours || 0), 0);
|
||
|
||
const hasError = todayWork.some(w => w.work_status_id === 2);
|
||
|
||
// 정규 작업과 에러 작업 건수 분리
|
||
const regularWorkCount = todayWork.filter(w => w.project_id !== 13 && w.work_status_id !== 2).length;
|
||
const errorWorkCount = todayWork.filter(w => w.project_id !== 13 && w.work_status_id === 2).length;
|
||
|
||
return `
|
||
<div class="worker-card card">
|
||
<div class="card-body">
|
||
<div class="worker-header">
|
||
<div class="worker-avatar">
|
||
<span>${worker.worker_name.charAt(0)}</span>
|
||
</div>
|
||
<div class="worker-info">
|
||
<h4 class="worker-name">${worker.worker_name}</h4>
|
||
<p class="worker-job">${worker.job_type || '작업자'}</p>
|
||
</div>
|
||
<div class="worker-status">
|
||
<span class="status-dot ${todayWork.length > 0 ? 'active' : 'inactive'}"></span>
|
||
</div>
|
||
</div>
|
||
<div class="worker-stats">
|
||
<div class="stat">
|
||
<span class="stat-label">작업시간</span>
|
||
<span class="stat-value">${actualWorkHours.toFixed(1)}h</span>
|
||
</div>
|
||
<div class="stat">
|
||
<span class="stat-label">정규</span>
|
||
<span class="stat-value">${regularWorkCount}건</span>
|
||
</div>
|
||
${errorWorkCount > 0 ? `
|
||
<div class="stat error">
|
||
<span class="stat-label">에러</span>
|
||
<span class="stat-value">${errorWorkCount}건</span>
|
||
</div>
|
||
` : ''}
|
||
</div>
|
||
</div>
|
||
</div>
|
||
`;
|
||
}).join('')}
|
||
</div>
|
||
`;
|
||
}
|
||
|
||
function displayWorkersAsList(workers) {
|
||
elements.workersContainer.innerHTML = `
|
||
<div class="workers-table">
|
||
<table class="table">
|
||
<thead>
|
||
<tr>
|
||
<th>작업자</th>
|
||
<th>직종</th>
|
||
<th>오늘 작업</th>
|
||
<th>작업 시간</th>
|
||
<th>상태</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
${workers.map(worker => {
|
||
const todayWork = workData.filter(w => w.worker_id === worker.worker_id);
|
||
const totalHours = todayWork.reduce((sum, w) => sum + parseFloat(w.work_hours || 0), 0);
|
||
const hasError = todayWork.some(w => w.work_status_id === 2);
|
||
|
||
return `
|
||
<tr>
|
||
<td>
|
||
<div class="worker-cell">
|
||
<div class="worker-avatar small">
|
||
<span>${worker.worker_name.charAt(0)}</span>
|
||
</div>
|
||
<span class="worker-name">${worker.worker_name}</span>
|
||
</div>
|
||
</td>
|
||
<td>${worker.job_type || '작업자'}</td>
|
||
<td>${todayWork.length}건</td>
|
||
<td>${totalHours.toFixed(1)}시간</td>
|
||
<td>
|
||
<span class="badge ${todayWork.length > 0 ? 'badge-success' : 'badge-gray'}">
|
||
${todayWork.length > 0 ? '작업 중' : '대기'}
|
||
</span>
|
||
${hasError ? '<span class="badge badge-error">오류</span>' : ''}
|
||
</td>
|
||
</tr>
|
||
`;
|
||
}).join('')}
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
`;
|
||
}
|
||
|
||
// ========== 뷰 버튼 업데이트 ========== //
|
||
function updateViewButtons(activeView) {
|
||
const listBtn = document.getElementById('listViewBtn');
|
||
const cardBtn = document.getElementById('cardViewBtn');
|
||
|
||
if (listBtn && cardBtn) {
|
||
listBtn.classList.toggle('btn-primary', activeView === 'list');
|
||
listBtn.classList.toggle('btn-secondary', activeView !== 'list');
|
||
|
||
cardBtn.classList.toggle('btn-primary', activeView === 'card');
|
||
cardBtn.classList.toggle('btn-secondary', activeView !== 'card');
|
||
}
|
||
}
|
||
|
||
// ========== 관리자 권한 확인 ========== //
|
||
function checkAdminAccess() {
|
||
const adminElements = document.querySelectorAll('.admin-only');
|
||
const isFullAdmin = currentUser && ['admin', 'system'].includes(currentUser.access_level);
|
||
const isGroupLeader = currentUser && currentUser.access_level === 'group_leader';
|
||
|
||
console.log(`🔐 권한 확인: 사용자=${currentUser?.username}, 역할=${currentUser.access_level}, 전체관리자=${isFullAdmin}, 그룹리더=${isGroupLeader}`);
|
||
|
||
adminElements.forEach(element => {
|
||
const href = element.getAttribute('href');
|
||
|
||
// 작업 분석: 전체 관리자만 접근 가능
|
||
if (href && href.includes('work-analysis.html')) {
|
||
if (isFullAdmin) {
|
||
element.style.display = '';
|
||
element.classList.add('visible');
|
||
} else {
|
||
element.style.display = 'none';
|
||
element.classList.remove('visible');
|
||
}
|
||
}
|
||
// 작업 관리: 전체 관리자 + 그룹 리더 접근 가능
|
||
else if (href && href.includes('work-management.html')) {
|
||
if (isFullAdmin || isGroupLeader) {
|
||
element.style.display = '';
|
||
element.classList.add('visible');
|
||
} else {
|
||
element.style.display = 'none';
|
||
element.classList.remove('visible');
|
||
}
|
||
}
|
||
// 기타 관리자 전용 메뉴: 전체 관리자만 접근 가능
|
||
else {
|
||
if (isFullAdmin) {
|
||
element.style.display = '';
|
||
element.classList.add('visible');
|
||
} else {
|
||
element.style.display = 'none';
|
||
element.classList.remove('visible');
|
||
}
|
||
}
|
||
});
|
||
}
|
||
|
||
// ========== TBM 페이지 접근 권한 확인 ========== //
|
||
async function checkTbmPageAccess() {
|
||
try {
|
||
if (!currentUser || !currentUser.user_id) {
|
||
console.log('⚠️ TBM 페이지 권한 확인: 사용자 정보 없음');
|
||
return;
|
||
}
|
||
|
||
const tbmQuickAction = document.getElementById('tbmQuickAction');
|
||
if (!tbmQuickAction) {
|
||
console.log('⚠️ TBM 빠른 작업 버튼 요소를 찾을 수 없습니다');
|
||
return;
|
||
}
|
||
|
||
console.log('🛠️ TBM 페이지 권한 확인 중...', { role: currentUser.role, access_level: currentUser.access_level });
|
||
|
||
// Admin은 모든 페이지 접근 가능
|
||
if (currentUser.role === 'Admin' || currentUser.role === 'System Admin' || currentUser.access_level === 'admin' || currentUser.access_level === 'system') {
|
||
tbmQuickAction.style.display = 'block';
|
||
console.log('✅ Admin 사용자 - TBM 빠른 작업 버튼 표시');
|
||
return;
|
||
}
|
||
|
||
// 일반 사용자는 페이지 접근 권한 조회
|
||
const response = await window.apiCall(`/users/${currentUser.user_id}/page-access`);
|
||
|
||
if (response && response.success) {
|
||
const pageAccess = response.data?.pageAccess || [];
|
||
|
||
// 'work.tbm' 페이지 접근 권한 확인 (마이그레이션에서 work.tbm으로 등록함)
|
||
const tbmPage = pageAccess.find(p => p.page_key === 'work.tbm');
|
||
|
||
if (tbmPage && tbmPage.can_access) {
|
||
tbmQuickAction.style.display = 'block';
|
||
console.log('✅ TBM 페이지 접근 권한 있음 - 빠른 작업 버튼 표시');
|
||
} else {
|
||
console.log('❌ TBM 페이지 접근 권한 없음 - 빠른 작업 버튼 숨김');
|
||
}
|
||
} else {
|
||
console.log('⚠️ TBM 페이지 권한 확인 실패');
|
||
}
|
||
} catch (error) {
|
||
console.error('❌ TBM 페이지 권한 확인 오류:', error);
|
||
}
|
||
}
|
||
|
||
// ========== 상태 표시 ========== //
|
||
function showLoadingState() {
|
||
const loadingHTML = `
|
||
<div class="loading-state">
|
||
<div class="spinner"></div>
|
||
<p>데이터를 불러오는 중...</p>
|
||
</div>
|
||
`;
|
||
|
||
if (elements.workStatusContainer) {
|
||
elements.workStatusContainer.innerHTML = loadingHTML;
|
||
}
|
||
|
||
if (elements.workersContainer) {
|
||
elements.workersContainer.innerHTML = loadingHTML;
|
||
}
|
||
}
|
||
|
||
function showErrorState() {
|
||
const errorHTML = `
|
||
<div class="error-state">
|
||
<div class="error-icon">⚠️</div>
|
||
<h3>데이터를 불러올 수 없습니다</h3>
|
||
<p>네트워크 연결을 확인하고 다시 시도해주세요.</p>
|
||
<button class="btn btn-primary" onclick="loadDashboardData()">
|
||
<span>🔄</span>
|
||
다시 시도
|
||
</button>
|
||
</div>
|
||
`;
|
||
|
||
if (elements.workStatusContainer) {
|
||
elements.workStatusContainer.innerHTML = errorHTML;
|
||
}
|
||
|
||
if (elements.workersContainer) {
|
||
elements.workersContainer.innerHTML = errorHTML;
|
||
}
|
||
}
|
||
|
||
// ========== 토스트 알림 ========== //
|
||
function showToast(message, type = 'info', duration = 3000) {
|
||
if (!elements.toastContainer) return;
|
||
|
||
const toast = document.createElement('div');
|
||
toast.className = `toast ${type}`;
|
||
|
||
const iconMap = {
|
||
success: '✅',
|
||
error: '❌',
|
||
warning: '⚠️',
|
||
info: 'ℹ️'
|
||
};
|
||
|
||
toast.innerHTML = `
|
||
<div class="toast-icon">${iconMap[type] || 'ℹ️'}</div>
|
||
<div class="toast-message">${message}</div>
|
||
<button class="toast-close" onclick="this.parentElement.remove()">×</button>
|
||
`;
|
||
|
||
elements.toastContainer.appendChild(toast);
|
||
|
||
// 자동 제거
|
||
setTimeout(() => {
|
||
if (toast.parentElement) {
|
||
toast.remove();
|
||
}
|
||
}, duration);
|
||
}
|
||
|
||
// ========== 작업자 관련 액션 함수들 ========== //
|
||
function openWorkerModal(workerId, workerName) {
|
||
console.log(`📝 ${workerName}(ID: ${workerId}) 작업 보고서 모달 열기`);
|
||
|
||
// 모달 데이터 설정
|
||
currentModalWorker = {
|
||
id: workerId,
|
||
name: workerName,
|
||
date: selectedDate
|
||
};
|
||
|
||
// 모달 표시
|
||
showWorkerModal();
|
||
}
|
||
|
||
function handleVacation(workerId, vacationType) {
|
||
console.log(`🏖️ 작업자 ${workerId} 휴가 처리: ${vacationType}`);
|
||
|
||
const vacationNames = {
|
||
'full': '연차',
|
||
'half': '반차',
|
||
'half-half': '반반차'
|
||
};
|
||
|
||
const vacationHours = {
|
||
'full': 8,
|
||
'half': 4,
|
||
'half-half': 2
|
||
};
|
||
|
||
if (confirm(`${vacationNames[vacationType]} 처리하시겠습니까?\n(${vacationHours[vacationType]}시간으로 자동 입력됩니다)`)) {
|
||
// 휴가 처리 API 호출
|
||
processVacation(workerId, vacationType, vacationHours[vacationType]);
|
||
}
|
||
}
|
||
|
||
async function processVacation(workerId, vacationType, hours) {
|
||
try {
|
||
showToast(`휴가 처리 중...`, 'info');
|
||
|
||
// 휴가용 작업 보고서 생성 (특별한 작업 유형으로)
|
||
const vacationReport = {
|
||
report_date: selectedDate,
|
||
worker_id: workerId,
|
||
project_id: 1, // 기본 프로젝트 (휴가용)
|
||
work_type_id: 999, // 휴가 전용 작업 유형 (DB에 추가 필요)
|
||
work_status_id: 1, // 정상 상태
|
||
error_type_id: null,
|
||
work_hours: hours,
|
||
created_by: currentUser?.user_id || 1
|
||
};
|
||
|
||
const response = await window.apiCall('/daily-work-reports', 'POST', vacationReport);
|
||
|
||
showToast(`휴가 처리가 완료되었습니다.`, 'success');
|
||
await loadDashboardData(); // 데이터 새로고침
|
||
|
||
} catch (error) {
|
||
console.error('휴가 처리 오류:', error);
|
||
showToast(`휴가 처리 중 오류가 발생했습니다: ${error.message}`, 'error');
|
||
}
|
||
}
|
||
|
||
function confirmOvertime(workerId) {
|
||
console.log(`⚠️ 작업자 ${workerId} 초과근무 확인`);
|
||
|
||
if (confirm('12시간을 초과한 작업시간이 정상적인 입력인지 확인하시겠습니까?')) {
|
||
// 초과근무 확인 처리
|
||
processOvertimeConfirmation(workerId);
|
||
}
|
||
}
|
||
|
||
async function processOvertimeConfirmation(workerId) {
|
||
try {
|
||
showToast('초과근무 승인 처리 중...', 'info');
|
||
|
||
// 새로운 근태 관리 API 사용
|
||
const overtimeData = {
|
||
worker_id: workerId,
|
||
date: selectedDate
|
||
};
|
||
|
||
const response = await window.apiCall('/attendance/overtime/approve', 'POST', overtimeData);
|
||
|
||
if (response.success) {
|
||
showToast('초과근무가 정상으로 승인되었습니다.', 'success');
|
||
await loadDashboardData(); // 데이터 새로고침
|
||
} else {
|
||
throw new Error(response.message || '초과근무 승인에 실패했습니다.');
|
||
}
|
||
|
||
} catch (error) {
|
||
console.error('초과근무 승인 오류:', error);
|
||
showToast(`초과근무 승인 중 오류가 발생했습니다: ${error.message}`, 'error');
|
||
}
|
||
}
|
||
|
||
// ========== 모달 시스템 ========== //
|
||
function showWorkerModal() {
|
||
// 모달이 없으면 생성
|
||
if (!document.getElementById('workerModal')) {
|
||
createWorkerModal();
|
||
}
|
||
|
||
// 모달 데이터 로드 및 표시
|
||
loadModalData();
|
||
document.getElementById('workerModal').style.display = 'flex';
|
||
document.body.style.overflow = 'hidden'; // 배경 스크롤 방지
|
||
}
|
||
|
||
function hideWorkerModal() {
|
||
document.getElementById('workerModal').style.display = 'none';
|
||
document.body.style.overflow = 'auto'; // 배경 스크롤 복원
|
||
resetModalForm();
|
||
}
|
||
|
||
function createWorkerModal() {
|
||
const modalHTML = `
|
||
<div id="workerModal" class="modal-overlay">
|
||
<div class="modal-container">
|
||
<div class="modal-header">
|
||
<h2 id="modalTitle">작업자 보고서</h2>
|
||
<button class="modal-close-btn" onclick="hideWorkerModal()">×</button>
|
||
</div>
|
||
|
||
<div class="modal-body">
|
||
<!-- 작업자 정보 -->
|
||
<div class="modal-worker-info">
|
||
<div class="modal-worker-avatar">
|
||
<span id="modalWorkerInitial">작</span>
|
||
</div>
|
||
<div class="modal-worker-details">
|
||
<h3 id="modalWorkerName">작업자명</h3>
|
||
<p id="modalWorkerDate">날짜</p>
|
||
</div>
|
||
<div class="modal-worker-summary">
|
||
<div class="modal-stat">
|
||
<span class="modal-stat-label">총 시간</span>
|
||
<span class="modal-stat-value" id="modalTotalHours">0h</span>
|
||
</div>
|
||
<div class="modal-stat">
|
||
<span class="modal-stat-label">작업 건수</span>
|
||
<span class="modal-stat-value" id="modalWorkCount">0건</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 기존 작업 목록 -->
|
||
<div class="modal-section">
|
||
<div class="modal-section-header">
|
||
<h4>기존 작업 목록</h4>
|
||
<button class="btn btn-sm btn-primary" id="modalAddWorkBtn">새 작업 추가</button>
|
||
</div>
|
||
<div id="modalExistingWork" class="modal-existing-work">
|
||
<!-- 기존 작업들이 여기에 표시됩니다 -->
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 새 작업 추가 폼 -->
|
||
<div class="modal-section" id="modalNewWorkSection" style="display: none;">
|
||
<div class="modal-section-header">
|
||
<h4>새 작업 추가</h4>
|
||
<button class="btn btn-sm btn-secondary" id="modalCancelWorkBtn">취소</button>
|
||
</div>
|
||
<div class="modal-work-form">
|
||
<div class="modal-form-row">
|
||
<div class="modal-form-group">
|
||
<label>프로젝트</label>
|
||
<select id="modalProjectSelect" class="modal-select">
|
||
<option value="">프로젝트 선택</option>
|
||
</select>
|
||
</div>
|
||
<div class="modal-form-group">
|
||
<label>작업 유형</label>
|
||
<select id="modalWorkTypeSelect" class="modal-select">
|
||
<option value="">작업 유형 선택</option>
|
||
</select>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="modal-form-group">
|
||
<label>업무 상태</label>
|
||
<select id="modalWorkStatusSelect" class="modal-select">
|
||
<option value="">업무 상태 선택</option>
|
||
</select>
|
||
</div>
|
||
|
||
<div class="modal-form-group" id="modalErrorTypeGroup" style="display: none;">
|
||
<label>에러 유형</label>
|
||
<select id="modalErrorTypeSelect" class="modal-select">
|
||
<option value="">에러 유형 선택</option>
|
||
</select>
|
||
</div>
|
||
|
||
<div class="modal-form-group">
|
||
<label>작업 시간</label>
|
||
<input type="number" id="modalWorkHours" class="modal-input" step="0.25" min="0.25" max="24" value="1.00">
|
||
<div class="modal-quick-time">
|
||
<button type="button" class="modal-time-btn" data-hours="0.5">0.5h</button>
|
||
<button type="button" class="modal-time-btn" data-hours="1">1h</button>
|
||
<button type="button" class="modal-time-btn" data-hours="2">2h</button>
|
||
<button type="button" class="modal-time-btn" data-hours="4">4h</button>
|
||
<button type="button" class="modal-time-btn" data-hours="8">8h</button>
|
||
</div>
|
||
</div>
|
||
|
||
<button class="btn btn-success modal-save-btn" id="modalSaveWorkBtn">작업 저장</button>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 휴가 처리 -->
|
||
<div class="modal-section">
|
||
<div class="modal-section-header">
|
||
<h4>휴가 처리</h4>
|
||
</div>
|
||
<div class="modal-vacation-buttons">
|
||
<button class="btn btn-warning modal-vacation-btn" data-type="full">연차 (8시간)</button>
|
||
<button class="btn btn-warning modal-vacation-btn" data-type="half-half">반반차 (6시간)</button>
|
||
<button class="btn btn-warning modal-vacation-btn" data-type="half">반차 (4시간)</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="modal-footer">
|
||
<button class="btn btn-secondary" onclick="hideWorkerModal()">닫기</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
`;
|
||
|
||
document.body.insertAdjacentHTML('beforeend', modalHTML);
|
||
setupModalEventListeners();
|
||
}
|
||
|
||
function setupModalEventListeners() {
|
||
// 모달 외부 클릭 시 닫기
|
||
document.getElementById('workerModal').addEventListener('click', (e) => {
|
||
if (e.target.id === 'workerModal') {
|
||
hideWorkerModal();
|
||
}
|
||
});
|
||
|
||
// 새 작업 추가/취소 버튼
|
||
document.getElementById('modalAddWorkBtn').addEventListener('click', showModalNewWorkForm);
|
||
document.getElementById('modalCancelWorkBtn').addEventListener('click', hideModalNewWorkForm);
|
||
document.getElementById('modalSaveWorkBtn').addEventListener('click', saveModalNewWork);
|
||
|
||
// 업무 상태 변경 시 에러 유형 토글
|
||
document.getElementById('modalWorkStatusSelect').addEventListener('change', toggleModalErrorType);
|
||
|
||
// 빠른 시간 버튼
|
||
document.querySelectorAll('.modal-time-btn').forEach(btn => {
|
||
btn.addEventListener('click', (e) => {
|
||
document.getElementById('modalWorkHours').value = e.target.dataset.hours;
|
||
});
|
||
});
|
||
|
||
// 휴가 처리 버튼
|
||
document.querySelectorAll('.modal-vacation-btn').forEach(btn => {
|
||
btn.addEventListener('click', (e) => {
|
||
const vacationType = e.target.dataset.type;
|
||
handleModalVacation(vacationType);
|
||
});
|
||
});
|
||
}
|
||
|
||
async function loadModalData() {
|
||
if (!currentModalWorker) return;
|
||
|
||
try {
|
||
// 모달 헤더 업데이트
|
||
document.getElementById('modalTitle').textContent = `${currentModalWorker.name} 작업 보고서`;
|
||
document.getElementById('modalWorkerName').textContent = currentModalWorker.name;
|
||
document.getElementById('modalWorkerDate').textContent = currentModalWorker.date;
|
||
document.getElementById('modalWorkerInitial').textContent = currentModalWorker.name.charAt(0);
|
||
|
||
// 병렬로 데이터 로드
|
||
await Promise.all([
|
||
loadModalExistingWork(),
|
||
loadModalDropdownData()
|
||
]);
|
||
|
||
// UI 업데이트
|
||
updateModalSummary();
|
||
renderModalExistingWork();
|
||
populateModalDropdowns();
|
||
|
||
} catch (error) {
|
||
console.error('모달 데이터 로드 오류:', error);
|
||
showToast('데이터 로드 중 오류가 발생했습니다.', 'error');
|
||
}
|
||
}
|
||
|
||
async function loadModalExistingWork() {
|
||
try {
|
||
const response = await window.apiCall(`/daily-work-reports?date=${currentModalWorker.date}&worker_id=${currentModalWorker.id}`);
|
||
modalExistingWork = Array.isArray(response) ? response : (response.data || []);
|
||
} catch (error) {
|
||
console.error('기존 작업 로드 오류:', error);
|
||
modalExistingWork = [];
|
||
}
|
||
}
|
||
|
||
async function loadModalDropdownData() {
|
||
try {
|
||
const [projectsRes, workTypesRes, workStatusRes, errorTypesRes] = await Promise.all([
|
||
window.apiCall('/projects/active/list'),
|
||
window.apiCall('/daily-work-reports/work-types'),
|
||
window.apiCall('/daily-work-reports/work-status-types'),
|
||
window.apiCall('/daily-work-reports/error-types')
|
||
]);
|
||
|
||
modalProjects = Array.isArray(projectsRes) ? projectsRes : (projectsRes.data || []);
|
||
modalWorkTypes = Array.isArray(workTypesRes) ? workTypesRes : (workTypesRes.data || []);
|
||
modalWorkStatusTypes = Array.isArray(workStatusRes) ? workStatusRes : (workStatusRes.data || []);
|
||
modalErrorTypes = Array.isArray(errorTypesRes) ? errorTypesRes : (errorTypesRes.data || []);
|
||
} catch (error) {
|
||
console.error('드롭다운 데이터 로드 오류:', error);
|
||
}
|
||
}
|
||
|
||
function updateModalSummary() {
|
||
const totalHours = modalExistingWork.reduce((sum, work) => sum + parseFloat(work.work_hours || 0), 0);
|
||
const workCount = modalExistingWork.length;
|
||
|
||
document.getElementById('modalTotalHours').textContent = `${totalHours.toFixed(1)}h`;
|
||
document.getElementById('modalWorkCount').textContent = `${workCount}건`;
|
||
|
||
// 12시간 초과 경고
|
||
if (totalHours > 12) {
|
||
document.getElementById('modalTotalHours').classList.add('warning');
|
||
} else {
|
||
document.getElementById('modalTotalHours').classList.remove('warning');
|
||
}
|
||
}
|
||
|
||
function renderModalExistingWork() {
|
||
const container = document.getElementById('modalExistingWork');
|
||
|
||
if (modalExistingWork.length === 0) {
|
||
container.innerHTML = `
|
||
<div class="modal-empty-state">
|
||
<div class="modal-empty-icon">—</div>
|
||
<p>등록된 작업이 없습니다.</p>
|
||
</div>
|
||
`;
|
||
return;
|
||
}
|
||
|
||
container.innerHTML = modalExistingWork.map(work => `
|
||
<div class="modal-work-item">
|
||
<div class="modal-work-info">
|
||
<h5>${work.project_name || '미지정 프로젝트'}</h5>
|
||
<p>${work.work_type_name || '미지정 작업'}</p>
|
||
${work.work_status_id === 2 && work.error_type_name ? `
|
||
<span class="modal-error-badge">${work.error_type_name}</span>
|
||
` : ''}
|
||
</div>
|
||
<div class="modal-work-actions">
|
||
<span class="modal-work-hours">${work.work_hours}h</span>
|
||
<button class="btn btn-xs btn-danger" onclick="deleteModalWork(${work.id})">삭제</button>
|
||
</div>
|
||
</div>
|
||
`).join('');
|
||
}
|
||
|
||
function populateModalDropdowns() {
|
||
// 프로젝트 드롭다운
|
||
const projectSelect = document.getElementById('modalProjectSelect');
|
||
projectSelect.innerHTML = '<option value="">프로젝트 선택</option>';
|
||
modalProjects.forEach(project => {
|
||
projectSelect.innerHTML += `<option value="${project.project_id}">${project.project_name}</option>`;
|
||
});
|
||
|
||
// 작업 유형 드롭다운
|
||
const workTypeSelect = document.getElementById('modalWorkTypeSelect');
|
||
workTypeSelect.innerHTML = '<option value="">작업 유형 선택</option>';
|
||
modalWorkTypes.forEach(type => {
|
||
workTypeSelect.innerHTML += `<option value="${type.id}">${type.name}</option>`;
|
||
});
|
||
|
||
// 작업 상태 드롭다운
|
||
const workStatusSelect = document.getElementById('modalWorkStatusSelect');
|
||
workStatusSelect.innerHTML = '<option value="">업무 상태 선택</option>';
|
||
modalWorkStatusTypes.forEach(status => {
|
||
workStatusSelect.innerHTML += `<option value="${status.id}">${status.name}</option>`;
|
||
});
|
||
|
||
// 에러 유형 드롭다운
|
||
const errorTypeSelect = document.getElementById('modalErrorTypeSelect');
|
||
errorTypeSelect.innerHTML = '<option value="">에러 유형 선택</option>';
|
||
modalErrorTypes.forEach(error => {
|
||
errorTypeSelect.innerHTML += `<option value="${error.id}">${error.name}</option>`;
|
||
});
|
||
}
|
||
|
||
function showModalNewWorkForm() {
|
||
document.getElementById('modalNewWorkSection').style.display = 'block';
|
||
document.getElementById('modalAddWorkBtn').style.display = 'none';
|
||
}
|
||
|
||
function hideModalNewWorkForm() {
|
||
document.getElementById('modalNewWorkSection').style.display = 'none';
|
||
document.getElementById('modalAddWorkBtn').style.display = 'block';
|
||
resetModalForm();
|
||
}
|
||
|
||
function resetModalForm() {
|
||
document.getElementById('modalProjectSelect').value = '';
|
||
document.getElementById('modalWorkTypeSelect').value = '';
|
||
document.getElementById('modalWorkStatusSelect').value = '';
|
||
document.getElementById('modalErrorTypeSelect').value = '';
|
||
document.getElementById('modalWorkHours').value = '1.00';
|
||
document.getElementById('modalErrorTypeGroup').style.display = 'none';
|
||
}
|
||
|
||
function toggleModalErrorType() {
|
||
const workStatusSelect = document.getElementById('modalWorkStatusSelect');
|
||
const errorTypeGroup = document.getElementById('modalErrorTypeGroup');
|
||
|
||
if (workStatusSelect.value === '2') { // 에러 상태
|
||
errorTypeGroup.style.display = 'block';
|
||
} else {
|
||
errorTypeGroup.style.display = 'none';
|
||
document.getElementById('modalErrorTypeSelect').value = '';
|
||
}
|
||
}
|
||
|
||
async function saveModalNewWork() {
|
||
try {
|
||
const projectId = document.getElementById('modalProjectSelect').value;
|
||
const workTypeId = document.getElementById('modalWorkTypeSelect').value;
|
||
const workStatusId = document.getElementById('modalWorkStatusSelect').value;
|
||
const errorTypeId = document.getElementById('modalErrorTypeSelect').value;
|
||
const workHours = document.getElementById('modalWorkHours').value;
|
||
|
||
// 유효성 검사
|
||
if (!projectId || !workTypeId || !workStatusId || !workHours) {
|
||
showToast('모든 필수 필드를 입력해주세요.', 'error');
|
||
return;
|
||
}
|
||
|
||
if (workStatusId === '2' && !errorTypeId) {
|
||
showToast('에러 상태일 때는 에러 유형을 선택해야 합니다.', 'error');
|
||
return;
|
||
}
|
||
|
||
const workData = {
|
||
report_date: currentModalWorker.date,
|
||
worker_id: currentModalWorker.id,
|
||
work_entries: [{
|
||
project_id: parseInt(projectId),
|
||
task_id: parseInt(workTypeId), // work_type_id를 task_id로 매핑
|
||
work_hours: parseFloat(workHours),
|
||
work_status_id: parseInt(workStatusId),
|
||
error_type_id: workStatusId === '2' ? parseInt(errorTypeId) : null,
|
||
description: '' // 기본 설명
|
||
}]
|
||
};
|
||
|
||
console.log('📤 전송할 작업 데이터:', workData);
|
||
console.log('📋 현재 사용자:', currentUser);
|
||
|
||
await window.apiCall('/daily-work-reports', 'POST', workData);
|
||
|
||
showToast('작업이 성공적으로 저장되었습니다.', 'success');
|
||
|
||
// 데이터 새로고침
|
||
await loadModalExistingWork();
|
||
updateModalSummary();
|
||
renderModalExistingWork();
|
||
hideModalNewWorkForm();
|
||
|
||
// 대시보드 데이터도 새로고침
|
||
await loadDashboardData();
|
||
|
||
} catch (error) {
|
||
console.error('작업 저장 오류:', error);
|
||
showToast(`작업 저장 중 오류가 발생했습니다: ${error.message}`, 'error');
|
||
}
|
||
}
|
||
|
||
async function deleteModalWork(workId) {
|
||
if (!confirm('이 작업을 삭제하시겠습니까?')) {
|
||
return;
|
||
}
|
||
|
||
try {
|
||
await window.apiCall(`/daily-work-reports/${workId}`, 'DELETE');
|
||
|
||
showToast('작업이 성공적으로 삭제되었습니다.', 'success');
|
||
|
||
// 데이터 새로고침
|
||
await loadModalExistingWork();
|
||
updateModalSummary();
|
||
renderModalExistingWork();
|
||
|
||
// 대시보드 데이터도 새로고침
|
||
await loadDashboardData();
|
||
|
||
} catch (error) {
|
||
console.error('작업 삭제 오류:', error);
|
||
showToast(`작업 삭제 중 오류가 발생했습니다: ${error.message}`, 'error');
|
||
}
|
||
}
|
||
|
||
async function handleModalVacation(vacationType) {
|
||
const vacationTypeMap = {
|
||
'full': { code: 'ANNUAL_FULL', name: '연차', hours: 8 },
|
||
'half': { code: 'ANNUAL_HALF', name: '반차', hours: 4 },
|
||
'half-half': { code: 'ANNUAL_QUARTER', name: '반반차', hours: 2 }
|
||
};
|
||
|
||
const vacation = vacationTypeMap[vacationType];
|
||
if (!vacation) return;
|
||
|
||
if (!confirm(`${vacation.name} 처리하시겠습니까?\n(${vacation.hours}시간으로 자동 입력됩니다)`)) {
|
||
return;
|
||
}
|
||
|
||
try {
|
||
// 새로운 근태 관리 API 사용
|
||
const vacationData = {
|
||
worker_id: currentModalWorker.id,
|
||
date: currentModalWorker.date,
|
||
vacation_type: vacation.code
|
||
};
|
||
|
||
const response = await window.apiCall('/attendance/vacation', 'POST', vacationData);
|
||
|
||
if (response.success) {
|
||
showToast(`${vacation.name} 처리가 완료되었습니다.`, 'success');
|
||
|
||
// 데이터 새로고침
|
||
await loadModalExistingWork();
|
||
updateModalSummary();
|
||
renderModalExistingWork();
|
||
|
||
// 대시보드 데이터도 새로고침
|
||
await loadDashboardData();
|
||
} else {
|
||
throw new Error(response.message || '휴가 처리에 실패했습니다.');
|
||
}
|
||
|
||
} catch (error) {
|
||
console.error('휴가 처리 오류:', error);
|
||
showToast(`휴가 처리 중 오류가 발생했습니다: ${error.message}`, 'error');
|
||
}
|
||
}
|
||
|
||
// ========== 전역 함수 (HTML에서 호출) ========== //
|
||
window.loadDashboardData = loadDashboardData;
|
||
window.showToast = showToast;
|
||
window.updateSummaryCards = updateSummaryCards;
|
||
window.displayWorkers = displayWorkers;
|
||
window.openWorkerModal = openWorkerModal;
|
||
window.hideWorkerModal = hideWorkerModal;
|
||
window.deleteModalWork = deleteModalWork;
|
||
window.handleVacation = handleVacation;
|
||
window.confirmOvertime = confirmOvertime;
|