feat: add StudentNav with logout to all student pages
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
co-authored by
Claude Sonnet 4.6
parent
9bc2d65b43
commit
2dba7f7cd2
@@ -2,6 +2,7 @@
|
|||||||
|
|
||||||
import { useState, useEffect } from 'react';
|
import { useState, useEffect } from 'react';
|
||||||
import Link from 'next/link';
|
import Link from 'next/link';
|
||||||
|
import { StudentNav } from '@/components/StudentNav';
|
||||||
import { BalanceCard } from '@/components/BalanceCard';
|
import { BalanceCard } from '@/components/BalanceCard';
|
||||||
import { TransactionList } from '@/components/TransactionList';
|
import { TransactionList } from '@/components/TransactionList';
|
||||||
import { Spinner } from '@/components/ui';
|
import { Spinner } from '@/components/ui';
|
||||||
@@ -58,6 +59,8 @@ export default function StudentDashboardPage() {
|
|||||||
const balance = profile?.balance ?? user?.balance ?? 0;
|
const balance = profile?.balance ?? user?.balance ?? 0;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
|
<div className="min-h-screen">
|
||||||
|
<StudentNav />
|
||||||
<main className="mx-auto max-w-lg space-y-6 p-4 pb-10 pt-6">
|
<main className="mx-auto max-w-lg space-y-6 p-4 pb-10 pt-6">
|
||||||
<h1 className="text-xl font-bold text-white">
|
<h1 className="text-xl font-bold text-white">
|
||||||
Привет, {displayName.split(' ')[0]} 👋
|
Привет, {displayName.split(' ')[0]} 👋
|
||||||
@@ -77,5 +80,6 @@ export default function StudentDashboardPage() {
|
|||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
</main>
|
</main>
|
||||||
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -2,6 +2,7 @@
|
|||||||
|
|
||||||
import { useState, useEffect, useCallback } from 'react';
|
import { useState, useEffect, useCallback } from 'react';
|
||||||
import Link from 'next/link';
|
import Link from 'next/link';
|
||||||
|
import { StudentNav } from '@/components/StudentNav';
|
||||||
import { TransactionList } from '@/components/TransactionList';
|
import { TransactionList } from '@/components/TransactionList';
|
||||||
import { Button } from '@/components/ui';
|
import { Button } from '@/components/ui';
|
||||||
import { api } from '@/lib/api';
|
import { api } from '@/lib/api';
|
||||||
@@ -49,13 +50,10 @@ export default function HistoryPage() {
|
|||||||
const hasMore = transactions.length < total;
|
const hasMore = transactions.length < total;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
|
<div className="min-h-screen">
|
||||||
|
<StudentNav />
|
||||||
<main className="mx-auto max-w-lg p-4 pb-10 pt-6">
|
<main className="mx-auto max-w-lg p-4 pb-10 pt-6">
|
||||||
<div className="mb-4 flex items-center gap-3">
|
<h1 className="mb-4 text-xl font-bold text-white">История операций</h1>
|
||||||
<Link href="/dashboard" className="text-sm text-blue-400 hover:text-blue-300">
|
|
||||||
← Назад
|
|
||||||
</Link>
|
|
||||||
<h1 className="text-xl font-bold text-white">История операций</h1>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{error && (
|
{error && (
|
||||||
<p className="mb-4 rounded-lg bg-red-900/30 px-3 py-2 text-sm text-red-400">{error}</p>
|
<p className="mb-4 rounded-lg bg-red-900/30 px-3 py-2 text-sm text-red-400">{error}</p>
|
||||||
@@ -77,5 +75,6 @@ export default function HistoryPage() {
|
|||||||
<p className="mt-4 text-center text-xs text-gray-600">Это все операции</p>
|
<p className="mt-4 text-center text-xs text-gray-600">Это все операции</p>
|
||||||
)}
|
)}
|
||||||
</main>
|
</main>
|
||||||
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
'use client';
|
'use client';
|
||||||
|
|
||||||
import { useState, useEffect } from 'react';
|
import { useState, useEffect } from 'react';
|
||||||
import Link from 'next/link';
|
import { StudentNav } from '@/components/StudentNav';
|
||||||
import { PartnerCard } from '@/components/PartnerCard';
|
import { PartnerCard } from '@/components/PartnerCard';
|
||||||
import { Spinner } from '@/components/ui';
|
import { Spinner } from '@/components/ui';
|
||||||
import { api } from '@/lib/api';
|
import { api } from '@/lib/api';
|
||||||
@@ -27,13 +27,10 @@ export default function PartnersPage() {
|
|||||||
}, []);
|
}, []);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
|
<div className="min-h-screen">
|
||||||
|
<StudentNav />
|
||||||
<main className="mx-auto max-w-lg p-4 pb-10 pt-6">
|
<main className="mx-auto max-w-lg p-4 pb-10 pt-6">
|
||||||
<div className="mb-4 flex items-center gap-3">
|
<h1 className="mb-4 text-xl font-bold text-white">Партнёры</h1>
|
||||||
<Link href="/dashboard" className="text-sm text-blue-400 hover:text-blue-300">
|
|
||||||
← Назад
|
|
||||||
</Link>
|
|
||||||
<h1 className="text-xl font-bold text-white">Партнёры</h1>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{loading && (
|
{loading && (
|
||||||
<div className="flex justify-center py-12">
|
<div className="flex justify-center py-12">
|
||||||
@@ -57,5 +54,6 @@ export default function PartnersPage() {
|
|||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
</main>
|
</main>
|
||||||
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,11 +1,13 @@
|
|||||||
'use client';
|
'use client';
|
||||||
|
|
||||||
import Link from 'next/link';
|
import { StudentNav } from '@/components/StudentNav';
|
||||||
import { QRDisplay } from '@/components/QRDisplay';
|
import { QRDisplay } from '@/components/QRDisplay';
|
||||||
|
|
||||||
export default function QRPage() {
|
export default function QRPage() {
|
||||||
return (
|
return (
|
||||||
<main className="flex min-h-screen flex-col items-center justify-center gap-6 p-6">
|
<div className="min-h-screen">
|
||||||
|
<StudentNav />
|
||||||
|
<main className="flex flex-col items-center justify-center gap-6 p-6 pt-12">
|
||||||
<h1 className="text-xl font-bold text-white">Оплата поинтами</h1>
|
<h1 className="text-xl font-bold text-white">Оплата поинтами</h1>
|
||||||
|
|
||||||
<QRDisplay />
|
<QRDisplay />
|
||||||
@@ -13,10 +15,7 @@ export default function QRPage() {
|
|||||||
<p className="max-w-xs text-center text-sm text-gray-500">
|
<p className="max-w-xs text-center text-sm text-gray-500">
|
||||||
Покажи этот QR кассиру. Он действителен 5 минут и может быть использован только один раз.
|
Покажи этот QR кассиру. Он действителен 5 минут и может быть использован только один раз.
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
<Link href="/dashboard" className="text-sm text-blue-400 hover:text-blue-300">
|
|
||||||
← Назад
|
|
||||||
</Link>
|
|
||||||
</main>
|
</main>
|
||||||
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -0,0 +1,44 @@
|
|||||||
|
'use client';
|
||||||
|
|
||||||
|
import Link from 'next/link';
|
||||||
|
import { usePathname } from 'next/navigation';
|
||||||
|
import { useAuthStore } from '@/lib/store';
|
||||||
|
|
||||||
|
const LINKS = [
|
||||||
|
{ href: '/dashboard', label: 'Главная' },
|
||||||
|
{ href: '/history', label: 'История' },
|
||||||
|
{ href: '/qr', label: 'QR-код' },
|
||||||
|
{ href: '/partners', label: 'Партнёры' },
|
||||||
|
] as const;
|
||||||
|
|
||||||
|
export function StudentNav() {
|
||||||
|
const pathname = usePathname();
|
||||||
|
const { logout } = useAuthStore();
|
||||||
|
|
||||||
|
return (
|
||||||
|
<nav className="border-b border-gray-700 bg-gray-900">
|
||||||
|
<div className="mx-auto flex max-w-lg flex-wrap items-center gap-1 px-4 py-3">
|
||||||
|
<span className="mr-4 text-sm font-semibold text-white">CU Points</span>
|
||||||
|
{LINKS.map((link) => (
|
||||||
|
<Link
|
||||||
|
key={link.href}
|
||||||
|
href={link.href}
|
||||||
|
className={`rounded-lg px-3 py-1.5 text-sm transition-colors ${
|
||||||
|
pathname === link.href
|
||||||
|
? 'bg-blue-600 text-white'
|
||||||
|
: 'text-gray-400 hover:bg-gray-700 hover:text-white'
|
||||||
|
}`}
|
||||||
|
>
|
||||||
|
{link.label}
|
||||||
|
</Link>
|
||||||
|
))}
|
||||||
|
<button
|
||||||
|
onClick={logout}
|
||||||
|
className="ml-auto rounded-lg px-3 py-1.5 text-sm text-gray-400 transition-colors hover:bg-gray-700 hover:text-white"
|
||||||
|
>
|
||||||
|
Выйти
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
);
|
||||||
|
}
|
||||||
Reference in New Issue
Block a user