From 4f1f59a40a4fcda521d33b51646d025466c4c11b Mon Sep 17 00:00:00 2001 From: mrlemaire Date: Fri, 14 Jun 2024 10:47:47 +0000 Subject: [PATCH] desactivation du guard sur les routes --- src/app/_helpers/auth.guard.ts | 35 ++++++++++++++++++----------------- src/app/_helpers/services/auth.service.ts | 8 +++++++- src/app/account/auth/login-standard-user/login-standard-user.component.ts | 26 ++++++++++++++++++-------- src/app/app.config.ts | 3 +-- src/app/app.routes.ts | 34 ++++++++++++++-------------------- src/app/core/layout/main-layout/main-layout.component.html | 2 +- src/app/core/layout/navbar/navbar.component.html | 8 +++++--- src/app/core/layout/navbar/navbar.component.ts | 12 +++++++++--- src/assets/scss/core/components/_users.scss | 11 +++++++++++ src/assets/scss/core/layouts/_header.scss | 6 ++++-- 10 files changed, 88 insertions(+), 57 deletions(-) diff --git a/src/app/_helpers/auth.guard.ts b/src/app/_helpers/auth.guard.ts index 09aba59..8ff802a 100644 --- a/src/app/_helpers/auth.guard.ts +++ b/src/app/_helpers/auth.guard.ts @@ -1,36 +1,37 @@ import { Injectable } from '@angular/core'; import { + CanActivate, ActivatedRouteSnapshot, RouterStateSnapshot, + UrlTree, Router, - CanActivate, } from '@angular/router'; -import type { Observable } from 'rxjs'; +import { Observable } from 'rxjs'; +import { AuthService } from './services/auth.service'; @Injectable({ providedIn: 'root', }) export class AuthGuard implements CanActivate { - constructor(private router: Router) {} + constructor( + private authService: AuthService, + private router: Router + ) {} canActivate( - route: ActivatedRouteSnapshot, + next: ActivatedRouteSnapshot, state: RouterStateSnapshot - ): Observable | Promise | boolean { - if (this.isLoggedIn()) { + ): + | Observable + | Promise + | boolean + | UrlTree { + const isAuthenticated = this.authService.isAuthenticated(); + if (isAuthenticated) { return true; - } - this.router.navigate(['/auth']); - return false; - } - public isLoggedIn(): boolean { - let status = false; - if (localStorage.getItem('isLoggedIn')) { - status = true; } else { - status = false; + this.router.navigate(['/auth']); + return false; } - return status; } } - diff --git a/src/app/_helpers/services/auth.service.ts b/src/app/_helpers/services/auth.service.ts index ab9c25b..7792af0 100644 --- a/src/app/_helpers/services/auth.service.ts +++ b/src/app/_helpers/services/auth.service.ts @@ -34,7 +34,13 @@ export class AuthService { public errors: any[] = []; constructor(private http: HttpClient) {} + + isAuthenticated(): boolean { + // implémenter la logique pour vérifier si l'utilisateur est authentifié + // cela peut impliquer de vérifier un token dans le localStorage ou sessionStorage + return !!sessionStorage.getItem('username'); + } public verifyToken( token: string // eslint-disable-next-line @typescript-eslint/no-explicit-any @@ -124,7 +130,7 @@ export class AuthService { } // Met à jour les données utilisateur après une connexion réussie ou un rafraîchissement de jeton - private updateData(token: string) { + public updateData(token: string) { this.token = token; this.errors = []; diff --git a/src/app/account/auth/login-standard-user/login-standard-user.component.ts b/src/app/account/auth/login-standard-user/login-standard-user.component.ts index 11b9d11..5e89fcf 100644 --- a/src/app/account/auth/login-standard-user/login-standard-user.component.ts +++ b/src/app/account/auth/login-standard-user/login-standard-user.component.ts @@ -12,7 +12,7 @@ import { MatInputModule } from '@angular/material/input'; import { MatButtonModule } from '@angular/material/button'; import { MatIconModule } from '@angular/material/icon'; import { MatCheckboxModule } from '@angular/material/checkbox'; -import { Router } from '@angular/router'; +import { Router, RouterLink, RouterOutlet } from '@angular/router'; import { AuthService } from 'src/app/_helpers/services/auth.service'; @Component({ @@ -31,7 +31,7 @@ import { AuthService } from 'src/app/_helpers/services/auth.service'; ], templateUrl: './login-standard-user.component.html', styleUrls: ['./login-standard-user.component.scss'], - providers: [AuthService], + providers: [AuthService, RouterLink, RouterOutlet], }) export class LoginStandardUserComponent implements OnInit { router = inject(Router); @@ -83,27 +83,37 @@ export class LoginStandardUserComponent implements OnInit { password: '', }; } + login() { console.log('Username:', this.user.username); console.log('Password:', this.user.password); this.authService.login(this.user.username, this.user.password).subscribe( - // eslint-disable-next-line @typescript-eslint/no-explicit-any - (response: any) => { - console.log('currentUser=>', response.data); + (response: { status: boolean; data?: any; error?: string }) => { + console.log('currentUser =>', response.data); + console.log('response.status', response.status); if (response.status) { console.log('Connexion réussie'); - // Stocker l'username dans une variable ou dans le localStorage si nécessaire + + // Stocker l'username dans une variable ou dans le sessionStorage si nécessaire const username = response.data; console.log('userInfos', username); + + try { + sessionStorage.setItem('username', username); + } catch (error) { + console.warn('Could not store username in sessionStorage', error); + } + // Redirection vers la page admin - this.router.navigate(['/admin']); + console.log('Redirection vers la page admin'); + this.router.navigateByUrl('/admin'); } else { console.error('Échec de la connexion :', response.error); } }, - error => { + (error: any) => { console.error('Erreur lors de la connexion :', error); // Gérer l'erreur de connexion ici } diff --git a/src/app/app.config.ts b/src/app/app.config.ts index 0ed732b..fc57419 100644 --- a/src/app/app.config.ts +++ b/src/app/app.config.ts @@ -9,7 +9,6 @@ import { provideAnimations } from '@angular/platform-browser/animations'; import { provideEnvironmentNgxMask } from 'ngx-mask'; import { HttpClientModule } from '@angular/common/http'; // Import de HttpClientModule import { provideNativeDateAdapter } from '@angular/material/core'; -import { provideClientHydration } from '@angular/platform-browser'; export const appConfig: ApplicationConfig = { providers: [ @@ -19,6 +18,6 @@ export const appConfig: ApplicationConfig = { provideNativeDateAdapter(), { provide: LOCALE_ID, useValue: 'fr-FR' }, //HttpClientModule, - importProvidersFrom(HttpClientModule), provideClientHydration(), + importProvidersFrom(HttpClientModule), ], }; diff --git a/src/app/app.routes.ts b/src/app/app.routes.ts index 4aac427..36596fe 100644 --- a/src/app/app.routes.ts +++ b/src/app/app.routes.ts @@ -3,6 +3,7 @@ import type { Routes } from '@angular/router'; import { MainLayoutComponent } from './core/layout/main-layout/main-layout.component'; import { AuthGuard } from './_helpers/auth.guard'; import { LoginStandardUserComponent } from './account/auth/login-standard-user/login-standard-user.component'; +import { AdminTestComponent } from './admin-test/admin-test.component'; export const routes: Routes = [ { @@ -15,23 +16,16 @@ export const routes: Routes = [ { path: '', component: MainLayoutComponent, - canActivate: [AuthGuard], + children: [ - { - path: 'admin', - loadComponent: () => - import('./admin-test/admin-test.component').then( - c => c.AdminTestComponent - ), - canActivate: [AuthGuard], - }, + { path: 'admin', component: AdminTestComponent }, { path: 'transactions', loadChildren: () => import('./trafics/transactions/transaction.routes').then( c => c.transactionsRoutes ), - canActivate: [AuthGuard], + }, { path: 'integrations', @@ -39,19 +33,19 @@ export const routes: Routes = [ import('./integrations/integration/integration.routes').then( c => c.integrationRoutes ), - canActivate: [AuthGuard], + }, { path: 'utilisateurs', loadChildren: () => import('./utilisateurs/user.routes').then(c => c.userRoutes), - canActivate: [AuthGuard], + }, { path: 'assistances', loadChildren: () => import('./assistances/service.routes').then(c => c.userRoutes), - canActivate: [AuthGuard], + }, { path: 'reversements', @@ -59,7 +53,7 @@ export const routes: Routes = [ import('./reversements/reversement/reversement.routes').then( c => c.reversementRoutes ), - canActivate: [AuthGuard], + }, { path: 'dash', @@ -67,7 +61,7 @@ export const routes: Routes = [ import( './admin/dashboards/beasy-dashboard/beasy-dashboard.component' ).then(c => c.BeasyDashboardComponent), - canActivate: [AuthGuard], + }, { path: 'application-android', @@ -75,7 +69,7 @@ export const routes: Routes = [ import('./application-android/application-android.component').then( c => c.ApplicationAndroidComponent ), - canActivate: [AuthGuard], + }, { path: 'compte-associe', @@ -83,7 +77,7 @@ export const routes: Routes = [ import('./compte-associe/compte-associe.component').then( c => c.CompteAssocieComponent ), - canActivate: [AuthGuard], + }, { path: 'utilisateurs', @@ -91,7 +85,7 @@ export const routes: Routes = [ import('./utilisateurs/utilisateurs.component').then( c => c.UtilisateursComponent ), - canActivate: [AuthGuard], + }, { path: 'facturation', @@ -99,9 +93,9 @@ export const routes: Routes = [ import('./facturation/facturation.component').then( c => c.FacturationComponent ), - canActivate: [AuthGuard], + // }, - ], + ],canActivate: [AuthGuard], }, { path: '**', diff --git a/src/app/core/layout/main-layout/main-layout.component.html b/src/app/core/layout/main-layout/main-layout.component.html index 7924d24..660f44b 100644 --- a/src/app/core/layout/main-layout/main-layout.component.html +++ b/src/app/core/layout/main-layout/main-layout.component.html @@ -53,7 +53,7 @@ -
+
diff --git a/src/app/core/layout/navbar/navbar.component.html b/src/app/core/layout/navbar/navbar.component.html index 01549b0..afbf0b4 100644 --- a/src/app/core/layout/navbar/navbar.component.html +++ b/src/app/core/layout/navbar/navbar.component.html @@ -9,10 +9,12 @@ >
- +
-
+ -