isa44.74/organizee-front
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

avancées page account/ modif side bar/modif card-member

Browse source
This commit is contained in:
Sana EL HIRI 2022-03-02 19:14:43 +01:00
parent 8c36759ce3
commit ab58fd0c6a
5 changed files with 73 additions and 43 deletions

4
src/app/components/card-member/card-member.component.scss
View file

@ -7,7 +7,7 @@
}
.card {
min-height: 22rem;
min-height: 14rem;
border: none;
position: relative;
overflow: hidden;
@ -22,6 +22,7 @@
.buttons button:nth-child(1) {
margin-top: 5px;
margin-right: 5px;
border: 1px solid #7879F1 !important;
color: #7879F1;
height: 40px;
@ -30,6 +31,7 @@
.buttons button:nth-child(1):hover {
margin-top: 5px;
margin-right: 5px;
border: 1px solid #7879F1 !important;
color: #fff;
height: 40px;

2
src/app/components/side-bar/side-bar.component.scss
View file

@ -5,7 +5,7 @@
width: auto;
height: 100%;
position: absolute;
background-color: rgb(238, 238, 238);
background-color: #c3c3e7;
}
.nav{
margin-top: 20px;

60
src/app/pages/page-account/page-account.component.html
View file

@ -1,47 +1,33 @@
<app-header></app-header>
<app-side-bar></app-side-bar>
<div class="container-fluid">
<div class="row">
<app-side-bar></app-side-bar>
<div class="col-9 offset-2" id="main">
<h1>Ma team</h1>
<div class="d-flex justify-content-center">
<button
button
type="button"
class="btn btn-primary btn-lg"
routerLink="../modifier-compte"
routerLinkActive="active-custom"
>
Modifier mon compte
</button>
</div>
<div class="d-flex justify-content-center">
<button
button
type="button"
class="btn btn-primary btn-lg"
routerLink="../supprimer-compte"
routerLinkActive="active-custom"
>
Supprimer mon compte
</button>
</div>
<div class="d-flex justify-content-center">
<button
button
type="button"
class="btn btn-primary btn-lg"
routerLink="../ajout-membre"
routerLinkActive="active-custom"
>
Ajouter un membre
</button>
<h1>{{currentTeam.nom}}</h1>
<div class="row">
<div class="d-flex justify-content-center">
<app-card-member [membre]="currentUser"> </app-card-member>
</div>
<div class="d-flex justify-content-center">
<button
id = "bouton-ajout"
type="button"
class="btn btn-primary btn-lg"
routerLink="../ajout-membre"
routerLinkActive="active-custom"
>Ajouter un membre
</button>
</div>
</div>
<div class="row">
<div class="col" *ngFor="let membreData of listMembres">
<app-card-member [membre]="membreData"> </app-card-member>
</div>
<ng-container *ngFor="let membreData of listMembres">
<div class="col" *ngIf= "membreData.id != currentUser.id" >
<app-card-member [membre]="membreData"> </app-card-member>
</div>
</ng-container>
</div>
</div>
</div>
</div>
<app-footer></app-footer>

26
src/app/pages/page-account/page-account.component.scss
View file

@ -1,3 +1,29 @@
button{
margin-bottom: 5px;
}
#main{
margin-top: 20px;
}
ng-container{
display: flex;
}
#bouton-ajout {
margin-top: 5px;
border: 1px solid #7879F1 !important;
background-color: #7879F1;
color: #fff;
height: 50px;
width: 250px;
}
#bouton-ajout:hover {
margin-top: 5px;
border: 1px solid #191933 !important;
background-color: #191933;
color: #fff;
height: 50px;
width: 250px;
}

24
src/app/pages/page-account/page-account.component.ts
View file

@ -1,5 +1,9 @@
import { Component, OnInit } from '@angular/core';
import { Router } from '@angular/router';
import { MembreService } from 'src/app/services/membre.service';
import { TeamService } from 'src/app/services/team.service';
import { TokenService } from 'src/app/services/token.service';
@Component({
@ -9,16 +13,28 @@ import { MembreService } from 'src/app/services/membre.service';
})
export class PageAccountComponent implements OnInit {
public listMembres: any[];
currentUser: any;
currentTeam: any;
constructor(private membreService: MembreService) {
constructor(private membreService: MembreService,
private teamService: TeamService,
private tokenService: TokenService,
private router: Router) {
this.listMembres = [];
}
ngOnInit(): void {
/** Récuperer la team du membre connecté **/
this.teamService.getTeamById()?.subscribe((team) => {
this.currentTeam = team;
});
/** Récuperer le membre connecté **/
this.membreService.getMembreId(this.tokenService.getCurrentMembreId()).subscribe((user) => {
this.currentUser = user;
});
/** Récuperer la liste des membres de la team **/
this.membreService.getMembresByTeamId()?.subscribe((membres: any[]) => {
console.log(membres);
this.listMembres = membres;
});
});
}
}