golomazov/hotelsync
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Apply 7 calendar/booking UI improvements

Browse Source 
1. Remove redundant "Шахматка бронирований" header from CalendarPage
2. Fix Saturday abbreviation: "су" → "сб" (use EEEEEE format)
3. Compact toggle: add "Вид" text label to button
4. Booking bars: check-in starts at 1/3 cell, check-out ends at 1/3 cell
5. BookingModal: move "Статус гостя" tags to left column
6. BookingDetailPanel: add scan button + print package in Docs tab
7. RentalBookingModal: add payment method + amount section

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
HotelSync
2026-03-16 14:48:06 +03:00
parent afe7445d7e
commit 2e7abc2b7a
6 changed files with 87 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
src/components/calendar/BookingCalendar.tsx
View File

@@ -98,15 +98,24 @@ export function BookingCalendar({ rooms, bookings, onBookingCreate, onBookingUpd
const getBlockStyle = (booking: Booking) => {
const start = parseISO(booking.checkIn)
const end = parseISO(booking.checkOut)
const end = parseISO(booking.checkOut)
const rawColStart = differenceInDays(start, startDate)
const rawColEnd = differenceInDays(end, startDate)
if (rawColStart >= visibleDays || rawColEnd <= 0) return null
const colStart = Math.max(0, differenceInDays(start, startDate))
const colEnd = Math.min(visibleDays, differenceInDays(end, startDate))
if (colStart >= visibleDays || colEnd <= 0) return null
const INSET = Math.round(CELL_WIDTH / 3)
const isClippedLeft = rawColStart < 0
const isClippedRight = rawColEnd > visibleDays
const colStart = Math.max(0, rawColStart)
const colEnd = Math.min(visibleDays, rawColEnd)
const leftPx = colStart * CELL_WIDTH + (isClippedLeft ? 0 : INSET)
const rightPx = colEnd * CELL_WIDTH + (isClippedRight ? 0 : INSET)
return {
left: colStart * CELL_WIDTH,
width: (colEnd - colStart) * CELL_WIDTH - 4,
left: leftPx + 2,
width: Math.max(8, rightPx - leftPx - 4),
}
}
@@ -245,9 +254,13 @@ export function BookingCalendar({ rooms, bookings, onBookingCreate, onBookingUpd
<button
onClick={() => setCompact(v => !v)}
title={compact ? 'Обычный вид' : 'Компактный вид'}
className={cn('btn-ghost p-2', compact && 'bg-brand-50 dark:bg-brand-900/20 text-brand-600 dark:text-brand-400')}
className={cn(
'btn-ghost flex items-center gap-1.5 px-2.5 py-1.5 text-xs font-medium',
compact && 'bg-brand-50 dark:bg-brand-900/20 text-brand-600 dark:text-brand-400',
)}
>
<AlignJustify size={16} />
<AlignJustify size={14} />
Вид
</button>
<button
@@ -295,7 +308,7 @@ export function BookingCalendar({ rooms, bookings, onBookingCreate, onBookingUpd
'text-xs font-medium',
isTod ? 'text-brand-600 dark:text-brand-400' : isWe ? 'text-slate-400' : 'text-slate-500 dark:text-slate-400',
)}>
{format(date, 'EEE', { locale: ru }).slice(0, 2)}
{format(date, 'EEEEEE', { locale: ru })}
</span>
<span className={cn(
'text-sm font-bold',