118 lines
4.7 KiB
PHP
118 lines
4.7 KiB
PHP
<?php
|
|
// index.php
|
|
require_once 'includes/auth.php';
|
|
require_once 'includes/header.php';
|
|
global $pdo;
|
|
|
|
// Fetch Featured Cars
|
|
try {
|
|
$stmt = $pdo->query("SELECT * FROM cars WHERE is_featured = 1 LIMIT 6");
|
|
$featured_cars = $stmt->fetchAll();
|
|
|
|
// Fetch branches for selector
|
|
$branches = $pdo->query("SELECT * FROM branches")->fetchAll();
|
|
} catch (Exception $e) {
|
|
$featured_cars = [];
|
|
$branches = [];
|
|
}
|
|
?>
|
|
|
|
<!-- Hero Section -->
|
|
<section class="hero">
|
|
<div class="container">
|
|
<h1>Find Your Dream Car</h1>
|
|
<p>Premium Vehicles. Flexible Installments. Nationwide Service.</p>
|
|
<a href="marketplace.php" class="btn">Browse Inventory</a>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Installment Calculator Section -->
|
|
<section class="container mt-5">
|
|
<h2 class="text-center">Installment Calculator</h2>
|
|
<div class="calculator">
|
|
<div class="grid" style="grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));">
|
|
<div class="form-group">
|
|
<label>Car Price ($)</label>
|
|
<input type="number" id="calcPrice" class="form-control" placeholder="30000" value="30000">
|
|
</div>
|
|
<div class="form-group">
|
|
<label>Down Payment ($)</label>
|
|
<input type="number" id="calcDown" class="form-control" placeholder="5000" value="5000">
|
|
</div>
|
|
<div class="form-group">
|
|
<label>Loan Term</label>
|
|
<select id="calcMonths" class="form-control">
|
|
<option value="12">12 Months</option>
|
|
<option value="24" selected>24 Months</option>
|
|
<option value="36">36 Months</option>
|
|
<option value="48">48 Months</option>
|
|
</select>
|
|
</div>
|
|
<div class="form-group" style="display: flex; align-items: flex-end;">
|
|
<button onclick="calculateInstallment()" class="btn" style="width: 100%;">Calculate</button>
|
|
</div>
|
|
</div>
|
|
<div id="calcResult" class="mt-5 text-center" style="font-size: 1.5rem; font-weight: bold; color: var(--primary);">
|
|
Monthly Payment: $1,145.83
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Featured Cars -->
|
|
<section class="container mt-5">
|
|
<h2 class="text-center mb-5">Featured Vehicles</h2>
|
|
<div class="grid">
|
|
<?php foreach ($featured_cars as $car): ?>
|
|
<div class="card">
|
|
<img src="<?= htmlspecialchars($car['image_path'] ?? $car['image_url'] ?? '') ?>" alt="<?= htmlspecialchars($car['brand']) ?>">
|
|
<div class="card-body">
|
|
<h3 class="card-title"><?= htmlspecialchars($car['brand'] . ' ' . $car['model']) ?></h3>
|
|
<div class="card-price">$<?= number_format((float)$car['price']) ?></div>
|
|
<div class="card-meta">
|
|
<span><?= $car['year'] ?></span> •
|
|
<span><?= number_format((float)$car['mileage']) ?> km</span>
|
|
</div>
|
|
<div class="card-actions">
|
|
<a href="car_detail.php?id=<?= $car['id'] ?>" class="btn btn-outline" style="width:100%">View Details</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<?php endforeach; ?>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Branch Selector -->
|
|
<section class="container mt-5 mb-5">
|
|
<h2 class="text-center mb-5">Visit Our Branches</h2>
|
|
<div class="grid" style="grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));">
|
|
<?php foreach ($branches as $branch): ?>
|
|
<div class="card" style="padding: 20px; text-align: center;">
|
|
<h3 style="color: var(--primary); margin-bottom: 10px;"><?= htmlspecialchars($branch['city']) ?></h3>
|
|
<p style="margin-bottom: 5px;"><?= htmlspecialchars($branch['name']) ?></p>
|
|
<p style="color: #aaa;"><?= htmlspecialchars($branch['phone']) ?></p>
|
|
<a href="contact.php?branch=<?= $branch['id'] ?>" class="btn-outline" style="margin-top: 15px; display: inline-block;">View Map</a>
|
|
</div>
|
|
<?php endforeach; ?>
|
|
</div>
|
|
</section>
|
|
|
|
<script>
|
|
function calculateInstallment() {
|
|
const price = parseFloat(document.getElementById('calcPrice').value);
|
|
const down = parseFloat(document.getElementById('calcDown').value);
|
|
const months = parseInt(document.getElementById('calcMonths').value);
|
|
|
|
if (price && months) {
|
|
const principal = price - (down || 0);
|
|
const interestRate = 0.05; // 5% flat rate
|
|
const total = principal * (1 + interestRate);
|
|
const monthly = total / months;
|
|
|
|
document.getElementById('calcResult').innerText =
|
|
`Monthly Payment: $${monthly.toFixed(2)}`;
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<?php require_once 'includes/footer.php'; ?>
|