{{ slide.caption }}

{{ settings.page_tagline || 'Dominance Starts On The Court.' }}

Select date & available hours, choose your payment option, and secure your court.

How It Works

Four simple steps to reserve your court.

1

Select Court

Pick your preferred pickleball court from our available facilities.

2

Pick Date & Time

Choose available start and end hours for your playing session.

3

Choose Payment

Pay online instantly with GCASH/BANK QR or select Pay After Game.

4

Play Court Game

Receive instant confirmation and step onto the court!

Our Top-tier Courts

Choose from our top-tier indoor and outdoor courts.

No Image
₱{{ formatAmount(c.hourly_rate) }}/hr

{{ c.name }}

{{ c.description || 'Professional pro-level surfaces and LED court illuminations.' }}

Reserve Court Slot

Pick a date and choose an available time slot below.

Court Image Original View
{{ selectedCourtName }} — Photo {{ courtCarouselIndex + 1 }} of {{ selectedCourtImages.length }}
₱{{ formatAmount(selectedCourt.hourly_rate) }} / hour

About {{ selectedCourtName }}

{{ selectedCourtDescription }}

Selected: {{ formatDateMDY(bookingForm.booking_date) }} ⚠️ Selected date is fully booked! Please select another date.
8. Payment Timing Choice
GCASH/BANK QR Code
Scan GCASH/BANK QR Code
GCASH/BANK Name: {{ settings.gcash_name }}
Account Number: {{ settings.gcash_number }}
Scan the QR code above and pay the total amount. Once paid, upload a screenshot/photo of your payment receipt in the field below.
Payment Receipt Preview
Total Calculated Fee: {{ calculatedHours }} {{ calculatedHours === 1 ? 'Hour' : 'Hours' }} Selected
₱{{ formatAmount(bookingForm.amount) }} PHP

Booking Verifier

You can check the status of your booking here.

{{ verifierError }}
Booking Reference: {{ verifierBooking.booking_ref || verifierBooking.id }}
Court {{ verifierBooking.court_name }}
Booking Date {{ formatDateMDY(verifierBooking.booking_date) }}
Time {{ formatTime12(verifierBooking.start_time) }} - {{ formatTime12(verifierBooking.end_time) }}
Amount ₱{{ formatAmount(verifierBooking.amount) }}
Player Name {{ verifierBooking.customer_name }}
Contact Phone {{ verifierBooking.customer_phone }}
Payment Ref {{ verifierBooking.payment_ref }}
Status: {{ verifierBooking.status }}

This booking can no longer be cancelled.

Portal Login

Staff/Admin Only

📊 Performance Analytics

Weekly performance metrics (Monday to Sunday) based on current week data.

Weekly Revenue (₱ PHP)

Weekly Bookings Count

Weekly Courts Usage

Management Terminal

Review schedule, manage courts, carousel, staff, and approve bookings.

Metric Filter:
Start (MM/DD/YYYY):
End (MM/DD/YYYY):
Total Revenue ₱{{ formatAmount(filteredStats.revenue) }} Range: {{ analyticsRange.replace('_', ' ') }}
💰
Total Bookings {{ filteredStats.bookingsCount }} Range: {{ analyticsRange.replace('_', ' ') }}
📅
Total Players {{ filteredStats.players }} Range: {{ analyticsRange.replace('_', ' ') }}
👥

Court Availability - {{ formatDateMDY(courtGridDate) }}

Available Pending Approved Completed Maintenance Private Event Past

Courts on the left, hours across the top. Click an open slot to start a booking for that court and time. Admins can click a maintenance or private event slot to remove the block.

No active courts to display.
{{ formatHour12(h).replace(':00', '').replace(' ', '') }}
{{ row.court.name }}
🚧 🎉
{{ courtGridTooltip.cell.blockType ? (courtGridTooltip.cell.blockType === 'private_event' ? '🎉 Private Event' : '🚧 Maintenance') : courtGridTooltip.cell.booking.customer_name }}
{{ courtGridTooltip.cell.booking.customer_name }}
{{ formatTime12(courtGridTooltip.cell.booking.start_time) }} - {{ formatTime12(courtGridTooltip.cell.booking.end_time) }}
Status: {{ courtGridTooltip.cell.status }}
Ref #: {{ courtGridTooltip.cell.booking.booking_ref || courtGridTooltip.cell.booking.id }}
₱{{ formatAmount(courtGridTooltip.cell.booking.amount) }}
{{ courtGridTooltip.cell.blockType ? (auth.user.role === 'admin' ? (courtGridTooltip.cell.blockType === 'maintenance' ? 'Click to remove this block' : 'Click for full details') : '') : 'Click for full details' }}

Schedule Calendar - {{ calendarMonthName }}

Pending Approved Completed Declined
Sun
Mon
Tue
Wed
Thu
Fri
Sat
{{ day.dayNum }} PAST FULL
{{ b.court_name }} {{ formatTime12(b.start_time) }} - {{ formatTime12(b.end_time) }} {{ b.customer_name }}

Reservations Approval & List

Search and update player booking statuses below.

Table Filter:
Start (MM/DD/YYYY):
End (MM/DD/YYYY):
Booking Ref # Date & Time Court Player Info Amount Created At Updated By Status Action
No matching reservation records found.
{{ b.booking_ref || b.id }}
{{ formatDateMDY(b.booking_date) }}
{{ formatTime12(b.start_time) }} - {{ formatTime12(b.end_time) }}
{{ b.court_name }}
🚧 Maintenance 🎉 Private Event {{ b.customer_name }}
{{ b.customer_email || 'N/A' }} | {{ b.customer_phone }}
₱{{ formatAmount(b.amount) }} {{ b.created_at ? formatDateTime12(b.created_at) : 'N/A' }} {{ b.processed_by || 'System' }} {{ b.status }}
Booking Successful!
You're ready to play! See you on the court.

Booking Ticket

{{ settings.page_title || 'HARD COURTS RESERVATION SYSTEM' }} Confirmation

📌 Notice: You need to take a screenshot of this ticket to present at the court.
Booking Reference: {{ receiptModalBooking.booking_ref || receiptModalBooking.id }}
Court {{ receiptModalBooking.court_name }}
Booking Date {{ formatDateMDY(receiptModalBooking.booking_date) }}
Time Slot {{ formatTime12(receiptModalBooking.start_time) }} - {{ formatTime12(receiptModalBooking.end_time) }}
Status {{ receiptModalBooking.status }}
Player Name: {{ receiptModalBooking.customer_name }}
Email: {{ receiptModalBooking.customer_email }}
Phone: {{ receiptModalBooking.customer_phone }}
Payment Receipt Payment Receipt
{{ receiptModalBooking.status === 'completed' ? 'Total Amount Paid:' : (receiptModalBooking.payment_ref === 'PAY_AFTER_GAME' ? 'Total Amount Due:' : 'Total Amount Paid:') }} ₱{{ formatAmount(receiptModalBooking.amount) }} PHP

Edit End Time

Booking Ref: {{ editEndTimeModal.booking_ref || editEndTimeModal.id }}

Court: {{ editEndTimeModal.court_name }}
Date: {{ formatDateMDY(editEndTimeModal.booking_date) }}
Start Time: {{ formatTime12(editEndTimeModal.start_time) }}
Current End Time: {{ formatTime12(editEndTimeModal.end_time) }}
New Total Amount: ₱{{ formatAmount(editEndTimeCalculatedAmount) }} PHP

System Activity & Audit Logs

Tracks all administrative user actions.

ID User Role Action Details Timestamp
No activity logs recorded yet.
#{{ log.id }} {{ log.user_name }} {{ log.user_role }} {{ log.action }} {{ log.details || '—' }} {{ formatDateMDY(log.created_at) }}

{{ auth.user.role === 'staff' ? 'My Account Details' : 'Staff & Admin Account Management' }}

{{ userForm.id ? 'Edit User Account' : 'Add New Staff / Admin' }}

ℹ️ Select your own individual account record row below to update your authentic credential properties.

{{ auth.user.role === 'staff' ? 'Your Personal Account Record' : 'Existing System Users' }}

{{ u.name }}
{{ u.email }}
{{ u.role }}

Court Management & Settings

Reserve Court Form Time Settings

{{ courtForm.id ? 'Edit Court Facility' : 'Add New Court Facility' }}

⚠️ Staff cannot edit hourly rate
Uploaded Images (Click ✕ to remove photo):
Court Image Preview

Existing Courts

Court item picture
No Image
{{ c.name }}
₱{{ formatAmount(c.hourly_rate) }}/hr
{{ getCourtImageArray(c.image_url).length }} photo(s)

🚧 Block A Court

Duration: {{ blockCalculatedHours }} hour{{ blockCalculatedHours === 1 ? '' : 's' }} selected
Auto-calculated from the court's hourly rate × hours booked — feel free to adjust for a discount.

Bookings on {{ formatDateMDY(selectedDayModal.dateStr) }}

No active bookings on this date.
{{ b.court_name }} {{ b.status }}
{{ formatTime12(b.start_time) }} - {{ formatTime12(b.end_time) }}
Player: {{ b.customer_name }} ({{ b.customer_phone }})
Booking Ref #: {{ b.booking_ref || b.id }}
₱{{ formatAmount(b.amount) }}
⚠️ Past dates cannot be reserved.

System Settings & Carousel

General System Settings

Adjusts readability text scaling across system screens.
GCash QR preview
System logo preview

Dynamic Landing Carousel Slides

Slide preview
Slide preview
{{ slide.caption || 'No Caption' }}
ID: #{{ slide.id }}