correction pages: register, myProfil-user, search, myPlaylists

This commit is contained in:
MiharyR 2021-11-14 03:39:24 +01:00
parent 91171a3765
commit a8cbd4efb7
27 changed files with 278 additions and 352 deletions

View file

@ -9,49 +9,13 @@
<!-- Photo de profil -->
<div style="text-align: center">
<img [src]="user.profilePictureUrl"
onerror="this.onerror=null; this.src='assets/profil.png'">
<img [src]="user.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"> {{user.login}} </div>
</div>
<!-- mail -->
<div class="row myRow">
<div class="col-6 myLabel">Mail:</div>
<div class="col-6 myValue"> {{user.mail}} </div>
</div>
<!-- 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>
<!-- gender -->
<div class="row myRow">
<div class="col-6 myLabel">Sexe:</div>
<div class="col-6 myValue">
<span *ngIf="user.gender==='man'"> Homme </span>
<span *ngIf="user.gender==='woman'"> Femme </span>
</div>
</div>
<!-- interets -->
<div class="row myRow">
<div class="col-6 myLabel">Centres d'intérêt:</div>
<div class="col-6 myValue" style="border-left: solid 1px #e6e6e6">
<div *ngFor="let interest of user.interests">• {{interest}}</div>
</div>
</div>
<!-- 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' }}</div>
<!-- Col gauche & droite -->
<div class="row">
<ng-template *ngIf="true; then leftCol"></ng-template>
<ng-template *ngIf="true; then rightCol"></ng-template>
</div>
<!-- Modifier profil -->
@ -61,6 +25,68 @@
</div>
</div>
</div>
<!-- --------------------------------------------------------------------------------------------------------------- -->
<ng-template #leftCol>
<div class="col-6">
<!-- login -->
<div class="row myRow">
<div class="col-8 myLabel">Login:</div>
<div class="col-4 myValue"> {{user.login}} </div>
</div>
<!-- mail -->
<div class="row myRow">
<div class="col-8 myLabel">Mail:</div>
<div class="col-4 myValue"> {{user.mail}} </div>
</div>
<!-- gender -->
<div class="row myRow">
<div class="col-8 myLabel">Sexe:</div>
<div class="col-4 myValue">
<span *ngIf="user.gender==='man'"> Homme </span>
<span *ngIf="user.gender==='woman'"> Femme </span>
</div>
</div>
<!-- createdAt -->
<div class="row myRow">
<div class="col-8 myLabel">Date de création:</div>
<div class="col-4 myValue">{{ user.createdAt | date:'dd/LL/YYYY' }}</div>
</div>
</div>
</ng-template>
<!-- --------------------------------------------------------------------------------------------------------------- -->
<ng-template #rightCol>
<div class="col-6" style="border-left: solid 1px #e6e6e6">
<!-- dateOfBirth -->
<div class="row myRow">
<div class="col-4 myLabel">Date de naissance:</div>
<div class="col-8 myValue">{{ user.dateOfBirth | date:'dd/LL/YYYY' }}</div>
</div>
<!-- interets -->
<div class="row myRow">
<div class="col-4 myLabel">Centres d'intérêt:</div>
<div class="col-8 myValue">
<div class="interestsContainer">
<div *ngFor="let interest of user.interests" class="interest"> {{interest}} </div>
</div>
</div>
</div>
</div>
</ng-template>

View file

@ -8,7 +8,7 @@
.boite {
margin-left: auto;
margin-right: auto;
width: 25%;
width: 70%;
margin-top: 10vh;
border: solid 3px;
border-radius: 10px;
@ -24,6 +24,7 @@
border-color: white;
}
// --------------------------------------------------------------------------------------------
img {
margin: 0px 0px 10px 0px;
@ -34,6 +35,7 @@ img {
font-size: xxx-large;
}
// --------------------------------------------------------------------------------------------
.myRow {
margin: 15px 0px 15px 0px;
@ -50,6 +52,21 @@ img {
margin: 0px;
}
// --------------------------------------------------------------------------------------------
.interestsContainer {
width: 70%;
height: 15vh;
overflow-y: scroll;
border: 1px solid black;
}
.interest {
border-bottom: 1px solid #dcdcdc;
padding: 5px 5px 5px 5px;
}
// --------------------------------------------------------------------------------------------
.btnContainer {
text-align: center;
@ -59,3 +76,5 @@ img {
border: solid 1px black;
background-color: white;
}

View file

@ -78,6 +78,10 @@ export class PopupUpdateUserComponent implements OnInit
this.errorMessage = "Email invalide" ;
this.hasError = true;
}
else if((this.userCopy.dateOfBirth === undefined) || (this.userCopy.dateOfBirth === null)) {
this.errorMessage = "Veuillez remplir le champ 'date de naissance'.";
this.hasError = true;
}
else if(this.changePassword) {
if (this.newPassword.length === 0) {
this.errorMessage = "Veuillez remplir le champ 'mot de passe'" ;