feat: module Garage — véhicules, entretiens, pièces (intégration GarageManager)
Deploy to Pacha Family / deploy (push) Failing after 3s
Deploy to Pacha Family / deploy (push) Failing after 3s
- modules/garage/api.php : API REST MySQL (vehicles, maintenances, parts, stats, photos) - modules/garage/assets/garage.css + garage.js : UI adaptée (chemins API mis à jour) - garage.php : page principale avec header/footer HouseHub + i18n - docker/schema_family.sql : tables pf_vehicles, pf_maintenances, pf_parts - docker-compose.yml : volume househub_uploads pour photos - includes/lang/fr|ca|en.php : ~50 clés de traduction garage - header.php : lien Garage dans nav desktop + mobile - settings.php : module garage dans les toggles - README.md : tableau des modules + mise à jour description Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
perco
co-authored by
Claude Sonnet 4.6
Claude Sonnet 4.6
parent
f6de4918bd
commit
62eabfb5ee
@@ -1,5 +1,5 @@
|
|||||||
🦙 HouseHub OS
|
🦙 HouseHub OS
|
||||||
Système de gestion familiale sur-mesure : Budget, Calendrier, Voyages et Cadeaux.
|
Système de gestion familiale sur-mesure : Budget, Calendrier, Voyages, Cadeaux et Garage.
|
||||||
|
|
||||||
## 🚀 Déploiement (Docker)
|
## 🚀 Déploiement (Docker)
|
||||||
|
|
||||||
@@ -32,8 +32,9 @@ HouseHub supporte plusieurs familles indépendantes sur la même instance :
|
|||||||
|-----|-------------|
|
|-----|-------------|
|
||||||
| `/register.php` | Créer un compte + nouvel espace, ou rejoindre un espace existant via code |
|
| `/register.php` | Créer un compte + nouvel espace, ou rejoindre un espace existant via code |
|
||||||
| `/login.php` | Connexion |
|
| `/login.php` | Connexion |
|
||||||
| `/settings.php` | Paramètres du compte : profil, mot de passe, code d'invitation, membres |
|
| `/settings.php` | Paramètres : profil, mot de passe, langue, modules actifs, code d'invitation |
|
||||||
| `/admin/` | Panneau d'administration (admin uniquement) |
|
| `/admin/` | Panneau d'administration (admin uniquement) |
|
||||||
|
| `/garage.php` | Module Garage — véhicules, entretiens, pièces |
|
||||||
|
|
||||||
### Inviter quelqu'un dans son espace
|
### Inviter quelqu'un dans son espace
|
||||||
1. Aller sur `/settings.php` → copier le code d'invitation
|
1. Aller sur `/settings.php` → copier le code d'invitation
|
||||||
@@ -47,6 +48,18 @@ UPDATE househub_meta.users SET is_admin = 1 WHERE username = 'ton_username';
|
|||||||
```
|
```
|
||||||
L'admin peut ensuite promouvoir/désactiver d'autres utilisateurs depuis `/admin/`.
|
L'admin peut ensuite promouvoir/désactiver d'autres utilisateurs depuis `/admin/`.
|
||||||
|
|
||||||
|
## 🧩 Modules
|
||||||
|
|
||||||
|
| Module | Route | Description |
|
||||||
|
|--------|-------|-------------|
|
||||||
|
| Calendrier | `/family-calendar.php` | Congés, modes de garde, planning hebdo |
|
||||||
|
| Budget | `/budget.php` | Suivi mensuel, prévisionnel, épargne |
|
||||||
|
| Voyages | `/holidays.php` | Roadtrips, cartographie, météo |
|
||||||
|
| Cadeaux | `/gift-list.php` | Noël, anniversaires, Tricount |
|
||||||
|
| Garage | `/garage.php` | Véhicules, entretiens, pièces détachées |
|
||||||
|
|
||||||
|
Les modules sont activables/désactivables par famille depuis `/settings.php`.
|
||||||
|
|
||||||
---
|
---
|
||||||
|
|
||||||
📝 Présentation du projet
|
📝 Présentation du projet
|
||||||
|
|||||||
@@ -12,6 +12,8 @@ services:
|
|||||||
DB_NAME: ${DB_NAME:-househub}
|
DB_NAME: ${DB_NAME:-househub}
|
||||||
DB_USER: ${DB_USER:-househub}
|
DB_USER: ${DB_USER:-househub}
|
||||||
DB_PASS: ${DB_PASS:-changeme}
|
DB_PASS: ${DB_PASS:-changeme}
|
||||||
|
volumes:
|
||||||
|
- househub_uploads:/uploads
|
||||||
networks:
|
networks:
|
||||||
- househub_net
|
- househub_net
|
||||||
- proxy
|
- proxy
|
||||||
@@ -34,6 +36,7 @@ services:
|
|||||||
MYSQL_PASSWORD: ${DB_PASS:-changeme}
|
MYSQL_PASSWORD: ${DB_PASS:-changeme}
|
||||||
volumes:
|
volumes:
|
||||||
- househub_db_data:/var/lib/mysql
|
- househub_db_data:/var/lib/mysql
|
||||||
|
- househub_uploads:/uploads
|
||||||
- ./docker/init:/docker-entrypoint-initdb.d:ro
|
- ./docker/init:/docker-entrypoint-initdb.d:ro
|
||||||
networks:
|
networks:
|
||||||
- househub_net
|
- househub_net
|
||||||
@@ -45,6 +48,7 @@ services:
|
|||||||
|
|
||||||
volumes:
|
volumes:
|
||||||
househub_db_data:
|
househub_db_data:
|
||||||
|
househub_uploads:
|
||||||
|
|
||||||
networks:
|
networks:
|
||||||
househub_net:
|
househub_net:
|
||||||
|
|||||||
@@ -235,3 +235,61 @@ VALUES (1, 'admin', '$2y$10$92IXUNpkjO0rOQ5byMi.Ye4oKoEa3Ro9llC/.og/at2.uheWG/ig
|
|||||||
-- Personnes (IDs fixes correspondant aux constantes dans config.php)
|
-- Personnes (IDs fixes correspondant aux constantes dans config.php)
|
||||||
INSERT IGNORE INTO pf_people (id, name) VALUES (2, 'Alex');
|
INSERT IGNORE INTO pf_people (id, name) VALUES (2, 'Alex');
|
||||||
INSERT IGNORE INTO pf_people (id, name) VALUES (3, 'Laia');
|
INSERT IGNORE INTO pf_people (id, name) VALUES (3, 'Laia');
|
||||||
|
|
||||||
|
-- ─── Garage Manager ───────────────────────────────────────────────────────────
|
||||||
|
CREATE TABLE IF NOT EXISTS pf_vehicles (
|
||||||
|
id INT AUTO_INCREMENT PRIMARY KEY,
|
||||||
|
name VARCHAR(255) NOT NULL,
|
||||||
|
brand VARCHAR(100) NOT NULL,
|
||||||
|
model VARCHAR(100) NOT NULL,
|
||||||
|
year INT DEFAULT NULL,
|
||||||
|
license_plate VARCHAR(50) DEFAULT NULL,
|
||||||
|
vin VARCHAR(100) DEFAULT NULL,
|
||||||
|
fuel_type VARCHAR(50) DEFAULT 'Essence',
|
||||||
|
color VARCHAR(50) DEFAULT NULL,
|
||||||
|
purchase_date DATE DEFAULT NULL,
|
||||||
|
purchase_price DECIMAL(10,2) DEFAULT NULL,
|
||||||
|
current_km INT DEFAULT 0,
|
||||||
|
photo VARCHAR(255) DEFAULT NULL,
|
||||||
|
notes TEXT DEFAULT NULL,
|
||||||
|
created_at DATETIME DEFAULT CURRENT_TIMESTAMP,
|
||||||
|
updated_at DATETIME DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP
|
||||||
|
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;
|
||||||
|
|
||||||
|
CREATE TABLE IF NOT EXISTS pf_maintenances (
|
||||||
|
id INT AUTO_INCREMENT PRIMARY KEY,
|
||||||
|
vehicle_id INT NOT NULL,
|
||||||
|
type VARCHAR(100) NOT NULL,
|
||||||
|
description TEXT DEFAULT NULL,
|
||||||
|
date DATE NOT NULL,
|
||||||
|
km INT DEFAULT NULL,
|
||||||
|
cost DECIMAL(10,2) DEFAULT 0,
|
||||||
|
mechanic VARCHAR(100) DEFAULT NULL,
|
||||||
|
garage_name VARCHAR(100) DEFAULT NULL,
|
||||||
|
next_km INT DEFAULT NULL,
|
||||||
|
next_date DATE DEFAULT NULL,
|
||||||
|
invoice_photo VARCHAR(255) DEFAULT NULL,
|
||||||
|
notes TEXT DEFAULT NULL,
|
||||||
|
created_at DATETIME DEFAULT CURRENT_TIMESTAMP,
|
||||||
|
FOREIGN KEY (vehicle_id) REFERENCES pf_vehicles(id) ON DELETE CASCADE
|
||||||
|
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;
|
||||||
|
|
||||||
|
CREATE TABLE IF NOT EXISTS pf_parts (
|
||||||
|
id INT AUTO_INCREMENT PRIMARY KEY,
|
||||||
|
vehicle_id INT DEFAULT NULL,
|
||||||
|
maintenance_id INT DEFAULT NULL,
|
||||||
|
brand VARCHAR(100) DEFAULT NULL,
|
||||||
|
reference VARCHAR(100) DEFAULT NULL,
|
||||||
|
name VARCHAR(255) NOT NULL,
|
||||||
|
category VARCHAR(100) DEFAULT 'Autre',
|
||||||
|
price DECIMAL(10,2) DEFAULT 0,
|
||||||
|
quantity INT DEFAULT 1,
|
||||||
|
unit VARCHAR(50) DEFAULT 'pièce',
|
||||||
|
supplier VARCHAR(100) DEFAULT NULL,
|
||||||
|
purchase_date DATE DEFAULT NULL,
|
||||||
|
photo VARCHAR(255) DEFAULT NULL,
|
||||||
|
notes TEXT DEFAULT NULL,
|
||||||
|
created_at DATETIME DEFAULT CURRENT_TIMESTAMP,
|
||||||
|
FOREIGN KEY (vehicle_id) REFERENCES pf_vehicles(id) ON DELETE SET NULL,
|
||||||
|
FOREIGN KEY (maintenance_id) REFERENCES pf_maintenances(id) ON DELETE SET NULL
|
||||||
|
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;
|
||||||
|
|||||||
+257
@@ -0,0 +1,257 @@
|
|||||||
|
<?php
|
||||||
|
require __DIR__ . '/includes/auth.php';
|
||||||
|
require_login();
|
||||||
|
require_once __DIR__ . '/includes/i18n.php';
|
||||||
|
|
||||||
|
$pageTitle = tr('garage_page_title');
|
||||||
|
$activePage = "garage";
|
||||||
|
require __DIR__ . '/header.php';
|
||||||
|
?>
|
||||||
|
|
||||||
|
<link rel="stylesheet" href="/modules/garage/assets/garage.css">
|
||||||
|
|
||||||
|
<div id="toasts" class="toast-container"></div>
|
||||||
|
|
||||||
|
<div id="page-dashboard" class="page active">
|
||||||
|
<div class="container">
|
||||||
|
<div class="stats-grid">
|
||||||
|
<div class="stat-pill blue"><div class="label"><?= tr('garage_stat_vehicles') ?></div><div class="value" id="stat-vehicles">--</div></div>
|
||||||
|
<div class="stat-pill green"><div class="label"><?= tr('garage_stat_maintenances') ?></div><div class="value" id="stat-maintenances">--</div></div>
|
||||||
|
<div class="stat-pill amber"><div class="label"><?= tr('garage_stat_parts') ?></div><div class="value" id="stat-parts">--</div></div>
|
||||||
|
<div class="stat-pill red"><div class="label"><?= tr('garage_stat_cost') ?></div><div class="value" id="stat-cost">--</div></div>
|
||||||
|
</div>
|
||||||
|
<div style="display:grid;grid-template-columns:1fr 380px;gap:1.5rem;align-items:start">
|
||||||
|
<div>
|
||||||
|
<div class="card-header" style="margin-bottom:.75rem">
|
||||||
|
<h2 style="font-size:1rem;font-weight:600"><?= tr('garage_my_vehicles') ?></h2>
|
||||||
|
<button class="btn btn-primary btn-sm" onclick="openAddVehicle()">+ <?= tr('garage_add') ?></button>
|
||||||
|
</div>
|
||||||
|
<div id="dashboard-vehicles" class="vehicles-grid"></div>
|
||||||
|
</div>
|
||||||
|
<div class="card">
|
||||||
|
<div class="card-header"><div class="card-title">🔔 <?= tr('garage_reminders') ?></div></div>
|
||||||
|
<div id="reminders-list"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="page-vehicles" class="page">
|
||||||
|
<div class="container">
|
||||||
|
<div class="card-header" style="margin-bottom:1rem">
|
||||||
|
<h1 style="font-size:1.2rem;font-weight:700">🚗 <?= tr('garage_vehicles_title') ?></h1>
|
||||||
|
<button class="btn btn-primary" onclick="openAddVehicle()">+ <?= tr('garage_add_vehicle') ?></button>
|
||||||
|
</div>
|
||||||
|
<div id="vehicles-grid" class="vehicles-grid"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="page-vehicle" class="page">
|
||||||
|
<div class="container">
|
||||||
|
<div style="margin-bottom:1rem">
|
||||||
|
<button class="btn btn-secondary btn-sm" onclick="navigate('vehicles')">← <?= tr('btn_back') ?></button>
|
||||||
|
</div>
|
||||||
|
<div id="vehicle-header"></div>
|
||||||
|
<div class="tabs">
|
||||||
|
<button class="tab-btn active" data-tab="maintenances" onclick="switchTab('maintenances')">🔧 <?= tr('garage_maintenances') ?> <span id="maintenance-total" style="color:var(--muted);font-size:.78rem"></span></button>
|
||||||
|
<button class="tab-btn" data-tab="parts" onclick="switchTab('parts')">🔩 <?= tr('garage_parts') ?> <span id="parts-total-vehicle" style="color:var(--muted);font-size:.78rem"></span></button>
|
||||||
|
</div>
|
||||||
|
<div id="tab-maintenances" class="tab-pane active">
|
||||||
|
<div style="margin-bottom:1rem;display:flex;justify-content:flex-end">
|
||||||
|
<button class="btn btn-primary btn-sm" onclick="openAddMaintenance()">+ <?= tr('garage_add_maintenance') ?></button>
|
||||||
|
</div>
|
||||||
|
<div id="maintenance-list"></div>
|
||||||
|
</div>
|
||||||
|
<div id="tab-parts" class="tab-pane">
|
||||||
|
<div style="margin-bottom:1rem;display:flex;justify-content:flex-end">
|
||||||
|
<button class="btn btn-primary btn-sm" onclick="openAddPart()">+ <?= tr('garage_add_part') ?></button>
|
||||||
|
</div>
|
||||||
|
<div id="parts-list-vehicle"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="page-parts" class="page">
|
||||||
|
<div class="container">
|
||||||
|
<div class="card-header" style="margin-bottom:1rem">
|
||||||
|
<div>
|
||||||
|
<h1 style="font-size:1.2rem;font-weight:700">🔩 <?= tr('garage_all_parts') ?></h1>
|
||||||
|
<p style="color:var(--muted);font-size:.85rem"><span id="all-parts-count">0</span> <?= tr('garage_parts_count') ?> · Total : <span id="all-parts-total">--</span></p>
|
||||||
|
</div>
|
||||||
|
<button class="btn btn-primary" onclick="openAddPart()">+ <?= tr('garage_add_part') ?></button>
|
||||||
|
</div>
|
||||||
|
<div id="all-parts-list"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- MODAL: VEHICLE -->
|
||||||
|
<div id="modal-vehicle" class="modal-backdrop">
|
||||||
|
<div class="modal">
|
||||||
|
<div class="modal-header">
|
||||||
|
<div class="modal-title" id="modal-vehicle-title"><?= tr('garage_add_vehicle') ?></div>
|
||||||
|
<button class="modal-close" onclick="closeModal('modal-vehicle')">✕</button>
|
||||||
|
</div>
|
||||||
|
<div class="modal-body">
|
||||||
|
<form id="form-vehicle" onsubmit="return false">
|
||||||
|
<input type="hidden" id="form-vehicle-id" name="id">
|
||||||
|
<div class="form-row">
|
||||||
|
<div class="form-group"><label class="form-label"><?= tr('garage_vehicle_name') ?> *</label><input class="form-control" id="vehicle-name" name="name" required placeholder="Ma Clio"></div>
|
||||||
|
<div class="form-group"><label class="form-label"><?= tr('garage_brand') ?> *</label><input class="form-control" id="vehicle-brand" name="brand" required placeholder="Renault"></div>
|
||||||
|
</div>
|
||||||
|
<div class="form-row">
|
||||||
|
<div class="form-group"><label class="form-label"><?= tr('garage_model') ?> *</label><input class="form-control" id="vehicle-model" name="model" required placeholder="Clio 4"></div>
|
||||||
|
<div class="form-group"><label class="form-label"><?= tr('garage_year') ?></label><input class="form-control" id="vehicle-year" name="year" type="number" placeholder="2019"></div>
|
||||||
|
</div>
|
||||||
|
<div class="form-row">
|
||||||
|
<div class="form-group"><label class="form-label"><?= tr('garage_plate') ?></label><input class="form-control" id="vehicle-license-plate" name="license_plate" placeholder="AB-123-CD"></div>
|
||||||
|
<div class="form-group"><label class="form-label"><?= tr('garage_fuel') ?></label>
|
||||||
|
<select class="form-control" id="vehicle-fuel-type" name="fuel_type">
|
||||||
|
<option>Essence</option><option>Diesel</option><option>Hybride</option><option>Electrique</option><option>GPL</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="form-row">
|
||||||
|
<div class="form-group"><label class="form-label"><?= tr('garage_km') ?></label><input class="form-control" id="vehicle-current-km" name="current_km" type="number" placeholder="85000"></div>
|
||||||
|
<div class="form-group"><label class="form-label"><?= tr('garage_color') ?></label><input class="form-control" id="vehicle-color" name="color" placeholder="Blanc nacré"></div>
|
||||||
|
</div>
|
||||||
|
<div class="form-row">
|
||||||
|
<div class="form-group"><label class="form-label"><?= tr('garage_purchase_date') ?></label><input class="form-control" id="vehicle-purchase-date" name="purchase_date" type="date"></div>
|
||||||
|
<div class="form-group"><label class="form-label"><?= tr('garage_purchase_price') ?></label><input class="form-control" id="vehicle-purchase-price" name="purchase_price" type="number" step="0.01"></div>
|
||||||
|
</div>
|
||||||
|
<div class="form-group"><label class="form-label">VIN</label><input class="form-control" id="vehicle-vin" name="vin" placeholder="VF1..."></div>
|
||||||
|
<div class="form-group">
|
||||||
|
<label class="form-label"><?= tr('garage_photo') ?></label>
|
||||||
|
<input class="form-control" id="vehicle-photo" name="photo" type="file" accept="image/*" onchange="previewPhoto('vehicle-photo','vehicle-photo-preview')">
|
||||||
|
<img id="vehicle-photo-preview" style="display:none;max-height:120px;margin-top:.5rem;border-radius:6px" alt="">
|
||||||
|
</div>
|
||||||
|
<div class="form-group"><label class="form-label"><?= tr('garage_notes') ?></label><textarea class="form-control" id="vehicle-notes" name="notes" rows="2"></textarea></div>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
<div class="modal-footer">
|
||||||
|
<button class="btn btn-secondary" onclick="closeModal('modal-vehicle')"><?= tr('btn_cancel') ?></button>
|
||||||
|
<button class="btn btn-primary" onclick="saveVehicle()"><?= tr('btn_save') ?></button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- MODAL: MAINTENANCE -->
|
||||||
|
<div id="modal-maintenance" class="modal-backdrop">
|
||||||
|
<div class="modal">
|
||||||
|
<div class="modal-header">
|
||||||
|
<div class="modal-title" id="modal-maintenance-title"><?= tr('garage_add_maintenance') ?></div>
|
||||||
|
<button class="modal-close" onclick="closeModal('modal-maintenance')">✕</button>
|
||||||
|
</div>
|
||||||
|
<div class="modal-body">
|
||||||
|
<form id="form-maintenance" onsubmit="return false">
|
||||||
|
<input type="hidden" id="form-maintenance-id" name="id">
|
||||||
|
<input type="hidden" id="maintenance-vehicle-id" name="vehicle_id">
|
||||||
|
<div class="form-row">
|
||||||
|
<div class="form-group"><label class="form-label"><?= tr('garage_maint_type') ?> *</label>
|
||||||
|
<select class="form-control" id="maintenance-type" name="type">
|
||||||
|
<option>Vidange</option><option>Révision</option><option>Freins</option><option>Pneus</option>
|
||||||
|
<option>Distribution</option><option>Filtres</option><option>Batterie</option><option>Climatisation</option>
|
||||||
|
<option>Carrosserie</option><option>Diagnostic</option><option>Contrôle technique</option><option>Autre</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
<div class="form-group"><label class="form-label"><?= tr('garage_date') ?> *</label><input class="form-control" id="maintenance-date" name="date" type="date" required></div>
|
||||||
|
</div>
|
||||||
|
<div class="form-row">
|
||||||
|
<div class="form-group"><label class="form-label"><?= tr('garage_km_at') ?></label><input class="form-control" id="maintenance-km" name="km" type="number" placeholder="85000"></div>
|
||||||
|
<div class="form-group"><label class="form-label"><?= tr('garage_labor_cost') ?></label><input class="form-control" id="maintenance-cost" name="cost" type="number" step="0.01" placeholder="0"></div>
|
||||||
|
</div>
|
||||||
|
<div class="form-group"><label class="form-label"><?= tr('garage_description') ?></label><textarea class="form-control" id="maintenance-description" name="description" rows="2"></textarea></div>
|
||||||
|
<div class="form-row">
|
||||||
|
<div class="form-group"><label class="form-label"><?= tr('garage_mechanic') ?></label><input class="form-control" id="maintenance-mechanic" name="mechanic"></div>
|
||||||
|
<div class="form-group"><label class="form-label"><?= tr('garage_garage') ?></label><input class="form-control" id="maintenance-garage" name="garage"></div>
|
||||||
|
</div>
|
||||||
|
<div style="background:rgba(37,99,235,.05);border:1px solid rgba(37,99,235,.1);border-radius:8px;padding:1rem;margin-top:.5rem">
|
||||||
|
<div style="font-size:.82rem;color:var(--muted);margin-bottom:.75rem;font-weight:600">🔔 <?= tr('garage_next_reminder') ?></div>
|
||||||
|
<div class="form-row">
|
||||||
|
<div class="form-group"><label class="form-label"><?= tr('garage_next_date') ?></label><input class="form-control" id="maintenance-next-date" name="next_date" type="date"></div>
|
||||||
|
<div class="form-group"><label class="form-label"><?= tr('garage_next_km') ?></label><input class="form-control" id="maintenance-next-km" name="next_km" type="number" placeholder="95000"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="form-group" style="margin-top:1rem"><label class="form-label"><?= tr('garage_notes') ?></label><textarea class="form-control" id="maintenance-notes" name="notes" rows="2"></textarea></div>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
<div class="modal-footer">
|
||||||
|
<button class="btn btn-secondary" onclick="closeModal('modal-maintenance')"><?= tr('btn_cancel') ?></button>
|
||||||
|
<button class="btn btn-primary" onclick="saveMaintenance()"><?= tr('btn_save') ?></button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- MODAL: PART -->
|
||||||
|
<div id="modal-part" class="modal-backdrop">
|
||||||
|
<div class="modal">
|
||||||
|
<div class="modal-header">
|
||||||
|
<div class="modal-title" id="modal-part-title"><?= tr('garage_add_part') ?></div>
|
||||||
|
<button class="modal-close" onclick="closeModal('modal-part')">✕</button>
|
||||||
|
</div>
|
||||||
|
<div class="modal-body">
|
||||||
|
<form id="form-part" onsubmit="return false">
|
||||||
|
<input type="hidden" id="form-part-id" name="id">
|
||||||
|
<input type="hidden" id="part-vehicle-id" name="vehicle_id">
|
||||||
|
<div class="form-row">
|
||||||
|
<div class="form-group"><label class="form-label"><?= tr('garage_part_name') ?> *</label><input class="form-control" id="part-name" name="name" required placeholder="Filtre à huile"></div>
|
||||||
|
<div class="form-group"><label class="form-label"><?= tr('garage_category') ?></label>
|
||||||
|
<select class="form-control" id="part-category" name="category">
|
||||||
|
<option>Moteur</option><option>Freinage</option><option>Suspension</option><option>Transmission</option>
|
||||||
|
<option>Carrosserie</option><option>Electricite</option><option>Eclairage</option><option>Filtration</option>
|
||||||
|
<option>Refroidissement</option><option>Echappement</option><option>Pneumatiques</option><option>Autre</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="form-row">
|
||||||
|
<div class="form-group"><label class="form-label"><?= tr('garage_brand') ?></label><input class="form-control" id="part-brand" name="brand" placeholder="Bosch, NGK..."></div>
|
||||||
|
<div class="form-group"><label class="form-label"><?= tr('garage_reference') ?></label><input class="form-control" id="part-reference" name="reference"></div>
|
||||||
|
</div>
|
||||||
|
<div class="form-row-3">
|
||||||
|
<div class="form-group"><label class="form-label"><?= tr('garage_unit_price') ?></label><input class="form-control" id="part-price" name="price" type="number" step="0.01" placeholder="12.50"></div>
|
||||||
|
<div class="form-group"><label class="form-label"><?= tr('garage_quantity') ?></label><input class="form-control" id="part-quantity" name="quantity" type="number" value="1" min="1"></div>
|
||||||
|
<div class="form-group"><label class="form-label"><?= tr('garage_unit') ?></label>
|
||||||
|
<select class="form-control" id="part-unit" name="unit">
|
||||||
|
<option value="piece">pièce</option><option value="litre">litre</option><option value="kg">kg</option><option value="m">mètre</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="form-row">
|
||||||
|
<div class="form-group"><label class="form-label"><?= tr('garage_supplier') ?></label><input class="form-control" id="part-supplier" name="supplier" placeholder="Amazon, Oscaro..."></div>
|
||||||
|
<div class="form-group"><label class="form-label"><?= tr('garage_purchase_date') ?></label><input class="form-control" id="part-purchase-date" name="purchase_date" type="date"></div>
|
||||||
|
</div>
|
||||||
|
<div class="form-group">
|
||||||
|
<label class="form-label"><?= tr('garage_photo') ?></label>
|
||||||
|
<input class="form-control" id="part-photo" name="photo" type="file" accept="image/*" onchange="previewPhoto('part-photo','part-photo-preview')">
|
||||||
|
<img id="part-photo-preview" style="display:none;max-height:100px;margin-top:.5rem;border-radius:6px" alt="">
|
||||||
|
</div>
|
||||||
|
<div class="form-group"><label class="form-label"><?= tr('garage_notes') ?></label><textarea class="form-control" id="part-notes" name="notes" rows="2"></textarea></div>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
<div class="modal-footer">
|
||||||
|
<button class="btn btn-secondary" onclick="closeModal('modal-part')"><?= tr('btn_cancel') ?></button>
|
||||||
|
<button class="btn btn-primary" onclick="savePart()"><?= tr('btn_save') ?></button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- MODAL: UPLOAD PHOTO -->
|
||||||
|
<div id="modal-upload-photo" class="modal-backdrop">
|
||||||
|
<div class="modal" style="max-width:400px">
|
||||||
|
<div class="modal-header">
|
||||||
|
<div class="modal-title">📷 <?= tr('garage_change_photo') ?></div>
|
||||||
|
<button class="modal-close" onclick="closeModal('modal-upload-photo')">✕</button>
|
||||||
|
</div>
|
||||||
|
<div class="modal-body">
|
||||||
|
<input type="hidden" id="upload-vehicle-id">
|
||||||
|
<div class="form-group"><label class="form-label"><?= tr('garage_new_photo') ?></label><input class="form-control" id="upload-photo-file" type="file" accept="image/*"></div>
|
||||||
|
</div>
|
||||||
|
<div class="modal-footer">
|
||||||
|
<button class="btn btn-secondary" onclick="closeModal('modal-upload-photo')"><?= tr('btn_cancel') ?></button>
|
||||||
|
<button class="btn btn-primary" onclick="doUploadPhoto()"><?= tr('garage_update_photo') ?></button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<script src="/modules/garage/assets/garage.js"></script>
|
||||||
|
|
||||||
|
<?php require __DIR__ . '/footer.php'; ?>
|
||||||
@@ -50,6 +50,7 @@ $currentLang = $_SESSION['app_lang'] ?? 'fr';
|
|||||||
<?php if (in_array('budget', $mods)): ?><a href="/budget.php" class="pf-nav-link <?= $activePage === 'budget' ? 'pf-nav-link--active' : '' ?>"><?= tr('menu_budget') ?></a><?php endif; ?>
|
<?php if (in_array('budget', $mods)): ?><a href="/budget.php" class="pf-nav-link <?= $activePage === 'budget' ? 'pf-nav-link--active' : '' ?>"><?= tr('menu_budget') ?></a><?php endif; ?>
|
||||||
<?php if (in_array('holidays', $mods)): ?><a href="/holidays.php" class="pf-nav-link <?= $activePage === 'holidays' ? 'pf-nav-link--active' : '' ?>"><?= tr('menu_holidays') ?></a><?php endif; ?>
|
<?php if (in_array('holidays', $mods)): ?><a href="/holidays.php" class="pf-nav-link <?= $activePage === 'holidays' ? 'pf-nav-link--active' : '' ?>"><?= tr('menu_holidays') ?></a><?php endif; ?>
|
||||||
<?php if (in_array('gifts', $mods)): ?><a href="/gift-list.php" class="pf-nav-link <?= $activePage === 'gift-list' ? 'pf-nav-link--active' : '' ?>"><?= tr('menu_gifts') ?></a><?php endif; ?>
|
<?php if (in_array('gifts', $mods)): ?><a href="/gift-list.php" class="pf-nav-link <?= $activePage === 'gift-list' ? 'pf-nav-link--active' : '' ?>"><?= tr('menu_gifts') ?></a><?php endif; ?>
|
||||||
|
<?php if (in_array('garage', $mods)): ?><a href="/garage.php" class="pf-nav-link <?= $activePage === 'garage' ? 'pf-nav-link--active' : '' ?>"><?= tr('menu_garage') ?></a><?php endif; ?>
|
||||||
</nav>
|
</nav>
|
||||||
<?php endif; ?>
|
<?php endif; ?>
|
||||||
|
|
||||||
@@ -90,6 +91,7 @@ $currentLang = $_SESSION['app_lang'] ?? 'fr';
|
|||||||
<?php if (in_array('budget', $mods)): ?><a href="/budget.php" class="pf-mobile-nav-link">💰 <?= tr('menu_budget') ?></a><?php endif; ?>
|
<?php if (in_array('budget', $mods)): ?><a href="/budget.php" class="pf-mobile-nav-link">💰 <?= tr('menu_budget') ?></a><?php endif; ?>
|
||||||
<?php if (in_array('holidays', $mods)): ?><a href="/holidays.php" class="pf-mobile-nav-link">🏖️ <?= tr('menu_holidays') ?></a><?php endif; ?>
|
<?php if (in_array('holidays', $mods)): ?><a href="/holidays.php" class="pf-mobile-nav-link">🏖️ <?= tr('menu_holidays') ?></a><?php endif; ?>
|
||||||
<?php if (in_array('gifts', $mods)): ?><a href="/gift-list.php" class="pf-mobile-nav-link">🎁 <?= tr('menu_gifts') ?></a><?php endif; ?>
|
<?php if (in_array('gifts', $mods)): ?><a href="/gift-list.php" class="pf-mobile-nav-link">🎁 <?= tr('menu_gifts') ?></a><?php endif; ?>
|
||||||
|
<?php if (in_array('garage', $mods)): ?><a href="/garage.php" class="pf-mobile-nav-link">🚗 <?= tr('menu_garage') ?></a><?php endif; ?>
|
||||||
<a href="/settings.php" class="pf-mobile-nav-link">⚙️ Paramètres</a>
|
<a href="/settings.php" class="pf-mobile-nav-link">⚙️ Paramètres</a>
|
||||||
<?php if (!empty($_SESSION['user']['is_admin'])): ?>
|
<?php if (!empty($_SESSION['user']['is_admin'])): ?>
|
||||||
<a href="/admin/" class="pf-mobile-nav-link" style="color:#2563eb">🛡️ Admin</a>
|
<a href="/admin/" class="pf-mobile-nav-link" style="color:#2563eb">🛡️ Admin</a>
|
||||||
|
|||||||
+53
-2
@@ -544,5 +544,56 @@ return [
|
|||||||
'gift_filter_all_adults' => 'Tots els adults',
|
'gift_filter_all_adults' => 'Tots els adults',
|
||||||
'gift_empty_state_no_gifts' => 'Cap regal de moment.',
|
'gift_empty_state_no_gifts' => 'Cap regal de moment.',
|
||||||
'gift_empty_state_no_filter' => 'Cap regal correspon al filtre.',
|
'gift_empty_state_no_filter' => 'Cap regal correspon al filtre.',
|
||||||
'gift_view_matrix' => 'Veure la matriu detallada',
|
// ==========================================
|
||||||
];
|
// GARAGE MANAGER
|
||||||
|
// ==========================================
|
||||||
|
'menu_garage' => 'Garatge',
|
||||||
|
'garage_page_title' => 'HouseHub - Garatge',
|
||||||
|
'garage_stat_vehicles' => 'Vehicles',
|
||||||
|
'garage_stat_maintenances' => 'Manteniments',
|
||||||
|
'garage_stat_parts' => 'Peces',
|
||||||
|
'garage_stat_cost' => 'Cost total',
|
||||||
|
'garage_my_vehicles' => 'Els meus vehicles',
|
||||||
|
'garage_reminders' => 'Recordatoris i propers manteniments',
|
||||||
|
'garage_vehicles_title' => 'Els meus vehicles',
|
||||||
|
'garage_all_parts' => 'Totes les peces',
|
||||||
|
'garage_parts_count' => 'peces',
|
||||||
|
'garage_maintenances' => 'Manteniments',
|
||||||
|
'garage_parts' => 'Peces',
|
||||||
|
'garage_add' => 'Afegir',
|
||||||
|
'garage_add_vehicle' => 'Afegir un vehicle',
|
||||||
|
'garage_add_maintenance' => 'Afegir un manteniment',
|
||||||
|
'garage_add_part' => 'Afegir una peça',
|
||||||
|
'garage_vehicle_name' => 'Nom del vehicle',
|
||||||
|
'garage_brand' => 'Marca',
|
||||||
|
'garage_model' => 'Model',
|
||||||
|
'garage_year' => 'Any',
|
||||||
|
'garage_plate' => 'Matrícula',
|
||||||
|
'garage_fuel' => 'Combustible',
|
||||||
|
'garage_km' => 'Quilometratge actual',
|
||||||
|
'garage_color' => 'Color',
|
||||||
|
'garage_purchase_date' => 'Data de compra',
|
||||||
|
'garage_purchase_price' => 'Preu de compra (€)',
|
||||||
|
'garage_photo' => 'Foto',
|
||||||
|
'garage_notes' => 'Notes',
|
||||||
|
'garage_maint_type' => 'Tipus de manteniment',
|
||||||
|
'garage_date' => 'Data',
|
||||||
|
'garage_km_at' => 'Quilometratge en el moment',
|
||||||
|
'garage_labor_cost' => 'Cost mà d\'obra (€)',
|
||||||
|
'garage_description' => 'Descripció',
|
||||||
|
'garage_mechanic' => 'Mecànic',
|
||||||
|
'garage_garage' => 'Taller',
|
||||||
|
'garage_next_reminder' => 'Proper manteniment (recordatori)',
|
||||||
|
'garage_next_date' => 'Data prevista',
|
||||||
|
'garage_next_km' => 'Quilometratge previst',
|
||||||
|
'garage_part_name' => 'Nom de la peça',
|
||||||
|
'garage_category' => 'Categoria',
|
||||||
|
'garage_reference' => 'Referència',
|
||||||
|
'garage_unit_price' => 'Preu unitari (€)',
|
||||||
|
'garage_quantity' => 'Quantitat',
|
||||||
|
'garage_unit' => 'Unitat',
|
||||||
|
'garage_supplier' => 'Proveïdor',
|
||||||
|
'garage_change_photo' => 'Canviar la foto',
|
||||||
|
'garage_new_photo' => 'Nova foto',
|
||||||
|
'garage_update_photo' => 'Actualitzar',
|
||||||
|
];
|
||||||
|
|||||||
@@ -529,4 +529,57 @@ return [
|
|||||||
'gift_empty_state_no_gifts' => 'No gifts yet.',
|
'gift_empty_state_no_gifts' => 'No gifts yet.',
|
||||||
'gift_empty_state_no_filter' => 'No gifts match the filter.',
|
'gift_empty_state_no_filter' => 'No gifts match the filter.',
|
||||||
'gift_view_matrix' => 'View detailed matrix',
|
'gift_view_matrix' => 'View detailed matrix',
|
||||||
|
|
||||||
|
// ==========================================
|
||||||
|
// GARAGE MANAGER
|
||||||
|
// ==========================================
|
||||||
|
'menu_garage' => 'Garage',
|
||||||
|
'garage_page_title' => 'HouseHub - Garage',
|
||||||
|
'garage_stat_vehicles' => 'Vehicles',
|
||||||
|
'garage_stat_maintenances' => 'Services',
|
||||||
|
'garage_stat_parts' => 'Parts',
|
||||||
|
'garage_stat_cost' => 'Total cost',
|
||||||
|
'garage_my_vehicles' => 'My vehicles',
|
||||||
|
'garage_reminders' => 'Reminders & upcoming services',
|
||||||
|
'garage_vehicles_title' => 'My vehicles',
|
||||||
|
'garage_all_parts' => 'All parts',
|
||||||
|
'garage_parts_count' => 'parts',
|
||||||
|
'garage_maintenances' => 'Services',
|
||||||
|
'garage_parts' => 'Parts',
|
||||||
|
'garage_add' => 'Add',
|
||||||
|
'garage_add_vehicle' => 'Add a vehicle',
|
||||||
|
'garage_add_maintenance' => 'Add a service',
|
||||||
|
'garage_add_part' => 'Add a part',
|
||||||
|
'garage_vehicle_name' => 'Vehicle name',
|
||||||
|
'garage_brand' => 'Make',
|
||||||
|
'garage_model' => 'Model',
|
||||||
|
'garage_year' => 'Year',
|
||||||
|
'garage_plate' => 'Licence plate',
|
||||||
|
'garage_fuel' => 'Fuel type',
|
||||||
|
'garage_km' => 'Current mileage',
|
||||||
|
'garage_color' => 'Colour',
|
||||||
|
'garage_purchase_date' => 'Purchase date',
|
||||||
|
'garage_purchase_price' => 'Purchase price (€)',
|
||||||
|
'garage_photo' => 'Photo',
|
||||||
|
'garage_notes' => 'Notes',
|
||||||
|
'garage_maint_type' => 'Service type',
|
||||||
|
'garage_date' => 'Date',
|
||||||
|
'garage_km_at' => 'Mileage at the time',
|
||||||
|
'garage_labor_cost' => 'Labour cost (€)',
|
||||||
|
'garage_description' => 'Description',
|
||||||
|
'garage_mechanic' => 'Mechanic',
|
||||||
|
'garage_garage' => 'Garage / Workshop',
|
||||||
|
'garage_next_reminder' => 'Next service (reminder)',
|
||||||
|
'garage_next_date' => 'Planned date',
|
||||||
|
'garage_next_km' => 'Planned mileage',
|
||||||
|
'garage_part_name' => 'Part name',
|
||||||
|
'garage_category' => 'Category',
|
||||||
|
'garage_reference' => 'Reference',
|
||||||
|
'garage_unit_price' => 'Unit price (€)',
|
||||||
|
'garage_quantity' => 'Quantity',
|
||||||
|
'garage_unit' => 'Unit',
|
||||||
|
'garage_supplier' => 'Supplier',
|
||||||
|
'garage_change_photo' => 'Change photo',
|
||||||
|
'garage_new_photo' => 'New photo',
|
||||||
|
'garage_update_photo' => 'Update',
|
||||||
];
|
];
|
||||||
|
|||||||
+53
-1
@@ -547,4 +547,56 @@ return [
|
|||||||
'gift_empty_state_no_gifts' => 'Aucun cadeau pour le moment.',
|
'gift_empty_state_no_gifts' => 'Aucun cadeau pour le moment.',
|
||||||
'gift_empty_state_no_filter' => 'Aucun cadeau ne correspond au filtre.',
|
'gift_empty_state_no_filter' => 'Aucun cadeau ne correspond au filtre.',
|
||||||
'gift_view_matrix' => 'Voir la matrice détaillée',
|
'gift_view_matrix' => 'Voir la matrice détaillée',
|
||||||
];
|
// ==========================================
|
||||||
|
// GARAGE MANAGER
|
||||||
|
// ==========================================
|
||||||
|
'menu_garage' => 'Garage',
|
||||||
|
'garage_page_title' => 'HouseHub - Garage',
|
||||||
|
'garage_stat_vehicles' => 'Véhicules',
|
||||||
|
'garage_stat_maintenances' => 'Entretiens',
|
||||||
|
'garage_stat_parts' => 'Pièces',
|
||||||
|
'garage_stat_cost' => 'Coût total',
|
||||||
|
'garage_my_vehicles' => 'Mes véhicules',
|
||||||
|
'garage_reminders' => 'Rappels & prochains entretiens',
|
||||||
|
'garage_vehicles_title' => 'Mes véhicules',
|
||||||
|
'garage_all_parts' => 'Toutes les pièces',
|
||||||
|
'garage_parts_count' => 'pièces',
|
||||||
|
'garage_maintenances' => 'Entretiens',
|
||||||
|
'garage_parts' => 'Pièces',
|
||||||
|
'garage_add' => 'Ajouter',
|
||||||
|
'garage_add_vehicle' => 'Ajouter un véhicule',
|
||||||
|
'garage_add_maintenance' => 'Ajouter un entretien',
|
||||||
|
'garage_add_part' => 'Ajouter une pièce',
|
||||||
|
'garage_vehicle_name' => 'Nom du véhicule',
|
||||||
|
'garage_brand' => 'Marque',
|
||||||
|
'garage_model' => 'Modèle',
|
||||||
|
'garage_year' => 'Année',
|
||||||
|
'garage_plate' => 'Immatriculation',
|
||||||
|
'garage_fuel' => 'Carburant',
|
||||||
|
'garage_km' => 'Kilométrage actuel',
|
||||||
|
'garage_color' => 'Couleur',
|
||||||
|
'garage_purchase_date' => 'Date d\'achat',
|
||||||
|
'garage_purchase_price' => 'Prix d\'achat (€)',
|
||||||
|
'garage_photo' => 'Photo',
|
||||||
|
'garage_notes' => 'Notes',
|
||||||
|
'garage_maint_type' => 'Type d\'entretien',
|
||||||
|
'garage_date' => 'Date',
|
||||||
|
'garage_km_at' => 'Kilométrage au moment',
|
||||||
|
'garage_labor_cost' => 'Coût main d\'œuvre (€)',
|
||||||
|
'garage_description' => 'Description',
|
||||||
|
'garage_mechanic' => 'Mécanicien',
|
||||||
|
'garage_garage' => 'Garage / Atelier',
|
||||||
|
'garage_next_reminder' => 'Prochain entretien (rappel)',
|
||||||
|
'garage_next_date' => 'Date prévue',
|
||||||
|
'garage_next_km' => 'Kilométrage prévu',
|
||||||
|
'garage_part_name' => 'Nom de la pièce',
|
||||||
|
'garage_category' => 'Catégorie',
|
||||||
|
'garage_reference' => 'Référence',
|
||||||
|
'garage_unit_price' => 'Prix unitaire (€)',
|
||||||
|
'garage_quantity' => 'Quantité',
|
||||||
|
'garage_unit' => 'Unité',
|
||||||
|
'garage_supplier' => 'Fournisseur',
|
||||||
|
'garage_change_photo' => 'Changer la photo',
|
||||||
|
'garage_new_photo' => 'Nouvelle photo',
|
||||||
|
'garage_update_photo' => 'Mettre à jour',
|
||||||
|
];
|
||||||
|
|||||||
@@ -0,0 +1,161 @@
|
|||||||
|
<?php
|
||||||
|
require_once dirname(__DIR__, 2) . '/includes/auth.php';
|
||||||
|
require_login();
|
||||||
|
|
||||||
|
header('Content-Type: application/json');
|
||||||
|
header('Access-Control-Allow-Methods: GET, POST, PUT, DELETE, OPTIONS');
|
||||||
|
if ($_SERVER['REQUEST_METHOD'] === 'OPTIONS') { http_response_code(200); exit; }
|
||||||
|
|
||||||
|
require_once dirname(__DIR__, 2) . '/includes/db.php';
|
||||||
|
|
||||||
|
$UPLOAD_DIR = '/uploads/garage/';
|
||||||
|
if (!is_dir($UPLOAD_DIR)) { @mkdir($UPLOAD_DIR, 0755, true); }
|
||||||
|
|
||||||
|
$method = $_SERVER['REQUEST_METHOD'];
|
||||||
|
$action = $_GET['action'] ?? '';
|
||||||
|
|
||||||
|
function gOk($d) { echo json_encode(['ok' => true, 'data' => $d]); exit; }
|
||||||
|
function gErr($m, $c = 400) { http_response_code($c); echo json_encode(['ok' => false, 'error' => $m]); exit; }
|
||||||
|
function gBody() { return json_decode(file_get_contents('php://input'), true) ?? []; }
|
||||||
|
|
||||||
|
function handleUpload(string $field, string $dir): ?string {
|
||||||
|
if (!isset($_FILES[$field]) || $_FILES[$field]['error'] !== 0) return null;
|
||||||
|
$ext = strtolower(pathinfo($_FILES[$field]['name'], PATHINFO_EXTENSION));
|
||||||
|
if (!in_array($ext, ['jpg','jpeg','png','gif','webp'])) return null;
|
||||||
|
$fname = uniqid('g', true) . '.' . $ext;
|
||||||
|
if (move_uploaded_file($_FILES[$field]['tmp_name'], $dir . $fname)) return $fname;
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
|
||||||
|
// ─── Vehicles ─────────────────────────────────────────────────────────────────
|
||||||
|
if ($action === 'vehicles') {
|
||||||
|
if ($method === 'GET') {
|
||||||
|
$id = $_GET['id'] ?? null;
|
||||||
|
if ($id) {
|
||||||
|
$v = $pdo->prepare("SELECT * FROM pf_vehicles WHERE id = ?"); $v->execute([$id]);
|
||||||
|
$vehicle = $v->fetch(); if (!$vehicle) gErr('Véhicule introuvable', 404);
|
||||||
|
$s = $pdo->prepare("SELECT COUNT(*) as cnt, COALESCE(SUM(cost),0) as total FROM pf_maintenances WHERE vehicle_id = ?"); $s->execute([$id]); $vehicle['stats'] = $s->fetch();
|
||||||
|
$p = $pdo->prepare("SELECT COUNT(*) as cnt, COALESCE(SUM(price*quantity),0) as total FROM pf_parts WHERE vehicle_id = ?"); $p->execute([$id]); $vehicle['parts_stats'] = $p->fetch();
|
||||||
|
gOk($vehicle);
|
||||||
|
}
|
||||||
|
$stmt = $pdo->query("SELECT v.*, (SELECT COUNT(*) FROM pf_maintenances m WHERE m.vehicle_id = v.id) as maintenance_count, (SELECT COALESCE(SUM(cost),0) FROM pf_maintenances m WHERE m.vehicle_id = v.id) as total_cost, (SELECT date FROM pf_maintenances m WHERE m.vehicle_id = v.id ORDER BY date DESC LIMIT 1) as last_maintenance FROM pf_vehicles v ORDER BY v.created_at DESC");
|
||||||
|
gOk($stmt->fetchAll());
|
||||||
|
}
|
||||||
|
if ($method === 'POST') {
|
||||||
|
$photo = handleUpload('photo', $UPLOAD_DIR); $d = $_POST ?: gBody();
|
||||||
|
$stmt = $pdo->prepare("INSERT INTO pf_vehicles (name,brand,model,year,license_plate,vin,fuel_type,color,purchase_date,purchase_price,current_km,photo,notes) VALUES (?,?,?,?,?,?,?,?,?,?,?,?,?)");
|
||||||
|
$stmt->execute([$d['name']??'', $d['brand']??'', $d['model']??'', $d['year']??null, $d['license_plate']??null, $d['vin']??null, $d['fuel_type']??'Essence', $d['color']??null, $d['purchase_date']??null, $d['purchase_price']??null, $d['current_km']??0, $photo, $d['notes']??null]);
|
||||||
|
gOk(['id' => $pdo->lastInsertId()]);
|
||||||
|
}
|
||||||
|
if ($method === 'PUT') {
|
||||||
|
$id = $_GET['id'] ?? null; if (!$id) gErr('ID manquant'); $d = gBody();
|
||||||
|
$fields = ['name','brand','model','year','license_plate','vin','fuel_type','color','purchase_date','purchase_price','current_km','notes'];
|
||||||
|
$sets = array_map(fn($f) => "$f = ?", $fields); $vals = array_map(fn($f) => $d[$f] ?? null, $fields); $vals[] = $id;
|
||||||
|
$pdo->prepare("UPDATE pf_vehicles SET " . implode(', ', $sets) . ", updated_at = NOW() WHERE id = ?")->execute($vals);
|
||||||
|
gOk(['updated' => true]);
|
||||||
|
}
|
||||||
|
if ($method === 'DELETE') {
|
||||||
|
$id = $_GET['id'] ?? null; if (!$id) gErr('ID manquant');
|
||||||
|
$v = $pdo->prepare("SELECT photo FROM pf_vehicles WHERE id=?"); $v->execute([$id]); $row = $v->fetch(); if ($row['photo']) @unlink($UPLOAD_DIR . $row['photo']);
|
||||||
|
$pdo->prepare("DELETE FROM pf_vehicles WHERE id = ?")->execute([$id]); gOk(['deleted' => true]);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// ─── Maintenances ─────────────────────────────────────────────────────────────
|
||||||
|
if ($action === 'maintenances') {
|
||||||
|
$vid = $_GET['vehicle_id'] ?? null;
|
||||||
|
if ($method === 'GET') {
|
||||||
|
if ($vid) {
|
||||||
|
$stmt = $pdo->prepare("SELECT m.*, GROUP_CONCAT(p.name SEPARATOR ', ') as parts_names, COUNT(p.id) as parts_count, COALESCE(SUM(p.price*p.quantity),0) as parts_cost FROM pf_maintenances m LEFT JOIN pf_parts p ON p.maintenance_id = m.id WHERE m.vehicle_id = ? GROUP BY m.id ORDER BY m.date DESC, m.created_at DESC");
|
||||||
|
$stmt->execute([$vid]); gOk($stmt->fetchAll());
|
||||||
|
}
|
||||||
|
$stmt = $pdo->query("SELECT m.*, v.name as vehicle_name, v.license_plate, v.current_km FROM pf_maintenances m JOIN pf_vehicles v ON v.id = m.vehicle_id WHERE m.next_date IS NOT NULL OR m.next_km IS NOT NULL ORDER BY m.next_date ASC");
|
||||||
|
gOk($stmt->fetchAll());
|
||||||
|
}
|
||||||
|
if ($method === 'POST') {
|
||||||
|
$photo = handleUpload('invoice_photo', $UPLOAD_DIR); $d = $_POST ?: gBody();
|
||||||
|
if (!($d['vehicle_id'] ?? null)) gErr('vehicle_id manquant');
|
||||||
|
$stmt = $pdo->prepare("INSERT INTO pf_maintenances (vehicle_id,type,description,date,km,cost,mechanic,garage_name,next_km,next_date,invoice_photo,notes) VALUES (?,?,?,?,?,?,?,?,?,?,?,?)");
|
||||||
|
$stmt->execute([$d['vehicle_id'], $d['type']??'', $d['description']??null, $d['date']??date('Y-m-d'), $d['km']??null, $d['cost']??0, $d['mechanic']??null, $d['garage']??null, $d['next_km']??null, $d['next_date']??null, $photo, $d['notes']??null]);
|
||||||
|
$mid = $pdo->lastInsertId();
|
||||||
|
if (!empty($d['km'])) { $pdo->prepare("UPDATE pf_vehicles SET current_km = GREATEST(current_km, ?), updated_at = NOW() WHERE id = ?")->execute([$d['km'], $d['vehicle_id']]); }
|
||||||
|
gOk(['id' => $mid]);
|
||||||
|
}
|
||||||
|
if ($method === 'PUT') {
|
||||||
|
$id = $_GET['id'] ?? null; if (!$id) gErr('ID manquant'); $d = gBody();
|
||||||
|
$fields = ['type','description','date','km','cost','mechanic','garage_name','next_km','next_date','notes'];
|
||||||
|
$sets = array_map(fn($f) => "$f = ?", $fields); $vals = array_map(fn($f) => $d[$f] ?? null, $fields); $vals[] = $id;
|
||||||
|
$pdo->prepare("UPDATE pf_maintenances SET " . implode(', ', $sets) . " WHERE id = ?")->execute($vals); gOk(['updated' => true]);
|
||||||
|
}
|
||||||
|
if ($method === 'DELETE') {
|
||||||
|
$id = $_GET['id'] ?? null; if (!$id) gErr('ID manquant');
|
||||||
|
$pdo->prepare("DELETE FROM pf_maintenances WHERE id = ?")->execute([$id]); gOk(['deleted' => true]);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// ─── Parts ────────────────────────────────────────────────────────────────────
|
||||||
|
if ($action === 'parts') {
|
||||||
|
if ($method === 'GET') {
|
||||||
|
$vid = $_GET['vehicle_id'] ?? null; $mid = $_GET['maintenance_id'] ?? null;
|
||||||
|
if ($mid) { $stmt = $pdo->prepare("SELECT * FROM pf_parts WHERE maintenance_id = ? ORDER BY created_at DESC"); $stmt->execute([$mid]); gOk($stmt->fetchAll()); }
|
||||||
|
if ($vid) { $stmt = $pdo->prepare("SELECT p.*, m.type as maintenance_type, m.date as maintenance_date FROM pf_parts p LEFT JOIN pf_maintenances m ON m.id = p.maintenance_id WHERE p.vehicle_id = ? ORDER BY p.created_at DESC"); $stmt->execute([$vid]); gOk($stmt->fetchAll()); }
|
||||||
|
$stmt = $pdo->query("SELECT p.*, v.name as vehicle_name, m.type as maintenance_type, m.date as maintenance_date FROM pf_parts p LEFT JOIN pf_vehicles v ON v.id = p.vehicle_id LEFT JOIN pf_maintenances m ON m.id = p.maintenance_id ORDER BY p.created_at DESC");
|
||||||
|
gOk($stmt->fetchAll());
|
||||||
|
}
|
||||||
|
if ($method === 'POST') {
|
||||||
|
$photo = handleUpload('photo', $UPLOAD_DIR); $d = $_POST ?: gBody();
|
||||||
|
$stmt = $pdo->prepare("INSERT INTO pf_parts (vehicle_id,maintenance_id,brand,reference,name,category,price,quantity,unit,supplier,purchase_date,photo,notes) VALUES (?,?,?,?,?,?,?,?,?,?,?,?,?)");
|
||||||
|
$stmt->execute([$d['vehicle_id']??null, $d['maintenance_id']??null, $d['brand']??null, $d['reference']??null, $d['name']??'', $d['category']??'Autre', $d['price']??0, $d['quantity']??1, $d['unit']??'pièce', $d['supplier']??null, $d['purchase_date']??null, $photo, $d['notes']??null]);
|
||||||
|
gOk(['id' => $pdo->lastInsertId()]);
|
||||||
|
}
|
||||||
|
if ($method === 'PUT') {
|
||||||
|
$id = $_GET['id'] ?? null; if (!$id) gErr('ID manquant'); $d = gBody();
|
||||||
|
$fields = ['brand','reference','name','category','price','quantity','unit','supplier','purchase_date','notes'];
|
||||||
|
$sets = array_map(fn($f) => "$f = ?", $fields); $vals = array_map(fn($f) => $d[$f] ?? null, $fields); $vals[] = $id;
|
||||||
|
$pdo->prepare("UPDATE pf_parts SET " . implode(', ', $sets) . " WHERE id = ?")->execute($vals); gOk(['updated' => true]);
|
||||||
|
}
|
||||||
|
if ($method === 'DELETE') {
|
||||||
|
$id = $_GET['id'] ?? null; if (!$id) gErr('ID manquant');
|
||||||
|
$r = $pdo->prepare("SELECT photo FROM pf_parts WHERE id=?"); $r->execute([$id]); $row = $r->fetch(); if ($row['photo']) @unlink($UPLOAD_DIR . $row['photo']);
|
||||||
|
$pdo->prepare("DELETE FROM pf_parts WHERE id = ?")->execute([$id]); gOk(['deleted' => true]);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// ─── Stats ────────────────────────────────────────────────────────────────────
|
||||||
|
if ($action === 'stats') {
|
||||||
|
gOk([
|
||||||
|
'vehicles' => $pdo->query("SELECT COUNT(*) FROM pf_vehicles")->fetchColumn(),
|
||||||
|
'maintenances' => $pdo->query("SELECT COUNT(*) FROM pf_maintenances")->fetchColumn(),
|
||||||
|
'parts' => $pdo->query("SELECT COUNT(*) FROM pf_parts")->fetchColumn(),
|
||||||
|
'total_cost' => $pdo->query("SELECT COALESCE(SUM(cost),0) FROM pf_maintenances")->fetchColumn(),
|
||||||
|
'total_parts_cost' => $pdo->query("SELECT COALESCE(SUM(price*quantity),0) FROM pf_parts")->fetchColumn(),
|
||||||
|
'upcoming_reminders'=> $pdo->query("SELECT COUNT(*) FROM pf_maintenances WHERE next_date >= CURDATE() OR next_km IS NOT NULL")->fetchColumn(),
|
||||||
|
]);
|
||||||
|
}
|
||||||
|
|
||||||
|
// ─── Photo upload ──────────────────────────────────────────────────────────────
|
||||||
|
if ($action === 'upload_vehicle_photo') {
|
||||||
|
$id = $_GET['id'] ?? null; if (!$id) gErr('ID manquant');
|
||||||
|
$photo = handleUpload('photo', $UPLOAD_DIR); if (!$photo) gErr('Upload échoué');
|
||||||
|
$old = $pdo->prepare("SELECT photo FROM pf_vehicles WHERE id=?"); $old->execute([$id]); $row = $old->fetch(); if ($row['photo']) @unlink($UPLOAD_DIR . $row['photo']);
|
||||||
|
$pdo->prepare("UPDATE pf_vehicles SET photo = ?, updated_at = NOW() WHERE id = ?")->execute([$photo, $id]); gOk(['photo' => $photo]);
|
||||||
|
}
|
||||||
|
|
||||||
|
if ($action === 'photo') {
|
||||||
|
$f = basename($_GET['file'] ?? '');
|
||||||
|
if ($f && preg_match('/^[a-zA-Z0-9._-]+$/', $f) && file_exists($UPLOAD_DIR . $f)) {
|
||||||
|
$ext = strtolower(pathinfo($f, PATHINFO_EXTENSION));
|
||||||
|
$mime = ['jpg'=>'image/jpeg','jpeg'=>'image/jpeg','png'=>'image/png','gif'=>'image/gif','webp'=>'image/webp'][$ext] ?? 'image/jpeg';
|
||||||
|
header('Content-Type: ' . $mime);
|
||||||
|
readfile($UPLOAD_DIR . $f);
|
||||||
|
exit;
|
||||||
|
}
|
||||||
|
http_response_code(404); exit;
|
||||||
|
}
|
||||||
|
|
||||||
|
if ($action === 'upload_part_photo') {
|
||||||
|
$id = $_GET['id'] ?? null; if (!$id) gErr('ID manquant');
|
||||||
|
$photo = handleUpload('photo', $UPLOAD_DIR); if (!$photo) gErr('Upload échoué');
|
||||||
|
$pdo->prepare("UPDATE pf_parts SET photo = ? WHERE id = ?")->execute([$photo, $id]); gOk(['photo' => $photo]);
|
||||||
|
}
|
||||||
|
gErr('Action inconnue', 404);
|
||||||
@@ -0,0 +1,361 @@
|
|||||||
|
:root {
|
||||||
|
--bg: #0d1117;
|
||||||
|
--card: #161b22;
|
||||||
|
--border: #30363d;
|
||||||
|
--text: #e6edf3;
|
||||||
|
--muted: #8b949e;
|
||||||
|
--primary: #2563eb;
|
||||||
|
--success: #22c55e;
|
||||||
|
--warning: #f59e0b;
|
||||||
|
--danger: #ef4444;
|
||||||
|
--info: #06b6d4;
|
||||||
|
--radius: 8px;
|
||||||
|
--radius-lg: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
|
||||||
|
html { font-size: 15px; }
|
||||||
|
body { background: var(--bg); color: var(--text); font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; min-height: 100vh; }
|
||||||
|
a { color: var(--primary); text-decoration: none; }
|
||||||
|
a:hover { text-decoration: underline; }
|
||||||
|
img { max-width: 100%; display: block; }
|
||||||
|
|
||||||
|
/* NAVBAR */
|
||||||
|
.navbar {
|
||||||
|
position: sticky; top: 0; z-index: 100;
|
||||||
|
background: var(--card);
|
||||||
|
border-bottom: 1px solid var(--border);
|
||||||
|
padding: 0 1.5rem;
|
||||||
|
display: flex; align-items: center; gap: 1.5rem;
|
||||||
|
height: 56px;
|
||||||
|
}
|
||||||
|
.navbar-brand {
|
||||||
|
font-size: 1.15rem; font-weight: 700; color: var(--text);
|
||||||
|
text-decoration: none; white-space: nowrap;
|
||||||
|
}
|
||||||
|
.navbar-brand:hover { text-decoration: none; color: var(--primary); }
|
||||||
|
.navbar-nav { display: flex; gap: 0.25rem; margin-left: auto; }
|
||||||
|
.navbar-nav a {
|
||||||
|
color: var(--muted); font-size: 0.9rem; font-weight: 500;
|
||||||
|
padding: 0.35rem 0.75rem; border-radius: var(--radius);
|
||||||
|
transition: background 0.15s, color 0.15s;
|
||||||
|
}
|
||||||
|
.navbar-nav a:hover, .navbar-nav a.active {
|
||||||
|
background: rgba(37,99,235,0.15); color: var(--primary); text-decoration: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* CONTAINER */
|
||||||
|
.container { max-width: 1200px; margin: 0 auto; padding: 1.5rem; }
|
||||||
|
|
||||||
|
/* PAGES */
|
||||||
|
.page { display: none; }
|
||||||
|
.page.active { display: block; }
|
||||||
|
|
||||||
|
/* CARD */
|
||||||
|
.card {
|
||||||
|
background: var(--card); border: 1px solid var(--border);
|
||||||
|
border-radius: var(--radius-lg); padding: 1.25rem;
|
||||||
|
}
|
||||||
|
.card-title { font-size: 1rem; font-weight: 600; margin-bottom: 1rem; color: var(--text); }
|
||||||
|
|
||||||
|
/* STATS GRID */
|
||||||
|
.stats-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 1rem; margin-bottom: 1.5rem; }
|
||||||
|
.stat-pill {
|
||||||
|
background: var(--card); border: 1px solid var(--border);
|
||||||
|
border-radius: var(--radius-lg); padding: 1.25rem 1.5rem;
|
||||||
|
display: flex; flex-direction: column; gap: 0.4rem;
|
||||||
|
border-left: 4px solid var(--border);
|
||||||
|
}
|
||||||
|
.stat-pill-label { font-size: 0.8rem; color: var(--muted); text-transform: uppercase; letter-spacing: 0.05em; }
|
||||||
|
.stat-pill-value { font-size: 1.75rem; font-weight: 700; line-height: 1; }
|
||||||
|
.stat-pill-sub { font-size: 0.8rem; color: var(--muted); }
|
||||||
|
.stat-pill.blue { border-left-color: var(--primary); }
|
||||||
|
.stat-pill.blue .stat-pill-value { color: var(--primary); }
|
||||||
|
.stat-pill.green { border-left-color: var(--success); }
|
||||||
|
.stat-pill.green .stat-pill-value { color: var(--success); }
|
||||||
|
.stat-pill.amber { border-left-color: var(--warning); }
|
||||||
|
.stat-pill.amber .stat-pill-value { color: var(--warning); }
|
||||||
|
.stat-pill.red { border-left-color: var(--danger); }
|
||||||
|
.stat-pill.red .stat-pill-value { color: var(--danger); }
|
||||||
|
.stat-pill.cyan { border-left-color: var(--info); }
|
||||||
|
.stat-pill.cyan .stat-pill-value { color: var(--info); }
|
||||||
|
|
||||||
|
/* VEHICLES GRID */
|
||||||
|
.vehicles-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 1.25rem; }
|
||||||
|
.vehicle-card {
|
||||||
|
background: var(--card); border: 1px solid var(--border);
|
||||||
|
border-radius: var(--radius-lg); overflow: hidden;
|
||||||
|
transition: border-color 0.2s, transform 0.15s;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
.vehicle-card:hover { border-color: var(--primary); transform: translateY(-2px); }
|
||||||
|
.vehicle-card-img {
|
||||||
|
width: 100%; height: 180px; object-fit: cover;
|
||||||
|
background: #1c2128;
|
||||||
|
}
|
||||||
|
.vehicle-card-img-placeholder {
|
||||||
|
width: 100%; height: 180px; background: #1c2128;
|
||||||
|
display: flex; align-items: center; justify-content: center;
|
||||||
|
font-size: 3.5rem; color: var(--muted);
|
||||||
|
}
|
||||||
|
.vehicle-card-body { padding: 1rem; }
|
||||||
|
.vehicle-card-title { font-size: 1rem; font-weight: 600; margin-bottom: 0.35rem; }
|
||||||
|
.vehicle-card-sub { font-size: 0.82rem; color: var(--muted); margin-bottom: 0.6rem; }
|
||||||
|
.vehicle-card-meta { display: flex; flex-wrap: wrap; gap: 0.4rem; align-items: center; }
|
||||||
|
.vehicle-card-footer {
|
||||||
|
padding: 0.75rem 1rem; border-top: 1px solid var(--border);
|
||||||
|
display: flex; justify-content: space-between; align-items: center;
|
||||||
|
font-size: 0.8rem; color: var(--muted);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* FUEL BADGE */
|
||||||
|
.fuel-badge {
|
||||||
|
display: inline-block; font-size: 0.72rem; font-weight: 600;
|
||||||
|
padding: 0.2rem 0.5rem; border-radius: 4px;
|
||||||
|
text-transform: uppercase; letter-spacing: 0.03em;
|
||||||
|
}
|
||||||
|
.fuel-Essence { background: rgba(37,99,235,0.2); color: #60a5fa; }
|
||||||
|
.fuel-Diesel { background: rgba(139,92,246,0.2); color: #a78bfa; }
|
||||||
|
.fuel-Hybride { background: rgba(34,197,94,0.2); color: #4ade80; }
|
||||||
|
.fuel-Electrique { background: rgba(6,182,212,0.2); color: #22d3ee; }
|
||||||
|
|
||||||
|
/* PLATE */
|
||||||
|
.plate {
|
||||||
|
display: inline-block; background: #fff; color: #111;
|
||||||
|
font-family: 'Courier New', monospace; font-weight: 700;
|
||||||
|
font-size: 0.82rem; padding: 0.2rem 0.5rem;
|
||||||
|
border-radius: 4px; letter-spacing: 0.08em;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* TABLE */
|
||||||
|
.table-wrap { overflow-x: auto; border-radius: var(--radius); }
|
||||||
|
.table-wrap table { width: 100%; border-collapse: collapse; font-size: 0.875rem; }
|
||||||
|
.table-wrap table th {
|
||||||
|
background: #1c2128; color: var(--muted); font-weight: 600;
|
||||||
|
text-align: left; padding: 0.65rem 0.9rem;
|
||||||
|
border-bottom: 1px solid var(--border); white-space: nowrap;
|
||||||
|
}
|
||||||
|
.table-wrap table td { padding: 0.65rem 0.9rem; border-bottom: 1px solid var(--border); vertical-align: middle; }
|
||||||
|
.table-wrap table tr:last-child td { border-bottom: none; }
|
||||||
|
.table-wrap table tr:hover td { background: rgba(255,255,255,0.03); }
|
||||||
|
|
||||||
|
/* BADGES */
|
||||||
|
.badge {
|
||||||
|
display: inline-block; font-size: 0.72rem; font-weight: 600;
|
||||||
|
padding: 0.22rem 0.55rem; border-radius: 999px;
|
||||||
|
}
|
||||||
|
.badge-green { background: rgba(34,197,94,0.15); color: #4ade80; }
|
||||||
|
.badge-blue { background: rgba(37,99,235,0.15); color: #60a5fa; }
|
||||||
|
.badge-amber { background: rgba(245,158,11,0.15); color: #fbbf24; }
|
||||||
|
.badge-red { background: rgba(239,68,68,0.15); color: #f87171; }
|
||||||
|
.badge-gray { background: rgba(139,148,158,0.15); color: var(--muted); }
|
||||||
|
.badge-purple { background: rgba(139,92,246,0.15); color: #a78bfa; }
|
||||||
|
|
||||||
|
/* BUTTONS */
|
||||||
|
.btn {
|
||||||
|
display: inline-flex; align-items: center; gap: 0.4rem;
|
||||||
|
padding: 0.5rem 1rem; border-radius: var(--radius);
|
||||||
|
font-size: 0.875rem; font-weight: 500; cursor: pointer;
|
||||||
|
border: 1px solid transparent; transition: all 0.15s;
|
||||||
|
white-space: nowrap; text-decoration: none;
|
||||||
|
}
|
||||||
|
.btn:hover { text-decoration: none; }
|
||||||
|
.btn-primary { background: var(--primary); color: #fff; border-color: var(--primary); }
|
||||||
|
.btn-primary:hover { background: #1d4ed8; border-color: #1d4ed8; }
|
||||||
|
.btn-secondary { background: transparent; color: var(--text); border-color: var(--border); }
|
||||||
|
.btn-secondary:hover { background: rgba(255,255,255,0.05); border-color: var(--muted); }
|
||||||
|
.btn-danger { background: transparent; color: var(--danger); border-color: var(--danger); }
|
||||||
|
.btn-danger:hover { background: rgba(239,68,68,0.1); }
|
||||||
|
.btn-sm { padding: 0.3rem 0.65rem; font-size: 0.8rem; }
|
||||||
|
.btn-icon { padding: 0.35rem; min-width: 32px; justify-content: center; }
|
||||||
|
|
||||||
|
/* FORMS */
|
||||||
|
.form-group { display: flex; flex-direction: column; gap: 0.35rem; }
|
||||||
|
.form-label { font-size: 0.82rem; font-weight: 500; color: var(--muted); }
|
||||||
|
.form-control {
|
||||||
|
background: #1c2128; border: 1px solid var(--border); color: var(--text);
|
||||||
|
border-radius: var(--radius); padding: 0.5rem 0.75rem; font-size: 0.875rem;
|
||||||
|
width: 100%; outline: none; transition: border-color 0.15s;
|
||||||
|
}
|
||||||
|
.form-control:focus { border-color: var(--primary); }
|
||||||
|
.form-control::placeholder { color: var(--muted); }
|
||||||
|
select.form-control option { background: #1c2128; }
|
||||||
|
textarea.form-control { resize: vertical; min-height: 80px; }
|
||||||
|
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 0.9rem; }
|
||||||
|
.form-row-3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 0.9rem; }
|
||||||
|
|
||||||
|
/* MODALS */
|
||||||
|
.modal-backdrop {
|
||||||
|
display: none; position: fixed; inset: 0; z-index: 200;
|
||||||
|
background: rgba(0,0,0,0.7); backdrop-filter: blur(2px);
|
||||||
|
align-items: center; justify-content: center; padding: 1rem;
|
||||||
|
}
|
||||||
|
.modal-backdrop.open { display: flex; }
|
||||||
|
.modal {
|
||||||
|
background: var(--card); border: 1px solid var(--border);
|
||||||
|
border-radius: var(--radius-lg); width: 100%; max-width: 640px;
|
||||||
|
max-height: 90vh; display: flex; flex-direction: column;
|
||||||
|
animation: modalIn 0.18s ease;
|
||||||
|
}
|
||||||
|
.modal-lg { max-width: 780px; }
|
||||||
|
@keyframes modalIn { from { opacity: 0; transform: scale(0.95) translateY(-10px); } to { opacity: 1; transform: none; } }
|
||||||
|
.modal-header {
|
||||||
|
display: flex; align-items: center; justify-content: space-between;
|
||||||
|
padding: 1rem 1.25rem; border-bottom: 1px solid var(--border); flex-shrink: 0;
|
||||||
|
}
|
||||||
|
.modal-header h3 { font-size: 1rem; font-weight: 600; }
|
||||||
|
.modal-close { background: none; border: none; color: var(--muted); cursor: pointer; font-size: 1.25rem; line-height: 1; padding: 0.2rem; }
|
||||||
|
.modal-close:hover { color: var(--text); }
|
||||||
|
.modal-body { padding: 1.25rem; overflow-y: auto; display: flex; flex-direction: column; gap: 0.9rem; }
|
||||||
|
.modal-footer { padding: 1rem 1.25rem; border-top: 1px solid var(--border); display: flex; justify-content: flex-end; gap: 0.5rem; flex-shrink: 0; }
|
||||||
|
|
||||||
|
/* VEHICLE DETAIL */
|
||||||
|
.vehicle-detail-header {
|
||||||
|
display: flex; gap: 1.5rem; align-items: flex-start;
|
||||||
|
background: var(--card); border: 1px solid var(--border);
|
||||||
|
border-radius: var(--radius-lg); padding: 1.5rem; margin-bottom: 1.5rem;
|
||||||
|
}
|
||||||
|
.vehicle-detail-img {
|
||||||
|
width: 180px; height: 130px; object-fit: cover;
|
||||||
|
border-radius: var(--radius); flex-shrink: 0; background: #1c2128;
|
||||||
|
}
|
||||||
|
.vehicle-detail-img-placeholder {
|
||||||
|
width: 180px; height: 130px; background: #1c2128;
|
||||||
|
border-radius: var(--radius); display: flex; align-items: center;
|
||||||
|
justify-content: center; font-size: 3rem; flex-shrink: 0;
|
||||||
|
}
|
||||||
|
.vehicle-detail-info { flex: 1; min-width: 0; }
|
||||||
|
.vehicle-detail-name { font-size: 1.5rem; font-weight: 700; margin-bottom: 0.35rem; }
|
||||||
|
.vehicle-detail-sub { font-size: 0.9rem; color: var(--muted); margin-bottom: 0.75rem; }
|
||||||
|
.vehicle-detail-stats { display: flex; gap: 1.5rem; flex-wrap: wrap; }
|
||||||
|
.vehicle-detail-stat { display: flex; flex-direction: column; gap: 0.1rem; }
|
||||||
|
.vehicle-detail-stat-label { font-size: 0.75rem; color: var(--muted); text-transform: uppercase; }
|
||||||
|
.vehicle-detail-stat-value { font-size: 1rem; font-weight: 600; }
|
||||||
|
|
||||||
|
/* TABS */
|
||||||
|
.tabs { display: flex; gap: 0.25rem; margin-bottom: 1rem; border-bottom: 1px solid var(--border); padding-bottom: 0; }
|
||||||
|
.tab-btn {
|
||||||
|
background: none; border: none; cursor: pointer;
|
||||||
|
color: var(--muted); font-size: 0.9rem; font-weight: 500;
|
||||||
|
padding: 0.6rem 1rem; border-bottom: 2px solid transparent;
|
||||||
|
margin-bottom: -1px; transition: color 0.15s, border-color 0.15s;
|
||||||
|
}
|
||||||
|
.tab-btn:hover { color: var(--text); }
|
||||||
|
.tab-btn.active { color: var(--primary); border-bottom-color: var(--primary); }
|
||||||
|
.tab-pane { display: none; }
|
||||||
|
.tab-pane.active { display: block; }
|
||||||
|
|
||||||
|
/* PARTS */
|
||||||
|
.part-thumb {
|
||||||
|
width: 40px; height: 40px; object-fit: cover;
|
||||||
|
border-radius: 4px; background: #1c2128;
|
||||||
|
}
|
||||||
|
.part-thumb-placeholder {
|
||||||
|
width: 40px; height: 40px; border-radius: 4px;
|
||||||
|
background: #1c2128; display: flex; align-items: center;
|
||||||
|
justify-content: center; font-size: 1rem; color: var(--muted);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* EMPTY STATE */
|
||||||
|
.empty-state {
|
||||||
|
display: flex; flex-direction: column; align-items: center;
|
||||||
|
gap: 0.75rem; padding: 3rem 1rem; color: var(--muted); text-align: center;
|
||||||
|
}
|
||||||
|
.empty-state-icon { font-size: 2.5rem; opacity: 0.5; }
|
||||||
|
.empty-state p { font-size: 0.9rem; }
|
||||||
|
|
||||||
|
/* TOASTS */
|
||||||
|
.toast-container {
|
||||||
|
position: fixed; bottom: 1.5rem; right: 1.5rem; z-index: 999;
|
||||||
|
display: flex; flex-direction: column; gap: 0.5rem; pointer-events: none;
|
||||||
|
}
|
||||||
|
.toast {
|
||||||
|
background: var(--card); border: 1px solid var(--border);
|
||||||
|
border-radius: var(--radius); padding: 0.75rem 1rem;
|
||||||
|
font-size: 0.875rem; min-width: 220px; max-width: 360px;
|
||||||
|
box-shadow: 0 4px 20px rgba(0,0,0,0.4);
|
||||||
|
animation: slideIn 0.25s ease; pointer-events: auto;
|
||||||
|
border-left: 4px solid var(--border);
|
||||||
|
}
|
||||||
|
.toast.success { border-left-color: var(--success); }
|
||||||
|
.toast.error { border-left-color: var(--danger); }
|
||||||
|
.toast.info { border-left-color: var(--info); }
|
||||||
|
.toast.warning { border-left-color: var(--warning); }
|
||||||
|
@keyframes slideIn { from { opacity: 0; transform: translateX(20px); } to { opacity: 1; transform: none; } }
|
||||||
|
|
||||||
|
/* UPLOAD ZONE */
|
||||||
|
.upload-zone {
|
||||||
|
border: 2px dashed var(--border); border-radius: var(--radius);
|
||||||
|
padding: 1.5rem; text-align: center; color: var(--muted);
|
||||||
|
cursor: pointer; transition: border-color 0.15s;
|
||||||
|
}
|
||||||
|
.upload-zone:hover { border-color: var(--primary); color: var(--text); }
|
||||||
|
.preview-img {
|
||||||
|
max-height: 120px; border-radius: var(--radius);
|
||||||
|
margin-top: 0.75rem; display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* SECTION HEADER */
|
||||||
|
.section-header {
|
||||||
|
display: flex; align-items: center; justify-content: space-between;
|
||||||
|
margin-bottom: 1.25rem;
|
||||||
|
}
|
||||||
|
.section-title { font-size: 1.1rem; font-weight: 600; }
|
||||||
|
|
||||||
|
/* PAGE HEADER */
|
||||||
|
.page-header {
|
||||||
|
display: flex; align-items: center; justify-content: space-between;
|
||||||
|
margin-bottom: 1.5rem; gap: 1rem;
|
||||||
|
}
|
||||||
|
.page-title { font-size: 1.4rem; font-weight: 700; }
|
||||||
|
|
||||||
|
/* REMINDERS */
|
||||||
|
.reminder-item {
|
||||||
|
display: flex; align-items: center; gap: 0.75rem;
|
||||||
|
padding: 0.75rem 0; border-bottom: 1px solid var(--border);
|
||||||
|
}
|
||||||
|
.reminder-item:last-child { border-bottom: none; }
|
||||||
|
.reminder-dot { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; }
|
||||||
|
.reminder-dot.overdue { background: var(--danger); }
|
||||||
|
.reminder-dot.soon { background: var(--warning); }
|
||||||
|
.reminder-dot.ok { background: var(--success); }
|
||||||
|
.reminder-info { flex: 1; min-width: 0; }
|
||||||
|
.reminder-title { font-size: 0.875rem; font-weight: 500; }
|
||||||
|
.reminder-sub { font-size: 0.78rem; color: var(--muted); }
|
||||||
|
.reminder-date { font-size: 0.78rem; color: var(--muted); white-space: nowrap; }
|
||||||
|
|
||||||
|
/* DASHBOARD LAYOUT */
|
||||||
|
.dashboard-grid { display: grid; grid-template-columns: 1fr 340px; gap: 1.5rem; }
|
||||||
|
|
||||||
|
/* MISC */
|
||||||
|
.text-muted { color: var(--muted); }
|
||||||
|
.text-right { text-align: right; }
|
||||||
|
.flex { display: flex; }
|
||||||
|
.flex-center { display: flex; align-items: center; }
|
||||||
|
.gap-1 { gap: 0.5rem; }
|
||||||
|
.gap-2 { gap: 1rem; }
|
||||||
|
.mt-1 { margin-top: 0.5rem; }
|
||||||
|
.mt-2 { margin-top: 1rem; }
|
||||||
|
.mb-1 { margin-bottom: 0.5rem; }
|
||||||
|
.mb-2 { margin-bottom: 1rem; }
|
||||||
|
.back-btn {
|
||||||
|
display: inline-flex; align-items: center; gap: 0.4rem;
|
||||||
|
color: var(--muted); font-size: 0.875rem; cursor: pointer;
|
||||||
|
margin-bottom: 1rem; background: none; border: none; padding: 0;
|
||||||
|
transition: color 0.15s;
|
||||||
|
}
|
||||||
|
.back-btn:hover { color: var(--text); }
|
||||||
|
.actions-cell { display: flex; gap: 0.35rem; }
|
||||||
|
|
||||||
|
/* RESPONSIVE */
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
.container { padding: 1rem; }
|
||||||
|
.dashboard-grid { grid-template-columns: 1fr; }
|
||||||
|
.vehicle-detail-header { flex-direction: column; }
|
||||||
|
.vehicle-detail-img, .vehicle-detail-img-placeholder { width: 100%; height: 200px; }
|
||||||
|
.form-row, .form-row-3 { grid-template-columns: 1fr; }
|
||||||
|
.stats-grid { grid-template-columns: repeat(2, 1fr); }
|
||||||
|
.modal { max-height: 95vh; }
|
||||||
|
.navbar { padding: 0 1rem; gap: 1rem; }
|
||||||
|
.vehicles-grid { grid-template-columns: 1fr; }
|
||||||
|
}
|
||||||
@@ -0,0 +1,369 @@
|
|||||||
|
// GarageManager - SPA Frontend
|
||||||
|
const API = '/modules/garage/api.php';
|
||||||
|
const UPLOADS = '/modules/garage/api.php?action=photo&file=';
|
||||||
|
|
||||||
|
function $(s, ctx=document){return ctx.querySelector(s);}
|
||||||
|
function $$(s, ctx=document){return [...ctx.querySelectorAll(s)];}
|
||||||
|
function fmt(n){return n!=null?Number(n).toLocaleString('fr-FR'):'--';}
|
||||||
|
function fmtPrice(n){return n!=null?Number(n).toFixed(2)+' \u20ac':'--';}
|
||||||
|
function fmtDate(d){if(!d)return '--';return new Date(d).toLocaleDateString('fr-FR');}
|
||||||
|
function ago(d){if(!d)return '';const diff=Math.floor((Date.now()-new Date(d))/86400000);if(diff===0)return "aujourd'hui";if(diff===1)return 'hier';return 'il y a '+diff+'j';}
|
||||||
|
function toast(msg,type='success'){
|
||||||
|
const c=document.getElementById('toasts');const t=document.createElement('div');
|
||||||
|
t.className='toast '+type;t.textContent=msg;c.appendChild(t);
|
||||||
|
setTimeout(()=>t.remove(),3000);
|
||||||
|
}
|
||||||
|
|
||||||
|
// NAV
|
||||||
|
let currentPage='dashboard';
|
||||||
|
function navigate(page,params={}){
|
||||||
|
currentPage=page;
|
||||||
|
$$('.page').forEach(p=>p.classList.remove('active'));
|
||||||
|
$$('.nav-link').forEach(n=>n.classList.remove('active'));
|
||||||
|
document.getElementById('page-'+page)?.classList.add('active');
|
||||||
|
document.querySelector('.nav-link[data-page="'+page+'"]')?.classList.add('active');
|
||||||
|
if(page==='dashboard')loadDashboard();
|
||||||
|
else if(page==='vehicles')loadVehicles();
|
||||||
|
else if(page==='vehicle')loadVehicleDetail(params.id);
|
||||||
|
else if(page==='parts')loadParts();
|
||||||
|
}
|
||||||
|
|
||||||
|
// API
|
||||||
|
async function api(action,method='GET',data=null,extra=''){
|
||||||
|
const opts={method,headers:{}};
|
||||||
|
if(data&&!(data instanceof FormData)){opts.headers['Content-Type']='application/json';opts.body=JSON.stringify(data);}
|
||||||
|
else if(data instanceof FormData){opts.body=data;}
|
||||||
|
const r=await fetch(API+'?action='+action+extra,opts);
|
||||||
|
const j=await r.json();
|
||||||
|
if(!j.ok)throw new Error(j.error||'Erreur API');
|
||||||
|
return j.data;
|
||||||
|
}
|
||||||
|
|
||||||
|
// DASHBOARD
|
||||||
|
async function loadDashboard(){
|
||||||
|
try{
|
||||||
|
const[stats,vehicles,reminders]=await Promise.all([api('stats'),api('vehicles'),api('maintenances')]);
|
||||||
|
$('#stat-vehicles').textContent=stats.vehicles;
|
||||||
|
$('#stat-maintenances').textContent=stats.maintenances;
|
||||||
|
$('#stat-parts').textContent=stats.parts;
|
||||||
|
$('#stat-cost').textContent=fmtPrice(parseFloat(stats.total_cost)+parseFloat(stats.total_parts_cost));
|
||||||
|
renderDashboardVehicles(vehicles);
|
||||||
|
renderReminders(reminders);
|
||||||
|
}catch(e){toast(e.message,'error');}
|
||||||
|
}
|
||||||
|
|
||||||
|
function renderDashboardVehicles(list){
|
||||||
|
const el=$('#dashboard-vehicles');
|
||||||
|
if(!list.length){el.innerHTML='<div class="empty-state"><div class="icon">\ud83d\ude97</div><p>Aucun v\u00e9hicule</p></div>';return;}
|
||||||
|
el.innerHTML=list.slice(0,6).map(v=>vehicleCardHTML(v)).join('');
|
||||||
|
$$('.vehicle-card',el).forEach(c=>c.addEventListener('click',()=>navigate('vehicle',{id:c.dataset.id})));
|
||||||
|
}
|
||||||
|
|
||||||
|
function vehicleCardHTML(v){
|
||||||
|
const photoHTML=v.photo?'<img src="'+UPLOADS+v.photo+'" alt="">':'<span class="no-photo">\ud83d\ude97</span>';
|
||||||
|
const fuel=v.fuel_type||'Essence';
|
||||||
|
const fuelClass='fuel-'+fuel.replace(/\s/g,'');
|
||||||
|
return '<div class="vehicle-card" data-id="'+v.id+'">'+
|
||||||
|
'<div class="vehicle-card-img">'+photoHTML+'<span class="fuel-badge '+fuelClass+'">'+fuel+'</span></div>'+
|
||||||
|
'<div class="vehicle-card-body">'+
|
||||||
|
'<div class="vehicle-card-title">'+v.name+'</div>'+
|
||||||
|
'<div class="vehicle-card-sub">'+v.brand+' '+v.model+(v.year?' · '+v.year:'')+'</div>'+
|
||||||
|
'<div class="vehicle-card-stats">'+
|
||||||
|
'<div class="vc-stat">\ud83d\udd27 <strong>'+(v.maintenance_count||0)+'</strong> entretiens</div>'+
|
||||||
|
'<div class="vc-stat">\ud83d\udcb6 <strong>'+fmtPrice(v.total_cost)+'</strong></div>'+
|
||||||
|
'</div>'+
|
||||||
|
'</div>'+
|
||||||
|
'<div class="vehicle-card-footer">'+
|
||||||
|
(v.license_plate?'<span class="plate">'+v.license_plate+'</span>':'<span></span>')+
|
||||||
|
'<span class="vc-stat">'+(v.current_km?fmt(v.current_km)+' km':'--')+'</span>'+
|
||||||
|
'</div></div>';
|
||||||
|
}
|
||||||
|
|
||||||
|
function renderReminders(list){
|
||||||
|
const el=$('#reminders-list');const today=new Date();
|
||||||
|
if(!list.length){el.innerHTML='<div class="empty-state" style="padding:1.5rem"><p style="color:var(--muted)">Aucun rappel configur\u00e9</p></div>';return;}
|
||||||
|
el.innerHTML='<div class="table-wrap"><table><thead><tr><th>V\u00e9hicule</th><th>Type</th><th>Prochaine date</th><th>Prochain km</th><th>\u00c9cart km</th></tr></thead><tbody>'+
|
||||||
|
list.map(r=>{
|
||||||
|
const diff=r.next_km&&r.current_km?r.next_km-r.current_km:null;
|
||||||
|
const dateOk=r.next_date?new Date(r.next_date)>today:true;
|
||||||
|
const kmOk=diff==null||diff>0;
|
||||||
|
const cls=(!dateOk||!kmOk)?'badge-red':diff!=null&&diff<2000?'badge-amber':'badge-green';
|
||||||
|
return '<tr><td><strong>'+r.vehicle_name+'</strong>'+(r.license_plate?' <span class="plate">'+r.license_plate+'</span>':'')+'</td>'+
|
||||||
|
'<td>'+r.type+'</td>'+
|
||||||
|
'<td>'+(r.next_date?'<span class="badge '+cls+'">'+fmtDate(r.next_date)+'</span>':'--')+'</td>'+
|
||||||
|
'<td>'+(r.next_km?fmt(r.next_km)+' km':'--')+'</td>'+
|
||||||
|
'<td>'+(diff!=null?'<span class="badge '+(diff<0?'badge-red':diff<2000?'badge-amber':'badge-green')+'">'+(diff>=0?'+':'')+fmt(diff)+' km</span>':'--')+'</td></tr>';
|
||||||
|
}).join('')+
|
||||||
|
'</tbody></table></div>';
|
||||||
|
}
|
||||||
|
|
||||||
|
// VEHICLES LIST
|
||||||
|
async function loadVehicles(){
|
||||||
|
try{
|
||||||
|
const list=await api('vehicles');
|
||||||
|
const el=$('#vehicles-grid');
|
||||||
|
if(!list.length){el.innerHTML='<div class="empty-state"><div class="icon">\ud83d\ude97</div><p>Aucun v\u00e9hicule. Ajoutez-en un !</p></div>';return;}
|
||||||
|
el.innerHTML=list.map(v=>vehicleCardHTML(v)).join('');
|
||||||
|
$$('.vehicle-card',el).forEach(c=>c.addEventListener('click',()=>navigate('vehicle',{id:c.dataset.id})));
|
||||||
|
}catch(e){toast(e.message,'error');}
|
||||||
|
}
|
||||||
|
|
||||||
|
// VEHICLE DETAIL
|
||||||
|
let currentVehicleId=null;
|
||||||
|
async function loadVehicleDetail(id){
|
||||||
|
currentVehicleId=id;
|
||||||
|
try{
|
||||||
|
const[v,maintenances,parts]=await Promise.all([
|
||||||
|
api('vehicles','GET',null,'&id='+id),
|
||||||
|
api('maintenances','GET',null,'&vehicle_id='+id),
|
||||||
|
api('parts','GET',null,'&vehicle_id='+id)
|
||||||
|
]);
|
||||||
|
renderVehicleHeader(v);
|
||||||
|
renderMaintenances(maintenances);
|
||||||
|
renderVehicleParts(parts);
|
||||||
|
document.title='GarageManager \u00b7 '+v.name;
|
||||||
|
}catch(e){toast(e.message,'error');}
|
||||||
|
}
|
||||||
|
|
||||||
|
function renderVehicleHeader(v){
|
||||||
|
const photoHTML=v.photo?'<img src="'+UPLOADS+v.photo+'" alt="">':'<div class="no-photo">\ud83d\ude97</div>';
|
||||||
|
const totalCost=(parseFloat(v.stats?.total||0)+parseFloat(v.parts_stats?.total||0)).toFixed(2);
|
||||||
|
$('#vehicle-header').innerHTML=
|
||||||
|
'<div class="vehicle-detail-header">'+
|
||||||
|
'<div class="vehicle-detail-img">'+photoHTML+'</div>'+
|
||||||
|
'<div class="vehicle-meta">'+
|
||||||
|
'<h2>'+v.name+'</h2>'+
|
||||||
|
'<p class="sub">'+v.brand+' '+v.model+(v.year?' \u00b7 '+v.year:'')+'</p>'+
|
||||||
|
'<div style="display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:.75rem">'+
|
||||||
|
(v.license_plate?'<span class="plate">'+v.license_plate+'</span>':'')+
|
||||||
|
'<span class="badge badge-blue">'+(v.fuel_type||'Essence')+'</span>'+
|
||||||
|
(v.color?'<span class="badge badge-gray">\ud83c\udfa8 '+v.color+'</span>':'')+
|
||||||
|
'</div>'+
|
||||||
|
'<div class="meta-grid">'+
|
||||||
|
'<div class="meta-item"><span class="k">Kilom\u00e9trage</span><br><span class="v">'+fmt(v.current_km)+' km</span></div>'+
|
||||||
|
'<div class="meta-item"><span class="k">Entretiens</span><br><span class="v">'+(v.stats?.cnt||0)+'</span></div>'+
|
||||||
|
'<div class="meta-item"><span class="k">Co\u00fbt total</span><br><span class="v">'+fmtPrice(totalCost)+'</span></div>'+
|
||||||
|
(v.purchase_date?'<div class="meta-item"><span class="k">Achat</span><br><span class="v">'+fmtDate(v.purchase_date)+'</span></div>':'')+
|
||||||
|
(v.vin?'<div class="meta-item"><span class="k">VIN</span><br><span class="v" style="font-size:.75rem;font-family:monospace">'+v.vin+'</span></div>':'')+
|
||||||
|
'</div>'+
|
||||||
|
'</div>'+
|
||||||
|
'<div style="display:flex;gap:.5rem;flex-wrap:wrap;align-self:flex-start">'+
|
||||||
|
'<button class="btn btn-secondary btn-sm" onclick="openEditVehicle('+v.id+')">\u270f\ufe0f Modifier</button>'+
|
||||||
|
'<button class="btn btn-secondary btn-sm" onclick="openUploadPhoto('+v.id+')">\ud83d\udcf7 Photo</button>'+
|
||||||
|
'<button class="btn btn-danger btn-sm" onclick="deleteVehicle('+v.id+')">\ud83d\uddd1\ufe0f Supprimer</button>'+
|
||||||
|
'</div>'+
|
||||||
|
'</div>';
|
||||||
|
}
|
||||||
|
|
||||||
|
function renderMaintenances(list){
|
||||||
|
const el=$('#maintenance-list');
|
||||||
|
const totalCost=list.reduce((s,m)=>s+parseFloat(m.cost||0)+parseFloat(m.parts_cost||0),0);
|
||||||
|
$('#maintenance-total').textContent=fmtPrice(totalCost);
|
||||||
|
if(!list.length){el.innerHTML='<div class="empty-state"><div class="icon">\ud83d\udd27</div><p>Aucun entretien enregistr\u00e9</p></div>';return;}
|
||||||
|
el.innerHTML='<div class="table-wrap"><table><thead><tr><th>Date</th><th>Type</th><th>Description</th><th>Kilom\u00e9trage</th><th>Co\u00fbt MO</th><th>Pi\u00e8ces</th><th>Prochain</th><th></th></tr></thead><tbody>'+
|
||||||
|
list.map(m=>'<tr>'+
|
||||||
|
'<td><strong>'+fmtDate(m.date)+'</strong><br><span style="color:var(--muted);font-size:.75rem">'+ago(m.date)+'</span></td>'+
|
||||||
|
'<td><span class="badge badge-blue">'+m.type+'</span></td>'+
|
||||||
|
'<td style="max-width:200px;color:var(--muted)">'+(m.description||'--')+'</td>'+
|
||||||
|
'<td>'+(m.km?fmt(m.km)+' km':'--')+'</td>'+
|
||||||
|
'<td>'+fmtPrice(m.cost)+'</td>'+
|
||||||
|
'<td>'+(m.parts_count>0?'<span class="badge badge-purple">\ud83d\udd29 '+m.parts_count+' ('+fmtPrice(m.parts_cost)+')</span>':'--')+'</td>'+
|
||||||
|
'<td style="font-size:.78rem">'+(m.next_date?'\ud83d\udcc5 '+fmtDate(m.next_date):'')+' '+(m.next_km?'<br>\ud83d\udee3\ufe0f '+fmt(m.next_km)+' km':'')+'</td>'+
|
||||||
|
'<td><button class="btn btn-danger btn-sm btn-icon" onclick="deleteMaintenance('+m.id+')" title="Supprimer">\ud83d\uddd1\ufe0f</button></td>'+
|
||||||
|
'</tr>').join('')+
|
||||||
|
'</tbody></table></div>';
|
||||||
|
}
|
||||||
|
|
||||||
|
function renderVehicleParts(list){
|
||||||
|
const el=$('#parts-list-vehicle');
|
||||||
|
const total=list.reduce((s,p)=>s+parseFloat(p.price||0)*parseInt(p.quantity||1),0);
|
||||||
|
$('#parts-total-vehicle').textContent=fmtPrice(total);
|
||||||
|
if(!list.length){el.innerHTML='<div class="empty-state"><div class="icon">\ud83d\udd29</div><p>Aucune pi\u00e8ce enregistr\u00e9e</p></div>';return;}
|
||||||
|
el.innerHTML='<div class="table-wrap"><table><thead><tr><th>Photo</th><th>Nom</th><th>Marque</th><th>R\u00e9f\u00e9rence</th><th>Cat\u00e9gorie</th><th>Prix unit.</th><th>Qt\u00e9</th><th>Total</th><th>Fournisseur</th><th></th></tr></thead><tbody>'+
|
||||||
|
list.map(p=>'<tr>'+
|
||||||
|
'<td>'+(p.photo?'<img class="part-thumb" src="'+UPLOADS+p.photo+'" alt="">':'<span style="color:var(--muted)">--</span>')+'</td>'+
|
||||||
|
'<td><strong>'+p.name+'</strong></td>'+
|
||||||
|
'<td>'+(p.brand||'--')+'</td>'+
|
||||||
|
'<td><code style="font-size:.75rem;color:var(--muted)">'+(p.reference||'--')+'</code></td>'+
|
||||||
|
'<td><span class="badge badge-gray">'+p.category+'</span></td>'+
|
||||||
|
'<td>'+fmtPrice(p.price)+'</td>'+
|
||||||
|
'<td>'+p.quantity+' '+p.unit+'</td>'+
|
||||||
|
'<td><strong>'+fmtPrice(parseFloat(p.price||0)*parseInt(p.quantity||1))+'</strong></td>'+
|
||||||
|
'<td>'+(p.supplier||'--')+'</td>'+
|
||||||
|
'<td><button class="btn btn-danger btn-sm btn-icon" onclick="deletePart('+p.id+')" title="Supprimer">\ud83d\uddd1\ufe0f</button></td>'+
|
||||||
|
'</tr>').join('')+
|
||||||
|
'</tbody></table></div>';
|
||||||
|
}
|
||||||
|
|
||||||
|
// ALL PARTS
|
||||||
|
async function loadParts(){
|
||||||
|
try{
|
||||||
|
const list=await api('parts');
|
||||||
|
const el=$('#all-parts-list');
|
||||||
|
const total=list.reduce((s,p)=>s+parseFloat(p.price||0)*parseInt(p.quantity||1),0);
|
||||||
|
$('#all-parts-total').textContent=fmtPrice(total);
|
||||||
|
$('#all-parts-count').textContent=list.length;
|
||||||
|
if(!list.length){el.innerHTML='<div class="empty-state"><div class="icon">\ud83d\udd29</div><p>Aucune pi\u00e8ce</p></div>';return;}
|
||||||
|
el.innerHTML='<div class="table-wrap"><table><thead><tr><th>Photo</th><th>Nom</th><th>V\u00e9hicule</th><th>Marque</th><th>R\u00e9f\u00e9rence</th><th>Cat\u00e9gorie</th><th>Prix unit.</th><th>Qt\u00e9</th><th>Total</th><th>Entretien</th><th></th></tr></thead><tbody>'+
|
||||||
|
list.map(p=>'<tr>'+
|
||||||
|
'<td>'+(p.photo?'<img class="part-thumb" src="'+UPLOADS+p.photo+'" alt="">':'--')+'</td>'+
|
||||||
|
'<td><strong>'+p.name+'</strong></td>'+
|
||||||
|
'<td>'+(p.vehicle_name?'<span class="badge badge-blue">'+p.vehicle_name+'</span>':'--')+'</td>'+
|
||||||
|
'<td>'+(p.brand||'--')+'</td>'+
|
||||||
|
'<td><code style="font-size:.75rem;color:var(--muted)">'+(p.reference||'--')+'</code></td>'+
|
||||||
|
'<td><span class="badge badge-gray">'+p.category+'</span></td>'+
|
||||||
|
'<td>'+fmtPrice(p.price)+'</td>'+
|
||||||
|
'<td>'+p.quantity+' '+p.unit+'</td>'+
|
||||||
|
'<td><strong>'+fmtPrice(parseFloat(p.price||0)*parseInt(p.quantity||1))+'</strong></td>'+
|
||||||
|
'<td>'+(p.maintenance_type?p.maintenance_type+' ('+fmtDate(p.maintenance_date)+')':'--')+'</td>'+
|
||||||
|
'<td><button class="btn btn-danger btn-sm btn-icon" onclick="deletePart('+p.id+')" title="Supprimer">\ud83d\uddd1\ufe0f</button></td>'+
|
||||||
|
'</tr>').join('')+
|
||||||
|
'</tbody></table></div>';
|
||||||
|
}catch(e){toast(e.message,'error');}
|
||||||
|
}
|
||||||
|
|
||||||
|
// MODALS
|
||||||
|
function openModal(id){document.getElementById(id).classList.add('show');}
|
||||||
|
function closeModal(id){document.getElementById(id).classList.remove('show');}
|
||||||
|
|
||||||
|
// VEHICLE CRUD
|
||||||
|
function openAddVehicle(){
|
||||||
|
$('#form-vehicle').reset();$('#form-vehicle-id').value='';
|
||||||
|
$('#modal-vehicle-title').textContent='Ajouter un v\u00e9hicule';
|
||||||
|
$('#vehicle-photo-preview').src='';$('#vehicle-photo-preview').style.display='none';
|
||||||
|
openModal('modal-vehicle');
|
||||||
|
}
|
||||||
|
function openEditVehicle(id){
|
||||||
|
api('vehicles','GET',null,'&id='+id).then(v=>{
|
||||||
|
$('#form-vehicle-id').value=v.id;
|
||||||
|
$('#modal-vehicle-title').textContent='Modifier le v\u00e9hicule';
|
||||||
|
['name','brand','model','year','license_plate','vin','fuel_type','color','purchase_date','purchase_price','current_km','notes'].forEach(f=>{
|
||||||
|
const el=$('#vehicle-'+f.replace(/_/g,'-'));
|
||||||
|
if(el)el.value=v[f]||'';
|
||||||
|
});
|
||||||
|
if(v.photo){$('#vehicle-photo-preview').src=UPLOADS+v.photo;$('#vehicle-photo-preview').style.display='block';}
|
||||||
|
openModal('modal-vehicle');
|
||||||
|
});
|
||||||
|
}
|
||||||
|
async function saveVehicle(){
|
||||||
|
const id=$('#form-vehicle-id').value;
|
||||||
|
const fd=new FormData($('#form-vehicle'));
|
||||||
|
try{
|
||||||
|
if(id){
|
||||||
|
const d={};for(const[k,v]of fd.entries())d[k]=v;
|
||||||
|
await api('vehicles','PUT',d,'&id='+id);
|
||||||
|
const photoFile=$('#vehicle-photo').files[0];
|
||||||
|
if(photoFile){const pfd=new FormData();pfd.append('photo',photoFile);await fetch(API+'?action=upload_vehicle_photo&id='+id,{method:'POST',body:pfd});}
|
||||||
|
toast('V\u00e9hicule modifi\u00e9');
|
||||||
|
}else{
|
||||||
|
await api('vehicles','POST',fd);
|
||||||
|
toast('V\u00e9hicule ajout\u00e9');
|
||||||
|
}
|
||||||
|
closeModal('modal-vehicle');
|
||||||
|
if(currentPage==='vehicles')loadVehicles();
|
||||||
|
else if(currentPage==='vehicle')loadVehicleDetail(currentVehicleId);
|
||||||
|
else loadDashboard();
|
||||||
|
}catch(e){toast(e.message,'error');}
|
||||||
|
}
|
||||||
|
async function deleteVehicle(id){
|
||||||
|
if(!confirm('Supprimer ce v\u00e9hicule et tout son historique ?'))return;
|
||||||
|
try{await api('vehicles','DELETE',null,'&id='+id);toast('V\u00e9hicule supprim\u00e9');navigate('vehicles');}catch(e){toast(e.message,'error');}
|
||||||
|
}
|
||||||
|
|
||||||
|
// MAINTENANCE CRUD
|
||||||
|
function openAddMaintenance(){
|
||||||
|
$('#form-maintenance').reset();$('#form-maintenance-id').value='';
|
||||||
|
$('#maintenance-vehicle-id').value=currentVehicleId||'';
|
||||||
|
$('#modal-maintenance-title').textContent='Ajouter un entretien';
|
||||||
|
$('#maintenance-date').value=new Date().toISOString().slice(0,10);
|
||||||
|
openModal('modal-maintenance');
|
||||||
|
}
|
||||||
|
async function saveMaintenance(){
|
||||||
|
const id=$('#form-maintenance-id').value;
|
||||||
|
const d={};new FormData($('#form-maintenance')).forEach((v,k)=>d[k]=v);
|
||||||
|
try{
|
||||||
|
if(id){await api('maintenances','PUT',d,'&id='+id);toast('Entretien modifi\u00e9');}
|
||||||
|
else{await api('maintenances','POST',d);toast('Entretien ajout\u00e9');}
|
||||||
|
closeModal('modal-maintenance');
|
||||||
|
loadVehicleDetail(currentVehicleId);
|
||||||
|
}catch(e){toast(e.message,'error');}
|
||||||
|
}
|
||||||
|
async function deleteMaintenance(id){
|
||||||
|
if(!confirm('Supprimer cet entretien ?'))return;
|
||||||
|
try{await api('maintenances','DELETE',null,'&id='+id);toast('Entretien supprim\u00e9');loadVehicleDetail(currentVehicleId);}catch(e){toast(e.message,'error');}
|
||||||
|
}
|
||||||
|
|
||||||
|
// PARTS CRUD
|
||||||
|
function openAddPart(){
|
||||||
|
$('#form-part').reset();$('#form-part-id').value='';
|
||||||
|
$('#part-vehicle-id').value=currentVehicleId||'';
|
||||||
|
$('#modal-part-title').textContent='Ajouter une pi\u00e8ce';
|
||||||
|
$('#part-purchase-date').value=new Date().toISOString().slice(0,10);
|
||||||
|
$('#part-photo-preview').src='';$('#part-photo-preview').style.display='none';
|
||||||
|
openModal('modal-part');
|
||||||
|
}
|
||||||
|
async function savePart(){
|
||||||
|
const id=$('#form-part-id').value;
|
||||||
|
const fd=new FormData($('#form-part'));
|
||||||
|
try{
|
||||||
|
if(id){
|
||||||
|
const d={};for(const[k,v]of fd.entries())d[k]=v;
|
||||||
|
await api('parts','PUT',d,'&id='+id);
|
||||||
|
const photoFile=$('#part-photo').files[0];
|
||||||
|
if(photoFile){const pfd=new FormData();pfd.append('photo',photoFile);await fetch(API+'?action=upload_part_photo&id='+id,{method:'POST',body:pfd});}
|
||||||
|
toast('Pi\u00e8ce modifi\u00e9e');
|
||||||
|
}else{
|
||||||
|
await api('parts','POST',fd);
|
||||||
|
toast('Pi\u00e8ce ajout\u00e9e');
|
||||||
|
}
|
||||||
|
closeModal('modal-part');
|
||||||
|
if(currentPage==='vehicle')loadVehicleDetail(currentVehicleId);
|
||||||
|
else loadParts();
|
||||||
|
}catch(e){toast(e.message,'error');}
|
||||||
|
}
|
||||||
|
async function deletePart(id){
|
||||||
|
if(!confirm('Supprimer cette pi\u00e8ce ?'))return;
|
||||||
|
try{
|
||||||
|
await api('parts','DELETE',null,'&id='+id);
|
||||||
|
toast('Pi\u00e8ce supprim\u00e9e');
|
||||||
|
if(currentPage==='vehicle')loadVehicleDetail(currentVehicleId);
|
||||||
|
else loadParts();
|
||||||
|
}catch(e){toast(e.message,'error');}
|
||||||
|
}
|
||||||
|
|
||||||
|
// UPLOAD PHOTO
|
||||||
|
function openUploadPhoto(id){$('#upload-vehicle-id').value=id;openModal('modal-upload-photo');}
|
||||||
|
async function doUploadPhoto(){
|
||||||
|
const id=$('#upload-vehicle-id').value;
|
||||||
|
const file=$('#upload-photo-file').files[0];
|
||||||
|
if(!file){toast('Choisissez une photo','error');return;}
|
||||||
|
const fd=new FormData();fd.append('photo',file);
|
||||||
|
try{
|
||||||
|
await fetch(API+'?action=upload_vehicle_photo&id='+id,{method:'POST',body:fd});
|
||||||
|
toast('Photo mise \u00e0 jour');closeModal('modal-upload-photo');
|
||||||
|
loadVehicleDetail(id);
|
||||||
|
}catch(e){toast(e.message,'error');}
|
||||||
|
}
|
||||||
|
|
||||||
|
// TABS
|
||||||
|
function switchTab(tab){
|
||||||
|
$$('.tab-btn').forEach(b=>b.classList.remove('active'));
|
||||||
|
$$('.tab-pane').forEach(p=>p.classList.remove('active'));
|
||||||
|
document.querySelector('.tab-btn[data-tab="'+tab+'"]')?.classList.add('active');
|
||||||
|
document.getElementById('tab-'+tab)?.classList.add('active');
|
||||||
|
}
|
||||||
|
|
||||||
|
// PHOTO PREVIEW
|
||||||
|
function previewPhoto(inputId,previewId){
|
||||||
|
const file=document.getElementById(inputId).files[0];if(!file)return;
|
||||||
|
const reader=new FileReader();
|
||||||
|
reader.onload=e=>{const img=document.getElementById(previewId);img.src=e.target.result;img.style.display='block';};
|
||||||
|
reader.readAsDataURL(file);
|
||||||
|
}
|
||||||
|
|
||||||
|
// INIT
|
||||||
|
document.addEventListener('DOMContentLoaded',()=>{
|
||||||
|
$$('.nav-link').forEach(n=>n.addEventListener('click',()=>navigate(n.dataset.page)));
|
||||||
|
$$('.modal-backdrop').forEach(m=>m.addEventListener('click',e=>{if(e.target===m)m.classList.remove('show');}));
|
||||||
|
navigate('dashboard');
|
||||||
|
});
|
||||||
+2
-1
@@ -15,7 +15,7 @@ if ($_SERVER['REQUEST_METHOD'] === 'POST') {
|
|||||||
$action = $_POST['action'] ?? '';
|
$action = $_POST['action'] ?? '';
|
||||||
|
|
||||||
if ($action === 'set_modules' && $family_id) {
|
if ($action === 'set_modules' && $family_id) {
|
||||||
$all = ['calendar', 'budget', 'holidays', 'gifts'];
|
$all = ['calendar', 'budget', 'holidays', 'gifts', 'garage'];
|
||||||
$enabled = array_values(array_filter($all, fn($m) => isset($_POST['mod_' . $m])));
|
$enabled = array_values(array_filter($all, fn($m) => isset($_POST['mod_' . $m])));
|
||||||
if (empty($enabled)) {
|
if (empty($enabled)) {
|
||||||
$error = "Vous devez garder au moins un module actif.";
|
$error = "Vous devez garder au moins un module actif.";
|
||||||
@@ -160,6 +160,7 @@ require __DIR__ . '/header.php';
|
|||||||
'budget' => ['icon' => '💰', 'label' => tr('menu_budget')],
|
'budget' => ['icon' => '💰', 'label' => tr('menu_budget')],
|
||||||
'holidays' => ['icon' => '🏖️', 'label' => tr('menu_holidays')],
|
'holidays' => ['icon' => '🏖️', 'label' => tr('menu_holidays')],
|
||||||
'gifts' => ['icon' => '🎁', 'label' => tr('menu_gifts')],
|
'gifts' => ['icon' => '🎁', 'label' => tr('menu_gifts')],
|
||||||
|
'garage' => ['icon' => '🚗', 'label' => tr('menu_garage')],
|
||||||
];
|
];
|
||||||
?>
|
?>
|
||||||
<form method="post">
|
<form method="post">
|
||||||
|
|||||||
Reference in New Issue
Block a user