merge: ux_setting 브랜치를 main에 병합 (HWModal UI 고도화 및 PC 탭 제한 사항 반영)

src/main.ts

@@ -2,6 +2,7 @@ import { state, loadMasterDataFromDB, saveAsset } from './core/state';
 import { renderNavigation } from './components/Navigation';
 import { renderDashboard } from './views/DashboardView';
 import { renderSWTable } from './views/SW_Table';
+import { renderLocationView } from './views/LocationView';
 import { initBaseModal } from './components/Modal/BaseModal';
 import { initHwModal, openHwModal } from './components/Modal/HWModal';
 import { initSwModal, openSwModal } from './components/Modal/SWModal';
@@ -15,11 +16,38 @@ import { createIcons, Plus, X, LayoutDashboard, Monitor, Server, Database, Lapto
 function refreshView() {
   const mainContent = document.getElementById('main-content')!;
   if (!mainContent) return;
+
+  // 서버 탭이 아닐 경우 '자산현황(위치)' 뷰 진입 방지 및 강제 리스트 모드 전환
+  if (state.activeSubTab !== '서버' && state.viewMode === 'location') {
+    state.viewMode = 'list';
+  }
+
+  const isServerTab = state.activeSubTab === '서버';
   
-  if (state.activeSubTab === '대시보드') {
-    renderDashboard(mainContent);
+  mainContent.innerHTML = `
+    <div class="view-header">
+      <div class="view-toggle-container" style="${isServerTab ? '' : 'display:none;'}">
+        <button class="mode-toggle-btn ${state.viewMode === 'location' ? 'active' : ''}" data-mode="location">자산현황(위치)</button>
+        <button class="mode-toggle-btn ${state.viewMode === 'list' ? 'active' : ''}" data-mode="list">자산목록</button>
+      </div>
+    </div>
+    <div id="view-body" style="flex: 1; overflow: hidden; display: flex; flex-direction: column;"></div>
+  `;
+
+  // 이벤트 바인딩
+  mainContent.querySelectorAll('.mode-toggle-btn').forEach(btn => {      
+    btn.addEventListener('click', () => {
+      const mode = (btn as HTMLElement).getAttribute('data-mode') as any;
+      state.viewMode = mode;
+      refreshView();
+    });
+  });
+
+  const viewBody = document.getElementById('view-body')!;
+  if (state.viewMode === 'location') {
+    renderLocationView(viewBody);
   } else {
-    renderSWTable(mainContent);
+    renderSWTable(viewBody);    // 리스트 형식
   }
 }
 
@@ -38,11 +66,7 @@ function initApp() {
 
   try {
     renderNavigation((tab) => {
-      if (tab === '대시보드') {
-        renderDashboard(mainContent);
-      } else {
-        renderSWTable(mainContent);
-      }
+      refreshView();
     });
 
     initHwModal(() => refreshAllData(), closeAllModals);