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,118 @@
|
||||
<section class="bareme">
|
||||
<h1>Barème kilométrique</h1>
|
||||
|
||||
<form [formGroup]="anneeForm" class="annee-form" (ngSubmit)="charger()">
|
||||
<div class="champ">
|
||||
<label for="annee">Année</label>
|
||||
<input id="annee" type="number" formControlName="annee" min="2000" max="2100" />
|
||||
</div>
|
||||
<button type="submit" class="btn-principal" [disabled]="anneeForm.invalid || chargement()">
|
||||
Afficher
|
||||
</button>
|
||||
</form>
|
||||
|
||||
<div class="bareme__entete-tranches">
|
||||
<h2>Tranches {{ annee() }}</h2>
|
||||
<button
|
||||
type="button"
|
||||
class="btn-secondaire"
|
||||
(click)="recopierDernierBareme()"
|
||||
[disabled]="!recopiePossible() || recopieEnCours() || chargement()"
|
||||
[title]="recopiePossible()
|
||||
? 'Recopier le barème ' + anneeSourceRecopie() + ' vers ' + annee() + ' (remplace la saisie existante)'
|
||||
: 'Aucun barème antérieur à recopier'"
|
||||
>
|
||||
@if (recopieEnCours()) {
|
||||
Recopie…
|
||||
} @else {
|
||||
Recopier le dernier barème connu
|
||||
}
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<table class="tranches" *ngIf="tranches().length; else aucune">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Puissance fiscale (CV)</th>
|
||||
<th>Km min</th>
|
||||
<th>Km max</th>
|
||||
<th>Coefficient (€/km)</th>
|
||||
<th>Base (€)</th>
|
||||
<th>Actions</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr *ngFor="let t of tranches()" [class.en-edition]="t.id === trancheEnEdition()">
|
||||
<td>{{ t.puissanceFiscale }}</td>
|
||||
<td>{{ t.kmMin | number: '1.0-0' }}</td>
|
||||
<td>{{ t.kmMax === null ? 'illimité' : (t.kmMax | number: '1.0-0') }}</td>
|
||||
<td>{{ t.coefficient | number: '1.3-3' }}</td>
|
||||
<td>{{ t.base | number: '1.2-2' }}</td>
|
||||
<td class="actions-cellule">
|
||||
<button type="button" class="btn-lien" (click)="editer(t)">Modifier</button>
|
||||
<button type="button" class="btn-lien danger" (click)="supprimer(t)">Supprimer</button>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<ng-template #aucune>
|
||||
<p class="vide">Aucune tranche définie pour cette année.</p>
|
||||
</ng-template>
|
||||
|
||||
<h2>{{ trancheEnEdition() !== null ? 'Modifier la tranche' : 'Ajouter une tranche' }}</h2>
|
||||
|
||||
<form [formGroup]="trancheForm" class="tranche-form" (ngSubmit)="enregistrer()">
|
||||
<div class="ligne">
|
||||
<div class="champ">
|
||||
<label for="pf">Puissance fiscale (CV)</label>
|
||||
<input id="pf" type="number" formControlName="puissanceFiscale" min="1" />
|
||||
<span
|
||||
class="erreur"
|
||||
*ngIf="trancheForm.get('puissanceFiscale')?.invalid && trancheForm.get('puissanceFiscale')?.touched"
|
||||
>
|
||||
Puissance fiscale requise (≥ 1).
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div class="champ">
|
||||
<label for="kmMin">Km min</label>
|
||||
<input id="kmMin" type="number" formControlName="kmMin" min="0" />
|
||||
</div>
|
||||
|
||||
<div class="champ">
|
||||
<label for="kmMax">Km max</label>
|
||||
<input id="kmMax" type="number" formControlName="kmMax" min="0" placeholder="Vide = illimité" />
|
||||
<small class="aide">Laisser vide pour une tranche sans borne supérieure (illimité).</small>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="ligne">
|
||||
<div class="champ">
|
||||
<label for="coef">Coefficient (€/km)</label>
|
||||
<input id="coef" type="number" step="0.001" formControlName="coefficient" min="0" />
|
||||
</div>
|
||||
|
||||
<div class="champ">
|
||||
<label for="base">Base (€)</label>
|
||||
<input id="base" type="number" step="0.01" formControlName="base" min="0" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<p class="erreur" *ngIf="erreurChevauchement()">{{ erreurChevauchement() }}</p>
|
||||
|
||||
<div class="actions">
|
||||
<button type="submit" class="btn-principal" [disabled]="trancheForm.invalid || chargement()">
|
||||
{{ trancheEnEdition() !== null ? 'Enregistrer les modifications' : 'Ajouter' }}
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
class="btn-secondaire"
|
||||
*ngIf="trancheEnEdition() !== null"
|
||||
(click)="annulerEdition()"
|
||||
>
|
||||
Annuler
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
</section>
|
||||
Reference in New Issue
Block a user