98 lines
2.9 KiB
TypeScript
98 lines
2.9 KiB
TypeScript
import { state } from '../core/state';
|
|
|
|
const MENU_CONFIG: any = {
|
|
hw: {
|
|
label: '하드웨어',
|
|
tabs: ['서버', 'PC', '스토리지', '공간정보장비', 'PC부품', '네트워크', '업무지원장비']
|
|
},
|
|
sw: {
|
|
label: '소프트웨어',
|
|
tabs: ['외부', '내부']
|
|
},
|
|
ops: {
|
|
label: '운영지원',
|
|
tabs: ['클라우드', '도메인', '비용관리']
|
|
},
|
|
vip: {
|
|
label: '내빈/외빈',
|
|
tabs: ['선물']
|
|
},
|
|
fac: {
|
|
label: '시설자산',
|
|
tabs: ['사무가구']
|
|
}
|
|
};
|
|
|
|
export function renderNavigation(onTabChange: (tab: string) => void) {
|
|
const navContainer = document.getElementById('main-nav')!;
|
|
|
|
const render = () => {
|
|
navContainer.innerHTML = '';
|
|
|
|
// 기존 메뉴 렌더링
|
|
(Object.keys(MENU_CONFIG) as Array<keyof typeof MENU_CONFIG>).forEach(catKey => {
|
|
const config = MENU_CONFIG[catKey];
|
|
const isActive = state.activeCategory === catKey;
|
|
|
|
const group = document.createElement('div');
|
|
group.className = `nav-group ${isActive ? 'active is-showing-shelf' : ''}`;
|
|
|
|
const trigger = document.createElement('div');
|
|
trigger.className = 'gnb-trigger';
|
|
trigger.textContent = config.label;
|
|
|
|
trigger.addEventListener('click', () => {
|
|
if (state.activeCategory !== catKey) {
|
|
state.activeCategory = catKey as any;
|
|
const firstTab = config.tabs[0];
|
|
state.activeSubTab = firstTab;
|
|
render();
|
|
onTabChange(firstTab);
|
|
}
|
|
});
|
|
group.appendChild(trigger);
|
|
|
|
const shelf = document.createElement('div');
|
|
shelf.className = 'lnb-shelf';
|
|
|
|
config.tabs.forEach((tab: string) => {
|
|
const item = document.createElement('div');
|
|
item.className = `lnb-item ${isActive && state.activeSubTab === tab ? 'active' : ''}`;
|
|
item.textContent = tab;
|
|
|
|
item.addEventListener('click', (e) => {
|
|
e.stopPropagation();
|
|
state.activeCategory = catKey as any;
|
|
state.activeSubTab = tab;
|
|
render();
|
|
onTabChange(tab);
|
|
});
|
|
shelf.appendChild(item);
|
|
});
|
|
group.appendChild(shelf);
|
|
navContainer.appendChild(group);
|
|
});
|
|
|
|
// ─── '관리자' 메뉴 별도 추가 (GNB 스타일) ───
|
|
const adminGroup = document.createElement('div');
|
|
adminGroup.className = 'nav-group';
|
|
|
|
const adminTrigger = document.createElement('div');
|
|
adminTrigger.className = 'gnb-trigger';
|
|
adminTrigger.innerHTML = '관리자';
|
|
adminTrigger.style.color = 'var(--text-muted)';
|
|
adminTrigger.style.borderLeft = '1px solid var(--border-color)';
|
|
adminTrigger.style.marginLeft = '1rem';
|
|
adminTrigger.style.paddingLeft = '1.5rem';
|
|
|
|
adminTrigger.addEventListener('click', () => {
|
|
window.open('/map_editor.html', '_blank');
|
|
});
|
|
|
|
adminGroup.appendChild(adminTrigger);
|
|
navContainer.appendChild(adminGroup);
|
|
};
|
|
|
|
render();
|
|
}
|