création des 3 pages de profil

src/app/admin/myProfil/page-profil-admin/page-profil-admin.component.html

@@ -0,0 +1,43 @@
+<div [class]="themeService.getClassTheme()">
+    <div class="myContainer">
+
+        <!-- NavBar -->
+        <app-navbar-admin></app-navbar-admin>
+
+        <!-- Boite -->
+        <div class="boite">
+
+            <!-- Photo de profil -->
+            <div style="text-align: center">
+                <img [src]="admin.profilePictureUrl"
+                     onerror="this.onerror=null; this.src='assets/profil.png'">
+            </div>
+
+            <!-- login -->
+            <div class="row myRow">
+                <div class="col-6 myLabel">Login:</div>
+                <div class="col-6 myValue"> {{admin.login}} </div>
+            </div>
+
+            <!-- mail -->
+            <div class="row myRow">
+                <div class="col-6 myLabel">Mail:</div>
+                <div class="col-6 myValue"> {{admin.mail}} </div>
+            </div>
+
+            <!-- createdAt -->
+            <div class="row myRow">
+                <div class="col-6 myLabel">Date de création:</div>
+                <div class="col-6 myValue">{{admin.createdAt | date:'dd/LL/YYYY'}}</div>
+            </div>
+
+            <!-- Modifier profil -->
+            <div class="btnContainer">
+                <button mat-button class="myBtn" (click)="onModifier()">Modifier profil</button>
+            </div>
+
+        </div>
+
+
+    </div>
+</div>

src/app/admin/myProfil/page-profil-admin/page-profil-admin.component.scss

@@ -0,0 +1,61 @@
+.myContainer {
+  max-width: 100vw;
+  height: 100vh;
+  overflow-x: hidden;
+}
+
+
+.boite {
+  margin-left: auto;
+  margin-right: auto;
+  width: 25%;
+  margin-top: 10vh;
+  border: solid 3px;
+  border-radius: 10px;
+  padding: 20px 40px 20px 40px;
+  background-color: #ffffff;
+  text-align: center;
+  box-shadow: 10px 5px 5px black;
+}
+.lightTheme .boite {
+  border-color: black;
+}
+.darkTheme .boite {
+  border-color: white;
+}
+
+
+img {
+  margin: 0px 0px 10px 0px;
+  width: 5vw;
+  height: 5vw;
+  border: solid 2px black;
+  border-radius: 50%;
+  font-size: xxx-large;
+}
+
+
+.myRow {
+  margin: 15px 0px 15px 0px;
+}
+.myLabel {
+  text-align: right;
+  padding: 0px 5px 0px 0px;
+  margin: 0px;
+  font-weight: bold;
+}
+.myValue {
+  text-align: left;
+  padding: 0px 0px 0px 5px;
+  margin: 0px;
+}
+
+
+.btnContainer {
+  text-align: center;
+  margin-top: 40px;
+}
+.myBtn {
+  border: solid 1px black;
+  background-color: white;
+}

src/app/admin/myProfil/page-profil-admin/page-profil-admin.component.spec.ts

@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { PageProfilAdminComponent } from './page-profil-admin.component';
+
+describe('PageProfilAdminComponent', () => {
+  let component: PageProfilAdminComponent;
+  let fixture: ComponentFixture<PageProfilAdminComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ PageProfilAdminComponent ]
+    })
+    .compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(PageProfilAdminComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/admin/myProfil/page-profil-admin/page-profil-admin.component.ts

@@ -0,0 +1,57 @@
+import { Component, OnInit } from '@angular/core';
+import {User} from "../../../utils/interfaces/user";
+import {ThemeService} from "../../../utils/services/theme/theme.service";
+import {FictitiousDatasService} from "../../../utils/services/fictitiousDatas/fictitious-datas.service";
+import {MatDialog} from "@angular/material/dialog";
+import {MatSnackBar} from "@angular/material/snack-bar";
+import {PopupUpdateAdminComponent} from "../popup-update-admin/popup-update-admin.component";
+
+
+
+@Component({
+    selector: 'app-page-profil-admin',
+    templateUrl: './page-profil-admin.component.html',
+    styleUrls: ['./page-profil-admin.component.scss']
+})
+export class PageProfilAdminComponent implements OnInit
+{
+
+    admin: User;
+
+
+    constructor( public themeService: ThemeService,
+                 private fictitiousDatasService: FictitiousDatasService,
+                 public dialog: MatDialog,
+                 private snackBar: MatSnackBar ) { }
+
+
+    ngOnInit(): void
+    {
+        this.admin = this.fictitiousDatasService.getAdmin();
+    }
+
+
+    onModifier()
+    {
+        const config = {
+            width: '25%',
+            data: { admin: this.admin }
+        };
+        this.dialog
+            .open(PopupUpdateAdminComponent, config)
+            .afterClosed()
+            .subscribe(retour => {
+
+                if((retour === null) || (retour === undefined))
+                {
+                    const config = { duration: 1000, panelClass: "custom-class" };
+                    this.snackBar.open( "Opération annulé", "", config);
+                }
+                else
+                {
+                    this.admin = retour;
+                }
+            });
+    }
+
+}

src/app/admin/myProfil/popup-update-admin/popup-update-admin.component.html

@@ -0,0 +1,65 @@
+<div class="myContainer">
+    <div class="boite">
+
+        <!-- photo de profil -->
+        <div style="text-align: center">
+            <img [src]="adminCopy.profilePictureUrl" onerror="this.onerror=null; this.src='assets/profil.png'"><br>
+            <input title="lien vers image" type="text" [(ngModel)]="adminCopy.profilePictureUrl" style="width: 90%">
+        </div>
+
+        <!-- divider -->
+        <br><mat-divider></mat-divider><br>
+
+        <!-- login -->
+        <mat-form-field appearance="fill">
+            <mat-label>Pseudo</mat-label>
+            <input matInput type="text" [(ngModel)]="adminCopy.login">
+        </mat-form-field><br>
+
+        <!-- email -->
+        <mat-form-field appearance="fill">
+            <mat-label>Email</mat-label>
+            <input matInput type="text" [(ngModel)]="adminCopy.mail">
+        </mat-form-field><br>
+
+        <!-- divider -->
+        <mat-divider></mat-divider><br>
+
+        <!-- Modifier mot de passe -->
+        <div>
+            Modifier mot de passe:
+            <mat-checkbox [(ngModel)]="changePassword"></mat-checkbox>
+        </div>
+
+        <!-- nouveau mot de passe -->
+        <div *ngIf="changePassword" style="margin-top: 10px">
+            <!-- Nouveau mot de passe -->
+            <mat-form-field appearance="fill">
+                <mat-label>Nouveau mot de passe</mat-label>
+                <input matInput type="password" [(ngModel)]="newPassword">
+            </mat-form-field>
+            <br>
+            <!-- Confirmation npuveau mot de passe -->
+            <mat-form-field appearance="fill">
+                <mat-label>Confirmation nouveau mot de passe</mat-label>
+                <input matInput type="password" [(ngModel)]="confirmNewPassword">
+            </mat-form-field>
+        </div>
+        <div *ngIf="!changePassword"><br></div>
+
+        <!-- divider -->
+        <mat-divider></mat-divider><br>
+
+        <!-- message d'erreur -->
+        <div *ngIf="hasError" style="text-align: center; margin-bottom: 20px;">
+            <span class="mat-error">{{errorMessage}}</span>
+        </div>
+
+        <!-- boutons -->
+        <div style="width: 100%; text-align: right">
+            <button mat-button (click)="this.dialogRef.close(null)"> Annuler </button>
+            <button mat-button (click)="onValider()"> Enregistrer </button>
+        </div>
+
+    </div>
+</div>

src/app/admin/myProfil/popup-update-admin/popup-update-admin.component.scss

@@ -0,0 +1,8 @@
+img {
+  margin: 0px 0px 10px 0px;
+  width: 5vw;
+  height: 5vw;
+  border: solid 2px black;
+  border-radius: 50%;
+  font-size: xxx-large;
+}

src/app/admin/myProfil/popup-update-admin/popup-update-admin.component.spec.ts

@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { PopupUpdateAdminComponent } from './popup-update-admin.component';
+
+describe('PopupUpdateAdminComponent', () => {
+  let component: PopupUpdateAdminComponent;
+  let fixture: ComponentFixture<PopupUpdateAdminComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ PopupUpdateAdminComponent ]
+    })
+    .compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(PopupUpdateAdminComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/admin/myProfil/popup-update-admin/popup-update-admin.component.ts

@@ -0,0 +1,106 @@
+import {Component, Inject, OnInit} from '@angular/core';
+import {User} from "../../../utils/interfaces/user";
+import {MAT_DIALOG_DATA, MatDialogRef} from "@angular/material/dialog";
+
+@Component({
+    selector: 'app-popup-update-admin',
+    templateUrl: './popup-update-admin.component.html',
+    styleUrls: ['./popup-update-admin.component.scss']
+})
+export class PopupUpdateAdminComponent implements OnInit
+{
+    adminCopy: User;
+    newPassword: string = "";
+    confirmNewPassword: string = "" ;
+    changePassword: boolean = false ;
+    hasError: boolean = false;
+    errorMessage: string = "" ;
+
+
+    constructor( public dialogRef: MatDialogRef<PopupUpdateAdminComponent>,
+                 @Inject(MAT_DIALOG_DATA) public data) { }
+
+
+    ngOnInit(): void
+    {
+        const admin0 = this.data.admin;
+        this.adminCopy = {
+            _id: admin0._id,
+            login: admin0.login,
+            hashPass: admin0.hashPass,
+            mail: admin0.mail,
+            role: {
+                name: admin0.role.name,
+                permission: admin0.role.permission,
+            },
+            profilePictureUrl: admin0.profilePictureUrl,
+            dateOfBirth: admin0.dateOfBirth,
+            gender: admin0.gender,
+            interests: [],
+            isActive: admin0.isActive,
+            createdAt: admin0.createdAt,
+            updatedAt: admin0.updatedAt,
+        };
+        for(let interest of admin0.interests) this.adminCopy.interests.push(interest);
+    }
+
+
+    onValider()
+    {
+        this.checkField();
+        if(!this.hasError)
+        {
+            const data = {
+                user: this.adminCopy,
+                newPassword: this.newPassword
+            };
+
+            // VRAI CODE: envoie au back ...
+
+            this.dialogRef.close(this.adminCopy);
+        }
+    }
+
+
+    checkField()
+    {
+        if(this.adminCopy.login.length === 0) {
+            this.errorMessage = "Veuillez remplir le champ 'login'" ;
+            this.hasError = true;
+        }
+        else if(this.adminCopy.mail.length === 0) {
+            this.errorMessage = "Veuillez remplir le champ 'email'" ;
+            this.hasError = true;
+        }
+        else if(!this.isValidEmail(this.adminCopy.mail)) {
+            this.errorMessage = "Email invalide" ;
+            this.hasError = true;
+        }
+        else if(this.changePassword) {
+            if (this.newPassword.length === 0) {
+                this.errorMessage = "Veuillez remplir le champ 'mot de passe'" ;
+                this.hasError = true;
+            } else if (this.newPassword !== this.confirmNewPassword) {
+                this.errorMessage = "Le mot de passe est différent de sa confirmation" ;
+                this.hasError = true;
+            }
+        }
+        else {
+            this.errorMessage = "" ;
+            this.hasError = false;
+        }
+    }
+
+
+    isValidEmail(email)
+    {
+        let re = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
+        return re.test(email);
+    }
+
+
+    onEventInputInterests(myInterets: string[])
+    {
+        this.adminCopy.interests = myInterets;
+    }
+}

src/app/admin/navbar-admin/navbar-admin.component.ts

@@ -1,5 +1,6 @@
-import { Component, OnInit } from '@angular/core';
+import { Component } from '@angular/core';
-import {ThemeService} from "../../utils/services/theme/theme.service";
+
+
 
 @Component({
   selector: 'app-navbar-admin',
@@ -8,11 +9,9 @@ import {ThemeService} from "../../utils/services/theme/theme.service";
 })
 export class NavbarAdminComponent
 {
-    urlImage: string = "" ;
+    urlImage: string = "https://www.reference-gaming.com/assets/media/product/41195/figurine-pop-duck-tales-n-309-loulou.jpg?format=product-cover-large&k=1519639530" ;
 
-    constructor( public themeService: ThemeService ) { }
+    constructor() { }
-
-    onDeconnexion(): void {
 
-    }
+    onDeconnexion(): void {}
 }

src/app/advertiser/myProfil/page-profil-advertiser/page-profil-advertiser.component.html

@@ -1 +1,43 @@
-<p>page-profil-advertiser works!</p>
+<div [class]="themeService.getClassTheme()">
+    <div class="myContainer">
+
+        <!-- NavBar -->
+        <app-navbar-advertiser></app-navbar-advertiser>
+
+        <!-- Boite -->
+        <div class="boite">
+
+            <!-- Photo de profil -->
+            <div style="text-align: center">
+                <img [src]="advertiser.profilePictureUrl"
+                     onerror="this.onerror=null; this.src='assets/profil.png'">
+            </div>
+
+            <!-- login -->
+            <div class="row myRow">
+                <div class="col-6 myLabel">Login:</div>
+                <div class="col-6 myValue"> {{advertiser.login}} </div>
+            </div>
+
+            <!-- mail -->
+            <div class="row myRow">
+                <div class="col-6 myLabel">Mail:</div>
+                <div class="col-6 myValue"> {{advertiser.mail}} </div>
+            </div>
+
+            <!-- createdAt -->
+            <div class="row myRow">
+                <div class="col-6 myLabel">Date de création:</div>
+                <div class="col-6 myValue">{{advertiser.createdAt | date:'dd/LL/YYYY'}}</div>
+            </div>
+
+            <!-- Modifier profil -->
+            <div class="btnContainer">
+                <button mat-button class="myBtn" (click)="onModifier()">Modifier profil</button>
+            </div>
+
+        </div>
+
+
+    </div>
+</div>

src/app/advertiser/myProfil/page-profil-advertiser/page-profil-advertiser.component.scss

@@ -0,0 +1,61 @@
+.myContainer {
+  max-width: 100vw;
+  height: 100vh;
+  overflow-x: hidden;
+}
+
+
+.boite {
+  margin-left: auto;
+  margin-right: auto;
+  width: 25%;
+  margin-top: 10vh;
+  border: solid 3px;
+  border-radius: 10px;
+  padding: 20px 40px 20px 40px;
+  background-color: #ffffff;
+  text-align: center;
+  box-shadow: 10px 5px 5px black;
+}
+.lightTheme .boite {
+  border-color: black;
+}
+.darkTheme .boite {
+  border-color: white;
+}
+
+
+img {
+  margin: 0px 0px 10px 0px;
+  width: 5vw;
+  height: 5vw;
+  border: solid 2px black;
+  border-radius: 50%;
+  font-size: xxx-large;
+}
+
+
+.myRow {
+  margin: 15px 0px 15px 0px;
+}
+.myLabel {
+  text-align: right;
+  padding: 0px 5px 0px 0px;
+  margin: 0px;
+  font-weight: bold;
+}
+.myValue {
+  text-align: left;
+  padding: 0px 0px 0px 5px;
+  margin: 0px;
+}
+
+
+.btnContainer {
+  text-align: center;
+  margin-top: 40px;
+}
+.myBtn {
+  border: solid 1px black;
+  background-color: white;
+}

src/app/advertiser/myProfil/page-profil-advertiser/page-profil-advertiser.component.ts

@@ -1,15 +1,56 @@
 import { Component, OnInit } from '@angular/core';
+import {User} from "../../../utils/interfaces/user";
+import {ThemeService} from "../../../utils/services/theme/theme.service";
+import {FictitiousDatasService} from "../../../utils/services/fictitiousDatas/fictitious-datas.service";
+import {MatDialog} from "@angular/material/dialog";
+import {MatSnackBar} from "@angular/material/snack-bar";
+import {PopupUpdateAdvertiserComponent} from "../popup-update-advertiser/popup-update-advertiser.component";
+
+
 
 @Component({
     selector: 'app-page-profil-advertiser',
     templateUrl: './page-profil-advertiser.component.html',
     styleUrls: ['./page-profil-advertiser.component.scss']
 })
-export class PageProfilAdvertiserComponent implements OnInit {
+export class PageProfilAdvertiserComponent implements OnInit
+{
+    advertiser: User;
 
-  constructor() { }
 
-  ngOnInit(): void {
+    constructor( public themeService: ThemeService,
+                 private fictitiousDatasService: FictitiousDatasService,
+                 public dialog: MatDialog,
+                 private snackBar: MatSnackBar ) { }
+
+
+    ngOnInit(): void
+    {
+        this.advertiser = this.fictitiousDatasService.getAdvertiser();
+    }
+
+
+    onModifier()
+    {
+        const config = {
+            width: '25%',
+            data: { advertiser: this.advertiser }
+        };
+        this.dialog
+            .open(PopupUpdateAdvertiserComponent, config)
+            .afterClosed()
+            .subscribe(retour => {
+
+                if((retour === null) || (retour === undefined))
+                {
+                    const config = { duration: 1000, panelClass: "custom-class" };
+                    this.snackBar.open( "Opération annulé", "", config);
+                }
+                else
+                {
+                    this.advertiser = retour;
+                }
+            });
     }
 
 }

src/app/advertiser/myProfil/popup-update-advertiser/popup-update-advertiser.component.html

@@ -1 +1,65 @@
-<p>popup-update-advertiser works!</p>
+<div class="myContainer">
+    <div class="boite">
+
+        <!-- photo de profil -->
+        <div style="text-align: center">
+            <img [src]="advertiserCopy.profilePictureUrl" onerror="this.onerror=null; this.src='assets/profil.png'"><br>
+            <input title="lien vers image" type="text" [(ngModel)]="advertiserCopy.profilePictureUrl" style="width: 90%">
+        </div>
+
+        <!-- divider -->
+        <br><mat-divider></mat-divider><br>
+
+        <!-- login -->
+        <mat-form-field appearance="fill">
+            <mat-label>Pseudo</mat-label>
+            <input matInput type="text" [(ngModel)]="advertiserCopy.login">
+        </mat-form-field><br>
+
+        <!-- email -->
+        <mat-form-field appearance="fill">
+            <mat-label>Email</mat-label>
+            <input matInput type="text" [(ngModel)]="advertiserCopy.mail">
+        </mat-form-field><br>
+
+        <!-- divider -->
+        <mat-divider></mat-divider><br>
+
+        <!-- Modifier mot de passe -->
+        <div>
+            Modifier mot de passe:
+            <mat-checkbox [(ngModel)]="changePassword"></mat-checkbox>
+        </div>
+
+        <!-- nouveau mot de passe -->
+        <div *ngIf="changePassword" style="margin-top: 10px">
+            <!-- Nouveau mot de passe -->
+            <mat-form-field appearance="fill">
+                <mat-label>Nouveau mot de passe</mat-label>
+                <input matInput type="password" [(ngModel)]="newPassword">
+            </mat-form-field>
+            <br>
+            <!-- Confirmation npuveau mot de passe -->
+            <mat-form-field appearance="fill">
+                <mat-label>Confirmation nouveau mot de passe</mat-label>
+                <input matInput type="password" [(ngModel)]="confirmNewPassword">
+            </mat-form-field>
+        </div>
+        <div *ngIf="!changePassword"><br></div>
+
+        <!-- divider -->
+        <mat-divider></mat-divider><br>
+
+        <!-- message d'erreur -->
+        <div *ngIf="hasError" style="text-align: center; margin-bottom: 20px;">
+            <span class="mat-error">{{errorMessage}}</span>
+        </div>
+
+        <!-- boutons -->
+        <div style="width: 100%; text-align: right">
+            <button mat-button (click)="this.dialogRef.close(null)"> Annuler </button>
+            <button mat-button (click)="onValider()"> Enregistrer </button>
+        </div>
+
+    </div>
+</div>

src/app/advertiser/myProfil/popup-update-advertiser/popup-update-advertiser.component.scss

@@ -0,0 +1,8 @@
+img {
+  margin: 0px 0px 10px 0px;
+  width: 5vw;
+  height: 5vw;
+  border: solid 2px black;
+  border-radius: 50%;
+  font-size: xxx-large;
+}

src/app/advertiser/myProfil/popup-update-advertiser/popup-update-advertiser.component.ts

@@ -1,15 +1,109 @@
-import { Component, OnInit } from '@angular/core';
+import {Component, Inject, OnInit} from '@angular/core';
+import {User} from "../../../utils/interfaces/user";
+import {MAT_DIALOG_DATA, MatDialogRef} from "@angular/material/dialog";
+
+
 
 @Component({
     selector: 'app-popup-update-advertiser',
     templateUrl: './popup-update-advertiser.component.html',
     styleUrls: ['./popup-update-advertiser.component.scss']
 })
-export class PopupUpdateAdvertiserComponent implements OnInit {
+export class PopupUpdateAdvertiserComponent implements OnInit
+{
+    advertiserCopy: User;
+    newPassword: string = "";
+    confirmNewPassword: string = "" ;
+    changePassword: boolean = false ;
+    hasError: boolean = false;
+    errorMessage: string = "" ;
 
-  constructor() { }
 
-  ngOnInit(): void {
+    constructor( public dialogRef: MatDialogRef<PopupUpdateAdvertiserComponent>,
+                 @Inject(MAT_DIALOG_DATA) public data) { }
+
+
+    ngOnInit(): void
+    {
+        const advertiser0 = this.data.advertiser;
+        this.advertiserCopy = {
+            _id: advertiser0._id,
+            login: advertiser0.login,
+            hashPass: advertiser0.hashPass,
+            mail: advertiser0.mail,
+            role: {
+                name: advertiser0.role.name,
+                permission: advertiser0.role.permission,
+            },
+            profilePictureUrl: advertiser0.profilePictureUrl,
+            dateOfBirth: advertiser0.dateOfBirth,
+            gender: advertiser0.gender,
+            interests: [],
+            isActive: advertiser0.isActive,
+            createdAt: advertiser0.createdAt,
+            updatedAt: advertiser0.updatedAt,
+        };
+        for(let interest of advertiser0.interests) this.advertiserCopy.interests.push(interest);
+    }
+
+
+    onValider()
+    {
+        this.checkField();
+        if(!this.hasError)
+        {
+            const data = {
+                user: this.advertiserCopy,
+                newPassword: this.newPassword
+            };
+
+            // VRAI CODE: envoie au back ...
+
+            this.dialogRef.close(this.advertiserCopy);
+        }
+    }
+
+
+    checkField()
+    {
+        if(this.advertiserCopy.login.length === 0) {
+            this.errorMessage = "Veuillez remplir le champ 'login'" ;
+            this.hasError = true;
+        }
+        else if(this.advertiserCopy.mail.length === 0) {
+            this.errorMessage = "Veuillez remplir le champ 'email'" ;
+            this.hasError = true;
+        }
+        else if(!this.isValidEmail(this.advertiserCopy.mail)) {
+            this.errorMessage = "Email invalide" ;
+            this.hasError = true;
+        }
+        else if(this.changePassword) {
+            if (this.newPassword.length === 0) {
+                this.errorMessage = "Veuillez remplir le champ 'mot de passe'" ;
+                this.hasError = true;
+            } else if (this.newPassword !== this.confirmNewPassword) {
+                this.errorMessage = "Le mot de passe est différent de sa confirmation" ;
+                this.hasError = true;
+            }
+        }
+        else {
+            this.errorMessage = "" ;
+            this.hasError = false;
+        }
+    }
+
+
+    isValidEmail(email)
+    {
+        let re = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
+        return re.test(email);
+    }
+
+
+    onEventInputInterests(myInterets: string[])
+    {
+        this.advertiserCopy.interests = myInterets;
     }
 
 }

src/app/advertiser/navbar-advertiser/navbar-advertiser.component.html

@@ -1,13 +1,23 @@
 <nav class="navbar navbar-expand-lg">
 
     <!-- PolyNotFound -->
-    <a class="navbar-brand" routerLink="/advertiser"> StreamNotFound </a>
+    <a class="navbar-brand" routerLink="/advertiser/manageAds"> StreamNotFound </a>
     <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavDropdown" aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Toggle navigation">
         <span class="navbar-toggler-icon"></span>
     </button>
 
     <!-- Vide -->
-    <div class="collapse navbar-collapse"></div>
+    <!-- [Recherche] [Mes Playlists] [Historique] -->
+    <div class="collapse navbar-collapse">
+        <ul class="navbar-nav">
+            <li class="nav-item active monLi">
+                <a class="nav-link" routerLink="/advertiser/manageAds"> Gestion des annonces </a>
+            </li>
+            <li class="nav-item active monLi">
+                <a class="nav-link" routerLink="/advertiser/manageAds"> Popularité des annonces </a>
+            </li>
+        </ul>
+    </div>
 
     <!-- Mon profil -->
     <img [src]=urlImage

src/app/advertiser/navbar-advertiser/navbar-advertiser.component.ts

@@ -1,5 +1,6 @@
 import { Component } from '@angular/core';
-import {ThemeService} from "../../utils/services/theme/theme.service";
+
+
 
 @Component({
   selector: 'app-navbar-advertiser',
@@ -8,10 +9,9 @@ import {ThemeService} from "../../utils/services/theme/theme.service";
 })
 export class NavbarAdvertiserComponent
 {
-    urlImage: string = "" ;
+    urlImage: string = "https://www.figurines-goodies.com/1188-large_default/dewey-duck-tales-disney-funko-pop.jpg" ;
 
-    constructor( public themeService: ThemeService ) { }
+    constructor() { }
 
     onDeconnexion(): void {}
-
 }

src/app/app-routing.module.ts

@@ -8,28 +8,35 @@ import {PageHistoryUserComponent} from "./user/history/page-history-user/page-hi
 import {PageAdvertiserComponent} from "./advertiser/manageAds/page-advertiser/page-advertiser.component";
 import {PageProfilUserComponent} from "./user/myProfil/page-profil-user/page-profil-user.component";
 import {PageProfilAdvertiserComponent} from "./advertiser/myProfil/page-profil-advertiser/page-profil-advertiser.component";
+import {PageProfilAdminComponent} from "./admin/myProfil/page-profil-admin/page-profil-admin.component";
 
 
 const routes: Routes = [
+
+    // Before connexion
     { path: '', component: PageLoginComponent },
     { path: 'login', component: PageLoginComponent },
     { path: 'register', component: PageRegisterComponent },
 
+    // User
     { path: 'user', component: PageSearchComponent },
     { path: 'user/search', component: PageSearchComponent },
     { path: 'user/myPlaylists', component: PageMyPlaylistsComponent },
     { path: 'user/history', component: PageHistoryUserComponent },
     { path: 'user/myProfil', component:  PageProfilUserComponent },
 
+    // Advertiser
     { path: 'advertiser', component: PageAdvertiserComponent },
+    { path: 'advertiser/manageAds', component: PageAdvertiserComponent },
     { path: 'advertiser/myProfil', component: PageProfilAdvertiserComponent },
 
-    /*
+    // Admin
-    { path: 'admin/userList', component: PageLoginComponent },
+    // { path: 'admin', component: PageLoginComponent }
-    { path: 'admin/addUser', component: PageLoginComponent },
+    // { path: 'admin/userList', component: PageLoginComponent },
-    { path: 'admin/adList', component: PageLoginComponent },
+    // { path: 'admin/addUser', component: PageLoginComponent },
+    // { path: 'admin/adList', component: PageLoginComponent },
     { path: 'admin/myProfil', component: PageProfilAdminComponent }
-    */
+
 ];
 
 

src/app/app.module.ts

@@ -57,6 +57,8 @@ import { PopupUpdateUserComponent } from './user/myProfil/popup-update-user/popu
 import { NavbarBeforeConnexionComponent } from './beforeConnexion/navbar-before-connexion/navbar-before-connexion.component';
 import {MatRadioModule} from "@angular/material/radio";
 import { InputInterestsComponent } from './user/myProfil/input-interests/input-interests.component';
+import { PageProfilAdminComponent } from './admin/myProfil/page-profil-admin/page-profil-admin.component';
+import { PopupUpdateAdminComponent } from './admin/myProfil/popup-update-admin/popup-update-admin.component';
 
 
 @NgModule({
@@ -96,6 +98,8 @@ import { InputInterestsComponent } from './user/myProfil/input-interests/input-i
         PopupUpdateUserComponent,
         NavbarBeforeConnexionComponent,
         InputInterestsComponent,
+        PageProfilAdminComponent,
+        PopupUpdateAdminComponent,
     ],
     imports: [
         BrowserModule,

src/app/user/myProfil/page-profil-user/page-profil-user.component.html

@@ -28,9 +28,7 @@
             <!-- dateOfBirth -->
             <div class="row myRow">
                 <div class="col-6 myLabel">Date de naissance:</div>
-                <div class="col-6 myValue">
+                <div class="col-6 myValue">{{ user.dateOfBirth | date:'dd/LL/YYYY' }}</div>
-                    {{ user.dateOfBirth | date:'dd/LL/YYYY' }}
-                </div>
             </div>
 
             <!-- gender -->
@@ -53,9 +51,7 @@
             <!-- createdAt -->
             <div class="row myRow">
                 <div class="col-6 myLabel">Date de création:</div>
-                <div class="col-6 myValue">
+                <div class="col-6 myValue">{{ user.createdAt | date:'dd/LL/YYYY' }}</div>
-                    {{ user.createdAt | date:'dd/LL/YYYY à HH:mm:ss' }}
-                </div>
             </div>
 
             <!-- Modifier profil -->

src/app/user/myProfil/page-profil-user/page-profil-user.component.ts

@@ -3,8 +3,10 @@ import {ThemeService} from "../../../utils/services/theme/theme.service";
 import {FictitiousDatasService} from "../../../utils/services/fictitiousDatas/fictitious-datas.service";
 import {User} from "../../../utils/interfaces/user";
 import {MatDialog} from "@angular/material/dialog";
-import {PopupUpdateUserComponent} from "../popup-update-user/popup-update-user.component";
 import {MatSnackBar} from "@angular/material/snack-bar";
+import {PopupUpdateUserComponent} from "../popup-update-user/popup-update-user.component";
+
+
 
 @Component({
     selector: 'app-page-profil-user',
@@ -50,4 +52,5 @@ export class PageProfilUserComponent implements OnInit
                 }
             });
     }
+
 }

src/app/user/myProfil/popup-update-user/popup-update-user.component.html

@@ -1,18 +1,14 @@
 <div class="myContainer">
-
-
     <div class="boite">
 
-        <!-- profil login mail dateOfBirth gender interets -->
-
         <!-- photo de profil -->
         <div style="text-align: center">
-            <img [src]="userCopy.profilePictureUrl"
+            <img [src]="userCopy.profilePictureUrl" onerror="this.onerror=null; this.src='assets/profil.png'"><br>
-                 onerror="this.onerror=null; this.src='assets/profil.png'">
+            <input title="lien vers image" type="text" [(ngModel)]="userCopy.profilePictureUrl" style="width: 90%">
-            <br>
-            <input matInput type="text" [(ngModel)]="userCopy.profilePictureUrl">
         </div>
-        <br>
+
+        <!-- divider -->
+        <br><mat-divider></mat-divider><br>
 
         <!-- login -->
         <mat-form-field appearance="fill">
@@ -31,27 +27,32 @@
         <!-- dateOfBirth -->
         <mat-form-field appearance="fill">
             <mat-label>Date de naissance</mat-label>
-            <input matInput type="date" [(ngModel)]="userCopy.mail">
+            <input matInput type="date"
+                   [ngModel] ="userCopy.dateOfBirth | date:'yyyy-MM-dd'"
+                   (ngModelChange)="userCopy.dateOfBirth = $event">
         </mat-form-field>
         <br>
 
         <!-- gender -->
         <mat-radio-group [(ngModel)]="userCopy.gender">
-            <mat-radio-button value="man"> Homme </mat-radio-button>
+            <mat-radio-button value="man"> Homme </mat-radio-button>&nbsp; &nbsp;
             <mat-radio-button value="woman"> Femme </mat-radio-button>
         </mat-radio-group>
-
+        <br><br>
 
         <!-- interets -->
         <app-input-interests [myInterests]="userCopy.interests" (eventEmitter)="onEventInputInterests($event)"></app-input-interests>
 
+        <!-- divider -->
+        <br><mat-divider></mat-divider><br>
 
         <!-- Modifier mot de passe -->
+        <div style="margin-bottom: 10px">
             Modifier mot de passe:
             <mat-checkbox [(ngModel)]="changePassword"></mat-checkbox>
-        <br>
+        </div>
 
-        <!-- Nouveau mot de passe -->
+        <!-- nouveau mot de passe -->
         <div *ngIf="changePassword">
             <!-- Nouveau mot de passe -->
             <mat-form-field appearance="fill">
@@ -65,17 +66,21 @@
                 <input matInput type="password" [(ngModel)]="confirmNewPassword">
             </mat-form-field>
         </div>
-        <br>
+        <div *ngIf="!changePassword"><br></div>
 
-        <!-- Bouton valider -->
+        <!-- divider -->
-        <div style="width: 100%; text-align: center">
+        <mat-divider></mat-divider><br>
-            <button mat-button (click)="onValider()"> Enregistrer </button>
-        </div>
 
-        <!-- Message d'erreur -->
+        <!-- message d'erreur -->
-        <div *ngIf="hasError" style="text-align: center; margin-top: 10px;">
+        <div *ngIf="hasError" style="text-align: center; margin-bottom: 20px;">
             <span class="mat-error">{{errorMessage}}</span>
         </div>
 
+        <!-- boutons -->
+        <div style="width: 100%; text-align: right">
+            <button mat-button (click)="this.dialogRef.close(null)"> Annuler </button>
+            <button mat-button (click)="onValider()"> Enregistrer </button>
+        </div>
+
     </div>
 </div>

src/app/user/myProfil/popup-update-user/popup-update-user.component.ts

@@ -12,7 +12,7 @@ import {User} from "../../../utils/interfaces/user";
 export class PopupUpdateUserComponent implements OnInit
 {
     userCopy: User;
-    newPassword: string;
+    newPassword: string = "";
     confirmNewPassword: string = "" ;
     changePassword: boolean = false ;
     hasError: boolean = false;
@@ -52,11 +52,14 @@ export class PopupUpdateUserComponent implements OnInit
         this.checkField();
         if(!this.hasError)
         {
-            const retour = {
+            const data = {
                 user: this.userCopy,
                 newPassword: this.newPassword
             };
-            this.dialogRef.close(retour);
+
+            // VRAI CODE: envoie au back ...
+
+            this.dialogRef.close(this.userCopy);
         }
     }
 

src/app/user/navbar-user/navbar-user.component.ts

@@ -1,35 +1,17 @@
-import {Component, OnInit} from '@angular/core';
+import {Component} from '@angular/core';
-import {ThemeService} from "../../utils/services/theme/theme.service";
+
-import {Router} from "@angular/router";
+
 
 @Component({
   selector: 'app-navbar-user',
   templateUrl: './navbar-user.component.html',
   styleUrls: ['./navbar-user.component.scss']
 })
-export class NavbarUserComponent implements OnInit
+export class NavbarUserComponent
 {
-    urlImage: string = "" ;
+    urlImage: string = "https://www.figurines-goodies.com/1185-thickbox_default/huey-duck-tales-disney-funko-pop.jpg" ;
 
-    constructor( public themeService: ThemeService,
+    constructor() { }
-                 private router: Router) { }
-
-
-    ngOnInit(): void
-    {
-        if(this.router.url.startsWith("/user")) {
-            this.urlImage = "https://www.figurines-goodies.com/1185-thickbox_default/huey-duck-tales-disney-funko-pop.jpg";
-        }
-        else if(this.router.url.startsWith("/advertiser")) {
-            this.urlImage = "https://www.figurines-goodies.com/1188-large_default/dewey-duck-tales-disney-funko-pop.jpg" ;
-        }
-        else if(this.router.url.startsWith("/admin")) {
-            this.urlImage = "https://www.reference-gaming.com/assets/media/product/41195/figurine-pop-duck-tales-n-309-loulou.jpg?format=product-cover-large&k=1519639530" ;
-        }
-    }
-
-    onDeconnexion(): void {
-
-    }
 
+    onDeconnexion(): void {}
 }

src/app/utils/services/fictitiousDatas/fictitious-datas.service.ts

@@ -252,9 +252,9 @@ export class FictitiousDatasService
                 permission: 5,
             },
             profilePictureUrl: "https://www.figurines-goodies.com/1188-large_default/dewey-duck-tales-disney-funko-pop.jpg",
-            dateOfBirth: new Date(),
+            dateOfBirth: null,
-            gender: "man",
+            gender: "",
-            interests: ["cuisine", "jeux-vidéo"],
+            interests: [],
             isActive: true,
             createdAt: new Date(),
             updatedAt: new Date(),
@@ -273,9 +273,9 @@ export class FictitiousDatasService
                 permission: 5,
             },
             profilePictureUrl: "https://www.reference-gaming.com/assets/media/product/41195/figurine-pop-duck-tales-n-309-loulou.jpg?format=product-cover-large&k=1519639530",
-            dateOfBirth: new Date(),
+            dateOfBirth: null,
-            gender: "man",
+            gender: "",
-            interests: ["musique", "jeux-vidéo"],
+            interests: [],
             isActive: true,
             createdAt: new Date(),
             updatedAt: new Date(),