Files
system-monitor/frontend/components/SidebarNav.vue
2025-12-28 16:27:46 +09:00

73 lines
2.7 KiB
Vue
Raw Blame History

This file contains invisible Unicode characters
This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<template>
<aside class="sidebar">
<div class="sidebar-header">
<div class="sidebar-logo">
<span class="logo-icon">📡</span>
<span>OSOLIT Monitor</span>
</div>
</div>
<nav class="sidebar-nav">
<NuxtLink to="/" class="nav-item" :class="{ active: route.path === '/' }">
<span class="icon">📊</span>
<span>대시보드</span>
</NuxtLink>
<div class="nav-group-title">네트워크</div>
<NuxtLink to="/network/pubnet" class="nav-item nav-sub-item" :class="{ active: route.path === '/network/pubnet' }">
<span class="icon">🌐</span>
<span>Public Network</span>
</NuxtLink>
<NuxtLink to="/network/privnet" class="nav-item nav-sub-item" :class="{ active: route.path === '/network/privnet' }">
<span class="icon">🔒</span>
<span>Private Network</span>
</NuxtLink>
<div class="nav-group-title">서버</div>
<NuxtLink to="/server/list" class="nav-item nav-sub-item" :class="{ active: route.path === '/server/list' }">
<span class="icon">🖥</span>
<span>Server Targets</span>
</NuxtLink>
<NuxtLink to="/server/history" class="nav-item nav-sub-item" :class="{ active: route.path === '/server/history' }">
<span class="icon">📈</span>
<span>Server Status</span>
</NuxtLink>
<NuxtLink to="/settings/thresholds" class="nav-item nav-sub-item" :class="{ active: route.path === '/settings/thresholds' }">
<span class="icon"></span>
<span>Thresholds</span>
</NuxtLink>
<div class="nav-group-title">이상감지</div>
<NuxtLink to="/anomaly/short-term" class="nav-item nav-sub-item" :class="{ active: route.path === '/anomaly/short-term' }">
<span class="icon"></span>
<span>단기 변화율</span>
</NuxtLink>
<NuxtLink to="/anomaly/zscore" class="nav-item nav-sub-item" :class="{ active: route.path === '/anomaly/zscore' }">
<span class="icon">📊</span>
<span>Z-Score 분석</span>
</NuxtLink>
<NuxtLink to="/anomaly/baseline" class="nav-item nav-sub-item" :class="{ active: route.path === '/anomaly/baseline' }">
<span class="icon">🕐</span>
<span>시간대별 베이스라인</span>
</NuxtLink>
<NuxtLink to="/anomaly/trend" class="nav-item nav-sub-item" :class="{ active: route.path === '/anomaly/trend' }">
<span class="icon">📉</span>
<span>추세 분석</span>
</NuxtLink>
</nav>
</aside>
</template>
<script setup lang="ts">
const route = useRoute()
</script>