admin page

src/pages/admin/index.ts

@@ -0,0 +1 @@
+export { AdminPage } from './ui/AdminPage'

src/pages/admin/ui/AdminPage.module.css

@@ -0,0 +1,84 @@
+.page {
+  min-height: 100vh;
+  background: var(--bg-deep);
+  padding: 40px 48px;
+}
+
+.header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  max-width: 1200px;
+  margin: 0 auto 36px;
+}
+
+.greeting {
+  font-size: clamp(28px, 4vw, 40px);
+  font-weight: 700;
+  color: var(--text-primary, #fff);
+  margin: 0;
+}
+
+.logout {
+  background: rgba(255, 255, 255, 0.06);
+  border: 1px solid var(--glass-border, rgba(255, 255, 255, 0.1));
+  color: var(--text-secondary, rgba(255, 255, 255, 0.7));
+  border-radius: 10px;
+  height: 40px;
+  padding: 0 18px;
+  font-size: 13px;
+  font-weight: 600;
+  cursor: pointer;
+  transition: background 0.2s, color 0.2s, border-color 0.2s;
+}
+
+.logout:hover {
+  background: rgba(255, 90, 90, 0.12);
+  border-color: rgba(255, 90, 90, 0.3);
+  color: #ff5a5a;
+}
+
+.content {
+  max-width: 1200px;
+  margin: 0 auto;
+}
+
+.toolbar {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 16px;
+  margin-bottom: 20px;
+  flex-wrap: wrap;
+}
+
+.sectionTitle {
+  font-size: 20px;
+  font-weight: 700;
+  color: var(--text-primary, #fff);
+  margin: 0;
+}
+
+.addBtn {
+  background: linear-gradient(135deg, var(--grad-edge, #4a6dff), var(--grad-center, #6f4aff));
+  border: none;
+  color: #fff;
+  border-radius: 12px;
+  height: 44px;
+  padding: 0 20px;
+  font-size: 14px;
+  font-weight: 700;
+  cursor: pointer;
+  transition: filter 0.2s, box-shadow 0.2s;
+}
+
+.addBtn:hover {
+  filter: brightness(1.12);
+  box-shadow: 0 6px 20px rgba(74, 109, 255, 0.35);
+}
+
+@media (max-width: 768px) {
+  .page {
+    padding: 28px 20px;
+  }
+}

src/pages/admin/ui/AdminPage.tsx

@@ -0,0 +1,53 @@
+import { useState } from 'react'
+import { useAdminAuth, useAdminLogout } from '@features/admin'
+import { Notification } from '@shared/ui'
+import { AdminLoginForm } from '@widgets/admin-login-form'
+import { LegalEntitiesTable } from '@widgets/legal-entities-table'
+import { AddLegalEntityModal } from '@widgets/add-legal-entity-modal'
+import styles from './AdminPage.module.css'
+
+export function AdminPage() {
+  const { isAuthenticated, isLoading } = useAdminAuth()
+  const logout = useAdminLogout()
+  const [modalOpen, setModalOpen] = useState(false)
+  const [notification, setNotification] = useState<{ message: string; status: 'success' | 'error' } | null>(null)
+
+  if (isLoading) return null
+  if (!isAuthenticated) return <AdminLoginForm />
+
+  return (
+    <div className={styles.page}>
+      <header className={styles.header}>
+        <h1 className={styles.greeting}>Привет, Марк!</h1>
+        <button className={styles.logout} type="button" onClick={() => logout.mutate()}>
+          Выйти
+        </button>
+      </header>
+
+      <section className={styles.content}>
+        <div className={styles.toolbar}>
+          <h2 className={styles.sectionTitle}>Юридические лица</h2>
+          <button className={styles.addBtn} type="button" onClick={() => setModalOpen(true)}>
+            + Добавить юридическое лицо
+          </button>
+        </div>
+
+        <LegalEntitiesTable />
+      </section>
+
+      <AddLegalEntityModal
+        open={modalOpen}
+        onClose={() => setModalOpen(false)}
+        onCreated={() => setNotification({ status: 'success', message: 'Юридическое лицо добавлено' })}
+      />
+
+      {notification && (
+        <Notification
+          status={notification.status}
+          message={notification.message}
+          onClose={() => setNotification(null)}
+        />
+      )}
+    </div>
+  )
+}