WallyHackenslacker/mainty
1
0
Fork 0
mirror of https://github.com/michaelstaake/mainty.git synced 2026-04-16 11:30:13 +00:00
Code Issues Packages Projects Releases Wiki Activity

Initial version upload

Browse Source
This commit is contained in:
Michael Staake
2025-11-03 11:04:46 -08:00
parent 8a3c48b98a
commit 0083f20e8c
26 changed files with 2281 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

114
views/export.php Normal file
View File

@@ -0,0 +1,114 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title><?php echo htmlspecialchars($vehicle['name']); ?> - Maintenance Export</title>
<script src="https://cdn.tailwindcss.com"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.1/font/bootstrap-icons.css">
</head>
<body class="bg-white p-8">
<div class="max-w-4xl mx-auto">
<div class="text-center mb-8">
<h1 class="text-3xl font-bold text-gray-800 mb-2"><?php echo APP_NAME; ?></h1>
<h2 class="text-xl text-gray-600">Vehicle Maintenance Export</h2>
</div>
<!-- Vehicle Information -->
<div class="bg-gray-50 rounded-lg p-6 mb-8">
<h3 class="text-xl font-semibold text-gray-800 mb-4">Vehicle Information</h3>
<div class="grid grid-cols-2 gap-4">
<div>
<span class="font-medium text-gray-700">Name:</span>
<span class="text-gray-600"><?php echo htmlspecialchars($vehicle['name']); ?></span>
</div>
<?php if ($vehicle['year']): ?>
<div>
<span class="font-medium text-gray-700">Year:</span>
<span class="text-gray-600"><?php echo htmlspecialchars($vehicle['year']); ?></span>
</div>
<?php endif; ?>
<?php if ($vehicle['make']): ?>
<div>
<span class="font-medium text-gray-700">Make:</span>
<span class="text-gray-600"><?php echo htmlspecialchars($vehicle['make']); ?></span>
</div>
<?php endif; ?>
<?php if ($vehicle['model']): ?>
<div>
<span class="font-medium text-gray-700">Model:</span>
<span class="text-gray-600"><?php echo htmlspecialchars($vehicle['model']); ?></span>
</div>
<?php endif; ?>
<?php if ($vehicle['color']): ?>
<div>
<span class="font-medium text-gray-700">Color:</span>
<span class="text-gray-600"><?php echo htmlspecialchars($vehicle['color']); ?></span>
</div>
<?php endif; ?>
<?php if ($vehicle['license_plate']): ?>
<div>
<span class="font-medium text-gray-700">License Plate:</span>
<span class="text-gray-600"><?php echo htmlspecialchars($vehicle['license_plate']); ?></span>
</div>
<?php endif; ?>
</div>
</div>
<!-- Maintenance History -->
<div>
<h3 class="text-xl font-semibold text-gray-800 mb-4">Maintenance History</h3>
<?php if (empty($maintenanceItems)): ?>
<p class="text-gray-500 text-center py-8">No maintenance records available.</p>
<?php else: ?>
<div class="space-y-4">
<?php foreach ($maintenanceItems as $item): ?>
<div class="border border-gray-300 rounded-lg p-4">
<div class="flex justify-between items-start mb-2">
<h4 class="text-lg font-semibold text-gray-800"><?php echo htmlspecialchars($item['name']); ?></h4>
<?php if ($item['cost']): ?>
<span class="bg-green-100 text-green-800 px-3 py-1 rounded">
$<?php echo number_format($item['cost'], 2); ?>
</span>
<?php endif; ?>
</div>
<div class="grid grid-cols-2 md:grid-cols-4 gap-2 text-sm text-gray-600 mb-2">
<div>
<strong>Date:</strong> <?php echo date('M d, Y', strtotime($item['date'])); ?>
</div>
<div>
<strong>Mileage:</strong> <?php echo number_format($item['mileage']); ?> miles
</div>
<?php if ($item['performed_by']): ?>
<div>
<strong>Performed By:</strong> <?php echo htmlspecialchars($item['performed_by']); ?>
</div>
<?php endif; ?>
<?php if ($item['parts_list']): ?>
<div>
<strong>Parts:</strong> <?php echo htmlspecialchars($item['parts_list']); ?>
</div>
<?php endif; ?>
</div>
<?php if ($item['description']): ?>
<div class="mt-2 text-sm text-gray-600">
<strong>Description:</strong><br>
<?php echo nl2br(htmlspecialchars($item['description'])); ?>
</div>
<?php endif; ?>
</div>
<?php endforeach; ?>
</div>
<?php endif; ?>
</div>
<div class="mt-8 text-center text-sm text-gray-500">
<p>Exported on <?php echo date('F j, Y \a\t g:i A'); ?></p>
<p>Generated by <?php echo APP_NAME; ?></p>
</div>
</div>
</body>
</html>

210
views/index.php Normal file
View File

@@ -0,0 +1,210 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title><?php echo APP_NAME; ?> - Vehicles</title>
<script src="https://cdn.tailwindcss.com"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.1/font/bootstrap-icons.css">
</head>
<body class="bg-gray-100 min-h-screen">
<!-- Header -->
<header class="bg-white shadow-sm">
<div class="max-w-7xl mx-auto px-4 py-4 flex justify-between items-center">
<a href="<?php echo url('/home'); ?>" class="text-2xl font-bold text-gray-800 hover:text-gray-600 transition"><?php echo APP_NAME; ?></a>
<div class="flex items-center space-x-4">
<a href="<?php echo url('/settings'); ?>" class="text-gray-600 hover:text-gray-800">
<i class="bi bi-gear-fill text-2xl"></i>
</a>
</div>
</div>
</header>
<main class="max-w-7xl mx-auto px-4 py-8">
<?php if (isset($_SESSION['error'])): ?>
<div class="bg-red-100 border border-red-400 text-red-700 px-4 py-3 rounded mb-4">
<?php echo htmlspecialchars($_SESSION['error']); unset($_SESSION['error']); ?>
</div>
<?php endif; ?>
<?php if (isset($_SESSION['success'])): ?>
<div class="bg-green-100 border border-green-400 text-green-700 px-4 py-3 rounded mb-4">
<?php echo htmlspecialchars($_SESSION['success']); unset($_SESSION['success']); ?>
</div>
<?php endif; ?>
<!-- Header with view toggle and add button -->
<div class="flex justify-between items-center mb-6">
<h2 class="text-xl font-semibold text-gray-700">My Vehicles</h2>
<div class="flex items-center space-x-3">
<div class="flex bg-white rounded-lg shadow-sm">
<a href="<?php echo url('/home?view=grid'); ?>"
class="px-3 py-2 <?php echo $viewMode === 'grid' ? 'bg-blue-600 text-white' : 'text-gray-600 hover:bg-gray-100'; ?> rounded-l-lg transition">
<i class="bi bi-grid-3x3-gap-fill"></i>
</a>
<a href="<?php echo url('/home?view=list'); ?>"
class="px-3 py-2 <?php echo $viewMode === 'list' ? 'bg-blue-600 text-white' : 'text-gray-600 hover:bg-gray-100'; ?> rounded-r-lg transition">
<i class="bi bi-list-ul"></i>
</a>
</div>
<button onclick="showAddVehicleModal()"
class="bg-blue-600 hover:bg-blue-700 text-white px-4 py-2 rounded-lg flex items-center space-x-2 transition">
<i class="bi bi-plus-lg"></i>
<span>Add Vehicle</span>
</button>
</div>
</div>
<!-- Vehicles Display -->
<?php if (empty($vehicles)): ?>
<div class="bg-white rounded-lg shadow-sm p-12 text-center">
<i class="bi bi-car-front text-6xl text-gray-300 mb-4"></i>
<h3 class="text-xl font-semibold text-gray-700 mb-2">No vehicles yet</h3>
<p class="text-gray-500 mb-4">Get started by adding your first vehicle</p>
<button onclick="showAddVehicleModal()"
class="bg-blue-600 hover:bg-blue-700 text-white px-6 py-2 rounded-lg transition">
Add Your First Vehicle
</button>
</div>
<?php else: ?>
<?php if ($viewMode === 'grid'): ?>
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
<?php foreach ($vehicles as $vehicle): ?>
<a href="<?php echo url('/vehicles/' . $vehicle['id']); ?>"
class="bg-white rounded-lg shadow-sm hover:shadow-md transition p-6 block">
<div class="flex items-start justify-between mb-3">
<div class="bg-blue-100 p-3 rounded-lg">
<i class="bi bi-car-front-fill text-blue-600 text-2xl"></i>
</div>
<span class="text-sm text-gray-500"><?php echo $vehicle['maintenance_count']; ?> records</span>
</div>
<h3 class="text-lg font-semibold text-gray-800 mb-2"><?php echo htmlspecialchars($vehicle['name']); ?></h3>
<div class="space-y-1 text-sm text-gray-600">
<?php if ($vehicle['year'] || $vehicle['make'] || $vehicle['model']): ?>
<p><?php echo implode(' ', array_filter([$vehicle['year'], $vehicle['make'], $vehicle['model']])); ?></p>
<?php endif; ?>
<?php if ($vehicle['license_plate']): ?>
<p><i class="bi bi-credit-card-2-front"></i> <?php echo htmlspecialchars($vehicle['license_plate']); ?></p>
<?php endif; ?>
<?php if ($vehicle['last_maintenance_date']): ?>
<p class="text-xs text-gray-500 mt-2">Last service: <?php echo date('M d, Y', strtotime($vehicle['last_maintenance_date'])); ?></p>
<?php endif; ?>
</div>
</a>
<?php endforeach; ?>
</div>
<?php else: ?>
<div class="bg-white rounded-lg shadow-sm overflow-hidden">
<table class="w-full">
<thead class="bg-gray-50 border-b">
<tr>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Vehicle</th>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Details</th>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">License Plate</th>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Records</th>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Last Service</th>
</tr>
</thead>
<tbody class="divide-y divide-gray-200">
<?php foreach ($vehicles as $vehicle): ?>
<tr class="hover:bg-gray-50 cursor-pointer" onclick="window.location='<?php echo url('/vehicles/' . $vehicle['id']); ?>'">
<td class="px-6 py-4 whitespace-nowrap">
<div class="flex items-center">
<div class="bg-blue-100 p-2 rounded">
<i class="bi bi-car-front-fill text-blue-600"></i>
</div>
<div class="ml-3">
<div class="text-sm font-medium text-gray-900"><?php echo htmlspecialchars($vehicle['name']); ?></div>
</div>
</div>
</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-600">
<?php echo implode(' ', array_filter([$vehicle['year'], $vehicle['make'], $vehicle['model']])) ?: '-'; ?>
</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-600">
<?php echo htmlspecialchars($vehicle['license_plate']) ?: '-'; ?>
</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-600">
<?php echo $vehicle['maintenance_count']; ?>
</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-600">
<?php echo $vehicle['last_maintenance_date'] ? date('M d, Y', strtotime($vehicle['last_maintenance_date'])) : '-'; ?>
</td>
</tr>
<?php endforeach; ?>
</tbody>
</table>
</div>
<?php endif; ?>
<?php endif; ?>
</main>
<!-- Add Vehicle Modal -->
<div id="addVehicleModal" class="hidden fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50">
<div class="bg-white rounded-lg p-6 w-full max-w-md">
<div class="flex justify-between items-center mb-4">
<h3 class="text-xl font-semibold">Add New Vehicle</h3>
<button onclick="hideAddVehicleModal()" class="text-gray-500 hover:text-gray-700">
<i class="bi bi-x-lg"></i>
</button>
</div>
<form method="POST" action="<?php echo url('/vehicles/add'); ?>">
<div class="space-y-4">
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">Name *</label>
<input type="text" name="name" required
class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500">
</div>
<div class="grid grid-cols-2 gap-4">
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">Year</label>
<input type="text" name="year"
class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500">
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">Color</label>
<input type="text" name="color"
class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500">
</div>
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">Make</label>
<input type="text" name="make"
class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500">
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">Model</label>
<input type="text" name="model"
class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500">
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">License Plate</label>
<input type="text" name="license_plate"
class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500">
</div>
</div>
<div class="flex space-x-3 mt-6">
<button type="button" onclick="hideAddVehicleModal()"
class="flex-1 px-4 py-2 border border-gray-300 rounded-md text-gray-700 hover:bg-gray-50 transition">
Cancel
</button>
<button type="submit"
class="flex-1 px-4 py-2 bg-blue-600 hover:bg-blue-700 text-white rounded-md transition">
Add Vehicle
</button>
</div>
</form>
</div>
</div>
<script>
function showAddVehicleModal() {
document.getElementById('addVehicleModal').classList.remove('hidden');
}
function hideAddVehicleModal() {
document.getElementById('addVehicleModal').classList.add('hidden');
}
</script>
</body>
</html>

41
views/login.php Normal file
View File

@@ -0,0 +1,41 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title><?php echo APP_NAME; ?> - Login</title>
<script src="https://cdn.tailwindcss.com"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.1/font/bootstrap-icons.css">
</head>
<body class="bg-gray-100 min-h-screen flex items-center justify-center">
<div class="bg-white p-8 rounded-lg shadow-md w-full max-w-md">
<h1 class="text-3xl font-bold text-gray-800 mb-6 text-center"><?php echo APP_NAME; ?></h1>
<?php if (isset($_SESSION['error'])): ?>
<div class="bg-red-100 border border-red-400 text-red-700 px-4 py-3 rounded mb-4">
<?php echo htmlspecialchars($_SESSION['error']); unset($_SESSION['error']); ?>
</div>
<?php endif; ?>
<?php if (isset($_SESSION['success'])): ?>
<div class="bg-green-100 border border-green-400 text-green-700 px-4 py-3 rounded mb-4">
<?php echo htmlspecialchars($_SESSION['success']); unset($_SESSION['success']); ?>
</div>
<?php endif; ?>
<form method="POST" action="<?php echo url('/login'); ?>" class="space-y-4">
<div>
<label for="password" class="block text-sm font-medium text-gray-700 mb-1">Password</label>
<input type="password" id="password" name="password" required autofocus
class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500"
placeholder="Enter your password">
</div>
<button type="submit"
class="w-full bg-blue-600 hover:bg-blue-700 text-white font-semibold py-2 px-4 rounded-md transition duration-200">
Login
</button>
</form>
</div>
</body>
</html>

129
views/settings.php Normal file
View File

@@ -0,0 +1,129 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title><?php echo APP_NAME; ?> - Settings</title>
<script src="https://cdn.tailwindcss.com"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.1/font/bootstrap-icons.css">
</head>
<body class="bg-gray-100 min-h-screen">
<!-- Header -->
<header class="bg-white shadow-sm">
<div class="max-w-7xl mx-auto px-4 py-4 flex justify-between items-center">
<a href="<?php echo url('/home'); ?>" class="text-2xl font-bold text-gray-800 hover:text-gray-600 transition"><?php echo APP_NAME; ?></a>
<div class="flex items-center space-x-4">
<a href="<?php echo url('/settings'); ?>" class="text-gray-600 hover:text-gray-800">
<i class="bi bi-gear-fill text-2xl"></i>
</a>
</div>
</div>
</header>
<main class="max-w-7xl mx-auto px-4 py-8">
<!-- Breadcrumb -->
<div class="mb-6">
<a href="<?php echo url('/home'); ?>" class="text-blue-600 hover:text-blue-800">← Back to Vehicles</a>
</div>
<?php if (isset($_SESSION['error'])): ?>
<div class="bg-red-100 border border-red-400 text-red-700 px-4 py-3 rounded mb-4">
<?php echo htmlspecialchars($_SESSION['error']); unset($_SESSION['error']); ?>
</div>
<?php endif; ?>
<?php if (isset($_SESSION['success'])): ?>
<div class="bg-green-100 border border-green-400 text-green-700 px-4 py-3 rounded mb-4">
<?php echo htmlspecialchars($_SESSION['success']); unset($_SESSION['success']); ?>
</div>
<?php endif; ?>
<h2 class="text-2xl font-bold text-gray-800 mb-6">Settings</h2>
<div class="grid grid-cols-1 lg:grid-cols-2 gap-6">
<!-- Quick Tasks Section -->
<div class="bg-white rounded-lg shadow-sm p-6">
<h3 class="text-lg font-semibold text-gray-800 mb-4 flex items-center">
<i class="bi bi-lightning-charge-fill text-yellow-500 mr-2"></i>
Quick Tasks
</h3>
<p class="text-sm text-gray-600 mb-4">Predefined maintenance items for quick selection when adding records.</p>
<!-- Add Quick Task Form -->
<form method="POST" action="<?php echo url('/settings/quick-tasks/add'); ?>" class="mb-4">
<div class="flex space-x-2">
<input type="text" name="name" required placeholder="New task name"
class="flex-1 px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500">
<button type="submit"
class="bg-blue-600 hover:bg-blue-700 text-white px-4 py-2 rounded-md transition">
<i class="bi bi-plus-lg"></i> Add
</button>
</div>
</form>
<!-- Quick Tasks List -->
<div class="space-y-2 max-h-96 overflow-y-auto">
<?php foreach ($quickTasks as $task): ?>
<div class="flex items-center justify-between p-2 hover:bg-gray-50 rounded border border-gray-200">
<span class="text-gray-700"><?php echo htmlspecialchars($task['name']); ?></span>
<form method="POST" action="<?php echo url('/settings/quick-tasks/' . $task['id'] . '/delete'); ?>"
onsubmit="return confirm('Are you sure you want to delete this quick task?')" class="inline">
<button type="submit" class="text-red-600 hover:text-red-800">
<i class="bi bi-trash"></i>
</button>
</form>
</div>
<?php endforeach; ?>
</div>
</div>
<!-- Change Password Section -->
<div class="bg-white rounded-lg shadow-sm p-6">
<h3 class="text-lg font-semibold text-gray-800 mb-4 flex items-center">
<i class="bi bi-key-fill text-blue-500 mr-2"></i>
Change Password
</h3>
<p class="text-sm text-gray-600 mb-4">Update your login password.</p>
<form method="POST" action="<?php echo url('/settings/password'); ?>" class="space-y-4">
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">Current Password</label>
<input type="password" name="current_password" required
class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500">
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">New Password</label>
<input type="password" name="new_password" required
class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500"
placeholder="At least 6 characters">
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">Confirm New Password</label>
<input type="password" name="confirm_password" required
class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500">
</div>
<button type="submit"
class="w-full bg-blue-600 hover:bg-blue-700 text-white px-4 py-2 rounded-md transition">
Update Password
</button>
</form>
</div>
</div>
<!-- Logout Section -->
<div class="mt-6 bg-white rounded-lg shadow-sm p-6">
<h3 class="text-lg font-semibold text-gray-800 mb-4 flex items-center">
<i class="bi bi-box-arrow-right text-red-500 mr-2"></i>
Account
</h3>
<a href="<?php echo url('/logout'); ?>"
class="inline-block bg-red-100 hover:bg-red-200 text-red-700 px-6 py-2 rounded-md transition">
<i class="bi bi-box-arrow-right"></i> Logout
</a>
</div>
</main>
</body>
</html>

78
views/setup.php Normal file
View File

@@ -0,0 +1,78 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title><?php echo APP_NAME; ?> - Setup</title>
<script src="https://cdn.tailwindcss.com"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.1/font/bootstrap-icons.css">
</head>
<body class="bg-gray-100 min-h-screen flex items-center justify-center">
<div class="bg-white p-8 rounded-lg shadow-md w-full max-w-md">
<h1 class="text-3xl font-bold text-gray-800 mb-6 text-center"><?php echo APP_NAME; ?> Setup</h1>
<?php if (isset($_SESSION['error'])): ?>
<div class="bg-red-100 border border-red-400 text-red-700 px-4 py-3 rounded mb-4">
<?php echo htmlspecialchars($_SESSION['error']); unset($_SESSION['error']); ?>
</div>
<?php endif; ?>
<div class="mb-6 p-4 bg-blue-50 border border-blue-200 rounded">
<h2 class="font-semibold text-blue-900 mb-2">System Requirements</h2>
<ul class="space-y-1 text-sm">
<li class="flex items-center">
<i class="bi bi-check-circle-fill text-green-600 mr-2"></i>
<span>PHP Version: <?php echo PHP_VERSION; ?>
<?php if (version_compare(PHP_VERSION, '8.0.0', '>=')): ?>
<span class="text-green-600">(✓ Meets requirement)</span>
<?php else: ?>
<span class="text-red-600">(✗ Requires 8.0+)</span>
<?php endif; ?>
</span>
</li>
<li class="flex items-center">
<?php if (extension_loaded('pdo_sqlite')): ?>
<i class="bi bi-check-circle-fill text-green-600 mr-2"></i>
<span>SQLite: <span class="text-green-600">Available (✓)</span></span>
<?php else: ?>
<i class="bi bi-x-circle-fill text-red-600 mr-2"></i>
<span>SQLite: <span class="text-red-600">Not Available (✗)</span></span>
<?php endif; ?>
</li>
</ul>
</div>
<?php
$canSetup = version_compare(PHP_VERSION, '8.0.0', '>=') && extension_loaded('pdo_sqlite');
?>
<?php if (!$canSetup): ?>
<div class="bg-yellow-100 border border-yellow-400 text-yellow-800 px-4 py-3 rounded mb-4">
<p class="font-semibold">System requirements not met!</p>
<p class="text-sm mt-1">Please ensure PHP 8.0+ and SQLite extension are available.</p>
</div>
<?php else: ?>
<form method="POST" action="<?php echo url('/setup'); ?>" class="space-y-4">
<div>
<label for="password" class="block text-sm font-medium text-gray-700 mb-1">Create Password</label>
<input type="password" id="password" name="password" required
class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500"
placeholder="Enter password (min 6 characters)">
</div>
<div>
<label for="confirm_password" class="block text-sm font-medium text-gray-700 mb-1">Confirm Password</label>
<input type="password" id="confirm_password" name="confirm_password" required
class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500"
placeholder="Confirm password">
</div>
<button type="submit"
class="w-full bg-blue-600 hover:bg-blue-700 text-white font-semibold py-2 px-4 rounded-md transition duration-200">
Complete Setup
</button>
</form>
<?php endif; ?>
</div>
</body>
</html>

425
views/vehicle.php Normal file
View File

@@ -0,0 +1,425 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title><?php echo APP_NAME; ?> - <?php echo htmlspecialchars($vehicle['name']); ?></title>
<script src="https://cdn.tailwindcss.com"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.1/font/bootstrap-icons.css">
</head>
<body class="bg-gray-100 min-h-screen">
<!-- Header -->
<header class="bg-white shadow-sm">
<div class="max-w-7xl mx-auto px-4 py-4 flex justify-between items-center">
<a href="<?php echo url('/home'); ?>" class="text-2xl font-bold text-gray-800 hover:text-gray-600 transition"><?php echo APP_NAME; ?></a>
<div class="flex items-center space-x-4">
<a href="<?php echo url('/settings'); ?>" class="text-gray-600 hover:text-gray-800">
<i class="bi bi-gear-fill text-2xl"></i>
</a>
</div>
</div>
</header>
<main class="max-w-7xl mx-auto px-4 py-8">
<!-- Breadcrumb -->
<div class="mb-6">
<a href="<?php echo url('/home'); ?>" class="text-blue-600 hover:text-blue-800">← Back to Vehicles</a>
</div>
<?php if (isset($_SESSION['error'])): ?>
<div class="bg-red-100 border border-red-400 text-red-700 px-4 py-3 rounded mb-4">
<?php echo htmlspecialchars($_SESSION['error']); unset($_SESSION['error']); ?>
</div>
<?php endif; ?>
<?php if (isset($_SESSION['success'])): ?>
<div class="bg-green-100 border border-green-400 text-green-700 px-4 py-3 rounded mb-4">
<?php echo htmlspecialchars($_SESSION['success']); unset($_SESSION['success']); ?>
</div>
<?php endif; ?>
<!-- Vehicle Info Card -->
<div class="bg-white rounded-lg shadow-sm p-6 mb-6">
<div class="flex items-start justify-between">
<div class="flex items-start space-x-4">
<div class="bg-blue-100 p-4 rounded-lg">
<i class="bi bi-car-front-fill text-blue-600 text-3xl"></i>
</div>
<div>
<h2 class="text-2xl font-bold text-gray-800 mb-2"><?php echo htmlspecialchars($vehicle['name']); ?></h2>
<div class="space-y-1 text-gray-600">
<?php if ($vehicle['year'] || $vehicle['make'] || $vehicle['model']): ?>
<p class="flex items-center">
<i class="bi bi-info-circle mr-2"></i>
<?php echo implode(' ', array_filter([$vehicle['year'], $vehicle['make'], $vehicle['model']])); ?>
</p>
<?php endif; ?>
<?php if ($vehicle['color']): ?>
<p class="flex items-center">
<i class="bi bi-palette mr-2"></i>
<?php echo htmlspecialchars($vehicle['color']); ?>
</p>
<?php endif; ?>
<?php if ($vehicle['license_plate']): ?>
<p class="flex items-center">
<i class="bi bi-credit-card-2-front mr-2"></i>
<?php echo htmlspecialchars($vehicle['license_plate']); ?>
</p>
<?php endif; ?>
</div>
</div>
</div>
<div class="flex space-x-2">
<button onclick="showEditVehicleModal()"
class="px-4 py-2 bg-gray-100 hover:bg-gray-200 text-gray-700 rounded-lg transition">
<i class="bi bi-pencil"></i> Edit
</button>
<div class="relative">
<button onclick="toggleExportMenu()"
class="px-4 py-2 bg-blue-600 hover:bg-blue-700 text-white rounded-lg transition">
<i class="bi bi-download"></i> Export
</button>
<div id="exportMenu" class="hidden absolute right-0 mt-2 w-48 bg-white rounded-lg shadow-lg z-10">
<a href="<?php echo url('/vehicles/' . $vehicle['id'] . '/export/json'); ?>"
class="block px-4 py-2 text-gray-700 hover:bg-gray-100 rounded-t-lg">
<i class="bi bi-filetype-json"></i> Export as JSON
</a>
<a href="<?php echo url('/vehicles/' . $vehicle['id'] . '/export/html'); ?>"
class="block px-4 py-2 text-gray-700 hover:bg-gray-100 rounded-b-lg">
<i class="bi bi-filetype-html"></i> Export as HTML
</a>
</div>
</div>
<button onclick="confirmDelete()"
class="px-4 py-2 bg-red-100 hover:bg-red-200 text-red-700 rounded-lg transition">
<i class="bi bi-trash"></i>
</button>
</div>
</div>
</div>
<!-- Add Maintenance Item Card -->
<div class="bg-white rounded-lg shadow-sm p-6 mb-6">
<h3 class="text-lg font-semibold text-gray-800 mb-4">Add Maintenance Record</h3>
<form method="POST" action="<?php echo url('/maintenance/add'); ?>">
<input type="hidden" name="vehicle_id" value="<?php echo $vehicle['id']; ?>">
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4 mb-4">
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">Maintenance Name *</label>
<input type="text" name="name" id="maintenanceName" required autocomplete="off"
class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500">
<div id="suggestions" class="hidden absolute z-10 bg-white border border-gray-300 rounded-md shadow-lg mt-1 max-h-48 overflow-y-auto"></div>
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">Date *</label>
<input type="date" name="date" required value="<?php echo date('Y-m-d'); ?>"
class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500">
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">Mileage *</label>
<input type="number" name="mileage" required
class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500">
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">Cost</label>
<input type="number" step="0.01" name="cost"
class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500">
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">Performed By</label>
<input type="text" name="performed_by"
class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500">
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">Parts List</label>
<input type="text" name="parts_list"
class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500">
</div>
</div>
<div class="mb-4">
<label class="block text-sm font-medium text-gray-700 mb-1">Description</label>
<textarea name="description" rows="3"
class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500"></textarea>
</div>
<button type="submit"
class="bg-blue-600 hover:bg-blue-700 text-white px-6 py-2 rounded-lg transition">
<i class="bi bi-plus-lg"></i> Add Record
</button>
</form>
</div>
<!-- Maintenance History -->
<div class="bg-white rounded-lg shadow-sm p-6">
<h3 class="text-lg font-semibold text-gray-800 mb-4">Maintenance History (<?php echo count($maintenanceItems); ?>)</h3>
<?php if (empty($maintenanceItems)): ?>
<div class="text-center py-8 text-gray-500">
<i class="bi bi-tools text-4xl mb-2"></i>
<p>No maintenance records yet</p>
</div>
<?php else: ?>
<div class="space-y-4">
<?php foreach ($maintenanceItems as $item): ?>
<div class="border border-gray-200 rounded-lg p-4 hover:border-blue-300 transition">
<div class="flex justify-between items-start">
<div class="flex-1">
<div class="flex items-center space-x-3 mb-2">
<h4 class="text-lg font-semibold text-gray-800"><?php echo htmlspecialchars($item['name']); ?></h4>
<?php if ($item['cost']): ?>
<span class="bg-green-100 text-green-800 px-2 py-1 rounded text-sm">
$<?php echo number_format($item['cost'], 2); ?>
</span>
<?php endif; ?>
</div>
<div class="grid grid-cols-2 md:grid-cols-4 gap-2 text-sm text-gray-600 mb-2">
<div>
<i class="bi bi-calendar3"></i>
<?php echo date('M d, Y', strtotime($item['date'])); ?>
</div>
<div>
<i class="bi bi-speedometer"></i>
<?php echo number_format($item['mileage']); ?> miles
</div>
<?php if ($item['performed_by']): ?>
<div>
<i class="bi bi-person"></i>
<?php echo htmlspecialchars($item['performed_by']); ?>
</div>
<?php endif; ?>
<?php if ($item['parts_list']): ?>
<div>
<i class="bi bi-box"></i>
<?php echo htmlspecialchars($item['parts_list']); ?>
</div>
<?php endif; ?>
</div>
<?php if ($item['description']): ?>
<p class="text-sm text-gray-600 mt-2"><?php echo nl2br(htmlspecialchars($item['description'])); ?></p>
<?php endif; ?>
</div>
<div class="flex space-x-2 ml-4">
<button onclick='showEditMaintenanceModal(<?php echo json_encode($item); ?>)'
class="text-blue-600 hover:text-blue-800">
<i class="bi bi-pencil"></i>
</button>
<form method="POST" action="<?php echo url('/maintenance/' . $item['id'] . '/delete'); ?>"
onsubmit="return confirm('Are you sure you want to delete this record?')" class="inline">
<button type="submit" class="text-red-600 hover:text-red-800">
<i class="bi bi-trash"></i>
</button>
</form>
</div>
</div>
</div>
<?php endforeach; ?>
</div>
<?php endif; ?>
</div>
</main>
<!-- Edit Vehicle Modal -->
<div id="editVehicleModal" class="hidden fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50">
<div class="bg-white rounded-lg p-6 w-full max-w-md">
<div class="flex justify-between items-center mb-4">
<h3 class="text-xl font-semibold">Edit Vehicle</h3>
<button onclick="hideEditVehicleModal()" class="text-gray-500 hover:text-gray-700">
<i class="bi bi-x-lg"></i>
</button>
</div>
<form method="POST" action="<?php echo url('/vehicles/' . $vehicle['id'] . '/edit'); ?>">
<div class="space-y-4">
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">Name *</label>
<input type="text" name="name" required value="<?php echo htmlspecialchars($vehicle['name']); ?>"
class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500">
</div>
<div class="grid grid-cols-2 gap-4">
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">Year</label>
<input type="text" name="year" value="<?php echo htmlspecialchars($vehicle['year'] ?? ''); ?>"
class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500">
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">Color</label>
<input type="text" name="color" value="<?php echo htmlspecialchars($vehicle['color'] ?? ''); ?>"
class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500">
</div>
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">Make</label>
<input type="text" name="make" value="<?php echo htmlspecialchars($vehicle['make'] ?? ''); ?>"
class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500">
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">Model</label>
<input type="text" name="model" value="<?php echo htmlspecialchars($vehicle['model'] ?? ''); ?>"
class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500">
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">License Plate</label>
<input type="text" name="license_plate" value="<?php echo htmlspecialchars($vehicle['license_plate'] ?? ''); ?>"
class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500">
</div>
</div>
<div class="flex space-x-3 mt-6">
<button type="button" onclick="hideEditVehicleModal()"
class="flex-1 px-4 py-2 border border-gray-300 rounded-md text-gray-700 hover:bg-gray-50 transition">
Cancel
</button>
<button type="submit"
class="flex-1 px-4 py-2 bg-blue-600 hover:bg-blue-700 text-white rounded-md transition">
Save Changes
</button>
</div>
</form>
</div>
</div>
<!-- Edit Maintenance Modal -->
<div id="editMaintenanceModal" class="hidden fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50">
<div class="bg-white rounded-lg p-6 w-full max-w-2xl max-h-screen overflow-y-auto">
<div class="flex justify-between items-center mb-4">
<h3 class="text-xl font-semibold">Edit Maintenance Record</h3>
<button onclick="hideEditMaintenanceModal()" class="text-gray-500 hover:text-gray-700">
<i class="bi bi-x-lg"></i>
</button>
</div>
<form id="editMaintenanceForm" method="POST">
<div class="grid grid-cols-1 md:grid-cols-2 gap-4 mb-4">
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">Maintenance Name *</label>
<input type="text" name="name" id="editName" required
class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500">
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">Date *</label>
<input type="date" name="date" id="editDate" required
class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500">
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">Mileage *</label>
<input type="number" name="mileage" id="editMileage" required
class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500">
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">Cost</label>
<input type="number" step="0.01" name="cost" id="editCost"
class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500">
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">Performed By</label>
<input type="text" name="performed_by" id="editPerformedBy"
class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500">
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">Parts List</label>
<input type="text" name="parts_list" id="editPartsList"
class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500">
</div>
</div>
<div class="mb-4">
<label class="block text-sm font-medium text-gray-700 mb-1">Description</label>
<textarea name="description" id="editDescription" rows="3"
class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500"></textarea>
</div>
<div class="flex space-x-3">
<button type="button" onclick="hideEditMaintenanceModal()"
class="flex-1 px-4 py-2 border border-gray-300 rounded-md text-gray-700 hover:bg-gray-50 transition">
Cancel
</button>
<button type="submit"
class="flex-1 px-4 py-2 bg-blue-600 hover:bg-blue-700 text-white rounded-md transition">
Save Changes
</button>
</div>
</form>
</div>
</div>
<!-- Delete Vehicle Form -->
<form id="deleteVehicleForm" method="POST" action="<?php echo url('/vehicles/' . $vehicle['id'] . '/delete'); ?>" class="hidden"></form>
<script>
let debounceTimer;
const nameInput = document.getElementById('maintenanceName');
const suggestionsDiv = document.getElementById('suggestions');
nameInput.addEventListener('input', function() {
clearTimeout(debounceTimer);
const query = this.value;
if (query.length < 2) {
suggestionsDiv.classList.add('hidden');
return;
}
debounceTimer = setTimeout(() => {
fetch('<?php echo url('/maintenance/search'); ?>?q=' + encodeURIComponent(query))
.then(r => r.json())
.then(items => {
if (items.length > 0) {
suggestionsDiv.innerHTML = items.map(item =>
`<div class="px-3 py-2 hover:bg-gray-100 cursor-pointer" onclick="selectSuggestion('${item.replace(/'/g, "\\'")}')">${item}</div>`
).join('');
suggestionsDiv.classList.remove('hidden');
} else {
suggestionsDiv.classList.add('hidden');
}
});
}, 300);
});
function selectSuggestion(value) {
nameInput.value = value;
suggestionsDiv.classList.add('hidden');
}
document.addEventListener('click', function(e) {
if (!nameInput.contains(e.target) && !suggestionsDiv.contains(e.target)) {
suggestionsDiv.classList.add('hidden');
}
});
function showEditVehicleModal() {
document.getElementById('editVehicleModal').classList.remove('hidden');
}
function hideEditVehicleModal() {
document.getElementById('editVehicleModal').classList.add('hidden');
}
function showEditMaintenanceModal(item) {
document.getElementById('editName').value = item.name;
document.getElementById('editDate').value = item.date;
document.getElementById('editMileage').value = item.mileage;
document.getElementById('editCost').value = item.cost || '';
document.getElementById('editPerformedBy').value = item.performed_by || '';
document.getElementById('editPartsList').value = item.parts_list || '';
document.getElementById('editDescription').value = item.description || '';
document.getElementById('editMaintenanceForm').action = '<?php echo url('/maintenance/'); ?>' + item.id + '/edit';
document.getElementById('editMaintenanceModal').classList.remove('hidden');
}
function hideEditMaintenanceModal() {
document.getElementById('editMaintenanceModal').classList.add('hidden');
}
function confirmDelete() {
if (confirm('Are you sure you want to delete this vehicle and all its maintenance records?')) {
document.getElementById('deleteVehicleForm').submit();
}
}
function toggleExportMenu() {
document.getElementById('exportMenu').classList.toggle('hidden');
}
document.addEventListener('click', function(e) {
const exportMenu = document.getElementById('exportMenu');
if (!e.target.closest('#exportMenu') && !e.target.closest('button[onclick="toggleExportMenu()"]')) {
exportMenu.classList.add('hidden');
}
});
</script>
</body>
</html>