filtre agenda, page de stats, queryparam add
This commit is contained in:
Tykayn
tykayn
parent
73e3b9e710
commit
5d636b0027
20 changed files with 2800 additions and 75 deletions
|
|
@ -308,8 +308,7 @@
|
|||
<!--fin des actions rapides-->
|
||||
|
||||
@if (toasts.length) {
|
||||
<div class="toaster"
|
||||
style="">
|
||||
<div class="toaster">
|
||||
@for (t of toasts; track t.id) {
|
||||
<div class="toast" [class.success]="t.type==='success'" [class.error]="t.type==='error'"
|
||||
[class.info]="t.type==='info'"
|
||||
|
|
@ -364,18 +363,19 @@
|
|||
</div>
|
||||
</aside>
|
||||
<main class="agenda-main">
|
||||
@if (selected && showEditForm) {
|
||||
@if ((selected || (showEditForm && addMode)) && showEditForm) {
|
||||
<div class="event-edit-panel">
|
||||
<div class="panel-header">
|
||||
<h3>Détails</h3>
|
||||
<button class="btn-close" (click)="selected = null">×</button>
|
||||
<h3>@if (selected && selected.id) { Détails } @else { Créer un événement }</h3>
|
||||
<button class="btn-close" (click)="closeEditForm()">×</button>
|
||||
</div>
|
||||
<div class="panel-content">
|
||||
<app-edit-form [selected]="selected"
|
||||
[filterByPrefix]="addMode"
|
||||
(saved)="onSaved($event)"
|
||||
(created)="onCreated($event)"
|
||||
(deleted)="onDeleted($event)"
|
||||
(canceled)="showEditForm=false"
|
||||
(canceled)="onCanceled()"
|
||||
>
|
||||
</app-edit-form>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -34,7 +34,7 @@ export class Home implements OnInit, OnDestroy {
|
|||
|
||||
OedbApi = inject(OedbApi);
|
||||
route = inject(ActivatedRoute);
|
||||
private router = inject(Router);
|
||||
router = inject(Router);
|
||||
private osmAuth = inject(OsmAuth);
|
||||
|
||||
features: Array<any> = [];
|
||||
|
|
@ -45,6 +45,7 @@ export class Home implements OnInit, OnDestroy {
|
|||
showEditForm = false;
|
||||
showOptions = false;
|
||||
pleinAirMode = false;
|
||||
addMode: string | null = null;
|
||||
civilianMode = false;
|
||||
toasts: Array<{ id: number, type: 'success' | 'error' | 'info', message: string }> = [];
|
||||
|
||||
|
|
@ -107,18 +108,46 @@ export class Home implements OnInit, OnDestroy {
|
|||
this.route.queryParamMap.subscribe(map => {
|
||||
const id = (map.get('id') || '').trim();
|
||||
const what = (map.get('what') || 'culture').trim();
|
||||
const add = (map.get('add') || '').trim();
|
||||
const pleinAir = (map.get('pleinair') || '').trim().toLowerCase();
|
||||
const preset = (map.get('preset') || '').trim().toLowerCase();
|
||||
const limitParam = map.get('limit');
|
||||
const limit = limitParam ? Number(limitParam) : null;
|
||||
|
||||
// Gérer le paramètre add pour activer le formulaire de création
|
||||
if (add) {
|
||||
this.addMode = add;
|
||||
this.selectedWhatFilter = add;
|
||||
this.showEditForm = true;
|
||||
this.showOptions = true; // Afficher aussi le panel d'options
|
||||
// Créer un événement temporaire avec le type what défini
|
||||
this.selected = {
|
||||
id: null,
|
||||
properties: {
|
||||
what: add,
|
||||
label: '',
|
||||
description: '',
|
||||
start: new Date().toISOString(),
|
||||
stop: new Date(Date.now() + 24 * 3600 * 1000).toISOString()
|
||||
},
|
||||
geometry: { type: 'Point', coordinates: [0, 0] }
|
||||
};
|
||||
} else {
|
||||
this.addMode = null;
|
||||
// Si pas de paramètre add, s'assurer que showEditForm est géré correctement
|
||||
if (!this.selected) {
|
||||
this.showEditForm = false;
|
||||
}
|
||||
}
|
||||
|
||||
// Charger selon les query params
|
||||
if (id) {
|
||||
this.loadSingleEvent(id);
|
||||
} else {
|
||||
this.loadEvents({what: what || undefined, limit: limit || undefined});
|
||||
}
|
||||
// Appliquer filtre par what côté client si fourni
|
||||
if (what) {
|
||||
// Appliquer filtre par what côté client si fourni (sauf si add est défini)
|
||||
if (what && !add) {
|
||||
this.selectedWhatFilter = what;
|
||||
}
|
||||
// Activer mode plein air via query param
|
||||
|
|
@ -137,6 +166,46 @@ export class Home implements OnInit, OnDestroy {
|
|||
this.enablePleinAirMode();
|
||||
}
|
||||
});
|
||||
|
||||
// Gérer aussi les paramètres du fragment (pour les URLs avec #)
|
||||
this.route.fragment.subscribe(fragment => {
|
||||
console.log('🔗 Fragment reçu:', fragment);
|
||||
if (fragment) {
|
||||
// Nettoyer le fragment en supprimant le & initial s'il existe
|
||||
const cleanFragment = fragment.startsWith('&') ? fragment.substring(1) : fragment;
|
||||
console.log('🧹 Fragment nettoyé:', cleanFragment);
|
||||
const params = new URLSearchParams(cleanFragment);
|
||||
const add = params.get('add');
|
||||
const what = params.get('what');
|
||||
console.log('🎯 Paramètre add extrait:', add);
|
||||
|
||||
// Gérer le paramètre add du fragment
|
||||
if (add) {
|
||||
this.addMode = add;
|
||||
this.selectedWhatFilter = add;
|
||||
this.showEditForm = true;
|
||||
this.showOptions = true; // Afficher aussi le panel d'options
|
||||
// Créer un événement temporaire avec le type what défini
|
||||
this.selected = {
|
||||
id: null,
|
||||
properties: {
|
||||
what: add,
|
||||
label: '',
|
||||
description: '',
|
||||
start: new Date().toISOString(),
|
||||
stop: new Date(Date.now() + 24 * 3600 * 1000).toISOString()
|
||||
},
|
||||
geometry: { type: 'Point', coordinates: [0, 0] }
|
||||
};
|
||||
console.log('✅ Formulaire de création activé pour:', add);
|
||||
} else if (what) {
|
||||
this.selectedWhatFilter = what;
|
||||
console.log('✅ Filtre what défini:', this.selectedWhatFilter);
|
||||
this.loadEvents({ what: what });
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
this.startAutoReload();
|
||||
|
||||
this.loadEvents({what: "culture", limit: 100});
|
||||
|
|
@ -475,7 +544,27 @@ export class Home implements OnInit, OnDestroy {
|
|||
|
||||
onCreated(_res: any) {
|
||||
this.selected = null;
|
||||
this.showEditForm = false;
|
||||
this.addMode = null;
|
||||
this.loadEvents();
|
||||
// Retirer le paramètre add de l'URL (query params ou fragment)
|
||||
if (this.route.snapshot.queryParams['add']) {
|
||||
this.router.navigate([], {
|
||||
relativeTo: this.route,
|
||||
queryParams: { ...this.route.snapshot.queryParams, add: null },
|
||||
queryParamsHandling: 'merge'
|
||||
});
|
||||
} else if (this.route.snapshot.fragment && this.route.snapshot.fragment.includes('add=')) {
|
||||
// Nettoyer le fragment s'il contient add
|
||||
const fragment = this.route.snapshot.fragment || '';
|
||||
const params = new URLSearchParams(fragment.startsWith('&') ? fragment.substring(1) : fragment);
|
||||
params.delete('add');
|
||||
const newFragment = params.toString();
|
||||
this.router.navigate([], {
|
||||
relativeTo: this.route,
|
||||
fragment: newFragment ? '?' + newFragment : undefined
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
onDeleted(_res: any) {
|
||||
|
|
@ -568,8 +657,52 @@ export class Home implements OnInit, OnDestroy {
|
|||
this.loadEvents();
|
||||
}
|
||||
|
||||
closeEditForm() {
|
||||
this.selected = null;
|
||||
this.showEditForm = false;
|
||||
this.addMode = null;
|
||||
// Retirer le paramètre add de l'URL si présent (query params ou fragment)
|
||||
if (this.route.snapshot.queryParams['add']) {
|
||||
this.router.navigate([], {
|
||||
relativeTo: this.route,
|
||||
queryParams: { ...this.route.snapshot.queryParams, add: null },
|
||||
queryParamsHandling: 'merge'
|
||||
});
|
||||
} else if (this.route.snapshot.fragment && this.route.snapshot.fragment.includes('add=')) {
|
||||
// Nettoyer le fragment s'il contient add
|
||||
const fragment = this.route.snapshot.fragment || '';
|
||||
const params = new URLSearchParams(fragment.startsWith('&') ? fragment.substring(1) : fragment);
|
||||
params.delete('add');
|
||||
const newFragment = params.toString();
|
||||
this.router.navigate([], {
|
||||
relativeTo: this.route,
|
||||
fragment: newFragment ? '?' + newFragment : undefined
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
onCanceled() {
|
||||
this.showEditForm = false;
|
||||
this.addMode = null;
|
||||
this.selected = null;
|
||||
// Retirer le paramètre add de l'URL si présent (query params ou fragment)
|
||||
if (this.route.snapshot.queryParams['add']) {
|
||||
this.router.navigate([], {
|
||||
relativeTo: this.route,
|
||||
queryParams: { ...this.route.snapshot.queryParams, add: null },
|
||||
queryParamsHandling: 'merge'
|
||||
});
|
||||
} else if (this.route.snapshot.fragment && this.route.snapshot.fragment.includes('add=')) {
|
||||
// Nettoyer le fragment s'il contient add
|
||||
const fragment = this.route.snapshot.fragment || '';
|
||||
const params = new URLSearchParams(fragment.startsWith('&') ? fragment.substring(1) : fragment);
|
||||
params.delete('add');
|
||||
const newFragment = params.toString();
|
||||
this.router.navigate([], {
|
||||
relativeTo: this.route,
|
||||
fragment: newFragment ? '?' + newFragment : undefined
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
ngAfterViewInit() {
|
||||
|
|
|
|||
|
|
@ -26,7 +26,7 @@
|
|||
<div class="nav-section">
|
||||
<h3>Intégration & API</h3>
|
||||
<a routerLink="/events-docs" class="link">📚 Documentation API</a>
|
||||
<a href="/demo/stats" class="link">📊 Statistiques</a>
|
||||
<a href="/stats" class="link">📊 Statistiques</a>
|
||||
</div>
|
||||
|
||||
<div class="nav-section">
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue