diff --git a/src/pages/BookingsPage.tsx b/src/pages/BookingsPage.tsx index 0aa532e..2340dd6 100644 --- a/src/pages/BookingsPage.tsx +++ b/src/pages/BookingsPage.tsx @@ -1,11 +1,11 @@ import { useState, useMemo, useEffect } from 'react' import { Search, Plus, ArrowUp, ArrowDown, ArrowUpDown, Clock, Pencil, Loader2 } from 'lucide-react' -import { RENTAL_OBJECTS, MOCK_RENTAL_BOOKINGS } from '../data/rentalData' import { useModules } from '../contexts/ModulesContext' import { useAuth } from '../contexts/AuthContext' import { api } from '../lib/api' +import type { RentalObjectApi, RentalBookingApi } from '../lib/api' import type { Booking, BookingStatus, Room } from '../types' -import type { RentalBooking } from '../data/rentalData' +import type { RentalObject, RentalBooking } from '../data/rentalData' import { RentalBookingModal } from '../components/rental/RentalBookingModal' import { cn, BOOKING_STATUS_BADGE, BOOKING_STATUS_LABELS, SOURCE_COLORS, SOURCE_LABELS, formatCurrency, nightsCount } from '../lib/utils' import { Badge } from '../components/ui/Badge' @@ -37,6 +37,31 @@ const COLUMNS: { key: SortKey | null; label: string }[] = [ type Tab = 'rooms' | 'rental' +function fromObjApi(o: RentalObjectApi): RentalObject { + return { + id: o.id, name: o.name, icon: o.icon, color: o.color, + textColor: o.textColor, pricePerHour: o.pricePerHour, pricePerDay: o.pricePerDay, + openHour: o.openHour, closeHour: o.closeHour, + maxHoursPerSlot: o.maxHoursPerSlot ?? undefined, + bufferMinutes: o.bufferMinutes ?? undefined, + } +} + +function fromBookingApi(b: RentalBookingApi): RentalBooking { + return { + id: b.id, objectId: b.objectId, date: (b.date as string).slice(0, 10), + isFullDay: b.isFullDay, startHour: b.startHour, endHour: b.endHour, + guestName: b.guestName, guestPhone: b.guestPhone ?? '', + linkedRoomId: b.linkedRoomId ?? undefined, + totalAmount: b.totalAmount, paidAmount: b.paidAmount, + status: b.status, notes: b.notes ?? undefined, + } +} + +function fmtMin(m: number) { + return `${Math.floor(m / 60).toString().padStart(2, '0')}:${(m % 60).toString().padStart(2, '0')}` +} + export function BookingsPage() { const { user } = useAuth() const slug = user?.hotelSlug ?? '' @@ -47,11 +72,12 @@ export function BookingsPage() { const [rooms, setRooms] = useState([]) const [bookings, setBookings] = useState([]) const [loading, setLoading] = useState(true) - const [rentalBookings, setRentalBookings] = useState(MOCK_RENTAL_BOOKINGS) + const [rentalObjects, setRentalObjects] = useState([]) + const [rentalBookings, setRentalBookings] = useState([]) const [newRentalStep, setNewRentalStep] = useState<'idle' | 'pick'>('idle') - const [rentalPickObj, setRentalPickObj] = useState(RENTAL_OBJECTS[0]?.id ?? '') + const [rentalPickObj, setRentalPickObj] = useState('') const [rentalPickDate, setRentalPickDate] = useState(format(new Date(), 'yyyy-MM-dd')) - const [showRentalModal, setShowRentalModal] = useState<{ obj: typeof RENTAL_OBJECTS[0]; date: string; editBooking?: RentalBooking } | null>(null) + const [showRentalModal, setShowRentalModal] = useState<{ obj: RentalObject; date: string; editBooking?: RentalBooking } | null>(null) const [search, setSearch] = useState('') const [statusFilter, setStatusFilter] = useState('all') const [selected, setSelected] = useState(null) @@ -61,8 +87,20 @@ export function BookingsPage() { useEffect(() => { if (!slug) return - Promise.all([api.rooms.list(slug), api.bookings.list(slug)]) - .then(([r, b]) => { setRooms(r); setBookings(b) }) + Promise.all([ + api.rooms.list(slug), + api.bookings.list(slug), + api.rental.listObjects(slug), + api.rental.listBookings(slug), + ]) + .then(([r, b, objs, rbks]) => { + setRooms(r) + setBookings(b) + const convertedObjs = objs.map(fromObjApi) + setRentalObjects(convertedObjs) + setRentalBookings(rbks.map(fromBookingApi)) + setRentalPickObj(convertedObjs[0]?.id ?? '') + }) .catch(console.error) .finally(() => setLoading(false)) }, [slug]) @@ -103,7 +141,7 @@ export function BookingsPage() { }) const room = (id: string) => rooms.find(r => r.id === id) - const rentalObj = (id: string) => RENTAL_OBJECTS.find(o => o.id === id) + const rentalObj = (id: string) => rentalObjects.find(o => o.id === id) const handleCreateBooking = async (data: Partial) => { try { @@ -384,7 +422,7 @@ export function BookingsPage() { {b.isFullDay ? Весь день - : `${b.startHour}:00 – ${b.endHour}:00` + : `${fmtMin(b.startHour)} – ${fmtMin(b.endHour)}` } @@ -459,7 +497,7 @@ export function BookingsPage() {
@@ -473,7 +511,7 @@ export function BookingsPage() {