Добавлены модели и функциональность для управления администраторами, включая авторизацию через JWT, запросы и мутации для получения информации об администраторах и управления пользователями. Обновлены стили и логика работы с токенами в Apollo Client. Улучшен интерфейс взаимодействия с пользователем.

2025-07-19 14:53:45 +03:00
parent f24c015021
commit 6287449521
26 changed files with 3931 additions and 19 deletions
--- a/src/components/admin/admin-sidebar.tsx
+++ b/src/components/admin/admin-sidebar.tsx
@ -0,0 +1,118 @@
+"use client"
+
+import { useAdminAuth } from '@/hooks/useAdminAuth'
+import { Button } from '@/components/ui/button'
+import { Card } from '@/components/ui/card'
+import { Avatar, AvatarFallback } from '@/components/ui/avatar'
+import { 
+  Settings, 
+  LogOut,
+  Users,
+  Shield,
+  Palette
+} from 'lucide-react'
+
+interface AdminSidebarProps {
+  activeSection: string
+  onSectionChange: (section: 'users' | 'ui-kit' | 'settings') => void
+}
+
+export function AdminSidebar({ activeSection, onSectionChange }: AdminSidebarProps) {
+  const { admin, logout } = useAdminAuth()
+
+  const getInitials = () => {
+    if (admin?.username) {
+      return admin.username.charAt(0).toUpperCase()
+    }
+    return 'A'
+  }
+
+  const handleLogout = () => {
+    logout()
+  }
+
+  return (
+    <div className="fixed left-0 top-0 h-full w-56 glass-sidebar border-r border-white/10 p-4 flex flex-col z-50">
+      {/* Профиль администратора */}
+      <Card className="glass-card border-white/10 p-4 mb-6">
+        <div className="flex items-center space-x-3">
+          <Avatar className="h-10 w-10 bg-white/20">
+            <AvatarFallback className="bg-white/20 text-white text-sm font-semibold">
+              {getInitials()}
+            </AvatarFallback>
+          </Avatar>
+          <div className="flex-1 min-w-0">
+            <p className="text-white text-sm font-medium truncate">
+              {admin?.username || 'Администратор'}
+            </p>
+            <p className="text-white/60 text-xs">
+              Админ-панель
+            </p>
+          </div>
+        </div>
+      </Card>
+
+      {/* Навигация */}
+      <nav className="flex-1 space-y-2">
+        <Button
+          variant={activeSection === 'users' ? "secondary" : "ghost"}
+          className={`w-full justify-start text-left transition-all duration-200 h-10 ${
+            activeSection === 'users'
+              ? 'bg-white/20 text-white hover:bg-white/30' 
+              : 'text-white/80 hover:bg-white/10 hover:text-white'
+          } cursor-pointer`}
+          onClick={() => onSectionChange('users')}
+        >
+          <Users className="h-4 w-4 mr-3" />
+          Пользователи
+        </Button>
+
+        <Button
+          variant={activeSection === 'ui-kit' ? "secondary" : "ghost"}
+          className={`w-full justify-start text-left transition-all duration-200 h-10 ${
+            activeSection === 'ui-kit'
+              ? 'bg-white/20 text-white hover:bg-white/30' 
+              : 'text-white/80 hover:bg-white/10 hover:text-white'
+          } cursor-pointer`}
+          onClick={() => onSectionChange('ui-kit')}
+        >
+          <Palette className="h-4 w-4 mr-3" />
+          UI Kit
+        </Button>
+
+        <Button
+          variant={activeSection === 'settings' ? "secondary" : "ghost"}
+          className={`w-full justify-start text-left transition-all duration-200 h-10 ${
+            activeSection === 'settings'
+              ? 'bg-white/20 text-white hover:bg-white/30' 
+              : 'text-white/80 hover:bg-white/10 hover:text-white'
+          } cursor-pointer`}
+          onClick={() => onSectionChange('settings')}
+        >
+          <Settings className="h-4 w-4 mr-3" />
+          Настройки
+        </Button>
+      </nav>
+
+      {/* Управление */}
+      <div className="space-y-2 border-t border-white/10 pt-4">
+        <Button
+          variant="ghost"
+          className="w-full justify-start text-left text-white/80 hover:bg-white/10 hover:text-white transition-all duration-200 h-10"
+          onClick={handleLogout}
+        >
+          <LogOut className="h-4 w-4 mr-3" />
+          Выйти
+        </Button>
+      </div>
+
+      {/* Логотип внизу */}
+      <div className="flex items-center justify-center mt-4 pt-4 border-t border-white/10">
+        <div className="flex items-center space-x-2">
+          <Shield className="h-5 w-5 text-white/60" />
+          <span className="text-white/60 text-sm font-medium">SferaV Admin</span>
+        </div>
+      </div>
+    </div>
+  )
+}