From 3319edc7e25d3343b2ac1b7b409ab03c0883d172 Mon Sep 17 00:00:00 2001 From: ddamiron <ddamiron@sii.fr> Date: Thu, 8 Aug 2019 18:09:13 +0200 Subject: [PATCH] add sort filter in log search tables --- .../logs-home/logs-home.component.html | 1 + .../logs-home/logs-home.component.ts | 12 ++-- .../logs-sessions.component.html | 66 +++++++++---------- .../logs-sessions/logs-sessions.component.ts | 22 +++++-- .../logs-slugs/logs-slugs.component.html | 33 +++++----- .../logs-slugs/logs-slugs.component.ts | 22 +++++-- .../logs-error/logs-error.component.html | 22 ++++--- .../report/logs-info/logs-info.component.html | 9 ++- src/app/services/data-logs.service.ts | 20 ++++-- src/assets/config/config.json | 4 +- 10 files changed, 128 insertions(+), 83 deletions(-) diff --git a/src/app/components/logs-dashboard/logs-home/logs-home.component.html b/src/app/components/logs-dashboard/logs-home/logs-home.component.html index ee7d901..fee2694 100644 --- a/src/app/components/logs-dashboard/logs-home/logs-home.component.html +++ b/src/app/components/logs-dashboard/logs-home/logs-home.component.html @@ -53,3 +53,4 @@ </div> </div> </div> +<app-confirmation-modal [isOpened]="isInfoOpened" [texts]= "texts" (continue)= "isInfoOpened"></app-confirmation-modal> \ No newline at end of file diff --git a/src/app/components/logs-dashboard/logs-home/logs-home.component.ts b/src/app/components/logs-dashboard/logs-home/logs-home.component.ts index 6bee42c..995a53f 100644 --- a/src/app/components/logs-dashboard/logs-home/logs-home.component.ts +++ b/src/app/components/logs-dashboard/logs-home/logs-home.component.ts @@ -20,6 +20,12 @@ export class LogsHomeComponent implements OnInit { sessionsList: any; nbSessionId: number; nbUuid: number; + isInfoOpened: boolean = false; + texts: Object = { + main : 'hello', + cancel: 'end', + continue: 'ok', + }; nbSlug: number; isToggled: boolean = true; data: any = []; @@ -87,11 +93,7 @@ export class LogsHomeComponent implements OnInit { } information() { - this._notificationService.notify( - { - type: 'success', - message: 'Veuillez remplir les champs uuid:slug et/ou sessionId', - }); + this.isInfoOpened = true; } trimAndNavigate(slugOrUuid, sessionId) { 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 aac562d..0aa6d25 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 @@ -12,7 +12,7 @@ <div class="columns is-centered is-marginless"> <div class="column is-6 has-text-left"> - <P>{{ childNbSessions }} session(s) dans la base de données</P> + <p>{{ childNbSessions }} session(s) dans la base de données</p> </div> <div class="column is-6 has-text-left"> <p>Pour chaque session, les valeurs affichées concernent le slug le plus récent.</p> @@ -42,53 +42,53 @@ </div> <div class="column is-2 has-text-left"> <span class="is-sortable"> - <span class="sort-icons"> - <span class="icon"> - <i class="fas fa-sort-up"></i> - </span> - <span class="icon"> - <i class="fas fa-sort-down"></i> - </span> - </span> + <span class="sort-icons"> + <span class="icon"> + <i class="fas fa-sort-up" (click)="sortInfos('_id.slug', -1, 'latest.completionDate', -1, this.childNbSlugs, 1);"></i> + </span> + <span class="icon"> + <i class="fas fa-sort-down" (click)="sortInfos('_id.slug', -1, 'latest.completionDate', 1, this.childNbSlugs, 1);"></i> + </span> + </span> <span class="column-title">Dernière date d'exécution</span> </span> </div> <div class="column is-1 has-text-left"> <span class="is-sortable"> - <span class="sort-icons"> - <span class="icon"> - <i class="fas fa-sort-up"></i> - </span> - <span class="icon"> - <i class="fas fa-sort-down"></i> - </span> - </span> + <span class="sort-icons"> + <span class="icon"> + <i class="fas fa-sort-up" (click)="sortInfos('_id.slug', -1, 'latest.duration', -1, this.childNbSlugs, 1);"></i> + </span> + <span class="icon"> + <i class="fas fa-sort-down" (click)="sortInfos('_id.slug', -1, 'latest.duration', 1, this.childNbSlugs, 1);"></i> + </span> + </span> <span class="column-title">Durée</span> </span> </div> <div class="column is-1 has-text-left"> <span class="is-sortable"> - <span class="sort-icons"> - <span class="icon"> - <i class="fas fa-sort-up"></i> - </span> - <span class="icon"> - <i class="fas fa-sort-down"></i> - </span> - </span> + <span class="sort-icons"> + <span class="icon"> + <i class="fas fa-sort-up" (click)="sortInfos('_id.slug', -1, 'latest.count.INFO', -1, this.childNbSlugs, 1);"></i> + </span> + <span class="icon"> + <i class="fas fa-sort-down" (click)="sortInfos('_id.slug', -1, 'latest.count.INFO', 1, this.childNbSlugs, 1);"></i> + </span> + </span> <span class="column-title">Infos</span> </span> </div> <div class="column is-1 has-text-left"> <span class="is-sortable"> - <span class="sort-icons"> - <span class="icon"> - <i class="fas fa-sort-up"></i> - </span> - <span class="icon"> - <i class="fas fa-sort-down"></i> - </span> - </span> + <span class="sort-icons"> + <span class="icon"> + <i class="fas fa-sort-up" (click)="sortInfos('_id.slug', -1, 'latest.count.ERROR', -1, this.childNbSlugs, 1);"></i> + </span> + <span class="icon"> + <i class="fas fa-sort-down" (click)="sortInfos('_id.slug', -1, 'latest.count.ERROR', 1, this.childNbSlugs, 1);"></i> + </span> + </span> <span class="column-title">Errors?</span> </span> </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 fc4264c..1e95f29 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 @@ -19,6 +19,10 @@ export class LogsSessionsComponent implements OnChanges, OnDestroy { allSessionsInfoList: any = []; paginator: PaginatorOptions; urlCode: string = 'sessionUrl'; + sortFilter1:string = ''; + orderFilter1: number = -1; + sortFilter2:string = ''; + orderFilter2: number = -1; constructor( private _dataLogsService: DataLogsService, ) { @@ -36,20 +40,21 @@ export class LogsSessionsComponent implements OnChanges, OnDestroy { this.paginator.limit = this._dataLogsService.limit; this.paginator.pageIndex = this._dataLogsService.pageNumber; this.paginator.length = this._dataLogsService.length; - this.getAllSessionsInfo(this.childNbSessions, this.paginator.pageIndex); + this.getAllSessionsInfo( + this.sortFilter1, this.orderFilter1, this.sortFilter2, this.orderFilter2, this.childNbSessions, this.paginator.pageIndex); }, (error) => { console.log('error in logs-session:', error); }, ); - this.getAllSessionsInfo(this.childNbSessions, 1); + this.getAllSessionsInfo('_id.slug', -1, 'latest.completionDate', 1, this.childNbSessions, 1); } ngOnDestroy() { this.sessionChangeSub.unsubscribe(); } - getAllSessionsInfo(length, pageNumber) { - this._dataLogsService.getAllInfoForAllSessions(length, pageNumber).subscribe( + getAllSessionsInfo(sortFilter1, order1, sortFilter2, order2, length, pageNumber) { + this._dataLogsService.getAllInfoForAllSessions(sortFilter1, order1, sortFilter2, order2, length, pageNumber).subscribe( (result) => { this.foundSession = ''; this.allSessionsInfoList = result; @@ -69,11 +74,18 @@ export class LogsSessionsComponent implements OnChanges, OnDestroy { }, ); } + sortInfos(sortFilter1, order1, sortFilter2, order2, length, pageNumber) { + this.sortFilter1 = sortFilter1; + this.orderFilter1 = order1; + this.sortFilter2 = sortFilter2; + this.orderFilter2 = order2; + this.getAllSessionsInfo(this.sortFilter1, this.orderFilter1, this.sortFilter2, this.orderFilter2, length, pageNumber); + } getAllInfoForOneSession($event) { // const foundSlug = (<HTMLInputElement>document.getElementById('foundSlug')).value; if (this.foundSession === '') { - this.getAllSessionsInfo(this.childNbSessions, 1); + this.getAllSessionsInfo('_id.slug', -1, 'latest.completionDate', 1, this.childNbSessions, 1); } else { this._dataLogsService.getAllInfoForOneSession(this.foundSession).subscribe((result) => { console.log('result for getAllInfoForOneSlug', result); 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 index df4245d..5204453 100644 --- a/src/app/components/logs-dashboard/logs-slugs/logs-slugs.component.html +++ b/src/app/components/logs-dashboard/logs-slugs/logs-slugs.component.html @@ -24,10 +24,11 @@ <span class="is-sortable"> <span class="sort-icons"> <span class="icon"> - <i class="fas fa-sort-up"></i> + <i class="fas fa-sort-up" (click)="sortInfos('completionDate', -1, '_id.slug', -1, this.childNbSlugs, 1);"></i> </span> <span class="icon"> - <i class="fas fa-sort-down"></i> + <i class="fas fa-sort-down" (click)="sortInfos('completionDate', -1, '_id.slug', 1, this.childNbSlugs, 1);"> + </i> </span> </span> <span class="column-title">Slugs</span> @@ -43,10 +44,10 @@ <span class="is-sortable"> <span class="sort-icons"> <span class="icon"> - <i class="fas fa-sort-up"></i> + <i class="fas fa-sort-up" (click)="sortInfos('_id.slug', -1, 'latest.completionDate', -1, this.childNbSlugs, 1);"></i> </span> <span class="icon"> - <i class="fas fa-sort-down"></i> + <i class="fas fa-sort-down" (click)="sortInfos('_id.slug', -1, 'latest.completionDate', 1, this.childNbSlugs, 1);"></i> </span> </span> <span class="column-title">Dernière date d'exécution</span> @@ -56,23 +57,23 @@ <span class="is-sortable"> <span class="sort-icons"> <span class="icon"> - <i class="fas fa-sort-up"></i> - </span> + <i class="fas fa-sort-up" (click)="sortInfos('_id.slug', -1, 'latest.duration', -1, this.childNbSlugs, 1);"></i> + </span> <span class="icon"> - <i class="fas fa-sort-down"></i> + <i class="fas fa-sort-down" (click)="sortInfos('_id.slug', -1, 'latest.duration', 1, this.childNbSlugs, 1);"></i> </span> </span> <span class="column-title">Durée</span> </span> </div> - <div class="column is-1 has-text-left"> + <div class="column is-1 has-text-left"> <span class="is-sortable"> <span class="sort-icons"> <span class="icon"> - <i class="fas fa-sort-up"></i> - </span> + <i class="fas fa-sort-up" (click)="sortInfos('_id.slug', -1, 'latest.count.INFO', -1, this.childNbSlugs, 1);"></i> + </span> <span class="icon"> - <i class="fas fa-sort-down"></i> - </span> + <i class="fas fa-sort-down" (click)="sortInfos('_id.slug', -1, 'latest.count.INFO', 1, this.childNbSlugs, 1);"></i> + </span> </span> <span class="column-title">Infos</span> </span> @@ -81,13 +82,13 @@ <span class="is-sortable"> <span class="sort-icons"> <span class="icon"> - <i class="fas fa-sort-up"></i> - </span> + <i class="fas fa-sort-up" (click)="sortInfos('_id.slug', -1, 'latest.count.ERROR', -1, this.childNbSlugs, 1);"></i> + </span> <span class="icon"> - <i class="fas fa-sort-down"></i> + <i class="fas fa-sort-down" (click)="sortInfos('_id.slug', -1, 'latest.count.ERROR', 1, this.childNbSlugs, 1);"></i> </span> </span> - <span class="column-title">Erreurs?</span> + <span class="column-title">Erreurs</span> </span> </div> <div class="column is-1 has-text-left"> 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 index 9d8974a..93e694a 100644 --- a/src/app/components/logs-dashboard/logs-slugs/logs-slugs.component.ts +++ b/src/app/components/logs-dashboard/logs-slugs/logs-slugs.component.ts @@ -15,6 +15,10 @@ export class LogsSlugsComponent implements OnChanges, OnDestroy { slugChangeSub: Subscription; foundSlug: string = ''; + sortFilter1:string = ''; + orderFilter1: number = -1; + sortFilter2:string = ''; + orderFilter2: number = -1; allSlugsInfoList:any = []; searchSlug: string = ''; slugInOnePage:number = 1; @@ -37,17 +41,18 @@ export class LogsSlugsComponent implements OnChanges, OnDestroy { this.paginator.limit = this._dataLogsService.limit; this.paginator.pageIndex = this._dataLogsService.pageNumber; this.paginator.length = this.childNbSlugs; - this.getAllInfoForAllSlugs(this.childNbSlugs, this.paginator.pageIndex); + this.getAllInfoForAllSlugs( + this.sortFilter1, this.orderFilter1, this.sortFilter2, this.orderFilter2, this.childNbSlugs, this.paginator.pageIndex); }, ); // console.log(' this.slugsList', this.slugsList); - this.getAllInfoForAllSlugs(this.childNbSlugs, 1); + this.getAllInfoForAllSlugs('_id.slug', -1, 'latest.completionDate', 1, this.childNbSlugs, 1); } ngOnDestroy() { this.slugChangeSub.unsubscribe(); } - getAllInfoForAllSlugs(length, pageNumber) { - this._dataLogsService.getAllInfoForAllSlugs(length, pageNumber).subscribe( + getAllInfoForAllSlugs(sortFilter1, order1, sortFilter2, order2, length, pageNumber) { + this._dataLogsService.getAllInfoForAllSlugs(sortFilter1, order1, sortFilter2, order2, length, pageNumber).subscribe( (result) => { this.foundSlug = ''; this.allSlugsInfoList = result; @@ -69,9 +74,16 @@ export class LogsSlugsComponent implements OnChanges, OnDestroy { ); } + sortInfos(sortFilter1, order1, sortFilter2, order2, length, pageNumber) { + this.sortFilter1 = sortFilter1; + this.orderFilter1 = order1; + this.sortFilter2 = sortFilter2; + this.orderFilter2 = order2; + this.getAllInfoForAllSlugs(this.sortFilter1, this.orderFilter1, this.sortFilter2, this.orderFilter2, length, pageNumber); + } getAllInfoForOneSlug($event) { if (this.foundSlug === '') { - this.getAllInfoForAllSlugs(this.childNbSlugs, 1); + this.getAllInfoForAllSlugs('_id.slug', -1, 'latest.completionDate', 1, this.childNbSlugs, 1); } else { // const foundSlug = (<HTMLInputElement>document.getElementById('foundSlug')).value; this._dataLogsService.getAllInfoForOneSlug(this.foundSlug).subscribe((result) => { diff --git a/src/app/components/logs-dashboard/report/logs-error/logs-error.component.html b/src/app/components/logs-dashboard/report/logs-error/logs-error.component.html index a78f90c..807664b 100644 --- a/src/app/components/logs-dashboard/report/logs-error/logs-error.component.html +++ b/src/app/components/logs-dashboard/report/logs-error/logs-error.component.html @@ -1,8 +1,8 @@ <div class="columns is-centered is-marginless"> - <div class="column is-5 has-text-left is-marginless"> + <div class="column is-3 has-text-left is-marginless"> - <div class="table entity-list-table is-marginless" *ngIf="allErrorLogs[0]; else noErrors"> + <div class="table entity-list-table is-marginless" > <div class="header columns is-marginless is-multiline is-vcentered"> <div class="column is-6 has-text-left"> <p> Toutes les étapes:</p> @@ -46,21 +46,22 @@ </div> </div> - <ng-template #noErrors class="is-centered is-marginless" > - <p>Pas d'erreurs</p> - </ng-template> + </div> - <div class="column is-7 has-text-left"> - <div class="table entity-list-table is-marginless" *ngIf="allErrorLogs[0]"> + <div class="column is-9 has-text-left"> + <div class="table entity-list-table is-marginless" *ngIf="allErrorLogs[0] ; else noErrors"> <div class="header columns is-marginless is-multiline is-centered is-vcentered"> - + <div class="column is-3 has-text-left"> + logs d'erreur pour {{allErrorLogs[0].step}}</div> + <div class="column is-9 has-text-left"> <app-paginator [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 class="data-list" *ngFor="let oneErrorLog of allErrorLogs; let i=index; let odd=odd; let even=even;"> <div class="data columns is-multiline is-vcentered is-marginless" [ngClass]="{ odd: odd, even: even }"> @@ -78,6 +79,11 @@ </div> </div> </div> + + <ng-template #noErrors class="is-centered is-marginless" > + <p>Pas d'erreurs</p> + </ng-template> + <div> </div> </div> diff --git a/src/app/components/logs-dashboard/report/logs-info/logs-info.component.html b/src/app/components/logs-dashboard/report/logs-info/logs-info.component.html index debebff..bb508d6 100644 --- a/src/app/components/logs-dashboard/report/logs-info/logs-info.component.html +++ b/src/app/components/logs-dashboard/report/logs-info/logs-info.component.html @@ -1,6 +1,6 @@ <div class="columns is-centered is-marginless"> - <div class="column is-5 has-text-left is-marginless"> + <div class="column is-3 has-text-left is-marginless"> <div class="table entity-list-table is-marginless" *ngIf="allLogs; else noLogs"> <div class="header columns is-marginless is-multiline is-vcentered"> @@ -53,14 +53,17 @@ </div> - <div class="column is-7 has-text-left"> + <div class="column is-9 has-text-left"> <div class="table entity-list-table is-marginless" *ngIf="allLogs"> <div class="header columns is-marginless is-multiline is-centered is-vcentered"> - + <div class="column is-3 has-text-left"> + logs pour {{allLogs[0].step}}</div> + <div class="column is-9 has-text-left"> <app-paginator [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 class="data-list" *ngFor="let oneLog of allLogs; let i=index; let odd=odd; let even=even;"> diff --git a/src/app/services/data-logs.service.ts b/src/app/services/data-logs.service.ts index ffd4977..5100827 100644 --- a/src/app/services/data-logs.service.ts +++ b/src/app/services/data-logs.service.ts @@ -62,10 +62,13 @@ export class DataLogsService { }), ); } - getAllInfoForAllSlugs(nbSlugs, pageNumber): Observable<any[]> { - let aggregationEndPoint = 'indexer_logs/_aggrs/allFullSlugAggr'; + getAllInfoForAllSlugs(sortFilter1, order1, sortFilter2, order2, nbSlugs, pageNumber): Observable<any[]> { + let aggregationEndPoint = 'indexer_logs/_aggrs/allFullSlugAggr?avars='; this.length = nbSlugs; this.pageNumber = pageNumber; + const query = { sortExpr1: { [sortFilter1] : order1 }, sortExpr2 :{ [sortFilter2] : order2 } }; + const stringQuery = JSON.stringify(query); + aggregationEndPoint += stringQuery; aggregationEndPoint += `?pagesize=${(this.limit)}`; aggregationEndPoint += `&page=${(pageNumber)}`; return this._httpClient.get<any[]>(this.resourceServiceUrl + aggregationEndPoint).pipe( @@ -75,10 +78,13 @@ export class DataLogsService { ); } - getAllInfoForAllSessions(nbSessions, pageNumber): Observable<any[]> { - let aggregationEndPoint = 'indexer_logs/_aggrs/allFullSessionAggr'; + getAllInfoForAllSessions(sortFilter1, order1, sortFilter2, order2, nbSessions, pageNumber): Observable<any[]> { + let aggregationEndPoint = 'indexer_logs/_aggrs/allFullSessionAggr?avars='; + const query = { sortExpr1: { [sortFilter1] : order1 }, sortExpr2 :{ [sortFilter2] : order2 } }; + const stringQuery = JSON.stringify(query); this.length = nbSessions; this.pageNumber = pageNumber; + aggregationEndPoint += stringQuery; aggregationEndPoint += `?pagesize=${(this.limit)}`; aggregationEndPoint += `&page=${(pageNumber)}`; return this._httpClient.get<any[]>(this.resourceServiceUrl + aggregationEndPoint).pipe( @@ -89,7 +95,7 @@ export class DataLogsService { ); } getAllInfoForOneSlug(slug): Observable<any[]> { - const query = { slug }; + const query = { slug, sortExpr1: { _id : 1 }, sortExpr2 :{ _id : 1 } }; const stringQuery = JSON.stringify(query); const aggregationEndPoint = 'indexer_logs/_aggrs/oneFullSlugAggr?avars='; return this._httpClient.get<any[]>(this.resourceServiceUrl + aggregationEndPoint + stringQuery).pipe( @@ -100,7 +106,7 @@ export class DataLogsService { } getAllInfoForOneSession(sessionId): Observable<any[]> { - const query = { session_id: sessionId }; + const query = { session_id: sessionId, sortExpr1: { _id : 1 }, sortExpr2 :{ _id : 1 } }; const stringQuery = JSON.stringify(query); const aggregationEndPoint = 'indexer_logs/_aggrs/oneFullSessionAggr?avars='; return this._httpClient.get<any[]>(this.resourceServiceUrl + aggregationEndPoint + stringQuery).pipe( @@ -111,7 +117,7 @@ export class DataLogsService { } getAllInfoForSlugSession(slug, sessionId): Observable<any[]> { - const query = { slug, session_id: sessionId }; + const query = { slug, session_id: sessionId , sortExpr1: { _id : 1 }, sortExpr2 :{ _id : 1 } }; const stringQuery = JSON.stringify(query); const aggregationEndPoint = 'indexer_logs/_aggrs/oneFullSessionSlugAggr?avars='; return this._httpClient.get<any[]>(this.resourceServiceUrl + aggregationEndPoint + stringQuery).pipe( diff --git a/src/assets/config/config.json b/src/assets/config/config.json index f6e484d..ddb5593 100644 --- a/src/assets/config/config.json +++ b/src/assets/config/config.json @@ -15,7 +15,9 @@ "url": "https://kong-dev.alpha.grandlyon.com/middleware-legacy/" }, "restHeartAggregations": { - "url": "https://kong-dev.alpha.grandlyon.com/indexer-logs/indexerdb/" + "url2": "https://kong-dev.alpha.grandlyon.com/indexer-logs/indexerdb/", + "url": "http://localhost:8080/indexerdb/" + }, "changelog": { "url": "https://kong-dev.alpha.grandlyon.com/changelog/" -- GitLab