Add account hierarchy framework with migrations, RLS policies, and UI components
This commit is contained in:
T. Zehetbauer
@@ -10,6 +10,7 @@ import {
|
||||
User,
|
||||
} from 'lucide-react';
|
||||
|
||||
import { formatDate } from '@kit/shared/dates';
|
||||
import { getSupabaseServerClient } from '@kit/supabase/server-client';
|
||||
import { Badge } from '@kit/ui/badge';
|
||||
import { Button } from '@kit/ui/button';
|
||||
@@ -21,8 +22,8 @@ import {
|
||||
CardTitle,
|
||||
} from '@kit/ui/card';
|
||||
|
||||
import { CmsPageShell } from '~/components/cms-page-shell';
|
||||
import { AccountNotFound } from '~/components/account-not-found';
|
||||
import { CmsPageShell } from '~/components/cms-page-shell';
|
||||
|
||||
interface PageProps {
|
||||
params: Promise<{ account: string; bookingId: string }>;
|
||||
@@ -124,9 +125,7 @@ export default async function BookingDetailPage({ params }: PageProps) {
|
||||
{STATUS_LABEL[status] ?? status}
|
||||
</Badge>
|
||||
</div>
|
||||
<p className="text-muted-foreground text-sm">
|
||||
ID: {bookingId}
|
||||
</p>
|
||||
<p className="text-muted-foreground text-sm">ID: {bookingId}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -144,7 +143,7 @@ export default async function BookingDetailPage({ params }: PageProps) {
|
||||
{room ? (
|
||||
<div className="space-y-2">
|
||||
<div className="flex justify-between">
|
||||
<span className="text-sm text-muted-foreground">
|
||||
<span className="text-muted-foreground text-sm">
|
||||
Zimmernummer
|
||||
</span>
|
||||
<span className="font-medium">
|
||||
@@ -153,14 +152,14 @@ export default async function BookingDetailPage({ params }: PageProps) {
|
||||
</div>
|
||||
{room.name && (
|
||||
<div className="flex justify-between">
|
||||
<span className="text-sm text-muted-foreground">
|
||||
<span className="text-muted-foreground text-sm">
|
||||
Name
|
||||
</span>
|
||||
<span className="font-medium">{String(room.name)}</span>
|
||||
</div>
|
||||
)}
|
||||
<div className="flex justify-between">
|
||||
<span className="text-sm text-muted-foreground">Typ</span>
|
||||
<span className="text-muted-foreground text-sm">Typ</span>
|
||||
<span className="font-medium">
|
||||
{String(room.room_type ?? '—')}
|
||||
</span>
|
||||
@@ -186,29 +185,25 @@ export default async function BookingDetailPage({ params }: PageProps) {
|
||||
{guest ? (
|
||||
<div className="space-y-2">
|
||||
<div className="flex justify-between">
|
||||
<span className="text-sm text-muted-foreground">Name</span>
|
||||
<span className="text-muted-foreground text-sm">Name</span>
|
||||
<span className="font-medium">
|
||||
{String(guest.first_name)} {String(guest.last_name)}
|
||||
</span>
|
||||
</div>
|
||||
{guest.email && (
|
||||
<div className="flex justify-between">
|
||||
<span className="text-sm text-muted-foreground">
|
||||
<span className="text-muted-foreground text-sm">
|
||||
E-Mail
|
||||
</span>
|
||||
<span className="font-medium">
|
||||
{String(guest.email)}
|
||||
</span>
|
||||
<span className="font-medium">{String(guest.email)}</span>
|
||||
</div>
|
||||
)}
|
||||
{guest.phone && (
|
||||
<div className="flex justify-between">
|
||||
<span className="text-sm text-muted-foreground">
|
||||
<span className="text-muted-foreground text-sm">
|
||||
Telefon
|
||||
</span>
|
||||
<span className="font-medium">
|
||||
{String(guest.phone)}
|
||||
</span>
|
||||
<span className="font-medium">{String(guest.phone)}</span>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
@@ -231,56 +226,30 @@ export default async function BookingDetailPage({ params }: PageProps) {
|
||||
<CardContent>
|
||||
<div className="space-y-2">
|
||||
<div className="flex justify-between">
|
||||
<span className="text-sm text-muted-foreground">
|
||||
<span className="text-muted-foreground text-sm">
|
||||
Check-in
|
||||
</span>
|
||||
<span className="font-medium">
|
||||
{booking.check_in
|
||||
? new Date(String(booking.check_in)).toLocaleDateString(
|
||||
'de-DE',
|
||||
{
|
||||
weekday: 'short',
|
||||
day: '2-digit',
|
||||
month: '2-digit',
|
||||
year: 'numeric',
|
||||
},
|
||||
)
|
||||
: '—'}
|
||||
{formatDate(booking.check_in)}
|
||||
</span>
|
||||
</div>
|
||||
<div className="flex justify-between">
|
||||
<span className="text-sm text-muted-foreground">
|
||||
<span className="text-muted-foreground text-sm">
|
||||
Check-out
|
||||
</span>
|
||||
<span className="font-medium">
|
||||
{booking.check_out
|
||||
? new Date(String(booking.check_out)).toLocaleDateString(
|
||||
'de-DE',
|
||||
{
|
||||
weekday: 'short',
|
||||
day: '2-digit',
|
||||
month: '2-digit',
|
||||
year: 'numeric',
|
||||
},
|
||||
)
|
||||
: '—'}
|
||||
{formatDate(booking.check_out)}
|
||||
</span>
|
||||
</div>
|
||||
<div className="flex justify-between">
|
||||
<span className="text-sm text-muted-foreground">
|
||||
<span className="text-muted-foreground text-sm">
|
||||
Erwachsene
|
||||
</span>
|
||||
<span className="font-medium">
|
||||
{booking.adults ?? '—'}
|
||||
</span>
|
||||
<span className="font-medium">{booking.adults ?? '—'}</span>
|
||||
</div>
|
||||
<div className="flex justify-between">
|
||||
<span className="text-sm text-muted-foreground">
|
||||
Kinder
|
||||
</span>
|
||||
<span className="font-medium">
|
||||
{booking.children ?? 0}
|
||||
</span>
|
||||
<span className="text-muted-foreground text-sm">Kinder</span>
|
||||
<span className="font-medium">{booking.children ?? 0}</span>
|
||||
</div>
|
||||
</div>
|
||||
</CardContent>
|
||||
@@ -294,7 +263,7 @@ export default async function BookingDetailPage({ params }: PageProps) {
|
||||
<CardContent>
|
||||
<div className="space-y-2">
|
||||
<div className="flex justify-between">
|
||||
<span className="text-sm text-muted-foreground">
|
||||
<span className="text-muted-foreground text-sm">
|
||||
Gesamtpreis
|
||||
</span>
|
||||
<span className="text-2xl font-bold">
|
||||
@@ -305,7 +274,7 @@ export default async function BookingDetailPage({ params }: PageProps) {
|
||||
</div>
|
||||
{booking.notes && (
|
||||
<div className="border-t pt-2">
|
||||
<span className="text-sm text-muted-foreground">
|
||||
<span className="text-muted-foreground text-sm">
|
||||
Notizen
|
||||
</span>
|
||||
<p className="mt-1 text-sm">{String(booking.notes)}</p>
|
||||
@@ -320,9 +289,7 @@ export default async function BookingDetailPage({ params }: PageProps) {
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<CardTitle>Aktionen</CardTitle>
|
||||
<CardDescription>
|
||||
Status der Buchung ändern
|
||||
</CardDescription>
|
||||
<CardDescription>Status der Buchung ändern</CardDescription>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<div className="flex flex-wrap gap-3">
|
||||
@@ -350,10 +317,10 @@ export default async function BookingDetailPage({ params }: PageProps) {
|
||||
)}
|
||||
|
||||
{status === 'cancelled' || status === 'checked_out' ? (
|
||||
<p className="text-sm text-muted-foreground py-2">
|
||||
<p className="text-muted-foreground py-2 text-sm">
|
||||
Diese Buchung ist{' '}
|
||||
{status === 'cancelled' ? 'storniert' : 'abgeschlossen'} — keine
|
||||
weiteren Aktionen verfügbar.
|
||||
{status === 'cancelled' ? 'storniert' : 'abgeschlossen'} —
|
||||
keine weiteren Aktionen verfügbar.
|
||||
</p>
|
||||
) : null}
|
||||
</div>
|
||||
|
||||
@@ -2,15 +2,14 @@ import Link from 'next/link';
|
||||
|
||||
import { ArrowLeft, ChevronLeft, ChevronRight } from 'lucide-react';
|
||||
|
||||
import { createBookingManagementApi } from '@kit/booking-management/api';
|
||||
import { getSupabaseServerClient } from '@kit/supabase/server-client';
|
||||
import { Badge } from '@kit/ui/badge';
|
||||
import { Button } from '@kit/ui/button';
|
||||
import { Card, CardContent, CardHeader, CardTitle } from '@kit/ui/card';
|
||||
|
||||
import { createBookingManagementApi } from '@kit/booking-management/api';
|
||||
|
||||
import { CmsPageShell } from '~/components/cms-page-shell';
|
||||
import { AccountNotFound } from '~/components/account-not-found';
|
||||
import { CmsPageShell } from '~/components/cms-page-shell';
|
||||
|
||||
interface PageProps {
|
||||
params: Promise<{ account: string }>;
|
||||
@@ -43,7 +42,11 @@ function getFirstWeekday(year: number, month: number): number {
|
||||
return day === 0 ? 6 : day - 1;
|
||||
}
|
||||
|
||||
function isDateInRange(date: string, checkIn: string, checkOut: string): boolean {
|
||||
function isDateInRange(
|
||||
date: string,
|
||||
checkIn: string,
|
||||
checkOut: string,
|
||||
): boolean {
|
||||
return date >= checkIn && date < checkOut;
|
||||
}
|
||||
|
||||
@@ -101,7 +104,11 @@ export default async function BookingCalendarPage({ params }: PageProps) {
|
||||
}
|
||||
|
||||
// Build calendar grid cells
|
||||
const cells: Array<{ day: number | null; occupied: boolean; isToday: boolean }> = [];
|
||||
const cells: Array<{
|
||||
day: number | null;
|
||||
occupied: boolean;
|
||||
isToday: boolean;
|
||||
}> = [];
|
||||
|
||||
// Empty cells before first day
|
||||
for (let i = 0; i < firstWeekday; i++) {
|
||||
@@ -158,11 +165,11 @@ export default async function BookingCalendarPage({ params }: PageProps) {
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
{/* Weekday Header */}
|
||||
<div className="grid grid-cols-7 gap-1 mb-1">
|
||||
<div className="mb-1 grid grid-cols-7 gap-1">
|
||||
{WEEKDAYS.map((day) => (
|
||||
<div
|
||||
key={day}
|
||||
className="text-center text-xs font-medium text-muted-foreground py-2"
|
||||
className="text-muted-foreground py-2 text-center text-xs font-medium"
|
||||
>
|
||||
{day}
|
||||
</div>
|
||||
@@ -180,13 +187,13 @@ export default async function BookingCalendarPage({ params }: PageProps) {
|
||||
: cell.occupied
|
||||
? 'bg-primary/15 text-primary font-semibold'
|
||||
: 'bg-muted/30 hover:bg-muted/50'
|
||||
} ${cell.isToday ? 'ring-2 ring-primary ring-offset-1' : ''}`}
|
||||
} ${cell.isToday ? 'ring-primary ring-2 ring-offset-1' : ''}`}
|
||||
>
|
||||
{cell.day !== null && (
|
||||
<>
|
||||
<span>{cell.day}</span>
|
||||
{cell.occupied && (
|
||||
<span className="absolute bottom-1 left-1/2 -translate-x-1/2 h-1.5 w-1.5 rounded-full bg-primary" />
|
||||
<span className="bg-primary absolute bottom-1 left-1/2 h-1.5 w-1.5 -translate-x-1/2 rounded-full" />
|
||||
)}
|
||||
</>
|
||||
)}
|
||||
@@ -195,17 +202,17 @@ export default async function BookingCalendarPage({ params }: PageProps) {
|
||||
</div>
|
||||
|
||||
{/* Legend */}
|
||||
<div className="mt-4 flex items-center gap-4 text-xs text-muted-foreground">
|
||||
<div className="text-muted-foreground mt-4 flex items-center gap-4 text-xs">
|
||||
<div className="flex items-center gap-1.5">
|
||||
<span className="inline-block h-3 w-3 rounded-sm bg-primary/15" />
|
||||
<span className="bg-primary/15 inline-block h-3 w-3 rounded-sm" />
|
||||
Belegt
|
||||
</div>
|
||||
<div className="flex items-center gap-1.5">
|
||||
<span className="inline-block h-3 w-3 rounded-sm bg-muted/30" />
|
||||
<span className="bg-muted/30 inline-block h-3 w-3 rounded-sm" />
|
||||
Frei
|
||||
</div>
|
||||
<div className="flex items-center gap-1.5">
|
||||
<span className="inline-block h-3 w-3 rounded-sm ring-2 ring-primary" />
|
||||
<span className="ring-primary inline-block h-3 w-3 rounded-sm ring-2" />
|
||||
Heute
|
||||
</div>
|
||||
</div>
|
||||
@@ -217,7 +224,7 @@ export default async function BookingCalendarPage({ params }: PageProps) {
|
||||
<CardContent className="p-6">
|
||||
<div className="flex items-center justify-between">
|
||||
<div>
|
||||
<p className="text-sm text-muted-foreground">
|
||||
<p className="text-muted-foreground text-sm">
|
||||
Buchungen in diesem Monat
|
||||
</p>
|
||||
<p className="text-2xl font-bold">{bookings.data.length}</p>
|
||||
|
||||
@@ -1,14 +1,13 @@
|
||||
import { UserCircle, Plus } from 'lucide-react';
|
||||
|
||||
import { createBookingManagementApi } from '@kit/booking-management/api';
|
||||
import { getSupabaseServerClient } from '@kit/supabase/server-client';
|
||||
import { Button } from '@kit/ui/button';
|
||||
import { Card, CardContent, CardHeader, CardTitle } from '@kit/ui/card';
|
||||
|
||||
import { createBookingManagementApi } from '@kit/booking-management/api';
|
||||
|
||||
import { AccountNotFound } from '~/components/account-not-found';
|
||||
import { CmsPageShell } from '~/components/cms-page-shell';
|
||||
import { EmptyState } from '~/components/empty-state';
|
||||
import { AccountNotFound } from '~/components/account-not-found';
|
||||
|
||||
interface PageProps {
|
||||
params: Promise<{ account: string }>;
|
||||
@@ -62,7 +61,7 @@ export default async function GuestsPage({ params }: PageProps) {
|
||||
<div className="rounded-md border">
|
||||
<table className="w-full text-sm">
|
||||
<thead>
|
||||
<tr className="border-b bg-muted/50">
|
||||
<tr className="bg-muted/50 border-b">
|
||||
<th className="p-3 text-left font-medium">Name</th>
|
||||
<th className="p-3 text-left font-medium">E-Mail</th>
|
||||
<th className="p-3 text-left font-medium">Telefon</th>
|
||||
@@ -72,9 +71,13 @@ export default async function GuestsPage({ params }: PageProps) {
|
||||
</thead>
|
||||
<tbody>
|
||||
{guests.map((guest: Record<string, unknown>) => (
|
||||
<tr key={String(guest.id)} className="border-b hover:bg-muted/30">
|
||||
<tr
|
||||
key={String(guest.id)}
|
||||
className="hover:bg-muted/30 border-b"
|
||||
>
|
||||
<td className="p-3 font-medium">
|
||||
{String(guest.last_name ?? '')}, {String(guest.first_name ?? '')}
|
||||
{String(guest.last_name ?? '')},{' '}
|
||||
{String(guest.first_name ?? '')}
|
||||
</td>
|
||||
<td className="p-3">{String(guest.email ?? '—')}</td>
|
||||
<td className="p-3">{String(guest.phone ?? '—')}</td>
|
||||
|
||||
@@ -1,15 +1,22 @@
|
||||
import { getSupabaseServerClient } from '@kit/supabase/server-client';
|
||||
import { createBookingManagementApi } from '@kit/booking-management/api';
|
||||
import { CreateBookingForm } from '@kit/booking-management/components';
|
||||
import { CmsPageShell } from '~/components/cms-page-shell';
|
||||
import { AccountNotFound } from '~/components/account-not-found';
|
||||
import { getSupabaseServerClient } from '@kit/supabase/server-client';
|
||||
|
||||
interface Props { params: Promise<{ account: string }> }
|
||||
import { AccountNotFound } from '~/components/account-not-found';
|
||||
import { CmsPageShell } from '~/components/cms-page-shell';
|
||||
|
||||
interface Props {
|
||||
params: Promise<{ account: string }>;
|
||||
}
|
||||
|
||||
export default async function NewBookingPage({ params }: Props) {
|
||||
const { account } = await params;
|
||||
const client = getSupabaseServerClient();
|
||||
const { data: acct } = await client.from('accounts').select('id').eq('slug', account).single();
|
||||
const { data: acct } = await client
|
||||
.from('accounts')
|
||||
.select('id')
|
||||
.eq('slug', account)
|
||||
.single();
|
||||
if (!acct) {
|
||||
return (
|
||||
<CmsPageShell account={account} title="Neue Buchung">
|
||||
@@ -22,13 +29,20 @@ export default async function NewBookingPage({ params }: Props) {
|
||||
const rooms = await api.listRooms(acct.id);
|
||||
|
||||
return (
|
||||
<CmsPageShell account={account} title="Neue Buchung" description="Buchung erstellen">
|
||||
<CreateBookingForm
|
||||
accountId={acct.id}
|
||||
account={account}
|
||||
<CmsPageShell
|
||||
account={account}
|
||||
title="Neue Buchung"
|
||||
description="Buchung erstellen"
|
||||
>
|
||||
<CreateBookingForm
|
||||
accountId={acct.id}
|
||||
account={account}
|
||||
rooms={(rooms ?? []).map((r: Record<string, unknown>) => ({
|
||||
id: String(r.id), roomNumber: String(r.room_number), name: String(r.name ?? ''), pricePerNight: Number(r.price_per_night ?? 0)
|
||||
}))}
|
||||
id: String(r.id),
|
||||
roomNumber: String(r.room_number),
|
||||
name: String(r.name ?? ''),
|
||||
pricePerNight: Number(r.price_per_night ?? 0),
|
||||
}))}
|
||||
/>
|
||||
</CmsPageShell>
|
||||
);
|
||||
|
||||
@@ -2,18 +2,18 @@ import Link from 'next/link';
|
||||
|
||||
import { BedDouble, CalendarCheck, Plus, Euro, Search } from 'lucide-react';
|
||||
|
||||
import { createBookingManagementApi } from '@kit/booking-management/api';
|
||||
import { formatDate } from '@kit/shared/dates';
|
||||
import { getSupabaseServerClient } from '@kit/supabase/server-client';
|
||||
import { Badge } from '@kit/ui/badge';
|
||||
import { Button } from '@kit/ui/button';
|
||||
import { Card, CardContent, CardHeader, CardTitle } from '@kit/ui/card';
|
||||
import { Input } from '@kit/ui/input';
|
||||
|
||||
import { createBookingManagementApi } from '@kit/booking-management/api';
|
||||
|
||||
import { AccountNotFound } from '~/components/account-not-found';
|
||||
import { CmsPageShell } from '~/components/cms-page-shell';
|
||||
import { EmptyState } from '~/components/empty-state';
|
||||
import { StatsCard } from '~/components/stats-card';
|
||||
import { AccountNotFound } from '~/components/account-not-found';
|
||||
|
||||
interface PageProps {
|
||||
params: Promise<{ account: string }>;
|
||||
@@ -42,7 +42,10 @@ const STATUS_LABEL: Record<string, string> = {
|
||||
no_show: 'Nicht erschienen',
|
||||
};
|
||||
|
||||
export default async function BookingsPage({ params, searchParams }: PageProps) {
|
||||
export default async function BookingsPage({
|
||||
params,
|
||||
searchParams,
|
||||
}: PageProps) {
|
||||
const { account } = await params;
|
||||
const search = await searchParams;
|
||||
const client = getSupabaseServerClient();
|
||||
@@ -148,7 +151,7 @@ export default async function BookingsPage({ params, searchParams }: PageProps)
|
||||
{/* Search */}
|
||||
<form className="flex items-center gap-2">
|
||||
<div className="relative max-w-sm flex-1">
|
||||
<Search className="absolute left-2.5 top-1/2 h-4 w-4 -translate-y-1/2 text-muted-foreground" />
|
||||
<Search className="text-muted-foreground absolute top-1/2 left-2.5 h-4 w-4 -translate-y-1/2" />
|
||||
<Input
|
||||
name="q"
|
||||
defaultValue={searchQuery}
|
||||
@@ -200,7 +203,7 @@ export default async function BookingsPage({ params, searchParams }: PageProps)
|
||||
<div className="rounded-md border">
|
||||
<table className="w-full text-sm">
|
||||
<thead>
|
||||
<tr className="border-b bg-muted/50">
|
||||
<tr className="bg-muted/50 border-b">
|
||||
<th className="p-3 text-left font-medium">Zimmer</th>
|
||||
<th className="p-3 text-left font-medium">Gast</th>
|
||||
<th className="p-3 text-left font-medium">Anreise</th>
|
||||
@@ -211,13 +214,19 @@ export default async function BookingsPage({ params, searchParams }: PageProps)
|
||||
</thead>
|
||||
<tbody>
|
||||
{bookingsData.map((booking) => {
|
||||
const room = booking.room as Record<string, string> | null;
|
||||
const guest = booking.guest as Record<string, string> | null;
|
||||
const room = booking.room as Record<
|
||||
string,
|
||||
string
|
||||
> | null;
|
||||
const guest = booking.guest as Record<
|
||||
string,
|
||||
string
|
||||
> | null;
|
||||
|
||||
return (
|
||||
<tr
|
||||
key={String(booking.id)}
|
||||
className="border-b hover:bg-muted/30"
|
||||
className="hover:bg-muted/30 border-b"
|
||||
>
|
||||
<td className="p-3">
|
||||
<Link
|
||||
@@ -235,18 +244,10 @@ export default async function BookingsPage({ params, searchParams }: PageProps)
|
||||
: '—'}
|
||||
</td>
|
||||
<td className="p-3">
|
||||
{booking.check_in
|
||||
? new Date(
|
||||
String(booking.check_in),
|
||||
).toLocaleDateString('de-DE')
|
||||
: '—'}
|
||||
{formatDate(booking.check_in)}
|
||||
</td>
|
||||
<td className="p-3">
|
||||
{booking.check_out
|
||||
? new Date(
|
||||
String(booking.check_out),
|
||||
).toLocaleDateString('de-DE')
|
||||
: '—'}
|
||||
{formatDate(booking.check_out)}
|
||||
</td>
|
||||
<td className="p-3">
|
||||
<Badge
|
||||
@@ -274,14 +275,12 @@ export default async function BookingsPage({ params, searchParams }: PageProps)
|
||||
{/* Pagination */}
|
||||
{totalPages > 1 && !searchQuery && (
|
||||
<div className="flex items-center justify-between border-t px-2 py-4">
|
||||
<p className="text-sm text-muted-foreground">
|
||||
<p className="text-muted-foreground text-sm">
|
||||
Seite {page} von {totalPages} ({total} Einträge)
|
||||
</p>
|
||||
<div className="flex items-center gap-2">
|
||||
{page > 1 ? (
|
||||
<Link
|
||||
href={`/home/${account}/bookings?page=${page - 1}`}
|
||||
>
|
||||
<Link href={`/home/${account}/bookings?page=${page - 1}`}>
|
||||
<Button variant="outline" size="sm">
|
||||
Zurück
|
||||
</Button>
|
||||
@@ -293,9 +292,7 @@ export default async function BookingsPage({ params, searchParams }: PageProps)
|
||||
)}
|
||||
|
||||
{page < totalPages ? (
|
||||
<Link
|
||||
href={`/home/${account}/bookings?page=${page + 1}`}
|
||||
>
|
||||
<Link href={`/home/${account}/bookings?page=${page + 1}`}>
|
||||
<Button variant="outline" size="sm">
|
||||
Weiter
|
||||
</Button>
|
||||
|
||||
@@ -1,15 +1,14 @@
|
||||
import { BedDouble, Plus } from 'lucide-react';
|
||||
|
||||
import { createBookingManagementApi } from '@kit/booking-management/api';
|
||||
import { getSupabaseServerClient } from '@kit/supabase/server-client';
|
||||
import { Badge } from '@kit/ui/badge';
|
||||
import { Button } from '@kit/ui/button';
|
||||
import { Card, CardContent, CardHeader, CardTitle } from '@kit/ui/card';
|
||||
|
||||
import { createBookingManagementApi } from '@kit/booking-management/api';
|
||||
|
||||
import { AccountNotFound } from '~/components/account-not-found';
|
||||
import { CmsPageShell } from '~/components/cms-page-shell';
|
||||
import { EmptyState } from '~/components/empty-state';
|
||||
import { AccountNotFound } from '~/components/account-not-found';
|
||||
|
||||
interface PageProps {
|
||||
params: Promise<{ account: string }>;
|
||||
@@ -63,26 +62,37 @@ export default async function RoomsPage({ params }: PageProps) {
|
||||
<div className="rounded-md border">
|
||||
<table className="w-full text-sm">
|
||||
<thead>
|
||||
<tr className="border-b bg-muted/50">
|
||||
<tr className="bg-muted/50 border-b">
|
||||
<th className="p-3 text-left font-medium">Zimmernr.</th>
|
||||
<th className="p-3 text-left font-medium">Name</th>
|
||||
<th className="p-3 text-left font-medium">Typ</th>
|
||||
<th className="p-3 text-right font-medium">Kapazität</th>
|
||||
<th className="p-3 text-right font-medium">Preis/Nacht</th>
|
||||
<th className="p-3 text-right font-medium">
|
||||
Preis/Nacht
|
||||
</th>
|
||||
<th className="p-3 text-center font-medium">Aktiv</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{rooms.map((room: Record<string, unknown>) => (
|
||||
<tr key={String(room.id)} className="border-b hover:bg-muted/30">
|
||||
<tr
|
||||
key={String(room.id)}
|
||||
className="hover:bg-muted/30 border-b"
|
||||
>
|
||||
<td className="p-3 font-mono text-xs">
|
||||
{String(room.room_number ?? '—')}
|
||||
</td>
|
||||
<td className="p-3 font-medium">{String(room.name ?? '—')}</td>
|
||||
<td className="p-3">
|
||||
<Badge variant="outline">{String(room.room_type ?? '—')}</Badge>
|
||||
<td className="p-3 font-medium">
|
||||
{String(room.name ?? '—')}
|
||||
</td>
|
||||
<td className="p-3">
|
||||
<Badge variant="outline">
|
||||
{String(room.room_type ?? '—')}
|
||||
</Badge>
|
||||
</td>
|
||||
<td className="p-3 text-right">
|
||||
{String(room.capacity ?? '—')}
|
||||
</td>
|
||||
<td className="p-3 text-right">{String(room.capacity ?? '—')}</td>
|
||||
<td className="p-3 text-right">
|
||||
{room.price_per_night != null
|
||||
? `${Number(room.price_per_night).toFixed(2)} €`
|
||||
|
||||
Reference in New Issue
Block a user