Taehoon
a805d9ce06
주요 정리 내용: - 핵심 엔진 분리: state, excelHandler 등을 src/core/ 디렉토리로 격리 - 모달 컴포넌트화: index.html의 거대 HTML 구조를 각 모달 TS 파일로 내장 및 동적 주입 - index.html 최적화: 수백 줄의 중복 코드를 제거하여 슬림한 Shell 구조로 변환 - 전역 복구: 병합 과정에서 발생한 한글 인코딩 깨짐 전수 복구 및 빌드 오류 해결 - 경로 정합성: 파일 구조 변경에 따른 모든 import 경로 일괄 업데이트
76 lines
3.5 KiB
HTML
76 lines
3.5 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="ko">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
<title>ITAM 자산관리 ERP</title>
|
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/variable/pretendardvariable.min.css" />
|
|
<link rel="stylesheet" href="/src/styles/common.css" />
|
|
<link rel="stylesheet" href="/src/styles/modal.css" />
|
|
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
|
|
<script src="https://cdn.jsdelivr.net/npm/chartjs-plugin-datalabels@2.0.0"></script>
|
|
</head>
|
|
<body>
|
|
<div class="app-layout">
|
|
<!-- Sidebar Navigation -->
|
|
<aside class="sidebar">
|
|
<div class="sidebar-header">
|
|
<h1>HM <span>ITAM</span></h1>
|
|
</div>
|
|
|
|
<div class="nav-section">
|
|
<h3><i data-lucide="cpu"></i> 하드웨어</h3>
|
|
<ul id="nav-hw" class="nav-list">
|
|
<li class="active" data-category="hw" data-tab="대시보드"><i data-lucide="layout-dashboard"></i> 대시보드</li>
|
|
<li data-category="hw" data-tab="개인PC"><i data-lucide="monitor"></i> 개인PC</li>
|
|
<li data-category="hw" data-tab="서버"><i data-lucide="server"></i> 서버</li>
|
|
<li data-category="hw" data-tab="스토리지"><i data-lucide="database"></i> 스토리지</li>
|
|
<li data-category="hw" data-tab="전산비품"><i data-lucide="laptop"></i> 전산비품</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div class="nav-section">
|
|
<h3><i data-lucide="layers"></i> 소프트웨어</h3>
|
|
<ul id="nav-sw" class="nav-list">
|
|
<li data-category="sw" data-tab="대시보드"><i data-lucide="layout-dashboard"></i> 대시보드</li>
|
|
<li data-category="sw" data-tab="구독SW"><i data-lucide="calendar-clock"></i> 구독 소프트웨어</li>
|
|
<li data-category="sw" data-tab="영구SW"><i data-lucide="key"></i> 영구 소프트웨어</li>
|
|
</ul>
|
|
</div>
|
|
</aside>
|
|
|
|
<!-- Main Content Area -->
|
|
<div class="main-wrapper">
|
|
<header class="top-header">
|
|
<div class="header-title">
|
|
<h2 id="current-tab-title">하드웨어 / 대시보드</h2>
|
|
</div>
|
|
<div class="header-actions">
|
|
<button id="btn-download-template" class="btn btn-outline" title="통합 양식 다운로드">
|
|
<i data-lucide="download"></i> 통합 양식 다운로드
|
|
</button>
|
|
<label for="excel-upload" class="btn btn-outline" title="엑셀 파일 업로드">
|
|
<i data-lucide="upload"></i> 엑셀 업로드
|
|
</label>
|
|
<input type="file" id="excel-upload" accept=".xlsx, .xls" style="display: none;" />
|
|
<button id="btn-export-excel" class="btn btn-primary" title="일괄 엑셀 저장">
|
|
<i data-lucide="file-spreadsheet"></i> 일괄 엑셀 저장
|
|
</button>
|
|
<button id="btn-add-asset" class="btn btn-primary hidden">
|
|
<i data-lucide="plus"></i> 자산 추가
|
|
</button>
|
|
</div>
|
|
</header>
|
|
|
|
<main class="content-area" id="main-content">
|
|
<!-- 컴포넌트에 의해 동적으로 채워짐 -->
|
|
</main>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 모든 모달은 각 TS 컴포넌트 내부에서 동적으로 주입됨 -->
|
|
<script type="module" src="/src/main.ts"></script>
|
|
</body>
|
|
</html>
|