diff --git a/src/app/components/index.ts b/src/app/components/index.ts
index fc91f8712dd2cebba33644bce5a6951d59e8f129..a37c9afcf4f00b44c4cfc1db414c60c23101f002 100644
--- a/src/app/components/index.ts
+++ b/src/app/components/index.ts
@@ -17,7 +17,7 @@ import { NotificationsComponent } from './notifications/notifications.component'
 import { LogsDataComponent } from './logs-dashboard/logs-data/logs-data.component';
 import { LogsGraphComponent } from './logs-dashboard/logs-graph/logs-graph.component';
 import { LogsSessionsComponent } from './logs-dashboard/logs-sessions/logs-sessions.component';
-
+import { LogsSlugsComponent } from './logs-dashboard/logs-slugs/logs-slugs.component';
 
 export {
   MenuComponent,
@@ -39,6 +39,7 @@ export {
   LogsDataComponent,
   LogsGraphComponent,
   LogsSessionsComponent,
+  LogsSlugsComponent,
 };
 
 // tslint:disable-next-line:variable-name
@@ -62,4 +63,5 @@ export const AppComponents = [
   LogsDataComponent,
   LogsGraphComponent,
   LogsSessionsComponent,
+  LogsSlugsComponent,
 ];
diff --git a/src/app/components/logs-dashboard/logs-data/logs-data.component.html b/src/app/components/logs-dashboard/logs-data/logs-data.component.html
index 9719aac7dd794c0c1cf57fff3f152e174a814805..68e59eb58ad09ea32c062d9a57d610fd61468834 100644
--- a/src/app/components/logs-dashboard/logs-data/logs-data.component.html
+++ b/src/app/components/logs-dashboard/logs-data/logs-data.component.html
@@ -1,21 +1,30 @@
 <div class="section">
-
+    <div class="columns is-centered is-marginless">
   <div class="input-field">
     <form>
-      <label>uuid: </label>
+      <label> Uuid: </label>
       <input type="text" size="40" name="uuid" [(ngModel)]="uuid">
-      <br>
-      <label>sessionId: </label>
+      <!-- <br> -->
+      <label>  SessionId: </label>
       <input type="text" size="40" name="sessionId" [(ngModel)]="sessionId">
-      <label>slug: </label>
-      <input type="text" size="40" name="slug" [(ngModel)]="slug">
+      <label>  Slug: </label> 
+      <input type="text" size="20" name="slug" [(ngModel)]="slug">
     </form>
     <br>
+
+
+    <a class="button button-gl is-centered" (click)="tabsToggler(true)">
+      Slugs
+    </a>
+    <a class="button button-gl is-centered" (click)="tabsToggler(false)">
+      Sessions
+    </a>
     <a class="button button-gl is-centered" (click)="onSubmit()">
-      Display Steps Duration
+      Report
     </a>
   </div>
-  <div class="columns is-centered is-marginless">
+  </div>
+  <!-- <div class="columns is-centered is-marginless">
     <div class="column has-text-centered">
       <h2>{{ nbSessionId }} sessionId trouvées</h2>
       <div *ngFor="let s of allFields.session_id_list">
@@ -32,14 +41,15 @@
       </div>
 
     </div>
-  </div>
+  </div> -->
   <div class="columns is-centered is-marginless">
-  <div class="column has-text-centered">
-
-      <app-logs-sessions [childSessionId]="sessionId" [childNbSessions]="nbSessionId" [childSessionsList]="allFields.session_id_list"></app-logs-sessions>
-
-    </div>
+    <div class="column has-text-centered is-marginless">
+      <app-logs-sessions [hidden]="isToggled" [childSessionId]="sessionId" [childNbSessions]="nbSessionId">
+      </app-logs-sessions>
+      <app-logs-slugs [hidden]="!isToggled" [childSlugsList]="allFields.slug_list" [childNbSlugs]="nbSlug"
+        [childNbUuids]="nbUuid"></app-logs-slugs>
     </div>
+  </div>
   <div class="columns is-centered is-marginless">
     <div class="column has-text-centered">
       <div *ngFor="let a of [data]">
@@ -58,7 +68,7 @@
       </div>
     </div>
 
-    <div class="column has-text-centered">
+    <div class="column has-text-left">
       <div *ngFor="let oneStepData of allStepsData">
         <div class="mini-log-card">
           <span>
diff --git a/src/app/components/logs-dashboard/logs-data/logs-data.component.scss b/src/app/components/logs-dashboard/logs-data/logs-data.component.scss
index de88a8fc34d9804a6bc98bb98c9e9184c8d69efa..a49495fc8219f4115c5f481408745d78f442d3a5 100644
--- a/src/app/components/logs-dashboard/logs-data/logs-data.component.scss
+++ b/src/app/components/logs-dashboard/logs-data/logs-data.component.scss
@@ -18,6 +18,6 @@ figure {
 
   }
   .input-field{
-    width: 300px;
+    width: 200%;
     margin-top: 20px;
   }
\ No newline at end of file
diff --git a/src/app/components/logs-dashboard/logs-data/logs-data.component.ts b/src/app/components/logs-dashboard/logs-data/logs-data.component.ts
index 21c1bbc237dfdf1b115fed1e778d7e77ff24c750..62ce54e117237fb6935ae070bcefadf1616c74ed 100644
--- a/src/app/components/logs-dashboard/logs-data/logs-data.component.ts
+++ b/src/app/components/logs-dashboard/logs-data/logs-data.component.ts
@@ -21,6 +21,7 @@ export class LogsDataComponent implements OnInit {
   nbSessionId: number;
   nbUuid: number;
   nbSlug: number;
+  isToggled: boolean;
 
   sessionIdList: [string];
   constructor(
@@ -29,6 +30,7 @@ export class LogsDataComponent implements OnInit {
   ) { }
 
   ngOnInit() {
+    this.isToggled = true;
     this.data = [];
     this.uuid = 'c1b069ca-181d-4265-9838-8d182f207bd3';
     this.sessionId = '372b59a4-72b0-4a3a-b518-843e516da0cd';
@@ -66,4 +68,8 @@ export class LogsDataComponent implements OnInit {
     },
     );
   }
+  tabsToggler(boolean) {
+    this.isToggled = boolean;
+
+  }
 }
diff --git a/src/app/components/logs-dashboard/logs-sessions/logs-sessions.component.html b/src/app/components/logs-dashboard/logs-sessions/logs-sessions.component.html
index 8c6361cb96d83d4314d7f9dcd702f3cdd6a0a256..3ed196e3cc9c7dfb6c05c3cb84c60527d9c51ad3 100644
--- a/src/app/components/logs-dashboard/logs-sessions/logs-sessions.component.html
+++ b/src/app/components/logs-dashboard/logs-sessions/logs-sessions.component.html
@@ -2,7 +2,7 @@
     <div>
       <div class="section">
         <div class="columns is-centered is-marginless">
-          <div class="column has-text-centered">
+          <div class="column has-text-left">
             <h2>{{ childNbSessions }} Sessions trouvées</h2>
           </div>
         </div>
@@ -33,9 +33,9 @@
           </div>
           <div class="data-list">
             <div class="data columns is-multiline is-vcentered is-marginless"
-              *ngFor="let sessionId of childSessionsList; let i=index;">
+              *ngFor="let session of allSessionsIdInfo; let i=index;">
               <div class="column is-4 has-text-centered">
-                {{ sessionId }}
+                {{ session._id }}
               </div>
               <div class="column is-1 has-text-centered">
                 <!-- {{ format.mapServerType}} -->
@@ -44,7 +44,9 @@
                   <span class="column-title">Completion Date</span>
               </div>
               <div class="column is-2 has-text-centered">
-                  <span class="column-title">Duration</span>
+                  <span class="column-title">{{ session.totalHoursSpent }}:
+                    {{ session.totalMinutesSpent }}:
+                    {{ session.totalSecondsSpent }}</span>
               </div>
               <div class="column  is-1 has-text-centered actions"> 
               </div>
diff --git a/src/app/components/logs-dashboard/logs-sessions/logs-sessions.component.ts b/src/app/components/logs-dashboard/logs-sessions/logs-sessions.component.ts
index 4ce05de95a50ca803977427d077f71f31ea69199..6011f51d2f4fa40e2b4e9091dbf8abd2a6e71943 100644
--- a/src/app/components/logs-dashboard/logs-sessions/logs-sessions.component.ts
+++ b/src/app/components/logs-dashboard/logs-sessions/logs-sessions.component.ts
@@ -11,12 +11,36 @@ import { FormsModule } from '@angular/forms';
 })
 export class LogsSessionsComponent implements OnInit {
   @Input() childSessionId: string;
-  @Input() childSessionsList: any;
+  // @Input() childSessionsList: [];
   @Input() childNbSessions: number;
+  allSessionsIdInfo: [];
+  childSessionsList: any;
 
-  constructor() { }
+  constructor(
+    private dataLogsService: DataLogsService,
+  ) { }
 
   ngOnInit() {
+    this.allSessionsIdInfo = [];
+    this.childSessionsList = [];
+    this.getAllUniqueFields();
   }
 
+  getProcessTimeAggr (sessionId) {
+    this.dataLogsService.getProcessTimeAggr(sessionId).subscribe((result) => {
+      console.log(result[0]);
+      this.allSessionsIdInfo.push(result[0]);
+    },
+    );
+  }
+  getAllUniqueFields() {
+    this.dataLogsService.getAllUniqueFields().subscribe((result) => {
+      this.childSessionsList = result[0]['session_id_list'];
+      for (let i = 0; i < this.childNbSessions; i++) {
+        this.getProcessTimeAggr(this.childSessionsList[i]);
+      }
+      console.log('allSessionsIdInfo: ', this.allSessionsIdInfo);
+    },
+    );
+  }
 }
diff --git a/src/app/components/logs-dashboard/logs-slugs/logs-slugs.component.html b/src/app/components/logs-dashboard/logs-slugs/logs-slugs.component.html
new file mode 100644
index 0000000000000000000000000000000000000000..9826bfebfe0812ebea086a7f1949620b0feca2ec
--- /dev/null
+++ b/src/app/components/logs-dashboard/logs-slugs/logs-slugs.component.html
@@ -0,0 +1,76 @@
+<ng-container >
+    <div>
+      <div class="section">
+        <div class="columns is-left is-marginless">
+          <div class="column has-text-left">
+              <div class="columns is-centered is-marginless">
+                  <div class="column has-text-left">
+             
+                    <h2>{{ childNbSlugs -1 }} slugs trouvées</h2>
+
+                    <h2>{{ childNbUuids }} uuid trouvées</h2>
+              
+                  </div>
+                </div>
+          </div>
+        </div>
+
+        <div class="table">
+          <div class="header columns is-marginless">
+            <div class="column is-4 has-text-centered">
+              <span (click)="sortBy('name')" class="is-sortable">
+                <span class="column-title" >Slugs</span>
+                <p></p>
+              </span>
+            </div>
+            <div class="column is-1 has-text-centered">
+              <span class="column-title">Uuids</span>
+            </div>
+            <div class="column is-2 has-text-centered">
+                <span class="column-title">Completion Date</span>
+            </div>
+            <div class="column is-2 has-text-centered">
+                <span class="column-title">Duration</span>
+            </div>
+            <div class="column  is-1 has-text-centered">
+                <span class="column-title">Errors?</span>
+            </div>
+            <div class="column is-offset-1  is-1 has-text-centered">
+                <span class="column-title"></span>
+            </div>
+          </div>
+          <div class="data-list">
+            <div class="data columns is-multiline is-vcentered is-marginless"
+              *ngFor="let slug of childSlugsList; let i=index;">
+              <div class="column is-4 has-text-centered">
+                {{ slug }}
+              </div>
+              <div class="column is-1 has-text-centered">
+                <!-- {{ format.mapServerType}} -->
+              </div>
+              <div class="column is-2 has-text-centered">
+                  <span class="column-title">Completion Date</span>
+              </div>
+              <div class="column is-2 has-text-centered">
+                  <span class="column-title"></span>
+              </div>
+              <div class="column  is-1 has-text-centered actions"> 
+              </div>
+              <div class="column is-offset-1 is-1 has-text-centered actions"> 
+                  <app-crud-buttons ></app-crud-buttons>
+              </div>
+            </div>
+          </div>
+          <div class="columns is-marginless">
+            <div class="column">
+              <!-- <app-paginator *ngIf="paginator.length > 0" [length]="paginator.length" [pageSize]="paginator.limit"
+                [pageSizeOptions]="paginator.pageSizeOptions" [pageIndex]="paginator.pageIndex" [pagesToShow]="5"
+                [showFirstLastButtons]="true" (page)="changePagination($event)"
+                (pageSizeChanged)="changePageSize($event)">
+              </app-paginator> -->
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </ng-container>
\ No newline at end of file
diff --git a/src/app/components/logs-dashboard/logs-slugs/logs-slugs.component.scss b/src/app/components/logs-dashboard/logs-slugs/logs-slugs.component.scss
new file mode 100644
index 0000000000000000000000000000000000000000..e69de29bb2d1d6434b8b29ae775ad8c2e48c5391
diff --git a/src/app/components/logs-dashboard/logs-slugs/logs-slugs.component.ts b/src/app/components/logs-dashboard/logs-slugs/logs-slugs.component.ts
new file mode 100644
index 0000000000000000000000000000000000000000..b9a089c0a99d310de25160fae2005fb1e8dc505a
--- /dev/null
+++ b/src/app/components/logs-dashboard/logs-slugs/logs-slugs.component.ts
@@ -0,0 +1,50 @@
+import { Component, OnInit, Input } from '@angular/core';
+import { DataLogsService } from 'src/app/services/data-logs.service';
+import { ActivatedRoute, ParamMap } from '@angular/router';
+import { switchMap } from 'rxjs/operators';
+import { ILogs } from 'src/app/models/logs.model';
+import { FormsModule } from '@angular/forms';
+@Component({
+  selector: 'app-logs-slugs',
+  templateUrl: './logs-slugs.component.html',
+  styleUrls: ['./logs-slugs.component.scss'],
+})
+export class LogsSlugsComponent implements OnInit {
+  // @Input() childSessionId: string;
+  // @Input() childSessionsList: [];
+  @Input() childSlugsList: any;
+  @Input() childNbSlugs: any;
+  @Input() childNbUuids: any;
+
+  allSessionsIdInfo: [];
+  childSessionsList: any;
+
+  constructor(
+    private dataLogsService: DataLogsService,
+  ) { }
+
+  ngOnInit() {
+    this.childSlugsList = [];
+    this.allSessionsIdInfo = [];
+    this.childSessionsList = [];
+    this.getAllUniqueFields();
+  }
+
+  getProcessTimeAggr (sessionId) {
+    this.dataLogsService.getProcessTimeAggr(sessionId).subscribe((result) => {
+      console.log(result[0]);
+      this.allSessionsIdInfo.push(result[0]);
+    },
+    );
+  }
+  getAllUniqueFields() {
+    this.dataLogsService.getAllUniqueFields().subscribe((result) => {
+      this.childSessionsList = result[0]['session_id_list'];
+      for (let i = 0; i < this.childNbSessions; i++) {
+        this.getProcessTimeAggr(this.childSessionsList[i]);
+      }
+      console.log('allSessionsIdInfo: ', this.allSessionsIdInfo);
+    },
+    );
+  }
+}
diff --git a/src/app/services/data-logs.service.ts b/src/app/services/data-logs.service.ts
index d85ac594896e8ed169d8b73eb98142df620468b9..cc60917f527f94c3fb0b662e21b8891ea8d8b10c 100644
--- a/src/app/services/data-logs.service.ts
+++ b/src/app/services/data-logs.service.ts
@@ -65,4 +65,14 @@ export class DataLogsService {
       }),
     );
   }
+  getProcessTimeAggr(sessionId): Observable<any[]> {
+    const query = { session_id: sessionId };
+    const stringQuery = JSON.stringify(query);
+    const aggregationEndPoint = 'processTimeAggr?avars=';
+    return this._httpClient.get<any[]>(this.resourceServiceUrl + aggregationEndPoint + stringQuery).pipe(
+      map((response) => {
+        return response;
+      }),
+    );
+  }
 }