// 프로젝트 관리 페이지 JavaScript
// 전역 변수
let allProjects = [];
let filteredProjects = [];
let currentEditingProject = null;
let currentStatusFilter = 'all'; // 'all', 'active', 'inactive'
// 페이지 초기화
document.addEventListener('DOMContentLoaded', function() {
console.log('📁 프로젝트 관리 페이지 초기화 시작');
initializePage();
loadProjects();
});
// 페이지 초기화
function initializePage() {
// 시간 업데이트 시작
updateCurrentTime();
setInterval(updateCurrentTime, 1000);
// 사용자 정보 업데이트
updateUserInfo();
// 프로필 메뉴 토글
setupProfileMenu();
// 로그아웃 버튼
setupLogoutButton();
// 검색 입력 이벤트
setupSearchInput();
}
// 현재 시간 업데이트 (시 분 초 형식으로 고정)
function updateCurrentTime() {
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');
const timeString = `${hours}시 ${minutes}분 ${seconds}초`;
const timeElement = document.getElementById('timeValue');
if (timeElement) {
timeElement.textContent = timeString;
}
}
// navbar/sidebar는 app-init.js에서 공통 처리
function updateUserInfo() {
// app-init.js가 navbar 사용자 정보를 처리
}
// 프로필 메뉴 설정
function setupProfileMenu() {
const userProfile = document.getElementById('userProfile');
const profileMenu = document.getElementById('profileMenu');
if (userProfile && profileMenu) {
userProfile.addEventListener('click', function(e) {
e.stopPropagation();
const isVisible = profileMenu.style.display === 'block';
profileMenu.style.display = isVisible ? 'none' : 'block';
});
// 외부 클릭 시 메뉴 닫기
document.addEventListener('click', function() {
profileMenu.style.display = 'none';
});
}
}
// 로그아웃 버튼 설정
function setupLogoutButton() {
const logoutBtn = document.getElementById('logoutBtn');
if (logoutBtn) {
logoutBtn.addEventListener('click', function() {
if (confirm('로그아웃 하시겠습니까?')) {
localStorage.removeItem('token');
localStorage.removeItem('user');
localStorage.removeItem('userInfo');
window.location.href = '/index.html';
}
});
}
}
// 검색 입력 설정
function setupSearchInput() {
const searchInput = document.getElementById('searchInput');
if (searchInput) {
searchInput.addEventListener('input', function() {
searchProjects();
});
searchInput.addEventListener('keypress', function(e) {
if (e.key === 'Enter') {
searchProjects();
}
});
}
}
// 프로젝트 목록 로드
async function loadProjects() {
try {
console.log('📊 프로젝트 목록 로딩 시작');
const response = await apiCall('/projects', 'GET');
console.log('📊 API 응답 구조:', response);
// API 응답이 { success: true, data: [...] } 형태인 경우 처리
let projectData = [];
if (response && response.success && Array.isArray(response.data)) {
projectData = response.data;
} else if (Array.isArray(response)) {
projectData = response;
} else {
console.warn('프로젝트 데이터가 배열이 아닙니다:', response);
projectData = [];
}
allProjects = projectData;
console.log(`✅ 프로젝트 ${allProjects.length}개 로드 완료`);
// 초기 필터 적용
applyAllFilters();
updateStatCardActiveState();
} catch (error) {
console.error('프로젝트 로딩 오류:', error);
showToast('프로젝트 목록을 불러오는데 실패했습니다.', 'error');
allProjects = [];
filteredProjects = [];
renderProjects();
}
}
// 프로젝트 목록 렌더링
function renderProjects() {
const projectsGrid = document.getElementById('projectsGrid');
const emptyState = document.getElementById('emptyState');
if (!projectsGrid || !emptyState) return;
if (filteredProjects.length === 0) {
projectsGrid.style.display = 'none';
emptyState.style.display = 'block';
return;
}
projectsGrid.style.display = 'grid';
emptyState.style.display = 'none';
const projectsHtml = filteredProjects.map(project => {
// 프로젝트 상태 아이콘 및 텍스트
const statusMap = {
'planning': { icon: '📋', text: '계획', color: '#6b7280' },
'active': { icon: '🚀', text: '진행중', color: '#10b981' },
'completed': { icon: '✅', text: '완료', color: '#3b82f6' },
'cancelled': { icon: '❌', text: '취소', color: '#ef4444' }
};
const validStatuses = ['planning', 'active', 'completed', 'cancelled'];
const safeProjectStatus = validStatuses.includes(project.project_status) ? project.project_status : 'active';
const status = statusMap[safeProjectStatus];
// is_active 값 처리 (DB에서 0/1로 오는 경우 대비)
const isInactive = project.is_active === 0 || project.is_active === false || project.is_active === 'false';
// XSS 방지를 위한 안전한 값
const safeProjectId = parseInt(project.project_id) || 0;
const safeJobNo = escapeHtml(project.job_no || 'Job No. 없음');
const safeProjectName = escapeHtml(project.project_name || '-');
const safePm = escapeHtml(project.pm || '-');
const safeSite = escapeHtml(project.site || '-');
console.log('🎨 카드 렌더링:', {
project_id: project.project_id,
project_name: project.project_name,
is_active_raw: project.is_active,
isInactive: isInactive
});
return `
${isInactive ? '
🚫 비활성화됨
' : ''}