Initial commit - Car Rental Management System
This commit is contained in:
Innovator committed
commit
f72173377a
100 files changed
+15201
No files matched your search
@@ -0,0 +1,143 @@
|
||||
@extends('layouts.app')
|
||||
|
||||
@section('title', 'New Rental')
|
||||
|
||||
@section('content')
|
||||
<div class="mb-8">
|
||||
<a href="{{ route('rentals.index') }}" class="text-blue-600 hover:text-blue-800 flex items-center gap-2 mb-4">
|
||||
<i class="fas fa-arrow-left"></i> Back to Rentals
|
||||
</a>
|
||||
<h2 class="text-3xl font-bold text-gray-800">New Rental</h2>
|
||||
</div>
|
||||
|
||||
<div class="bg-white rounded-2xl shadow-sm border border-gray-200 p-8">
|
||||
<form action="{{ route('rentals.store') }}" method="POST" id="rentalForm">
|
||||
@csrf
|
||||
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700 mb-2">Car</label>
|
||||
<select name="car_id" id="carSelect" required class="w-full px-4 py-3 rounded-lg border border-gray-300 focus:outline-none focus:ring-2 focus:ring-amber-500">
|
||||
<option value="">Select a car</option>
|
||||
@foreach($cars as $car)
|
||||
<option value="{{ $car->id }}" data-daily-rate="{{ $car->daily_rate }}">{{ $car->brand }} {{ $car->model }} - BHD {{ $car->daily_rate }}/day</option>
|
||||
@endforeach
|
||||
</select>
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700 mb-2">Customer</label>
|
||||
<select name="customer_id" required class="w-full px-4 py-3 rounded-lg border border-gray-300 focus:outline-none focus:ring-2 focus:ring-amber-500">
|
||||
<option value="">Select a customer</option>
|
||||
@foreach($customers as $customer)
|
||||
<option value="{{ $customer->id }}">{{ $customer->name }}</option>
|
||||
@endforeach
|
||||
</select>
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700 mb-2">Rental Type</label>
|
||||
<select name="rental_type" id="rentalType" required class="w-full px-4 py-3 rounded-lg border border-gray-300 focus:outline-none focus:ring-2 focus:ring-amber-500">
|
||||
<option value="daily" data-days="1">Daily</option>
|
||||
<option value="weekly" data-days="7">Weekly</option>
|
||||
<option value="monthly" data-days="30">Monthly</option>
|
||||
<option value="lease" data-days="365">Lease (1 Year)</option>
|
||||
</select>
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700 mb-2">Start Date</label>
|
||||
<input type="date" name="start_date" id="startDate" required class="w-full px-4 py-3 rounded-lg border border-gray-300 focus:outline-none focus:ring-2 focus:ring-amber-500">
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700 mb-2">Pickup Time</label>
|
||||
<input type="time" name="pickup_time" id="pickupTime" class="w-full px-4 py-3 rounded-lg border border-gray-300 focus:outline-none focus:ring-2 focus:ring-amber-500">
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700 mb-2">End Date</label>
|
||||
<input type="date" name="end_date" id="endDate" required class="w-full px-4 py-3 rounded-lg border border-gray-300 focus:outline-none focus:ring-2 focus:ring-amber-500">
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700 mb-2">Return Time</label>
|
||||
<input type="time" name="return_time" id="returnTime" class="w-full px-4 py-3 rounded-lg border border-gray-300 focus:outline-none focus:ring-2 focus:ring-amber-500">
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700 mb-2">Total Amount (BHD)</label>
|
||||
<input type="number" name="total_amount" id="totalAmount" step="0.01" required class="w-full px-4 py-3 rounded-lg border border-gray-300 focus:outline-none focus:ring-2 focus:ring-amber-500" readonly>
|
||||
<p class="text-xs text-gray-500 mt-1" id="priceInfo">Select a car to see pricing</p>
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700 mb-2">Advance Payment (BHD)</label>
|
||||
<input type="number" name="advance_payment" id="advancePayment" step="0.01" value="0" class="w-full px-4 py-3 rounded-lg border border-gray-300 focus:outline-none focus:ring-2 focus:ring-amber-500">
|
||||
</div>
|
||||
<div class="md:col-span-2">
|
||||
<label class="block text-sm font-medium text-gray-700 mb-2">Notes</label>
|
||||
<textarea name="notes" rows="3" class="w-full px-4 py-3 rounded-lg border border-gray-300 focus:outline-none focus:ring-2 focus:ring-amber-500"></textarea>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mt-6">
|
||||
<button type="submit" class="bg-amber-600 text-white px-8 py-3 rounded-xl hover:bg-amber-700">Create Rental</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
const carSelect = document.getElementById('carSelect');
|
||||
const rentalType = document.getElementById('rentalType');
|
||||
const startDate = document.getElementById('startDate');
|
||||
const endDate = document.getElementById('endDate');
|
||||
const totalAmount = document.getElementById('totalAmount');
|
||||
const priceInfo = document.getElementById('priceInfo');
|
||||
const advancePayment = document.getElementById('advancePayment');
|
||||
|
||||
// Pricing multipliers for each rental type
|
||||
const pricing = {
|
||||
daily: 1,
|
||||
weekly: 0.9, // 10% discount
|
||||
monthly: 0.8, // 20% discount
|
||||
lease: 0.7 // 30% discount
|
||||
};
|
||||
|
||||
function calculatePrice() {
|
||||
const selectedOption = carSelect.options[carSelect.selectedIndex];
|
||||
const dailyRate = parseFloat(selectedOption.dataset.dailyRate) || 0;
|
||||
const rentalTypeOption = rentalType.options[rentalType.selectedIndex];
|
||||
const days = parseInt(rentalTypeOption.dataset.days) || 1;
|
||||
|
||||
if (!dailyRate || !days) {
|
||||
priceInfo.textContent = 'Select a car and rental type to see pricing';
|
||||
return;
|
||||
}
|
||||
|
||||
const multiplier = pricing[rentalType.value];
|
||||
let total = 0;
|
||||
let infoText = '';
|
||||
|
||||
if (rentalType.value === 'lease') {
|
||||
total = dailyRate * days * multiplier;
|
||||
infoText = `Lease (365 days) @ BHD ${dailyRate}/day with ${(1-multiplier)*100}% discount`;
|
||||
} else {
|
||||
// Calculate based on actual dates if available
|
||||
if (startDate.value && endDate.value) {
|
||||
const start = new Date(startDate.value);
|
||||
const end = new Date(endDate.value);
|
||||
const diffTime = Math.abs(end - start);
|
||||
const diffDays = Math.ceil(diffTime / (1000 * 60 * 60 * 24)) + 1;
|
||||
|
||||
total = dailyRate * diffDays * multiplier;
|
||||
infoText = `${diffDays} days @ BHD ${dailyRate}/day with ${(1-multiplier)*100}% discount`;
|
||||
} else {
|
||||
total = dailyRate * days * multiplier;
|
||||
infoText = `${days} days @ BHD ${dailyRate}/day with ${(1-multiplier)*100}% discount`;
|
||||
}
|
||||
}
|
||||
|
||||
totalAmount.value = total.toFixed(2);
|
||||
priceInfo.textContent = infoText;
|
||||
|
||||
// Auto-set advance payment to 50% of total
|
||||
advancePayment.value = (total * 0.5).toFixed(2);
|
||||
}
|
||||
|
||||
carSelect.addEventListener('change', calculatePrice);
|
||||
rentalType.addEventListener('change', calculatePrice);
|
||||
startDate.addEventListener('change', calculatePrice);
|
||||
endDate.addEventListener('change', calculatePrice);
|
||||
</script>
|
||||
@endsection
|
||||
Reference in new issue
Block a user