yvachot/PolyNotFound
Archived
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

création des 3 pages de profil

Browse source
This commit is contained in:
MiharyR 2021-11-12 09:47:14 +01:00
parent ef5dd96747
commit 89e174a28d
25 changed files with 811 additions and 102 deletions
Download patch file Download diff file Expand all files Collapse all files

43
src/app/admin/myProfil/page-profil-admin/page-profil-admin.component.html Normal file
View file

@ -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>

61
src/app/admin/myProfil/page-profil-admin/page-profil-admin.component.scss Normal file
View file

@ -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;
}

25
src/app/admin/myProfil/page-profil-admin/page-profil-admin.component.spec.ts Normal file
View file

@ -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();
});
});

57
src/app/admin/myProfil/page-profil-admin/page-profil-admin.component.ts Normal file
View file

@ -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;
}
});
}
}

65
src/app/admin/myProfil/popup-update-admin/popup-update-admin.component.html Normal file
View file

@ -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>

8
src/app/admin/myProfil/popup-update-admin/popup-update-admin.component.scss Normal file
View file

@ -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;
}

25
src/app/admin/myProfil/popup-update-admin/popup-update-admin.component.spec.ts Normal file
View file

@ -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();
});
});

106
src/app/admin/myProfil/popup-update-admin/popup-update-admin.component.ts Normal file
View file

@ -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;
}
}

13
src/app/admin/navbar-admin/navbar-admin.component.ts
View file

@ -1,5 +1,6 @@
import { Component, OnInit } from '@angular/core';
import {ThemeService} from "../../utils/services/theme/theme.service";
import { Component } from '@angular/core';
@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 {}
}

44
src/app/advertiser/myProfil/page-profil-advertiser/page-profil-advertiser.component.html
View file

@ -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>

61
src/app/advertiser/myProfil/page-profil-advertiser/page-profil-advertiser.component.scss
View file

@ -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;
}

55
src/app/advertiser/myProfil/page-profil-advertiser/page-profil-advertiser.component.ts
View file

@ -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']
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;
}
});
}
}

66
src/app/advertiser/myProfil/popup-update-advertiser/popup-update-advertiser.component.html
View file

@ -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>

8
src/app/advertiser/myProfil/popup-update-advertiser/popup-update-advertiser.component.scss
View file

@ -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;
}

110
src/app/advertiser/myProfil/popup-update-advertiser/popup-update-advertiser.component.ts
View file

@ -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']
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;
}
}

14
src/app/advertiser/navbar-advertiser/navbar-advertiser.component.html
View file

@ -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

8
src/app/advertiser/navbar-advertiser/navbar-advertiser.component.ts
View file

@ -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 {}
}

17
src/app/app-routing.module.ts
View file

@ -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 },
/*
{ path: 'admin/userList', component: PageLoginComponent },
{ path: 'admin/addUser', component: PageLoginComponent },
{ path: 'admin/adList', component: PageLoginComponent },
// Admin
// { path: 'admin', component: PageLoginComponent }
// { path: 'admin/userList', component: PageLoginComponent },
// { path: 'admin/addUser', component: PageLoginComponent },
// { path: 'admin/adList', component: PageLoginComponent },
{ path: 'admin/myProfil', component: PageProfilAdminComponent }
*/
];

4
src/app/app.module.ts
View file

@ -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,

8
src/app/user/myProfil/page-profil-user/page-profil-user.component.html
View file

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

11
src/app/user/myProfil/page-profil-user/page-profil-user.component.ts
View file

@ -3,13 +3,15 @@ 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',
templateUrl: './page-profil-user.component.html',
styleUrls: ['./page-profil-user.component.scss']
selector: 'app-page-profil-user',
templateUrl: './page-profil-user.component.html',
styleUrls: ['./page-profil-user.component.scss']
})
export class PageProfilUserComponent implements OnInit
{
@ -50,4 +52,5 @@ export class PageProfilUserComponent implements OnInit
}
});
}
}

51
src/app/user/myProfil/popup-update-user/popup-update-user.component.html
View file

@ -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"
onerror="this.onerror=null; this.src='assets/profil.png'">
<br>
<input matInput type="text" [(ngModel)]="userCopy.profilePictureUrl">
<img [src]="userCopy.profilePictureUrl" onerror="this.onerror=null; this.src='assets/profil.png'"><br>
<input title="lien vers image" type="text" [(ngModel)]="userCopy.profilePictureUrl" style="width: 90%">
</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 -->
Modifier mot de passe:
<mat-checkbox [(ngModel)]="changePassword"></mat-checkbox>
<br>
<div style="margin-bottom: 10px">
Modifier mot de passe:
<mat-checkbox [(ngModel)]="changePassword"></mat-checkbox>
</div>
<!-- Nouveau mot de passe -->
<!-- nouveau mot de passe -->
<div *ngIf="changePassword">
<!-- Nouveau mot de passe -->
<mat-form-field appearance="fill">
@ -65,16 +66,20 @@
<input matInput type="password" [(ngModel)]="confirmNewPassword">
</mat-form-field>
</div>
<br>
<div *ngIf="!changePassword"><br></div>
<!-- Bouton valider -->
<div style="width: 100%; text-align: center">
<button mat-button (click)="onValider()"> Enregistrer </button>
<!-- 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>
<!-- Message d'erreur -->
<div *ngIf="hasError" style="text-align: center; margin-top: 10px;">
<span class="mat-error"> {{errorMessage}} </span>
<!-- 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>

9
src/app/user/myProfil/popup-update-user/popup-update-user.component.ts
View file

@ -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);
}
}

32
src/app/user/navbar-user/navbar-user.component.ts
View file

@ -1,35 +1,17 @@
import {Component, OnInit} from '@angular/core';
import {ThemeService} from "../../utils/services/theme/theme.service";
import {Router} from "@angular/router";
import {Component} from '@angular/core';
@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,
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 {
}
constructor() { }
onDeconnexion(): void {}
}

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

@ -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(),
gender: "man",
interests: ["cuisine", "jeux-vidéo"],
dateOfBirth: null,
gender: "",
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(),
gender: "man",
interests: ["musique", "jeux-vidéo"],
dateOfBirth: null,
gender: "",
interests: [],
isActive: true,
createdAt: new Date(),
updatedAt: new Date(),