iulian/masina-dock
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Initial commit: Masina-Dock Vehicle Management System

Browse source
This commit is contained in:
Iulian 2025-10-19 11:10:11 +01:00
commit ae923e2c41
4999 changed files with 1607266 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

125
frontend/templates/vehicles.html Normal file
View file

@ -0,0 +1,125 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Vehicles - Masina-Dock</title>
<link rel="stylesheet" href="/static/css/style.css">
</head>
<body>
<header>
<div class="logo">
<img src="/static/images/logo.svg" alt="Masina-Dock">
<h1>Masina-Dock</h1>
</div>
<nav>
<a href="/dashboard">Dashboard</a>
<button class="theme-toggle" onclick="toggleTheme()">Toggle Theme</button>
<button class="btn btn-danger" onclick="logout()">Logout</button>
</nav>
</header>
<div class="container">
<h2>All Vehicles</h2>
<button class="btn btn-success" onclick="showModal('add-vehicle-modal')">+ Add Vehicle</button>
<div id="vehicles-container" class="vehicle-grid"></div>
</div>
<div id="add-vehicle-modal" class="modal">
<div class="modal-content">
<h2>Add New Vehicle</h2>
<form id="add-vehicle-form" enctype="multipart/form-data">
<div class="form-group">
<label for="photo">Vehicle Photo</label>
<input type="file" id="photo" name="photo" accept="image/*">
<div id="photo-preview" style="margin-top: 10px;"></div>
</div>
<div class="form-group">
<label for="year">Year</label>
<input type="number" id="year" name="year" required min="1900" max="2099">
</div>
<div class="form-group">
<label for="make">Make</label>
<input type="text" id="make" name="make" required>
</div>
<div class="form-group">
<label for="model">Model</label>
<input type="text" id="model" name="model" required>
</div>
<div class="form-group">
<label for="vin">VIN (Optional)</label>
<input type="text" id="vin" name="vin" maxlength="17">
</div>
<div class="form-group">
<label for="license_plate">License Plate (Optional)</label>
<input type="text" id="license_plate" name="license_plate">
</div>
<div class="form-group">
<label for="odometer">Current Odometer</label>
<input type="number" id="odometer" name="odometer" required min="0">
</div>
<div style="display: flex; gap: 10px; margin-top: 20px;">
<button type="submit" class="btn btn-success">Add Vehicle</button>
<button type="button" class="btn" onclick="closeModal('add-vehicle-modal')">Cancel</button>
</div>
</form>
</div>
</div>
<script src="/static/js/app.js"></script>
<script>
document.addEventListener('DOMContentLoaded', () => {
loadVehicles();
});
document.getElementById('photo').addEventListener('change', (e) => {
const file = e.target.files[0];
if (file) {
const reader = new FileReader();
reader.onload = (e) => {
document.getElementById('photo-preview').innerHTML =
`<img src="${e.target.result}" style="max-width: 200px; border-radius: 8px;">`;
};
reader.readAsDataURL(file);
}
});
document.getElementById('add-vehicle-form').addEventListener('submit', async (e) => {
e.preventDefault();
let photoUrl = null;
const photoFile = document.getElementById('photo').files[0];
if (photoFile) {
const formData = new FormData();
formData.append('photo', photoFile);
try {
const response = await fetch('/api/upload/photo', {
method: 'POST',
credentials: 'include',
body: formData
});
const data = await response.json();
photoUrl = data.photo_url;
} catch (error) {
console.error('Photo upload failed:', error);
}
}
const vehicleData = {
year: parseInt(document.getElementById('year').value),
make: document.getElementById('make').value,
model: document.getElementById('model').value,
vin: document.getElementById('vin').value || null,
license_plate: document.getElementById('license_plate').value || null,
odometer: parseInt(document.getElementById('odometer').value),
photo: photoUrl
};
await addVehicle(vehicleData);
});
</script>
</body>
</html>