52 lines
1.4 KiB
TypeScript
52 lines
1.4 KiB
TypeScript
import { useState } from 'react'
|
|
import './App.css'
|
|
import AssetManagementView from './components/AssetManagementView'
|
|
import HardwareManagementView from './components/HardwareManagementView'
|
|
|
|
function App() {
|
|
const [activeMenu, setActiveMenu] = useState('assets')
|
|
|
|
const renderContent = () => {
|
|
switch (activeMenu) {
|
|
case 'assets':
|
|
return <AssetManagementView />
|
|
case 'hardware':
|
|
return <HardwareManagementView />
|
|
default:
|
|
return <AssetManagementView />
|
|
}
|
|
}
|
|
|
|
return (
|
|
<div className="app-container">
|
|
<header className="top-bar">
|
|
<div className="top-bar-brand">
|
|
ITAM System
|
|
</div>
|
|
<nav className="top-bar-menu">
|
|
<div
|
|
className={`menu-item ${activeMenu === 'assets' ? 'active' : ''}`}
|
|
onClick={() => setActiveMenu('assets')}
|
|
>
|
|
전산자산관리대장
|
|
</div>
|
|
<div
|
|
className={`menu-item ${activeMenu === 'hardware' ? 'active' : ''}`}
|
|
onClick={() => setActiveMenu('hardware')}
|
|
>
|
|
H/W 사양 정보
|
|
</div>
|
|
<div className="menu-item">S/W 설치 현황</div>
|
|
<div className="menu-item">라이선스 관리</div>
|
|
<div className="menu-item">실물 자산 관리</div>
|
|
</nav>
|
|
</header>
|
|
<main className="main-content">
|
|
{renderContent()}
|
|
</main>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export default App
|