SchotzIAD KM Tracker : suivi des trajets kilométriques (Angular + .NET 8)
Application complète de saisie et de suivi des trajets kilométriques avec calcul de distance routière (OpenRouteService), barème kilométrique, résumés et régularisation annuelle. Backend (ASP.NET Core .NET 8, EF Core, SQLite) : - Trajets (CRUD, réordonnancement, insertion), calcul de distance ORS avec fallback Haversine, géométrie d'itinéraire stockée par trajet, recalcul en masse. - Profil, véhicules (avec dénomination), carnet d'adresses nommées, cache d'adresses. - Barème kilométrique : tranches multiples par puissance fiscale, borne max exclusive avec 'illimité' (KmMax nullable), coefficient à 3 décimales, recopie du dernier barème connu. - Résumés mensuel/annuel, montants réglés, régularisation, export PDF. Frontend (Angular 22, zoneless + signals) : - Consultation par jour, navigation temporelle synchronisée, carte Leaflet, formulaire de trajet (adresses nommées, domicile, autocomplétion BAN). - Détection de changement zoneless (indépendante de zone.js). Hébergement : Docker Compose (nginx + backend), scripts run-dev.sh / run-docker.sh.
This commit is contained in:
@@ -0,0 +1,98 @@
|
||||
<section class="carnet">
|
||||
<h1>Carnet d'adresses</h1>
|
||||
|
||||
<!-- Formulaire de création / modification -->
|
||||
<form class="carnet__form" [formGroup]="form" (ngSubmit)="enregistrer()">
|
||||
<h2>{{ enEdition ? 'Modifier une adresse' : 'Ajouter une adresse' }}</h2>
|
||||
|
||||
<div class="field">
|
||||
<label for="denomination">Dénomination</label>
|
||||
<input
|
||||
id="denomination"
|
||||
type="text"
|
||||
formControlName="denomination"
|
||||
maxlength="100"
|
||||
autocomplete="off"
|
||||
placeholder="Ex. Bureau, Client X…"
|
||||
/>
|
||||
<p
|
||||
class="field__error"
|
||||
*ngIf="form.get('denomination')?.touched && form.get('denomination')?.invalid"
|
||||
>
|
||||
La dénomination est obligatoire (1 à 100 caractères).
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="field field--autocomplete">
|
||||
<label for="adresse">Adresse</label>
|
||||
<input
|
||||
id="adresse"
|
||||
type="text"
|
||||
formControlName="adresse"
|
||||
maxlength="255"
|
||||
autocomplete="off"
|
||||
placeholder="Saisir au moins 3 caractères…"
|
||||
(input)="onAdresseInput($any($event.target).value)"
|
||||
/>
|
||||
<p
|
||||
class="field__error"
|
||||
*ngIf="form.get('adresse')?.touched && form.get('adresse')?.invalid"
|
||||
>
|
||||
L'adresse est obligatoire (1 à 255 caractères).
|
||||
</p>
|
||||
|
||||
<ul class="suggestions" *ngIf="suggestions().length > 0">
|
||||
<li
|
||||
*ngFor="let s of suggestions()"
|
||||
class="suggestions__item"
|
||||
(click)="choisirSuggestion(s)"
|
||||
>
|
||||
{{ s.properties.label }}
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="carnet__actions">
|
||||
<button type="submit" [disabled]="form.invalid || enregistrement()">
|
||||
{{ enEdition ? 'Enregistrer' : 'Ajouter' }}
|
||||
</button>
|
||||
<button type="button" class="btn--secondary" (click)="annuler()" *ngIf="enEdition">
|
||||
Annuler
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
<!-- Liste des adresses nommées, triée par dénomination -->
|
||||
<div class="carnet__liste">
|
||||
<h2>Adresses enregistrées</h2>
|
||||
|
||||
<p *ngIf="chargement()" class="carnet__vide">Chargement…</p>
|
||||
<p *ngIf="!chargement() && adresses().length === 0" class="carnet__vide">
|
||||
Aucune adresse enregistrée pour le moment.
|
||||
</p>
|
||||
|
||||
<ul *ngIf="!chargement() && adresses().length > 0">
|
||||
<li *ngFor="let adresse of adresses()" class="ligne">
|
||||
<div class="ligne__infos">
|
||||
<span class="ligne__denomination">{{ adresse.denomination }}</span>
|
||||
<span class="ligne__adresse">{{ adresse.adresse }}</span>
|
||||
<span
|
||||
class="ligne__warning"
|
||||
*ngIf="!aCoordonnees(adresse)"
|
||||
title="Coordonnées non disponibles (géocodage échoué)"
|
||||
>
|
||||
⚠ Coordonnées indisponibles
|
||||
</span>
|
||||
</div>
|
||||
<div class="ligne__actions">
|
||||
<button type="button" class="btn--secondary" (click)="editer(adresse)">
|
||||
Modifier
|
||||
</button>
|
||||
<button type="button" class="btn--danger" (click)="supprimer(adresse)">
|
||||
Supprimer
|
||||
</button>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</section>
|
||||
Reference in New Issue
Block a user