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

src/app/components/card-member/card-member.component.scss

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

src/app/components/side-bar/side-bar.component.scss

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

src/app/pages/page-account/page-account.component.html

@@ -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>
+      <h1>{{currentTeam.nom}}</h1>
+      <div class="row">
         <div class="d-flex justify-content-center">
-        <button
+          <app-card-member [membre]="currentUser"> </app-card-member>
-          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
+            id = "bouton-ajout"
-          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
-          Ajouter un membre
           </button>
         </div>
+      </div>
       <div class="row">
-        <div class="col" *ngFor="let membreData of listMembres">
+
+        <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>

src/app/pages/page-account/page-account.component.scss

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

src/app/pages/page-account/page-account.component.ts

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