Overview
AutoLog’s Reservations module allows you to schedule future vehicle use, prevent booking conflicts, and manage reservation lifecycles. The system uses a visual calendar interface powered by FullCalendar for intuitive booking management.Reservation Calendar
Calendar View
The reservation system presents a monthly calendar view showing:- Current month: Default view on page load
- Color-coded events: Visual status indicators
- Date cells: Clickable for new reservations
- Existing reservations: Displayed as colored blocks
Event Colors
Reservation colors indicate status at a glance:
- Green (#4caf50): Active reservation
- Red (#e53935): Canceled
- Gray (#757575): Completed/Finished
Navigation
Use the calendar controls to:- Previous/Next month: Arrow buttons
- Today: Jump to current date
- Month selector: Quick navigation to any month
Creating a Reservation
Click-to-Create
Select Date Range
Click and drag on the calendar to select:
- Start date: Beginning of reservation
- End date: When vehicle must be returned
You cannot select dates in the past. Past dates are disabled automatically.
Reservation Modal Opens
A form appears with:
- Pre-filled start and end dates/times
- Default times: 8:00 AM start, 5:00 PM end
- Vehicle selector
- Employee selector
- Purpose/reason field
Fill Reservation Details
Required information:Vehicle:
- Select from available vehicles
- Only vehicles not already reserved for those dates are shown
- Choose who will use the vehicle
- Can search by name
- Describe the reason for the reservation
- Examples: “Client visit”, “Site inspection”, “Delivery”
- Adjust if needed
- End time must be after start time
Viewing Reservation Details
Single-Click vs Double-Click
- Single-click: Prevents accidental actions, no effect
- Double-click: Opens the reservation details/edit modal
Reservation Information
When you double-click a reservation, you’ll see:- Vehicle: License plate, make, model
- Employee: Full name and employee details
- Purpose: Reason for reservation
- Start date/time: When reservation begins
- End date/time: When vehicle must be returned
- Status: Current state (Active, Canceled, Finished)
- Created by: Who made the reservation
- Created at: When reservation was made
Editing Reservations
Modifying Details
Edit Fields
You can modify:
- Vehicle (if no other conflicts)
- Employee assigned
- Purpose/reason
- Date and time range
- Status
Some fields may be locked based on reservation status. For example, you cannot change the vehicle of a completed reservation.
Status Changes
You can change reservation status to: Active- Default status for new reservations
- Vehicle is reserved for the specified period
- Use when reservation is no longer needed
- Frees up the vehicle for other reservations
- Original details are preserved for record-keeping
- Marks reservation as completed
- Automatically set when end time passes (if configured)
- Vehicle becomes available again
Canceling Reservations
Canceled reservations remain visible on the calendar but are visually distinguished by their red color.
Conflict Prevention
Automatic Validation
AutoLog prevents double-booking by:- Real-time availability check: When selecting a vehicle
- Date overlap detection: Ensures no conflicts with existing reservations
- Status consideration: Only active reservations block availability
Conflict Resolution
If you encounter a conflict: Option 1: Choose Different Vehicle- Select another available vehicle from the list
- Only vehicles without conflicts are shown
- Modify start or end time to avoid overlap
- Even a 1-minute gap resolves the conflict
- If you have permission, cancel the blocking reservation
- Then create your new reservation
Searching Reservations
While the calendar provides visual browsing, you can also:- Filter by vehicle: See all reservations for a specific vehicle
- Filter by employee: View an employee’s schedule
- Date range filter: Focus on specific time periods
Advanced filtering may require administrator access or custom configuration.
Notification System
Automatic Notifications
Depending on your configuration, AutoLog can send: Reservation Confirmation- Sent to: Assigned employee
- When: Reservation is created
- Contains: Vehicle details, dates, purpose
- Sent to: Assigned employee
- When: Before reservation start time
- Contains: Pickup instructions
- Sent to: Assigned employee
- When: Before or at end time
- Contains: Return instructions
- Sent to: Assigned employee (if notified)
- When: Reservation is canceled
- Contains: Cancellation details
Reservation vs Check-Out
Key Differences
| Aspect | Reservation | Check-Out |
|---|---|---|
| Timing | Future use | Immediate use |
| Purpose | Planning | Actual vehicle assignment |
| Required | Optional | Yes (for tracking) |
| Blocks vehicle | Yes | Yes |
| Creates registration | No | Yes |
Workflow Integration
Typical flow:- Reservation made: Schedule vehicle for next week
- Reservation active: Vehicle blocked on calendar
- Check-out: Employee picks up vehicle at scheduled time
- Check-in: Employee returns vehicle
- Reservation finished: Marked complete automatically
Reservations and check-outs are separate systems. A reservation doesn’t automatically create a registration—the employee still needs to check out the vehicle using the normal process or QR code.
Permissions and Access
Required Permissions
Reservation operations require specific permissions:- View Reservations: See the calendar and events
- Create Reservations: Add new bookings
- Edit Reservations: Modify existing reservations
- Cancel Reservations: Change status to canceled
- Manage Reservations: Full administrative control
Self-Service Restrictions
Some organizations restrict employees to:- Only view their own reservations
- Create reservations requiring supervisor approval
- Limited date ranges (e.g., max 30 days ahead)
Contact your administrator if you need different reservation permissions.
Mobile Access
The reservation calendar is mobile-responsive:- Touch-enabled date selection
- Optimized modal forms
- Swipe navigation between months
- Readable event labels on small screens
- Use landscape orientation for better calendar view
- Tap and hold to select date ranges
- Double-tap events to open details
Best Practices
Planning Ahead
Reservation Planning Tips
Reservation Planning Tips
- Book early: Reserve popular vehicles well in advance
- Add buffer time: Include travel time to/from vehicle location
- Be specific: Clear purpose helps others understand vehicle needs
- Check availability: Review calendar before committing to client meetings
- Update promptly: Cancel or modify if plans change
Team Coordination
- Use descriptive purposes (“Client: Acme Corp visit” vs just “Meeting”)
- Book only what you need—don’t reserve “just in case”
- Check with colleagues before canceling their reservations
- Communicate via chat/email if you need priority access
Administrative Management
- Regularly review and clean up old reservations
- Set organizational policies for booking lead time
- Configure automated status transitions
- Monitor reservation vs actual usage patterns
Troubleshooting
Cannot Create Reservation
Problem: Form won’t submit or shows error Solutions:- Verify all required fields are filled
- Check date/time logic (end after start)
- Ensure selected vehicle is available
- Confirm you have permission to create reservations
- Try refreshing the page
Reservation Not Appearing on Calendar
Problem: Created reservation but don’t see it Solutions:- Refresh the calendar view
- Check you’re viewing the correct month
- Verify reservation wasn’t automatically canceled
- Look for the event in a different week/month
- Check browser console for errors
Vehicle Shows as Unavailable
Problem: Cannot select vehicle even though calendar looks clear Solutions:- Check for overlapping reservations (zoom in on dates)
- Verify vehicle isn’t marked as inactive/maintenance
- Confirm vehicle exists and you have permission to reserve it
- Try selecting a different date range to isolate the conflict
Technical Reference
Source Files:- Main component:
src/pages/Register/Reservas.jsx - Modal:
src/components/ReservaModal/ReservaModal.jsx - Services:
src/services/ReservaServices.js
getReservas(): Fetch all reservations (line 23)handleSelect(info): Date range selection handler (line 66)handleEventDoubleClick(info): Open reservation details (line 90)
- FullCalendar React (dayGrid + interaction plugins)
- Date handling and validation
- Event rendering customization (line 123-136)