diff --git a/src/app/app.component.html b/src/app/app.component.html index 811ea5f..e2a3e12 100644 --- a/src/app/app.component.html +++ b/src/app/app.component.html @@ -1,7 +1,7 @@ -
- +
+
diff --git a/src/app/app.component.ts b/src/app/app.component.ts index 56b8484..5578843 100644 --- a/src/app/app.component.ts +++ b/src/app/app.component.ts @@ -1,48 +1,8 @@ -import { Component, ViewChild } from '@angular/core'; -import { - trigger, - animate, - style, - group, - animateChild, - query, - stagger, - transition, - state, -} from '@angular/animations'; -import { AppService } from './services/app.service'; +import { Component } from '@angular/core'; @Component({ selector: 'app-root', templateUrl: './app.component.html', styleUrls: ['./app.component.scss'], - animations: [ - trigger('routerTransition', [ - transition('* <=> *', [ - query(':enter, :leave', style({ position: 'fixed', width: '100%' }), { optional: true }), - group([ - query(':enter', [ - style({ transform: 'translateX(100%)' }), - animate('0.5s ease-in-out', style({ transform: 'translateX(0%)' })) - ], { optional: true }), - query(':leave', [ - style({ transform: 'translateX(0%)' }), - animate('0.5s ease-in-out', style({ transform: 'translateX(-100%)' })) - ], { optional: true }), - ]), - ]), - ]), - - ], }) export class AppComponent { - message = ''; - name = ''; - - constructor(private appService: AppService) {} - - getState(outlet: any) { - // Changing the activatedRouteData.state triggers the animation - return outlet.activatedRouteData.state; - } - } diff --git a/src/app/app.module.ts b/src/app/app.module.ts index a1f6e94..d61cf8e 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -48,6 +48,7 @@ import { BugComponent } from './components/bug/bug.component'; import { AssociationsDetailsComponent } from './components/associations/associations-details/associations-details.component'; import { PaginatorModule } from 'primeng/paginator'; +import { AssociationsFormComponent } from './components/associations/associations-form/associations-form.component'; @NgModule({ @@ -74,6 +75,7 @@ import { PaginatorModule } from 'primeng/paginator'; TchatMessageComponent, AssociationsDetailsComponent, BugComponent, + AssociationsFormComponent, ], imports: [ BrowserModule, diff --git a/src/app/components/animaux/animaux-list/animaux-list.component.html b/src/app/components/animaux/animaux-list/animaux-list.component.html index 6c9a0df..e5515b6 100644 --- a/src/app/components/animaux/animaux-list/animaux-list.component.html +++ b/src/app/components/animaux/animaux-list/animaux-list.component.html @@ -54,7 +54,7 @@

Les chat

- {{chat.association.nom}} - {{formatDate(chat.createdAt)}}

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 735a61c..556457a 100644 --- a/src/app/components/animaux/animaux-list/animaux-list.component.ts +++ b/src/app/components/animaux/animaux-list/animaux-list.component.ts @@ -20,6 +20,7 @@ import { FormBuilder, FormGroup } from '@angular/forms'; }) export class AnimauxListComponent { @Input() profileContext: boolean = false; + @Input() associationId: number | undefined = undefined; isLoaded: boolean = false; faMars = faMars; faVenus = faVenus; @@ -65,7 +66,7 @@ export class AnimauxListComponent { async ngOnInit() { this.isAuthenticated = await firstValueFrom(this.auth.isAuthenticated$); - if (this.profileContext && this.isAuthenticated) { + if (this.profileContext && this.isAuthenticated && !this.associationId) { this.getCatByFavoris(); } else { this.getCats(); @@ -103,7 +104,7 @@ export class AnimauxListComponent { const filters = { ville: this.form.value.ville, race: this.form.value.race, - association: this.form.value.association + association: this.associationId ? this.associationId : this.form.value.association }; console.log('🚀 ~ AnimauxListComponent ~ catSubscription ~ filters:', filters); diff --git a/src/app/components/associations/associations-details/associations-details.component.html b/src/app/components/associations/associations-details/associations-details.component.html index e8c7f04..b5e1935 100644 --- a/src/app/components/associations/associations-details/associations-details.component.html +++ b/src/app/components/associations/associations-details/associations-details.component.html @@ -147,6 +147,17 @@

+
+
+

Chats de l'association :

+
+ +
+
+
+

+ diff --git a/src/app/components/associations/associations-form/associations-form.component.html b/src/app/components/associations/associations-form/associations-form.component.html new file mode 100644 index 0000000..a663da4 --- /dev/null +++ b/src/app/components/associations/associations-form/associations-form.component.html @@ -0,0 +1,157 @@ + + +
+ + + +
+ + Rajouter mon association ? +
+
+ +
+
+
+

Créer une Association

+ +
+
+
+
+ +
+
+

+ Vous devez être connecté pour créer une association. + S'inscrire ou se connecter +

+
+
+
+
+ +
+

Remplissez les informations ci-dessous pour créer une nouvelle association.

+
+
+ +
+
+ +
+
+ + +
+ {{ getErrorMessage('nom') }} +
+
+
+ + +
+
+ + +
+ {{ getErrorMessage('url') }} +
+
+
+ + +
+
+ + +
+ {{ getErrorMessage('ville') }} +
+
+
+ + +
+
+ + +
+ {{ getErrorMessage('shortDescription') }} +
+
+
+ + +
+
+ + +
+ {{ getErrorMessage('description') }} +
+
+
+ + +
+
+ + +
+ {{ getErrorMessage('tel') }} +
+
+
+ + +
+
+ + +
+ {{ getErrorMessage('urlGoogleMapsEmbled') }} +
+
+
+
+ +
+
+
+
+
+
+
+
+
\ No newline at end of file diff --git a/src/app/components/associations/associations-form/associations-form.component.scss b/src/app/components/associations/associations-form/associations-form.component.scss new file mode 100644 index 0000000..e69de29 diff --git a/src/app/components/associations/associations-form/associations-form.component.spec.ts b/src/app/components/associations/associations-form/associations-form.component.spec.ts new file mode 100644 index 0000000..3889125 --- /dev/null +++ b/src/app/components/associations/associations-form/associations-form.component.spec.ts @@ -0,0 +1,21 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { AssociationsFormComponent } from './associations-form.component'; + +describe('AssociationsFormComponent', () => { + let component: AssociationsFormComponent; + let fixture: ComponentFixture; + + beforeEach(() => { + TestBed.configureTestingModule({ + declarations: [AssociationsFormComponent] + }); + fixture = TestBed.createComponent(AssociationsFormComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/components/associations/associations-form/associations-form.component.ts b/src/app/components/associations/associations-form/associations-form.component.ts new file mode 100644 index 0000000..8a7acf1 --- /dev/null +++ b/src/app/components/associations/associations-form/associations-form.component.ts @@ -0,0 +1,76 @@ +import { DOCUMENT } from '@angular/common'; +import { Component, Inject } from '@angular/core'; +import { FormBuilder, FormGroup, Validators } from '@angular/forms'; +import { DomSanitizer } from '@angular/platform-browser'; +import { AuthService } from '@auth0/auth0-angular'; +import { ToastrService } from 'ngx-toastr'; +import { firstValueFrom } from 'rxjs'; +import { AppService } from 'src/app/services/app.service'; + +@Component({ + selector: 'app-associations-form', + templateUrl: './associations-form.component.html', + styleUrls: ['./associations-form.component.scss'] +}) +export class AssociationsFormComponent { + + associationForm!: FormGroup; + isAuthenticated: boolean = false; + + constructor( + private appService: AppService, + private sanitizer: DomSanitizer, + private toastr: ToastrService, + public auth: AuthService, + @Inject(DOCUMENT) private doc: Document, + private fb: FormBuilder + ) {} + + async ngOnInit() { + this.isAuthenticated = await firstValueFrom(this.auth.isAuthenticated$); + this.associationForm = this.fb.group({ + nom: ['', [Validators.required, Validators.minLength(3)]], + url: ['', Validators.required], + ville: ['', Validators.required], + description: ['', [Validators.required, Validators.minLength(10)]], + shortDescription: ['', [Validators.required, Validators.minLength(10)]], + tel: ['', [Validators.required]], + urlGoogleMapsEmbled: ['', [Validators.required, Validators.minLength(10)]] + }); + } + + + getErrorMessage(controlName: string): string { + const control = this.associationForm.get(controlName); + if (control?.hasError('required')) { + return 'Ce champ est requis'; + } + if (control?.hasError('minlength')) { + const minLength = control?.errors?.['minlength'].requiredLength; + return `Ce champ doit contenir au moins ${minLength} caractères`; + } + return ''; + } + + + onSubmit() { + if (this.associationForm.valid) { + console.log('Form Data:', this.associationForm.value); + this.appService.createAsso(this.associationForm.value).subscribe({ + next: (response) => { + console.log('response:', response); + this.toastr.success('Association créée avec succès, elle va être vérifiée par un administrateur', 'Succès'); + this.associationForm.reset(); + }, + error: (error) => { + this.toastr.error('Une erreur est survenue, veuillez réessayer plus tard', 'Erreur'); + console.error('error:', error); + } + }); + } + } + + loginWithRedirect() { + this.auth.loginWithRedirect(); + } +} diff --git a/src/app/components/associations/associations-list/associations-list.component.html b/src/app/components/associations/associations-list/associations-list.component.html index df5d7ed..a1e943d 100644 --- a/src/app/components/associations/associations-list/associations-list.component.html +++ b/src/app/components/associations/associations-list/associations-list.component.html @@ -2,25 +2,41 @@
    -
  • -
    -
    - -

    - {{ association.shortDescription }} -

    -
    - {{ association.nom }} +
  • + +
    + + +

    {{ association.nom }}

    +
    + + +
    + {{ association.nom }} +
    + + +

    {{ association.shortDescription }}

    +
    -
    -
    - - {{ association.ville }} +
    + +
    +
    + + {{ association.ville }} +
    +
    + +
    +
    + + {{ association.chats.length }} +
    @@ -28,137 +44,4 @@

    {{ association.nom }}

    - -
    - - - -
    - - Rajouter mon association ? -
    -
    - -
    -
    -
    -

    Créer une Association

    -

    Remplissez les informations ci-dessous pour créer une nouvelle association.

    -
    -
    -
    - -
    -
    - - -
    - {{ getErrorMessage('nom') }} -
    -
    -
    - - -
    -
    - - -
    - {{ getErrorMessage('url') }} -
    -
    -
    - - -
    -
    - - -
    - {{ getErrorMessage('ville') }} -
    -
    -
    - - -
    -
    - - -
    - {{ getErrorMessage('shortDescription') }} -
    -
    -
    - - -
    -
    - - -
    - {{ getErrorMessage('description') }} -
    -
    -
    - - -
    -
    - - -
    - {{ getErrorMessage('tel') }} -
    -
    -
    - - -
    -
    - - -
    - {{ getErrorMessage('urlGoogleMapsEmbled') }} -
    -
    -
    -
    - -
    -
    -
    -
    -
    -
    -
    -
    -
    + diff --git a/src/app/components/associations/associations-list/associations-list.component.ts b/src/app/components/associations/associations-list/associations-list.component.ts index bd028d1..c0379f1 100644 --- a/src/app/components/associations/associations-list/associations-list.component.ts +++ b/src/app/components/associations/associations-list/associations-list.component.ts @@ -6,7 +6,7 @@ import { ToastrService } from 'ngx-toastr'; import { AuthService } from '@auth0/auth0-angular'; import { Subscription } from 'rxjs'; import { Association } from '../../../interfaces/interfaces'; -import { faLocationDot, faPen } from '@fortawesome/free-solid-svg-icons'; +import { faCat, faLocationDot, faPen } from '@fortawesome/free-solid-svg-icons'; import { FormBuilder, FormGroup, Validators } from '@angular/forms'; @@ -19,6 +19,7 @@ export class AssociationsListComponent { isLoaded: boolean = false; isAuthenticated: boolean = false; faLocationDot = faLocationDot; + faCat = faCat; faPen = faPen; associationForm!: FormGroup; @@ -70,36 +71,6 @@ export class AssociationsListComponent { this.subscriptions.unsubscribe(); } - getErrorMessage(controlName: string): string { - const control = this.associationForm.get(controlName); - if (control?.hasError('required')) { - return 'Ce champ est requis'; - } - if (control?.hasError('minlength')) { - const minLength = control?.errors?.['minlength'].requiredLength; - return `Ce champ doit contenir au moins ${minLength} caractères`; - } - return ''; - } - - - onSubmit() { - if (this.associationForm.valid) { - console.log('Form Data:', this.associationForm.value); - this.appService.createAsso(this.associationForm.value).subscribe({ - next: (response) => { - console.log('response:', response); - this.toastr.success('Association créée avec succès, elle va être vérifiée par un administrateur', 'Succès'); - this.associationForm.reset(); - }, - error: (error) => { - this.toastr.error('Une erreur est survenue, veuillez réessayer plus tard', 'Erreur'); - console.error('error:', error); - } - }); - } - } - sanitizeHtml(html: string): SafeHtml { return this.sanitizer.bypassSecurityTrustHtml(html); } diff --git a/src/assets/home/adopter.png b/src/assets/home/adopter.png index 44da767..ac31f81 100644 Binary files a/src/assets/home/adopter.png and b/src/assets/home/adopter.png differ diff --git a/src/assets/home/rencontre.png b/src/assets/home/rencontre.png index 1dbc2f2..03ee7b1 100644 Binary files a/src/assets/home/rencontre.png and b/src/assets/home/rencontre.png differ