feat: implement unified schema mapper, enhance UI/UX with responsive design, and optimize asset log logic
This commit is contained in:
112
src/main.ts
112
src/main.ts
@@ -2,14 +2,14 @@ import { state, loadMasterDataFromDB } from './core/state';
|
||||
import { renderNavigation } from './components/Navigation';
|
||||
import { renderDashboard } from './views/DashboardView';
|
||||
import { renderSWTable } from './views/SW_Table';
|
||||
import { downloadTemplate, exportToExcel, parseExcel, HardwareAsset, SoftwareAsset, SWUser } from './core/excelHandler';
|
||||
import { downloadTemplate, exportToExcel, parseExcel } from './core/excelHandler';
|
||||
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 { initDashboardDetailModal } from './components/Modal/DashboardDetailModal';
|
||||
import { initGuide } from './components/Guide';
|
||||
import { createIcons, Download, Upload, FileSpreadsheet, Plus, X, LayoutDashboard, Monitor, Server, Database, Laptop, CalendarClock, Key, Cpu, Layers, Users, Paperclip, Edit2, History, RefreshCcw } from 'lucide';
|
||||
import { createIcons, Download, Upload, FileSpreadsheet, Plus, X, LayoutDashboard, Monitor, Server, Database, Laptop, CalendarClock, Key, Cpu, Layers, Users, Paperclip, Edit2, History, RefreshCcw, BookOpen, Settings } from 'lucide';
|
||||
|
||||
// --- DB 저장을 위한 세분화된 헬퍼 함수들 ---
|
||||
async function apiBatchSave(url: string, data: any[], label: string) {
|
||||
@@ -36,72 +36,50 @@ const savePermSwToDB = () => apiBatchSave('http://172.16.40.100:3000/api/sw/perm
|
||||
const saveCloudToDB = () => apiBatchSave('http://172.16.40.100:3000/api/cloud/batch', state.masterData.cloud, '클라우드');
|
||||
const saveSwUsersToDB = () => apiBatchSave('http://172.16.40.100:3000/api/sw-users/batch', state.masterData.swUsers, 'SW사용자');
|
||||
|
||||
// 모든 하드웨어 DB 동기화
|
||||
async function saveAllHardwareToDB() {
|
||||
await Promise.all([
|
||||
savePcToDB(),
|
||||
saveServerToDB(),
|
||||
saveStorageToDB(),
|
||||
saveEquipToDB(),
|
||||
saveMobileToDB()
|
||||
]);
|
||||
await Promise.all([savePcToDB(), saveServerToDB(), saveStorageToDB(), saveEquipToDB(), saveMobileToDB()]);
|
||||
}
|
||||
|
||||
// 모든 소프트웨어 DB 동기화
|
||||
async function saveAllSoftwareToDB() {
|
||||
await Promise.all([
|
||||
saveSubSwToDB(),
|
||||
savePermSwToDB(),
|
||||
saveCloudToDB(),
|
||||
saveSwUsersToDB()
|
||||
]);
|
||||
await Promise.all([saveSubSwToDB(), savePermSwToDB(), saveCloudToDB(), saveSwUsersToDB()]);
|
||||
}
|
||||
|
||||
// --- App Initialization ---
|
||||
function initApp() {
|
||||
console.log('🚀 ITAM Dedicated System Initializing...');
|
||||
const mainContent = document.getElementById('main-content')!;
|
||||
if (!mainContent) return;
|
||||
|
||||
const { closeAllModals } = initBaseModal();
|
||||
|
||||
|
||||
// 탭 변경 시 실행될 통합 렌더링 함수
|
||||
const handleTabChange = (tab: string) => {
|
||||
if (tab === '대시보드') {
|
||||
renderDashboard(mainContent);
|
||||
} else {
|
||||
renderSWTable(mainContent);
|
||||
}
|
||||
};
|
||||
|
||||
try {
|
||||
renderNavigation((tab) => {
|
||||
if (tab === '대시보드') {
|
||||
renderDashboard(mainContent);
|
||||
} else {
|
||||
renderSWTable(mainContent);
|
||||
// 1. 네비게이션 렌더링 및 콜백 연결
|
||||
renderNavigation(handleTabChange);
|
||||
|
||||
// 2. 각종 모달 및 가이드 초기화
|
||||
initHwModal(() => { saveAllHardwareToDB(); renderSWTable(mainContent); }, closeAllModals);
|
||||
initSwModal(() => { saveAllSoftwareToDB(); renderSWTable(mainContent); }, closeAllModals);
|
||||
initSwUserModal(() => { saveSwUsersToDB(); renderSWTable(mainContent); }, closeAllModals);
|
||||
initDashboardDetailModal();
|
||||
initGuide();
|
||||
|
||||
// 4. DB 데이터 로드 및 초기 화면 렌더링
|
||||
loadMasterDataFromDB().then((success) => {
|
||||
if (success) {
|
||||
handleTabChange(state.activeSubTab);
|
||||
}
|
||||
});
|
||||
|
||||
// 모달 초기화
|
||||
initHwModal(() => { saveAllHardwareToDB(); renderSWTable(mainContent); }, closeAllModals);
|
||||
|
||||
initSwModal(() => {
|
||||
saveAllSoftwareToDB();
|
||||
renderSWTable(mainContent);
|
||||
}, closeAllModals);
|
||||
|
||||
initSwUserModal(() => {
|
||||
saveSwUsersToDB();
|
||||
renderSWTable(mainContent);
|
||||
}, closeAllModals);
|
||||
|
||||
initDashboardDetailModal();
|
||||
initGuide(); // 가이드 초기화 추가
|
||||
} catch (e) { console.error('❌ Initialization failed:', e); }
|
||||
|
||||
// 초기 로드 시 대시보드 렌더링
|
||||
renderDashboard(mainContent);
|
||||
|
||||
// DB에서 데이터 로드 후 화면 갱신
|
||||
loadMasterDataFromDB().then((success) => {
|
||||
if (success) {
|
||||
if (state.activeSubTab === '대시보드') renderDashboard(mainContent);
|
||||
else renderSWTable(mainContent);
|
||||
}
|
||||
});
|
||||
|
||||
// 버튼 이벤트 바인딩
|
||||
document.getElementById('btn-download-template')?.addEventListener('click', () => downloadTemplate());
|
||||
document.getElementById('btn-export-excel')?.addEventListener('click', () => exportToExcel(state.masterData));
|
||||
@@ -112,46 +90,24 @@ function initApp() {
|
||||
if (file) {
|
||||
const data = await parseExcel(file);
|
||||
state.masterData = data;
|
||||
await Promise.all([
|
||||
saveAllHardwareToDB(),
|
||||
saveAllSoftwareToDB()
|
||||
]);
|
||||
renderSWTable(mainContent);
|
||||
await Promise.all([saveAllHardwareToDB(), saveAllSoftwareToDB()]);
|
||||
handleTabChange(state.activeSubTab);
|
||||
}
|
||||
});
|
||||
|
||||
document.getElementById('btn-add-asset')?.addEventListener('click', () => {
|
||||
const tab = state.activeSubTab;
|
||||
const cat = state.activeCategory;
|
||||
|
||||
if (cat === 'hw') {
|
||||
// 탭 명칭을 실제 유형명으로 매핑
|
||||
let defaultType = '';
|
||||
if (tab === '개인PC') defaultType = 'PC';
|
||||
else if (tab === '서버') defaultType = '서버';
|
||||
else if (tab === '스토리지') defaultType = '스토리지';
|
||||
else if (tab === '전산비품') defaultType = 'CPU';
|
||||
else if (tab === '모바일기기') defaultType = '모바일';
|
||||
|
||||
openHwModal({
|
||||
id: Math.random().toString(36).substring(2, 9),
|
||||
type: defaultType,
|
||||
법인: '한맥', 자산코드: '', 명칭: '', 설치위치: '', MACaddress: '', HW사양: '', OS: '', 연락처: '', 담당부서: ''
|
||||
} as any, 'add');
|
||||
let defaultType = (tab === '개인PC') ? 'PC' : (tab === '서버' ? '서버' : (tab === '스토리지' ? '스토리지' : (tab === '전산비품' ? 'CPU' : '모바일')));
|
||||
openHwModal({ id: Math.random().toString(36).substring(2, 9), type: defaultType, 법인: '한맥', 자산코드: '', 명칭: '', 설치위치: '', MACaddress: '', HW사양: '', OS: '', 연락처: '', 담당부서: '' } as any, 'add');
|
||||
} else if (cat === 'sw') {
|
||||
// 소프트웨어 대시보드 또는 개별 탭에서 추가
|
||||
let defaultType = tab;
|
||||
if (tab === '대시보드') defaultType = '구독SW'; // SW는 기본 레이아웃을 위해 하나 지정하되 필드는 빈값
|
||||
|
||||
openSwModal({
|
||||
id: Math.random().toString(36).substring(2, 9),
|
||||
type: defaultType, 제품명: '', 금액: '', 수량: 1, 계정명: '', 납품업체: '', 비고: '', 법인: '한맥'
|
||||
} as any, 'add');
|
||||
openSwModal({ id: Math.random().toString(36).substring(2, 9), type: tab === '대시보드' ? '구독SW' : tab, 제품명: '', 금액: '', 수량: 1, 계정명: '', 납품업체: '', 비고: '', 법인: '한맥' } as any, 'add');
|
||||
}
|
||||
});
|
||||
|
||||
createIcons({
|
||||
icons: { Download, Upload, FileSpreadsheet, Plus, X, LayoutDashboard, Monitor, Server, Database, Laptop, CalendarClock, Key, Cpu, Layers, Users, Paperclip, Edit2, History, RefreshCcw, BookOpen }
|
||||
icons: { Download, Upload, FileSpreadsheet, Plus, X, LayoutDashboard, Monitor, Server, Database, Laptop, CalendarClock, Key, Cpu, Layers, Users, Paperclip, Edit2, History, RefreshCcw, BookOpen, Settings }
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user