diff --git a/src/app/admin-component/add-restau/add-restau.component.ts b/src/app/admin-component/add-restau/add-restau.component.ts index 586719a..d98ccbd 100644 --- a/src/app/admin-component/add-restau/add-restau.component.ts +++ b/src/app/admin-component/add-restau/add-restau.component.ts @@ -83,7 +83,6 @@ export class AddRestauComponent implements OnInit { restaurant.adresse !== '') { this.apiBackService.addRestaurant(restaurant).subscribe( resp => - this.router.navigate(['restaurants']) ); } else { diff --git a/src/app/admin-component/update-del-restau/update-del-restau.component.html b/src/app/admin-component/update-del-restau/update-del-restau.component.html index d18c0d9..4a65ea7 100644 --- a/src/app/admin-component/update-del-restau/update-del-restau.component.html +++ b/src/app/admin-component/update-del-restau/update-del-restau.component.html @@ -5,11 +5,9 @@
{{restau.nom}}
-
- -
+
\ No newline at end of file diff --git a/src/app/app-routing.module.ts b/src/app/app-routing.module.ts index 644c2ab..a01b041 100644 --- a/src/app/app-routing.module.ts +++ b/src/app/app-routing.module.ts @@ -7,16 +7,20 @@ import { RestoPageComponent } from './pages/resto-page/resto-page.component'; import { PageNotFoundComponent } from './pages/page-not-found/page-not-found.component'; import { FiltersPageComponent } from './pages/filters-page/filters-page.component'; import { SigninComponent } from './pages/signin/signin.component'; +import { SignupComponent } from './pages/signup/signup.component'; import { AdminPageComponent } from './pages/admin-page/admin-page.component'; import { AuthGuard } from './services/auth.guard'; +import { PageAccountComponent } from './pages/page-account/page-account.component'; const routes: Routes = [ - { path: '', redirectTo: 'signin', pathMatch: 'full' }, + { path: '', redirectTo: 'home', pathMatch: 'full' }, {path: 'signin', component: SigninComponent}, + {path: 'signup', component: SignupComponent}, { path: 'home', component: HomePageComponent }, { path: 'categories', component: ListCategoriesComponent }, { path: 'favoris', component: FavorisUserComponent }, { path: 'filtres', component: FiltersPageComponent }, + { path: 'profil', component: PageAccountComponent }, { path: 'Deconnexion', redirectTo: 'home'}, {path: 'restaurants', canActivate: [AuthGuard], component: RestoPageComponent}, {path: 'page-not-found',component: PageNotFoundComponent}, diff --git a/src/app/app.component.html b/src/app/app.component.html index 19dd0a6..0aa81f4 100644 --- a/src/app/app.component.html +++ b/src/app/app.component.html @@ -3,4 +3,4 @@ - + diff --git a/src/app/app.component.ts b/src/app/app.component.ts index be5ed0d..18917ec 100644 --- a/src/app/app.component.ts +++ b/src/app/app.component.ts @@ -1,6 +1,7 @@ import { Component } from '@angular/core'; import { NavigationEnd, Router } from '@angular/router'; import { ApiBackService } from './services/api-back.service'; +import { AuthGuard } from './services/auth.guard'; @Component({ selector: 'app-root', @@ -11,7 +12,7 @@ export class AppComponent { title = 'simpleat'; dontShow: boolean = false; - constructor(public router:Router, private apiBackService : ApiBackService){ + constructor(public router:Router, private apiBackService : ApiBackService, private authgard : AuthGuard){ this.router.events.subscribe(e=>{ //console.log(e); if(e instanceof NavigationEnd){ @@ -26,6 +27,7 @@ export class AppComponent { } - ngOnInit(): void { } + ngOnInit(): void {} + } + -} diff --git a/src/app/app.module.ts b/src/app/app.module.ts index 6d701ea..de864a8 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -24,6 +24,8 @@ import { UpdateDelRestauComponent } from './admin-component/update-del-restau/up import { HeaderLogoComponent } from './header/components/header-logo/header-logo.component'; import { AuthInterceptor } from './services/auth.interceptor'; import { FavorisUserComponent } from './pages/favoris-user/favoris-user.component'; +import { SignupComponent } from './pages/signup/signup.component'; +import { PageAccountComponent } from './pages/page-account/page-account.component'; @NgModule({ declarations: [ @@ -46,7 +48,9 @@ import { FavorisUserComponent } from './pages/favoris-user/favoris-user.componen AddRestauComponent, UpdateDelRestauComponent, HeaderLogoComponent, - FavorisUserComponent + FavorisUserComponent, + SignupComponent, + PageAccountComponent ], imports: [ BrowserModule, diff --git a/src/app/header/components/header-logo/header-logo.component.html b/src/app/header/components/header-logo/header-logo.component.html index 8cc88e8..af4e171 100644 --- a/src/app/header/components/header-logo/header-logo.component.html +++ b/src/app/header/components/header-logo/header-logo.component.html @@ -10,4 +10,5 @@

LE BON PLAN POUR MANGER

+ \ No newline at end of file diff --git a/src/app/header/components/header-logo/header-logo.component.scss b/src/app/header/components/header-logo/header-logo.component.scss index 1202554..7d00233 100644 --- a/src/app/header/components/header-logo/header-logo.component.scss +++ b/src/app/header/components/header-logo/header-logo.component.scss @@ -10,6 +10,7 @@ } + .trait{ width: 100%; @@ -26,4 +27,12 @@ p{ left: 68px; padding : 0 10px 0 10px; color: grey; +} + +@media only screen and (max-width:753px) { + +.trait{ + display: none; +} + } \ No newline at end of file diff --git a/src/app/header/components/nav-bar/nav-bar.component.html b/src/app/header/components/nav-bar/nav-bar.component.html index 8fadc20..6a99db4 100644 --- a/src/app/header/components/nav-bar/nav-bar.component.html +++ b/src/app/header/components/nav-bar/nav-bar.component.html @@ -16,6 +16,7 @@ Restaurants Filtres Mes favoris + Mon profil Deconnexion diff --git a/src/app/header/components/nav-bar/nav-bar.component.scss b/src/app/header/components/nav-bar/nav-bar.component.scss index bf277c2..4b0136e 100644 --- a/src/app/header/components/nav-bar/nav-bar.component.scss +++ b/src/app/header/components/nav-bar/nav-bar.component.scss @@ -1,13 +1,15 @@ #image-header{ + display: flex; justify-content: center; + } img{ width: 100%; - display: block; + height: auto; margin: 0 auto; padding: 0; @@ -23,3 +25,14 @@ img{ +@media only screen and (max-width:1131px) { + .navbar-toggler{ + margin: 3vh; + } + .container-fluid{ + padding: 0; + } + + +} + diff --git a/src/app/header/components/search-bar/search-bar.component.html b/src/app/header/components/search-bar/search-bar.component.html index a9d881c..794fc6d 100644 --- a/src/app/header/components/search-bar/search-bar.component.html +++ b/src/app/header/components/search-bar/search-bar.component.html @@ -1,5 +1,5 @@ -
- +
\ No newline at end of file diff --git a/src/app/header/components/search-bar/search-bar.component.scss b/src/app/header/components/search-bar/search-bar.component.scss index 089d9a6..32a67eb 100644 --- a/src/app/header/components/search-bar/search-bar.component.scss +++ b/src/app/header/components/search-bar/search-bar.component.scss @@ -1,4 +1,19 @@ input[type="search"], textarea{ background-color: #edf5f1; + +} +@media only screen and (max-width:753px) { + + .content{ + margin-left: 3vh; + margin-top: 3vh; + + + } + // .btn{ + // display: none; + // } + + } diff --git a/src/app/pages/admin-page/admin-page.component.html b/src/app/pages/admin-page/admin-page.component.html index fd8ef34..32d34ce 100644 --- a/src/app/pages/admin-page/admin-page.component.html +++ b/src/app/pages/admin-page/admin-page.component.html @@ -1,9 +1,16 @@
-
- -
+
+
+ +
+
+ +
+ +
-
\ No newline at end of file +
+ diff --git a/src/app/pages/admin-page/admin-page.component.scss b/src/app/pages/admin-page/admin-page.component.scss index 8e1cebc..e69de29 100644 --- a/src/app/pages/admin-page/admin-page.component.scss +++ b/src/app/pages/admin-page/admin-page.component.scss @@ -1,3 +0,0 @@ -.search-bar{ - width : 30%; -} \ No newline at end of file diff --git a/src/app/pages/filters-page/filters-page.component.html b/src/app/pages/filters-page/filters-page.component.html index 00fb9ba..b07ef48 100644 --- a/src/app/pages/filters-page/filters-page.component.html +++ b/src/app/pages/filters-page/filters-page.component.html @@ -8,7 +8,7 @@

- @@ -36,7 +36,7 @@

- @@ -64,7 +64,7 @@

- @@ -91,7 +91,7 @@

- diff --git a/src/app/pages/filters-page/filters-page.component.scss b/src/app/pages/filters-page/filters-page.component.scss index 75a8bba..acb529b 100644 --- a/src/app/pages/filters-page/filters-page.component.scss +++ b/src/app/pages/filters-page/filters-page.component.scss @@ -8,21 +8,18 @@ .titre{ - display: flex; justify-content: flex-start; margin: 2.5em 0 0.5em 8.2em; color: #CE0000; - } .accordion{ padding-top: 100px; -max-width: 30%; +max-width: 40%; margin : 0 auto; margin-bottom: 100px; - } .accordion-body{ @@ -56,8 +53,28 @@ filter: drop-shadow(0 0 0.2rem grey); } span{ - font-weight: 500 ; } +.accordion-button.collapsed { + background: #CE0000; +} + +.accordion-button.collapsed::after { + background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e"); +} + +@media only screen and (max-width:768px) { + +span{ + font-size: 2vh; +} + +p{ + font-size: 2vh; +} + +} + + diff --git a/src/app/pages/models/roleList.ts b/src/app/pages/models/roleList.ts new file mode 100644 index 0000000..4103504 --- /dev/null +++ b/src/app/pages/models/roleList.ts @@ -0,0 +1,5 @@ +export enum RoleList { + ROLE_ADMIN = 'ROLE_ADMIN', + ROLE_CREATOR = 'ROLE_CREATOR', + ROLE_READER = 'ROLE_READER' +} \ No newline at end of file diff --git a/src/app/pages/models/user.ts b/src/app/pages/models/user.ts index 340925f..2eba1ca 100644 --- a/src/app/pages/models/user.ts +++ b/src/app/pages/models/user.ts @@ -5,4 +5,5 @@ export interface User { email: string; password?: string; preference ?: object; + roleList ?: string[]; } diff --git a/src/app/pages/page-account/page-account.component.html b/src/app/pages/page-account/page-account.component.html new file mode 100644 index 0000000..0e13e4c --- /dev/null +++ b/src/app/pages/page-account/page-account.component.html @@ -0,0 +1,20 @@ +
+
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+
+
\ No newline at end of file diff --git a/src/app/pages/page-account/page-account.component.scss b/src/app/pages/page-account/page-account.component.scss new file mode 100644 index 0000000..e69de29 diff --git a/src/app/pages/page-account/page-account.component.spec.ts b/src/app/pages/page-account/page-account.component.spec.ts new file mode 100644 index 0000000..8bbe80f --- /dev/null +++ b/src/app/pages/page-account/page-account.component.spec.ts @@ -0,0 +1,25 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { PageAccountComponent } from './page-account.component'; + +describe('PageAccountComponent', () => { + let component: PageAccountComponent; + let fixture: ComponentFixture; + + beforeEach(async () => { + await TestBed.configureTestingModule({ + declarations: [ PageAccountComponent ] + }) + .compileComponents(); + }); + + beforeEach(() => { + fixture = TestBed.createComponent(PageAccountComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/pages/page-account/page-account.component.ts b/src/app/pages/page-account/page-account.component.ts new file mode 100644 index 0000000..e129fde --- /dev/null +++ b/src/app/pages/page-account/page-account.component.ts @@ -0,0 +1,38 @@ +import { Component, OnInit } from '@angular/core'; +import { FormBuilder, FormGroup } from '@angular/forms'; +import { AuthService } from 'src/app/services/auth.service'; +import { RoleList } from '../models/roleList'; +import { User } from '../models/user'; + +@Component({ + selector: 'app-page-account', + templateUrl: './page-account.component.html', + styleUrls: ['./page-account.component.scss'] +}) +export class PageAccountComponent implements OnInit { + + public userInfo: FormGroup; + + constructor(private fb: FormBuilder, private authService: AuthService) { + this.userInfo = this.initForm(); + + this.authService.getConnectedUserInfo()?.subscribe( + (user: User) => { + this.userInfo = this.initForm(user); + } + ) + + } + + ngOnInit(): void { + } + + private initForm(user?: User): FormGroup { + return this.fb.group({ + firstName: [user ? user.prenom : ''], + lastName: [user ? user.nom : ''], + email: [user ? user.email : ''], + RoleList: [user ? user.roleList : ''] + }) + } +} diff --git a/src/app/pages/signup/signup.component.html b/src/app/pages/signup/signup.component.html new file mode 100644 index 0000000..0fd818a --- /dev/null +++ b/src/app/pages/signup/signup.component.html @@ -0,0 +1,71 @@ + \ No newline at end of file diff --git a/src/app/pages/signup/signup.component.scss b/src/app/pages/signup/signup.component.scss new file mode 100644 index 0000000..d1c5dd4 --- /dev/null +++ b/src/app/pages/signup/signup.component.scss @@ -0,0 +1,31 @@ +.signup-form { + height: 100vh; + padding-top: 40px; +} + +.form-signup { + width: 100%; + max-width: 330px; + padding: 15px; + margin: auto; +} + +.form-signup .checkbox { + font-weight: 400; +} + +.form-signup .form-floating:focus-within { + z-index: 2; +} + +.form-signup input[type="email"] { + margin-bottom: -1px; + border-bottom-right-radius: 0; + border-bottom-left-radius: 0; +} + +.form-signup input[type="password"] { + margin-bottom: 10px; + border-top-left-radius: 0; + border-top-right-radius: 0; +} \ No newline at end of file diff --git a/src/app/pages/signup/signup.component.spec.ts b/src/app/pages/signup/signup.component.spec.ts new file mode 100644 index 0000000..2c39790 --- /dev/null +++ b/src/app/pages/signup/signup.component.spec.ts @@ -0,0 +1,25 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { SignupComponent } from './signup.component'; + +describe('SignupComponent', () => { + let component: SignupComponent; + let fixture: ComponentFixture; + + beforeEach(async () => { + await TestBed.configureTestingModule({ + declarations: [ SignupComponent ] + }) + .compileComponents(); + }); + + beforeEach(() => { + fixture = TestBed.createComponent(SignupComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/pages/signup/signup.component.ts b/src/app/pages/signup/signup.component.ts new file mode 100644 index 0000000..6f9d703 --- /dev/null +++ b/src/app/pages/signup/signup.component.ts @@ -0,0 +1,69 @@ +import { Component, OnInit } from '@angular/core'; +import { FormControl, FormGroup, Validators } from '@angular/forms'; +import { Router } from '@angular/router'; +import { AuthService } from 'src/app/services/auth.service'; +import { RoleList } from '../models/roleList'; +import { User } from '../models/user'; + +@Component({ + selector: 'app-signup', + templateUrl: './signup.component.html', + styleUrls: ['./signup.component.scss'] +}) +export class SignupComponent implements OnInit { + public signupForm: FormGroup; + public roleList: typeof RoleList; + public alertMessage?: string; + public successMessage?: string; + + + constructor(private authService: AuthService, private router: Router) { + this.signupForm = new FormGroup({}); + this.roleList = RoleList; + } + + ngOnInit(): void { + // FormGroupe => Group de champs de saisie (notre objet) + // FormControl => Les champs de saisie (nos propriétés) + this.signupForm = new FormGroup({ + firstNameFc : new FormControl(''), + lastNameFc : new FormControl(''), + emailFc : new FormControl('', [Validators.email, Validators.required, Validators.pattern(/^([\w\.\-_]+)?\w+@[\w-_]+(\.\w+){1,}/igm)]), // chercher une meilleure regex + passwordFc : new FormControl('', [Validators.minLength(8), Validators.required]), + roleFc : new FormControl('') + }) + + console.log(this.roleList); + } + + public onSubmit(): void { + + if(confirm("Êtes-vous sur d'ajouter ce membre ?")){ + + const firstNameValue = this.signupForm.value['firstNameFc']; + const lastNameValue = this.signupForm.value['lastNameFc']; + const emailValue = this.signupForm.value['emailFc']; + const passwordValue = this.signupForm.value['passwordFc']; + const roleValue = this.signupForm.value['roleFc']; + + const user: User = { + prenom: firstNameValue, + nom: lastNameValue, + email: emailValue, + password: passwordValue, + roleList : [roleValue] + } + + if(user.email !== '' && user.password !== '') { + this.authService.signup(user).subscribe( + resp => { + this.successMessage = "Membre ajouté !"; + } + ) + } else { + this.alertMessage = "Erreur d'ajout !"; + } + } + } + +} diff --git a/src/app/services/auth.guard.ts b/src/app/services/auth.guard.ts index 6510e1a..01e2700 100644 --- a/src/app/services/auth.guard.ts +++ b/src/app/services/auth.guard.ts @@ -31,6 +31,7 @@ export class AuthGuard implements CanActivate { const dateExp = new Date(decodedToken.exp * 1000); if(new Date() >= dateExp) { // le token a expiré, je n'autorise pas l'accès + this.tokenService.destroyToken(this.tokenKey); this.router.navigate(['signin']); return false; } diff --git a/src/app/services/auth.service.ts b/src/app/services/auth.service.ts index b649e4f..d77b3ec 100644 --- a/src/app/services/auth.service.ts +++ b/src/app/services/auth.service.ts @@ -3,6 +3,9 @@ import { Injectable } from '@angular/core'; import { map, Observable } from 'rxjs'; import { environment } from 'src/environments/environment'; import { User } from 'src/app/pages/models/user'; +import jwt_decode from 'jwt-decode'; +import { Router } from '@angular/router'; + @Injectable({ @@ -12,24 +15,16 @@ export class AuthService { private apiUrl: string; private tokenKey: string; - constructor(private http: HttpClient) { + constructor(private http: HttpClient, private router: Router) { // On se sert des variables d'environnement de notre application this.apiUrl = environment.apiUrl; this.tokenKey = environment.tokenKey; } - // signup(): Observable { - // // const body = { - // // firstName: firstName, - // // lastName: lastName, - // // email: email, - // // password: password - // // }; + signup(newUser: User): Observable { + return this.http.post(`${this.apiUrl}/signup`, newUser); + } - // console.log("Mon nouvel utilisateur : ", newUser); - - // return this.http.post(`${this.apiUrl}/register`, newUser); - // } signin(email: string, password: string): Observable { const body = { @@ -37,12 +32,6 @@ export class AuthService { password: password }; - console.log("Mon body : ", body); - - // Modifier cette partie ci-dessous : - // - pour pouvoir stocker dans le localstorage notre accesstoken - // - Sous la clé "TOKEN-SIMPLEAT" - return this.http.post(`${this.apiUrl}/signin`, body).pipe( map((x: any) => { console.log(x); @@ -55,15 +44,12 @@ export class AuthService { ); } - // forgotPassword(email: string, password: string): Observable { - // const body = { - // email: email, - // password: password - // }; - - // console.log("Mon body : ", body); - - // return this.http.post(`${this.apiUrl}/forgot-psw`, body); - // } - + getConnectedUserInfo(): Observable | void { + const token = localStorage.getItem(this.tokenKey); + if(token) { + const decodedToken = jwt_decode(token); + const userId = decodedToken.userId; + return this.http.get(`${this.apiUrl}/user/${userId}`); + } + } } diff --git a/src/assets/images-header/bandeaumobile.png b/src/assets/images-header/bandeaumobile.png new file mode 100644 index 0000000..3f21e2e Binary files /dev/null and b/src/assets/images-header/bandeaumobile.png differ