feat(admin): claims dashboard listing all reservations
Some checks failed
Build and Push Docker Image / build-and-push (push) Has been cancelled
Some checks failed
Build and Push Docker Image / build-and-push (push) Has been cancelled
This commit is contained in:
82
app/admin/claims/page.tsx
Normal file
82
app/admin/claims/page.tsx
Normal file
@@ -0,0 +1,82 @@
|
||||
'use client';
|
||||
|
||||
import { useEffect, useMemo, useState } from 'react';
|
||||
import AdminGuard from '@/components/admin-guard';
|
||||
import { claimsApi, type AdminClaim } from '@/lib/api';
|
||||
|
||||
export default function AdminClaimsPage() {
|
||||
return (
|
||||
<AdminGuard>
|
||||
<ClaimsView />
|
||||
</AdminGuard>
|
||||
);
|
||||
}
|
||||
|
||||
function ClaimsView() {
|
||||
const [claims, setClaims] = useState<AdminClaim[]>([]);
|
||||
const [loading, setLoading] = useState(true);
|
||||
|
||||
useEffect(() => {
|
||||
claimsApi.list().then((c) => setClaims(c)).finally(() => setLoading(false));
|
||||
}, []);
|
||||
|
||||
const totals = useMemo(() => {
|
||||
const byItem: Record<string, { reserved: number; total: number }> = {};
|
||||
for (const c of claims) {
|
||||
const k = c.itemId;
|
||||
if (!byItem[k]) byItem[k] = { reserved: 0, total: c.itemQuantity };
|
||||
byItem[k].reserved += c.quantity;
|
||||
}
|
||||
return byItem;
|
||||
}, [claims]);
|
||||
|
||||
if (loading) {
|
||||
return <div className="min-h-screen flex items-center justify-center text-gray-500">Carregando…</div>;
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="max-w-5xl mx-auto p-6 space-y-6">
|
||||
<div className="flex items-center justify-between">
|
||||
<h1 className="text-2xl font-bold">Reservas</h1>
|
||||
<div className="text-sm text-gray-500">{claims.length} no total</div>
|
||||
</div>
|
||||
|
||||
{claims.length === 0 ? (
|
||||
<div className="border rounded p-6 text-center text-gray-500">Nenhuma reserva ainda.</div>
|
||||
) : (
|
||||
<div className="overflow-x-auto border rounded">
|
||||
<table className="w-full text-sm">
|
||||
<thead className="bg-gray-50 dark:bg-gray-800">
|
||||
<tr className="text-left">
|
||||
<th className="p-3">Item</th>
|
||||
<th className="p-3">Qtd</th>
|
||||
<th className="p-3">Convidado</th>
|
||||
<th className="p-3">Nota</th>
|
||||
<th className="p-3">Quando</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{claims.map((c) => {
|
||||
const t = totals[c.itemId];
|
||||
return (
|
||||
<tr key={c.claimId} className="border-t">
|
||||
<td className="p-3">
|
||||
<div className="font-medium">{c.itemName}</div>
|
||||
<div className="text-xs text-gray-500">
|
||||
{c.wishlistName} · {t.reserved}/{t.total} reservados
|
||||
</div>
|
||||
</td>
|
||||
<td className="p-3">{c.quantity}</td>
|
||||
<td className="p-3">{c.guestName}</td>
|
||||
<td className="p-3 italic text-gray-600 dark:text-gray-400">{c.note ?? '—'}</td>
|
||||
<td className="p-3 text-gray-500">{new Date(c.claimedAt).toLocaleString('pt-BR')}</td>
|
||||
</tr>
|
||||
);
|
||||
})}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -142,6 +142,12 @@ function AdminPageContent() {
|
||||
subtitle="Manage your wishlists and items"
|
||||
actions={
|
||||
<>
|
||||
<Link
|
||||
href="/admin/claims"
|
||||
className="inline-flex items-center px-6 py-3 border-2 border-indigo-600 dark:border-indigo-500 text-base font-semibold rounded-lg text-indigo-600 dark:text-indigo-400 bg-white dark:bg-gray-800 hover:bg-indigo-50 dark:hover:bg-gray-700 transition-all"
|
||||
>
|
||||
Reservas
|
||||
</Link>
|
||||
<Link
|
||||
href="/admin/guests"
|
||||
className="inline-flex items-center px-6 py-3 border-2 border-indigo-600 dark:border-indigo-500 text-base font-semibold rounded-lg text-indigo-600 dark:text-indigo-400 bg-white dark:bg-gray-800 hover:bg-indigo-50 dark:hover:bg-gray-700 transition-all"
|
||||
|
||||
33
app/api/admin/claims/route.ts
Normal file
33
app/api/admin/claims/route.ts
Normal file
@@ -0,0 +1,33 @@
|
||||
import { NextRequest, NextResponse } from 'next/server';
|
||||
import { desc, eq } from 'drizzle-orm';
|
||||
import { db, itemClaims, wishlistItems, wishlists, guests } from '@/lib/db';
|
||||
import { verifyAdminToken } from '@/lib/auth/tokens';
|
||||
|
||||
export async function GET(request: NextRequest) {
|
||||
if (!verifyAdminToken(request)) {
|
||||
return NextResponse.json({ error: 'Unauthorized' }, { status: 401 });
|
||||
}
|
||||
|
||||
const rows = await db
|
||||
.select({
|
||||
claimId: itemClaims.id,
|
||||
quantity: itemClaims.quantity,
|
||||
note: itemClaims.note,
|
||||
isPurchased: itemClaims.isPurchased,
|
||||
claimedAt: itemClaims.claimedAt,
|
||||
itemId: wishlistItems.id,
|
||||
itemName: wishlistItems.name,
|
||||
itemQuantity: wishlistItems.quantity,
|
||||
wishlistSlug: wishlists.slug,
|
||||
wishlistName: wishlists.name,
|
||||
guestId: guests.id,
|
||||
guestName: guests.name,
|
||||
})
|
||||
.from(itemClaims)
|
||||
.innerJoin(wishlistItems, eq(itemClaims.itemId, wishlistItems.id))
|
||||
.innerJoin(wishlists, eq(wishlistItems.wishlistId, wishlists.id))
|
||||
.innerJoin(guests, eq(itemClaims.guestId, guests.id))
|
||||
.orderBy(desc(itemClaims.claimedAt));
|
||||
|
||||
return NextResponse.json({ success: true, claims: rows });
|
||||
}
|
||||
Reference in New Issue
Block a user