+
Nombre de chats disponibles : {{ chats.length }}
+
-
-
-
- Pas de chat pour le moment :/
-
+
+
-
+
+
Pas de chat pour le moment :/
+
\ No newline at end of file
diff --git a/src/app/components/animaux/animaux-list/animaux-list.component.ts b/src/app/components/animaux/animaux-list/animaux-list.component.ts
index d0b7fa4..735a61c 100644
--- a/src/app/components/animaux/animaux-list/animaux-list.component.ts
+++ b/src/app/components/animaux/animaux-list/animaux-list.component.ts
@@ -3,12 +3,14 @@ import { faMars, faVenus, faHeart } from '@fortawesome/free-solid-svg-icons';
import { faHeart as fasHeart } from '@fortawesome/free-regular-svg-icons';
import { AppService } from '../../../services/app.service';
-import { Chat, Sexe, Favori } from '../../../interfaces/interfaces';
+import { Chat, Sexe, Favori, PageEvent, Association } from '../../../interfaces/interfaces';
import { DOCUMENT, DatePipe } from '@angular/common';
import { DomSanitizer, SafeHtml } from '@angular/platform-browser';
import { ToastrService } from 'ngx-toastr';
import { AuthService } from '@auth0/auth0-angular';
import { Subscription, firstValueFrom } from 'rxjs';
+import { PaginatorState } from 'primeng/paginator';
+import { FormBuilder, FormGroup } from '@angular/forms';
@Component({
selector: 'app-animaux-list',
@@ -26,20 +28,41 @@ export class AnimauxListComponent {
sexe = Sexe;
fasHeart = fasHeart;
isAuthenticated: boolean = false;
+ chats: Chat[] = [];
+ favoris: Favori[] = [];
+ associations: Association[] = [];
+ private subscriptions = new Subscription();
+
+
+ // Pagination
+ totalRecords = 3;
+ rows = 10;
+ first = 0;
+ currentPage = 1;
+ selectedCity: string | null = null;
+ selectedCatBreed: string | null = null;
+ selectedAssociation: string | null = null;
+ form: FormGroup;
+
constructor(
private appService: AppService,
private datePipe: DatePipe,
private sanitizer: DomSanitizer,
private toastr: ToastrService,
+ private fb: FormBuilder,
public auth: AuthService,
@Inject(DOCUMENT) private doc: Document
- ) {}
+ ) {
+ this.form = this.fb.group({
+ ville: [''],
+ race: [''],
+ association: ['']
+ });
+ }
- chats: Chat[] = [];
- favoris: Favori[] = [];
- private subscriptions = new Subscription();
+
async ngOnInit() {
this.isAuthenticated = await firstValueFrom(this.auth.isAuthenticated$);
if (this.profileContext && this.isAuthenticated) {
@@ -50,6 +73,7 @@ export class AnimauxListComponent {
this.getFavs();
}
}
+ this.getAllAssociation();
}
toggleFavori(chat: Chat) {
@@ -76,7 +100,14 @@ export class AnimauxListComponent {
}
getCats() {
- const catSubscription = this.appService.getAllCats().subscribe({
+ const filters = {
+ ville: this.form.value.ville,
+ race: this.form.value.race,
+ association: this.form.value.association
+ };
+
+ console.log('🚀 ~ AnimauxListComponent ~ catSubscription ~ filters:', filters);
+ const catSubscription = this.appService.getAllCats(filters).subscribe({
next: (chats) => {
this.chats = chats;
this.isLoaded = true;
@@ -92,6 +123,22 @@ export class AnimauxListComponent {
this.subscriptions.add(catSubscription);
}
+ getAllAssociation() {
+ const associationSubscription = this.appService.getAllAssociations().subscribe({
+ next: (associations) => {
+ this.associations = associations;
+ console.log('🚀 ~ AnimauxListComponent ~ associationSubscription ~ this.associations:', this.associations);
+ },
+ error: (error) => {
+ const errorText = 'Erreur lors de la récupération des associations';
+ console.error(errorText, error);
+ this.toastr.error(errorText, 'Erreur');
+ },
+ complete: () => console.log('Completion handler')
+ });
+ this.subscriptions.add(associationSubscription);
+ }
+
getCatByFavoris() {
const favCatSubscription = this.appService.getCatByFavoris().subscribe({
next: (chats) => {
@@ -140,4 +187,28 @@ export class AnimauxListComponent {
const formattedDate = this.datePipe.transform(date, 'dd MMM yyyy');
return formattedDate || ''; // return an empty string if the date is not valid
}
+
+ onPageChange(event: PaginatorState) {
+ this.first = event.first ?? 0;
+ this.rows = event.rows ?? 10;
+ this.currentPage = Math.floor(this.first / this.rows) + 1;
+ }
+
+ onSearch() {
+ console.log('Search clicked');
+ console.log(this.form.value);
+ this.getCats();
+
+ }
+
+ onClear() {
+ console.log('Clear clicked');
+ this.form.reset({
+ ville: '',
+ race: '',
+ association: ''
+ });
+ this.getCats();
+ }
+
}
diff --git a/src/app/interfaces/interfaces.ts b/src/app/interfaces/interfaces.ts
index 83ddd18..438ecef 100644
--- a/src/app/interfaces/interfaces.ts
+++ b/src/app/interfaces/interfaces.ts
@@ -120,4 +120,13 @@ export enum UserRole {
User = 'User',
Admin = 'Admin',
Asso = 'Asso'
+}
+
+
+// PrimeNG Paginator
+export interface PageEvent {
+ first: number;
+ rows: number;
+ page: number;
+ pageCount: number;
}
\ No newline at end of file
diff --git a/src/app/services/app.service.ts b/src/app/services/app.service.ts
index 648a82c..c65c488 100644
--- a/src/app/services/app.service.ts
+++ b/src/app/services/app.service.ts
@@ -1,5 +1,5 @@
import { Inject, Injectable } from '@angular/core';
-import { HttpClient } from '@angular/common/http';
+import { HttpClient, HttpParams } from '@angular/common/http';
import { Observable, map, share, take } from 'rxjs';
import { Chat, Favori, Association } from '../interfaces/interfaces';
import { environment } from 'src/environments/environment';
@@ -26,8 +26,18 @@ export class AppService {
);
}
- getAllCats(): Observable
{
- return this.http.get(this.api + '/chats').pipe(
+ getAllCats(filters: any = {}): Observable {
+ let params = new HttpParams();
+ if (filters.ville) {
+ params = params.append('ville', filters.ville);
+ }
+ if (filters.race) {
+ params = params.append('race', filters.race);
+ }
+ if (filters.association) {
+ params = params.append('associationId', filters.association);
+ }
+ return this.http.get(this.api + '/chats', { params }).pipe(
map((res: any) => res),
share(),
take(1)
From af057e6a14dd88d55700e37eabcbb79578b13f69 Mon Sep 17 00:00:00 2001
From: FazCodeFR <30906528+FazCodeFR@users.noreply.github.com>
Date: Fri, 7 Jun 2024 16:19:03 +0200
Subject: [PATCH 2/2] Fix pagination
---
src/app/app.module.ts | 2 --
1 file changed, 2 deletions(-)
diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index 6ebed07..e102b7e 100644
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -47,7 +47,6 @@ import { BugComponent } from './components/bug/bug.component';
import { AssociationsDetailsComponent } from './components/associations/associations-details/associations-details.component';
-import { PaginationComponent } from './components/shared/pagination/pagination.component';
import { PaginatorModule } from 'primeng/paginator';
@@ -75,7 +74,6 @@ import { PaginatorModule } from 'primeng/paginator';
TchatMessageComponent,
AssociationsDetailsComponent,
BugComponent,
- PaginationComponent,
],
imports: [
BrowserModule,