feat: добавил svg иконки

frontend/src/components/layout/AppSidebar.vue

@@ -2,6 +2,7 @@
 import { computed } from 'vue'
 import { useRouter, useRoute } from 'vue-router'
 import { useAuthStore } from '@/stores/auth'
+import AppIcon from '@/components/ui/AppIcon.vue'
 
 const auth = useAuthStore()
 const router = useRouter()
@@ -10,22 +11,22 @@ const route = useRoute()
 interface NavItem { label: string; icon: string; to: string; roles: string[] }
 
 const navItems: NavItem[] = [
-  { label: 'Главная',     icon: '🏠', to: '/',                roles: ['student'] },
-  { label: 'Каталог',     icon: '📚', to: '/catalog',         roles: ['student'] },
-  { label: 'Мои лекции',  icon: '📋', to: '/my-lectures',     roles: ['student'] },
-  { label: 'Достижения',  icon: '🏆', to: '/achievements',    roles: ['student'] },
-  { label: 'Уведомления', icon: '🔔', to: '/notifications',   roles: ['student'] },
-  { label: 'Профиль',     icon: '👤', to: '/profile',         roles: ['student'] },
+  { label: 'Главная', icon: 'home', to: '/', roles: ['student'] },
+  { label: 'Каталог', icon: 'books', to: '/catalog', roles: ['student'] },
+  { label: 'Мои лекции', icon: 'clipboard-list', to: '/my-lectures', roles: ['student'] },
+  { label: 'Достижения', icon: 'trophy', to: '/achievements', roles: ['student'] },
+  { label: 'Уведомления', icon: 'bell', to: '/notifications', roles: ['student'] },
+  { label: 'Профиль', icon: 'user', to: '/profile', roles: ['student'] },
   // Teacher
-  { label: 'Дашборд',     icon: '📊', to: '/teacher',         roles: ['teacher'] },
-  { label: 'Лекции',      icon: '📖', to: '/teacher/lectures',roles: ['teacher'] },
-  { label: 'Аналитика',   icon: '📈', to: '/teacher/analytics',roles: ['teacher'] },
-  { label: 'Профиль',     icon: '👤', to: '/profile',         roles: ['teacher'] },
+  { label: 'Дашборд', icon: 'chart-bar', to: '/teacher', roles: ['teacher'] },
+  { label: 'Лекции', icon: 'book-2', to: '/teacher/lectures', roles: ['teacher'] },
+  { label: 'Аналитика', icon: 'chart-line', to: '/teacher/analytics', roles: ['teacher'] },
+  { label: 'Профиль', icon: 'user', to: '/profile', roles: ['teacher'] },
   // Admin
-  { label: 'Дашборд',     icon: '🛡️', to: '/admin',           roles: ['admin'] },
-  { label: 'Пользователи',icon: '👥', to: '/admin/users',     roles: ['admin'] },
-  { label: 'Лекции',      icon: '📚', to: '/admin/lectures',  roles: ['admin'] },
-  { label: 'ИИ очередь',  icon: '🤖', to: '/admin/llm-queue', roles: ['admin'] },
+  { label: 'Дашборд', icon: 'shield', to: '/admin', roles: ['admin'] },
+  { label: 'Пользователи', icon: 'users', to: '/admin/users', roles: ['admin'] },
+  { label: 'Лекции', icon: 'books', to: '/admin/lectures', roles: ['admin'] },
+  { label: 'ИИ очередь', icon: 'robot', to: '/admin/llm-queue', roles: ['admin'] },
 ]
 
 const visible = computed(() =>
@@ -44,18 +45,19 @@ function isActive(to: string) {
       <RouterLink
         v-for="item in visible"
         :key="item.to + item.label"
-        :to="item.to"
-        class="nav-item"
-        :class="{ active: isActive(item.to) }"
-      >
-        <span class="nav-icon">{{ item.icon }}</span>
+      :to="item.to"
+      class="nav-item"
+      :class="{ active: isActive(item.to) }"
+    >
+        <AppIcon class="nav-icon" :icon="item.icon" :size="17" />
         <span class="nav-label">{{ item.label }}</span>
       </RouterLink>
     </nav>
 
     <div class="sidebar-footer">
       <button class="logout-btn" @click="auth.logout().then(() => router.push('/login'))">
-        🚪 Выйти
+        <AppIcon class="logout-icon" icon="logout" :size="16" />
+        Выйти
       </button>
     </div>
   </aside>
@@ -107,7 +109,7 @@ function isActive(to: string) {
   font-weight: 700;
   box-shadow: 0 2px 8px rgba(34,197,94,0.12);
 }
-.nav-icon { font-size: 17px; flex-shrink: 0; }
+.nav-icon { flex-shrink: 0; color: currentColor; }
 .sidebar-footer { padding: 10px 18px 8px; }
 .logout-btn {
   width: 100%;
@@ -124,6 +126,7 @@ function isActive(to: string) {
   align-items: center;
   gap: 6px;
 }
+.logout-icon { color: currentColor; }
 .logout-btn:hover { background: rgba(239,68,68,0.15); }
 
 @media (max-width: 768px) { .sidebar { display: none; } }