diff --git a/src/app/app-routing.module.ts b/src/app/app-routing.module.ts
index fb67551..9f63a3a 100644
--- a/src/app/app-routing.module.ts
+++ b/src/app/app-routing.module.ts
@@ -21,11 +21,11 @@ const routes: Routes = [
     component: HomeComponent,
     canActivate: [KeycloakGuard],
     pathMatch: 'full'
-  }/*,
+  },
   {
     path: paths_collaborateurs.path,
     loadChildren: () => import('./collaborateurs/collaborateurs.module').then(m=> m.CollaborateursModule)
-  },
+  }/*,
   {
     path: paths_demandes_delegation.path,
     loadChildren: () => import('./demandes-delegation/demandes-delegation.module').then(m=> m.DemandesDelegationModule)
diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index 003d274..de26755 100644
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -16,8 +16,8 @@ import { AppRoutingModule } from './app-routing.module';
 import { ApiModule } from '@shared/api-swagger'
 
 import { HomeModule } from './home';
-/*
 import { CollaborateursModule } from './collaborateurs';
+/*
 import { ReferentsModule } from './referents';
 import { FormationsModule } from './formations';
 import { DemandesFormationModule } from './demandes-formation';
@@ -42,7 +42,7 @@ let keycloakService: KeycloakService = new KeycloakService();
     BrowserModule, BrowserAnimationsModule,
     KeycloakAngularModule, AppRoutingModule,
     HttpClientModule, ApiModule,
-    HomeModule//, CollaborateursModule,
+    HomeModule, CollaborateursModule//,
     //ReferentsModule, FormationsModule,
     //DemandesFormationModule, DemandesDelegationModule,
     //EpSaisieModule
diff --git a/src/app/collaborateurs/collaborateurs.component.html b/src/app/collaborateurs/collaborateurs.component.html
index ecf7975..04dd5eb 100644
--- a/src/app/collaborateurs/collaborateurs.component.html
+++ b/src/app/collaborateurs/collaborateurs.component.html
@@ -4,7 +4,7 @@
 <mat-table matSort [dataSource]="dataSource">
   <ng-container matColumnDef="agence">
     <mat-header-cell *matHeaderCellDef mat-sort-header>Agence</mat-header-cell>
-    <mat-cell *matCellDef="let row">{{ row.agence}}</mat-cell>
+    <mat-cell *matCellDef="let row">{{ row.businessunit.nom }}</mat-cell>
   </ng-container>
 
   <ng-container matColumnDef="collaborateur">
@@ -14,12 +14,12 @@
 
   <ng-container matColumnDef="dateembauche">
     <mat-header-cell *matHeaderCellDef mat-sort-header>Date embauche</mat-header-cell>
-    <mat-cell *matCellDef="let row">TODO AUSSI</mat-cell>
+    <mat-cell *matCellDef="let row">{{row.dateArrivee | date:'yyyy/MM/dd'}}</mat-cell>
   </ng-container>
 
   <ng-container matColumnDef="referent">
     <mat-header-cell *matHeaderCellDef mat-sort-header>Référent</mat-header-cell>
-    <mat-cell *matCellDef="let row">TODO</mat-cell>
+    <mat-cell *matCellDef="let row">{{ row.referent.prenom }} {{ row.referent.nom }}</mat-cell>
   </ng-container>
 
   <mat-header-row *matHeaderRowDef="displayedColumns"></mat-header-row>
diff --git a/src/app/collaborateurs/collaborateurs.component.ts b/src/app/collaborateurs/collaborateurs.component.ts
index 0b4b3d1..79fb4ac 100644
--- a/src/app/collaborateurs/collaborateurs.component.ts
+++ b/src/app/collaborateurs/collaborateurs.component.ts
@@ -6,6 +6,7 @@ import {MatTableDataSource} from '@angular/material/table';
 import {MatPaginator} from '@angular/material/paginator';
 import {MatSort} from '@angular/material/sort';
 
+import { CollaborateurDTO } from '@shared/api-swagger/model/models'
 import { CollaborateursService } from "@shared/api-swagger/api/api";
 
 
@@ -20,19 +21,22 @@ import { CollaborateursService } from "@shared/api-swagger/api/api";
 })
 export class CollaborateursComponent implements OnInit {
 
-  collaborateursDisponibles : DisplayCollaborateur[];
-  collaborateursFiltre : DisplayCollaborateur[];
+  asc = true;
+  numPage = 1;
+  parPage = 5;
+  roles : string[] = ["collaborateur"];
+
   private collaborateursDisponiblesSubscription : Subscription;
 
   displayedColumns : string[] = ["agence", "collaborateur", "dateembauche", "referent"];
 
-  dataSource : MatTableDataSource<DisplayCollaborateur>;
+  dataSource : MatTableDataSource<CollaborateurDTO>;
 
   /**
     * contenu de la recherche.
     */
   search = "";
-
+  tri = "";
   /**
     * Pagination du tableau.
     */
@@ -50,34 +54,17 @@ export class CollaborateursComponent implements OnInit {
   constructor(private service: CollaborateursService) {}
 
   ngOnInit() {
-    this. collaborateursDisponiblesSubscription = this.service.getCollaborateurs(undefined,undefined,undefined,1).subscribe(
-      collaborateurs => {
-        this.initCollaborateur(collaborateurs)
-      }
-    );
+    this.updateDataSource();
+
   }
 
-  initCollaborateur(collaborateurs:CollaborateurModel[]) {
-    this.collaborateursDisponibles = [];
-    let collaborateurDisplay : DisplayCollaborateur;
-    let today = new Date();
-    console.log(collaborateurs);
-    for(let c of collaborateurs) {
-      collaborateurDisplay = new DisplayCollaborateur();
-      collaborateurDisplay.id = c.id;
-      collaborateurDisplay.prenom = c.prenom;
-      collaborateurDisplay.nom = c.nom;
-      collaborateurDisplay.agence = c.businessUnit.nom;
-      collaborateurDisplay.embauche = c.dateArrivee;
-      collaborateurDisplay.anciennete = this.setAnciennete(new Date(c.dateArrivee), today);
-      collaborateurDisplay.annee = Math.floor(collaborateurDisplay.anciennete / 31536000000);
-      collaborateurDisplay.mois = Math.floor(collaborateurDisplay.anciennete / 2629800000 % 12);
-      this.collaborateursDisponibles.push(collaborateurDisplay);
-    }
-    this.collaborateursFiltre = this.collaborateursDisponibles;
-    this.dataSource = new MatTableDataSource(this.collaborateursFiltre);
-    this.dataSource.paginator = this.paginator;
-    this.dataSource.sort = this.sort;
+  updateDataSource() {
+    this.collaborateursDisponiblesSubscription = this.service.getCollaborateurs(this.asc, this.numPage, this.parPage, this.roles, 1, undefined, this.search, this.tri).subscribe(
+      collaborateurs => this.dataSource = new MatTableDataSource(collaborateurs),
+      err => console.log(err)
+    );
+    //this.dataSource.paginator = this.paginator;
+    //this.dataSource.sort = this.sort;
   }
 
 
diff --git a/src/app/collaborateurs/collaborateurs.module.ts b/src/app/collaborateurs/collaborateurs.module.ts
index 3077bd2..5d110df 100644
--- a/src/app/collaborateurs/collaborateurs.module.ts
+++ b/src/app/collaborateurs/collaborateurs.module.ts
@@ -8,18 +8,20 @@ import { MaterialModule } from "@shared/angular-material/angular-material.module
 import {NavMenuModule} from '@shared/nav-menu/nav-menu.module';
 
 import { CollaborateursComponent } from "./collaborateurs.component";
+/*
 import { DetailsCollaborateurComponent } from "./details-collaborateur/details-collaborateur.component";
 import { EvaluationComponent } from "./formations-collaborateur/details-evaluation/evaluation.component";
 import { EditEvaluationComponent } from "./formations-collaborateur/edit-evaluation/edit-evaluation.component";
 import { FormationsCollaboateurComponent } from "./formations-collaborateur/formations-collaborateur.component";
-
+*/
 import { CollaborateursRoutingModule } from "./collaborateurs.routing.module";
 
 
 @NgModule({
   declarations: [
-    DetailsCollaborateurComponent, EvaluationComponent, EditEvaluationComponent,
-    CollaborateursComponent, FormationsCollaboateurComponent
+    CollaborateursComponent
+    /*DetailsCollaborateurComponent, EvaluationComponent, EditEvaluationComponent,
+    , FormationsCollaboateurComponent*/
   ],
   exports: [
     CollaborateursComponent
diff --git a/src/app/collaborateurs/collaborateurs.routing.module.ts b/src/app/collaborateurs/collaborateurs.routing.module.ts
index 1237b4f..926ddfd 100644
--- a/src/app/collaborateurs/collaborateurs.routing.module.ts
+++ b/src/app/collaborateurs/collaborateurs.routing.module.ts
@@ -1,24 +1,24 @@
 import { NgModule } from '@angular/core';
 import { Routes, RouterModule } from '@angular/router';
 
-
 import { CollaborateursComponent } from "./collaborateurs.component";
+/*
 import { DetailsCollaborateurComponent } from "./details-collaborateur/details-collaborateur.component";
 import { FormationsCollaboateurComponent } from "./formations-collaborateur/formations-collaborateur.component";
 import { EvaluationComponent } from './formations-collaborateur/details-evaluation/evaluation.component';
 import { EditEvaluationComponent } from './formations-collaborateur/edit-evaluation/edit-evaluation.component';
-
+*/
 import { paths_collaborateurs } from '@shared/utils/paths';
 
 import { KeycloakGuard } from '@shared/guards/keycloakguard';
 
 
 const routes: Routes = [
-  { path:'', component: CollaborateursComponent, pathMatch: 'full', canActivate: [KeycloakGuard] },
+  { path:'', component: CollaborateursComponent, pathMatch: 'full', canActivate: [KeycloakGuard] }/*,
   { path:paths_collaborateurs.formations, component: FormationsCollaboateurComponent, canActivate: [KeycloakGuard] },
   { path:paths_collaborateurs.evaluation, component: EvaluationComponent, canActivate: [KeycloakGuard] },
   { path:paths_collaborateurs.edit, component: EditEvaluationComponent, canActivate: [KeycloakGuard] },
-  { path:paths_collaborateurs.get, component: DetailsCollaborateurComponent, canActivate: [KeycloakGuard] }
+  { path:paths_collaborateurs.get, component: DetailsCollaborateurComponent, canActivate: [KeycloakGuard] }*/
 ];
 
 
diff --git a/src/app/home/home-assistante/home-assistante.component.html b/src/app/home/home-assistante/home-assistante.component.html
index 5f151c8..d7c0089 100644
--- a/src/app/home/home-assistante/home-assistante.component.html
+++ b/src/app/home/home-assistante/home-assistante.component.html
@@ -16,12 +16,12 @@
 
   <ng-container matColumnDef="agence">
     <mat-header-cell *matHeaderCellDef mat-sort-header> Agence </mat-header-cell>
-    <mat-cell  *matCellDef="let row"> {{row.collaborateur.businessunit.agence.nom}} </mat-cell>
+    <mat-cell  *matCellDef="let row"> {{row.collaborateur.businessunit.nom}} </mat-cell>
   </ng-container>
 
   <ng-container  matColumnDef="collaborateur">
     <mat-header-cell *matHeaderCellDef mat-sort-header> Collaborateur </mat-header-cell>
-    <mat-cell  *matCellDef="let row" [routerLink]="['/collaborateurs', row.collaborateur.id]"> {{row.collaborateur.nom}} {{row.collaborateur.prenom}} </mat-cell>
+    <mat-cell  *matCellDef="let row" [routerLink]="['/collaborateurs', row.collaborateur.id]">{{row.collaborateur.prenom}} {{row.collaborateur.nom}}</mat-cell>
   </ng-container>
 
   <ng-container matColumnDef="anciennete">
diff --git a/src/app/home/home.component.html b/src/app/home/home.component.html
index ae8d2b6..fcdd361 100644
--- a/src/app/home/home.component.html
+++ b/src/app/home/home.component.html
@@ -2,7 +2,5 @@
 <h1> Bonjour</h1>
 <home-assistante *ngIf="this.userRole == role.assistante"></home-assistante>
 <home-rh *ngIf="this.userRole ==role.rh"></home-rh>
-<!--
 <home-collaborateur *ngIf="this.userRole ==role.collaborateur"></home-collaborateur>
 <home-commercial *ngIf="this.userRole ==role.commercial"></home-commercial>
--->
diff --git a/src/app/home/home.module.ts b/src/app/home/home.module.ts
index f3fa964..3d9a4ba 100644
--- a/src/app/home/home.module.ts
+++ b/src/app/home/home.module.ts
@@ -7,17 +7,16 @@ import { MaterialModule } from "@shared/angular-material/angular-material.module
 
 import {HomeAssistanteComponent} from './home-assistante/home-assistante.component';
 import {HomeRHComponent} from './home-rh/home-rh.component';
-/*
+
 import {HomeCollaborateurComponent} from './home-collaborateur/home-collaborateur.component';
 import {HomeCommercialComponent} from './home-commercial/home-commercial.component';
-*/
+
 import {HomeComponent} from './home.component';
 import {NavMenuModule} from '@shared/nav-menu/nav-menu.module';
 @NgModule({
   declarations: [
-    HomeComponent, HomeAssistanteComponent, HomeRHComponent
-    /*, HomeCollaborateurComponent,
-    HomeCommercialComponent, */
+    HomeComponent, HomeAssistanteComponent, HomeRHComponent,
+     HomeCollaborateurComponent, HomeCommercialComponent
   ],
   exports: [
     HomeComponent