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

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