Files
ITAM/src/main.ts
Taehoon ce1ed40561 feat: 하드웨어 자산 관리 고도화 및 자동 이력 시스템 구축
- 통합 원격 접속 정보 UI 구현 (IP/MAC 및 계정 정보 통합)
- 서버 측 스냅샷 비교 기반 자동 이력(Log) 생성 로직 도입
- 타임라인 UI 개선 (이벤트별 색상 뱃지 및 변동 사항 강조)
- 자산 상세 필드 확장 (서비스 구분, 용도 등)
- 테스트 데이터 생성기 및 이력 계획서 추가
2026-06-10 09:51:03 +09:00

175 lines
6.0 KiB
TypeScript

import { state, loadMasterDataFromDB, saveAsset } from './core/state';
import { renderNavigation } from './components/Navigation';
import { renderDashboard } from './views/DashboardView';
import { renderSWTable } from './views/SW_Table';
import { initBaseModal } from './components/Modal/BaseModal';
import { initHwModal, openHwModal } from './components/Modal/HWModal';
import { initSwModal, openSwModal } from './components/Modal/SWModal';
import { initSwUserModal } from './components/Modal/SWUserModal';
import { initDomainModal, openDomainModal } from './components/Modal/DomainModal';
import { initDashboardDetailModal } from './components/Modal/DashboardDetailModal';
import { initGuide } from './components/Guide';
import { createIcons, Plus, X, LayoutDashboard, Monitor, Server, Database, Laptop, CalendarClock, Key, Cpu, Layers, Users, Paperclip, Edit2, History, RefreshCcw, BookOpen, Settings } from 'lucide';
// 화면 갱신 통합 핸들러
function refreshView() {
const mainContent = document.getElementById('main-content')!;
if (!mainContent) return;
if (state.activeSubTab === '대시보드') {
renderDashboard(mainContent);
} else {
renderSWTable(mainContent);
}
}
// 통합 갱신 (저장은 이미 개별 모달에서 처리됨)
async function refreshAllData() {
await loadMasterDataFromDB();
refreshView();
}
// --- App Initialization ---
function initApp() {
const mainContent = document.getElementById('main-content')!;
if (!mainContent) return;
const { closeAllModals } = initBaseModal();
try {
renderNavigation((tab) => {
if (tab === '대시보드') {
renderDashboard(mainContent);
} else {
renderSWTable(mainContent);
}
});
initHwModal(() => refreshAllData(), closeAllModals);
initSwModal(() => refreshAllData(), closeAllModals);
initSwUserModal(() => {
loadMasterDataFromDB().then(() => refreshView());
}, closeAllModals);
initDomainModal(() => refreshAllData(), closeAllModals);
initDashboardDetailModal();
initGuide();
loadMasterDataFromDB().then((success) => {
if (success) {
refreshView();
}
});
} catch (e) { console.error('❌ Initialization failed:', e); }
console.log('🚀 ITAM App Multi-Table Optimized');
// --- 통합 이벤트 위임 (Dynamic Elements 지원) ---
document.addEventListener('click', (e) => {
const target = e.target as HTMLElement;
// 자산 추가
if (target.closest('#btn-add-asset')) {
const tab = state.activeSubTab;
const cat = state.activeCategory;
const newId = Math.random().toString(36).substring(2, 9);
if (cat === 'users') {
// 사용자 추가는 renderUserList 내부에서 별도로 처리하거나 여기서 호출 가능
// 현재 renderUserList에서 별도로 핸들링하고 있으므로 중복 실행 방지
return;
}
if (cat === 'hw') {
openHwModal({ id: newId, asset_code: '', category: tab } as any, 'add');
} else if (cat === 'sw') {
const swType = tab === '외부SW' ? '외부SW' : (tab === '내부SW' ? '내부SW' : '외부SW');
openSwModal({ id: newId, asset_type: swType } as any, 'add');
} else if (cat === 'ops') {
if (tab === '도메인') openDomainModal(null);
}
return;
}
});
createIcons({
icons: { Plus, X, LayoutDashboard, Monitor, Server, Database, Laptop, CalendarClock, Key, Cpu, Layers, Users, Paperclip, Edit2, History, RefreshCcw, BookOpen, Settings }
});
window.addEventListener('refresh-view', () => refreshView());
}
/**
* 헤더 역할 전환 토글 로직
*/
function initRoleSwitcher() {
const checkbox = document.getElementById('role-toggle-checkbox') as HTMLInputElement;
const userLabel = document.querySelector('.role-label.user');
const adminLabel = document.querySelector('.role-label.admin');
if (!checkbox || !userLabel || !adminLabel) return;
checkbox.addEventListener('change', () => {
if (checkbox.checked) {
alert('관리자 모드는 현재 준비 중입니다. 나중에 관리자 전용 페이지와 연결될 예정입니다.');
checkbox.checked = false; // UI 강제 되돌리기
return;
}
// 실무자 모드 전환 (현재는 Admin 진입이 차단되므로 사실상 fallback 로직)
state.currentUserRole = 'user';
adminLabel.classList.remove('active');
userLabel.classList.add('active');
document.body.classList.remove('admin-mode');
});
}
/**
* 로그인 처리 로직
*/
function handleLogin() {
const loginContainer = document.getElementById('login-container');
const appLayout = document.getElementById('app-layout');
const roleCards = document.querySelectorAll('.role-card');
if (!loginContainer || !appLayout || roleCards.length === 0) return;
roleCards.forEach(card => {
card.addEventListener('click', () => {
const role = card.getAttribute('data-role');
if (role === 'admin') {
alert('관리자 모드는 현재 준비 중입니다. 실무자 모드를 이용해 주세요.');
return;
}
if (role === 'user') {
console.log('🔓 Entering as Practitioner');
// 초기 토글 상태 설정 (실무자 고정)
const checkbox = document.getElementById('role-toggle-checkbox') as HTMLInputElement;
if (checkbox) checkbox.checked = false;
state.currentUserRole = 'user';
// UI 전환
loginContainer.style.display = 'none';
appLayout.style.display = 'flex';
// 역할 스위처 및 앱 초기화 시작
initRoleSwitcher();
initApp();
// 로고 클릭 시 초기화면 복귀 로직 (한 번만 등록)
const brand = document.querySelector('.brand') as HTMLElement;
if (brand) {
brand.style.cursor = 'pointer';
brand.onclick = () => {
location.reload(); // 즉시 초기화면으로 복귀
};
}
}
});
});
}
document.addEventListener('DOMContentLoaded', handleLogin);