From 62697dfde02c5fb5ded820ddfab89d8e4080479e Mon Sep 17 00:00:00 2001 From: ychacon Date: Tue, 16 Feb 2021 14:21:42 +0100 Subject: [PATCH] Adding sorting for tables of EI Issue-ID: NONRTRIC-447 Signed-off-by: ychacon Change-Id: Ib0fd3b5d032dcf559f26bdb059efdf8f9053c186 --- .../ei-coordinator/ei-coordinator.component.html | 146 +++++++++++---------- .../app/ei-coordinator/ei-coordinator.component.ts | 53 ++++++-- .../src/app/ei-coordinator/ei-job.datasource.ts | 22 +++- 3 files changed, 138 insertions(+), 83 deletions(-) diff --git a/webapp-frontend/src/app/ei-coordinator/ei-coordinator.component.html b/webapp-frontend/src/app/ei-coordinator/ei-coordinator.component.html index 1b16b30..2eb0dd2 100644 --- a/webapp-frontend/src/app/ei-coordinator/ei-coordinator.component.html +++ b/webapp-frontend/src/app/ei-coordinator/ei-coordinator.component.html @@ -19,54 +19,59 @@ limitations under the License. -->
-
Enrichment Information Coordinator
-
- -
+
Enrichment Information Coordinator
+
+ +

Producers

- + - + +
Producer ID
+
{{eiProducer.ei_producer_id}} - -
+ +
Producer types
+
{{this.getEIProducerTypes(eiProducer)}} - -
+ +
Producer status
+
{{this.getEIProducerStatus(eiProducer)}} @@ -74,10 +79,6 @@ limitations under the License. - - - No data matching the filter "{{input.value}}" -
@@ -85,57 +86,62 @@ limitations under the License.

Jobs

- - - -
-
- - - Job ID - -
- - {{this.getDisplayName(eiJob)}} - - - -
-
- - - Type ID - -
- - {{this.getEITypeId(eiJob)}} - - - -
-
- - - Owner - -
- - {{eiJob.owner}} - - - -
-
- - - Target URI - -
- - {{this.getTargetUri(eiJob)}} - - - - + + + +
+
+ + + Job ID + +
+
+ + {{this.getDisplayName(eiJob)}} + + + +
+
+ + + Type ID + +
+
+ + {{this.getEITypeId(eiJob)}} + + + +
+
+ + + Owner + +
+
+ + {{eiJob.owner}} + + + +
+
+ + + Target URI + +
+
+ + {{this.getTargetUri(eiJob)}} + + + +
\ No newline at end of file diff --git a/webapp-frontend/src/app/ei-coordinator/ei-coordinator.component.ts b/webapp-frontend/src/app/ei-coordinator/ei-coordinator.component.ts index 45c5d3d..1bd7220 100644 --- a/webapp-frontend/src/app/ei-coordinator/ei-coordinator.component.ts +++ b/webapp-frontend/src/app/ei-coordinator/ei-coordinator.component.ts @@ -17,11 +17,11 @@ * limitations under the License. * ========================LICENSE_END=================================== */ -import { Component, OnInit, ViewChild } from '@angular/core'; -import { MatSort } from '@angular/material/sort'; +import { Component, OnInit } from '@angular/core'; +import { Sort } from '@angular/material/sort'; import { animate, state, style, transition, trigger } from '@angular/animations'; import { FormBuilder, FormGroup, AbstractControl } from '@angular/forms'; -import { MatTableDataSource, MatTable } from '@angular/material'; +import { MatTableDataSource } from '@angular/material'; import { BehaviorSubject, Observable } from 'rxjs'; @@ -51,9 +51,6 @@ class EIJobInfo { }) export class EICoordinatorComponent implements OnInit { - @ViewChild(MatSort, { static: true }) sort: MatSort; - @ViewChild('producersTable', { static: true }) table: MatTable; - eiJobInfo = new Map(); darkMode: boolean; searchString: string; @@ -87,7 +84,7 @@ export class EICoordinatorComponent implements OnInit { ngOnInit() { this.eiJobsDataSource.loadJobs(); this.eiProducersDataSource.loadProducers(); - this.jobsDataSource = new MatTableDataSource(this.eiJobsDataSource.eiJobs()); + this.jobsDataSource = this.eiJobsDataSource.jobsDataSource(); this.producersDataSource = new MatTableDataSource(this.eiProducersDataSource.eiProducers()); this.jobsFormControl.valueChanges.subscribe(value => { @@ -99,7 +96,7 @@ export class EICoordinatorComponent implements OnInit { this.producersDataSource.filter = filter; }); - this.jobsDataSource.filterPredicate = ((data, filter) => { + this.jobsDataSource.filterPredicate = ((data: EIJob, filter) => { return this.isDataIncluding(data.ei_job_identity, filter.id) && this.isDataIncluding(data.target_uri, filter.target_uri) && this.isDataIncluding(data.owner, filter.owner) @@ -117,6 +114,44 @@ export class EICoordinatorComponent implements OnInit { }); } + sortJobs(sort: Sort){ + console.log('Jobs new sort: ', sort); + const data = this.jobsDataSource.data + data.sort((a: EIJob, b: EIJob) => { + const isAsc = sort.direction === 'asc'; + switch (sort.active) { + case 'id': return this.compare(a.ei_job_identity, b.ei_job_identity, isAsc); + case 'typeId': return this.compare(a.ei_type_identity, b.ei_type_identity, isAsc); + case 'owner': return this.compare(a.owner, b.owner, isAsc); + case 'targetUri': return this.compare(a.target_uri, b.owner, isAsc); + default: return 0; + } + }); + this.jobsDataSource.data = data; + } + + sortProducers(sort: Sort){ + const data = this.producersDataSource.data + data.sort((a: EIProducer, b: EIProducer) => { + const isAsc = sort.direction === 'asc'; + switch (sort.active) { + case 'id': return this.compare(a.ei_producer_id, b.ei_producer_id, isAsc); + case 'types': return this.compare(a.ei_producer_types, b.ei_producer_types, isAsc); + case 'status': return this.compare(a.status, b.status, isAsc); + default: return 0; + } + }); + this.producersDataSource.data = data; + } + + compare(a: any, b: any, isAsc: boolean) { + return (a < b ? -1 : 1) * (isAsc ? 1 : -1); + } + + stopSort(event: any){ + event.stopPropagation(); + } + isDataIncluding(data: string, filter: string) : boolean { return !filter || data.toLowerCase().includes(filter); } @@ -182,7 +217,7 @@ export class EICoordinatorComponent implements OnInit { refreshTables() { this.eiJobsDataSource.loadJobs(); - this.jobsDataSource.data = this.eiJobsDataSource.eiJobs(); + this.jobsDataSource = this.eiJobsDataSource.jobsDataSource(); this.eiProducersDataSource.loadProducers(); this.producersDataSource.data = this.eiProducersDataSource.eiProducers(); } diff --git a/webapp-frontend/src/app/ei-coordinator/ei-job.datasource.ts b/webapp-frontend/src/app/ei-coordinator/ei-job.datasource.ts index 27a70c4..0727625 100644 --- a/webapp-frontend/src/app/ei-coordinator/ei-job.datasource.ts +++ b/webapp-frontend/src/app/ei-coordinator/ei-job.datasource.ts @@ -24,6 +24,10 @@ import { BehaviorSubject } from 'rxjs/BehaviorSubject'; import { EIJob } from '../interfaces/ei.types'; import { EIService } from '../services/ei/ei.service'; +import { MatTableDataSource } from '@angular/material'; +import { ViewChild } from '@angular/core'; +import { MatSort } from '@angular/material/sort'; +import { delay } from 'rxjs/operators'; @Injectable({ providedIn: 'root' @@ -32,9 +36,12 @@ import { EIService } from '../services/ei/ei.service'; export class EIJobDataSource { private jobs: Array = []; + private dataSource: MatTableDataSource = new MatTableDataSource(); + @ViewChild(MatSort, { static: true }) sort: MatSort; - public eiJobs(): EIJob[] { - return this.jobs; + + public jobsDataSource(): MatTableDataSource { + return this.dataSource; } private loadingSubject = new BehaviorSubject(false); @@ -55,14 +62,21 @@ export class EIJobDataSource { producerIds.forEach(id => { this.getJobsForProducer(id); }); + //this.dataSource = new MatTableDataSource(); + this.dataSource.data = this.jobs; + this.dataSource.sort = this.sort; + console.log("datasource: "+this.dataSource.data); }); this.rowCount = this.jobs.length; } private getJobsForProducer(id: string) { console.log('Getting jobs for producer ID: ', id); - this.eiSvc.getJobsForProducer(id).subscribe(producerJobs => { - this.jobs = this.jobs.concat(producerJobs); + this.eiSvc.getJobsForProducer(id)//.pipe(delay(5000)) + .subscribe(producerJobs => { + this.jobs = this.jobs.concat(producerJobs); + console.log("producerJobs: "+producerJobs); + }); } } -- 2.16.6