From 832368a5329cffbac6f33b8355d95a18875ac2b7 Mon Sep 17 00:00:00 2001 From: ychacon Date: Thu, 8 Apr 2021 08:31:36 +0200 Subject: [PATCH] Adding checkbox to enable/disable auto-refresh Issue-ID: NONRTRIC-475 Signed-off-by: ychacon Change-Id: I7cd55fa9386145f3a188e2e43111a9240f953b4f --- .../app/ei-coordinator/ei-coordinator.module.ts | 4 ++ .../jobs-list/jobs-list.component.html | 1 + .../jobs-list/jobs-list.component.scss | 5 +++ .../jobs-list/jobs-list.component.ts | 51 +++++++++++++--------- 4 files changed, 41 insertions(+), 20 deletions(-) diff --git a/webapp-frontend/src/app/ei-coordinator/ei-coordinator.module.ts b/webapp-frontend/src/app/ei-coordinator/ei-coordinator.module.ts index c9162d9..8dc0b47 100644 --- a/webapp-frontend/src/app/ei-coordinator/ei-coordinator.module.ts +++ b/webapp-frontend/src/app/ei-coordinator/ei-coordinator.module.ts @@ -25,10 +25,12 @@ import { RouterModule, Routes } from '@angular/router'; import { EICoordinatorComponent } from './ei-coordinator.component'; import { ProducersListComponent } from './producers-list/producers-list.component'; import { JobsListComponent } from './jobs-list/jobs-list.component'; +import { FormsModule } from '@angular/forms'; import { MatTableModule } from '@angular/material/table'; import { MatIconModule } from '@angular/material/icon'; import { MatInputModule } from '@angular/material/input'; import { ReactiveFormsModule } from '@angular/forms'; +import { MatCheckboxModule } from '@angular/material/checkbox'; import { MatSortModule } from '@angular/material/sort'; import { MatButtonModule } from '@angular/material/button'; import { FlexLayoutModule } from '@angular/flex-layout'; @@ -52,10 +54,12 @@ const routes: Routes = [ imports: [ CommonModule, FlexLayoutModule, + FormsModule, MatTableModule, MatIconModule, MatInputModule, ReactiveFormsModule, + MatCheckboxModule, MatSortModule, MatPaginatorModule, MatButtonModule, diff --git a/webapp-frontend/src/app/ei-coordinator/jobs-list/jobs-list.component.html b/webapp-frontend/src/app/ei-coordinator/jobs-list/jobs-list.component.html index d325d4d..1f5fd43 100644 --- a/webapp-frontend/src/app/ei-coordinator/jobs-list/jobs-list.component.html +++ b/webapp-frontend/src/app/ei-coordinator/jobs-list/jobs-list.component.html @@ -18,6 +18,7 @@ limitations under the License. ========================LICENSE_END=================================== -->
+ auto-refresh
diff --git a/webapp-frontend/src/app/ei-coordinator/jobs-list/jobs-list.component.scss b/webapp-frontend/src/app/ei-coordinator/jobs-list/jobs-list.component.scss index d0f2ee7..18f2410 100644 --- a/webapp-frontend/src/app/ei-coordinator/jobs-list/jobs-list.component.scss +++ b/webapp-frontend/src/app/ei-coordinator/jobs-list/jobs-list.component.scss @@ -28,4 +28,9 @@ .mat-form-field { font-size: 14px; width: 100%; +} + +.polling-checkbox{ + margin: 0 10px; + font-size: 0.75em; } \ No newline at end of file diff --git a/webapp-frontend/src/app/ei-coordinator/jobs-list/jobs-list.component.ts b/webapp-frontend/src/app/ei-coordinator/jobs-list/jobs-list.component.ts index 58e437a..a85e577 100644 --- a/webapp-frontend/src/app/ei-coordinator/jobs-list/jobs-list.component.ts +++ b/webapp-frontend/src/app/ei-coordinator/jobs-list/jobs-list.component.ts @@ -23,6 +23,7 @@ import { MatPaginator } from "@angular/material/paginator"; import { Sort } from "@angular/material/sort"; import { MatTableDataSource } from "@angular/material/table"; import { + EMPTY, forkJoin, Subscription, timer, @@ -33,7 +34,7 @@ import { finalize, map, tap, - switchMap, + switchMap } from "rxjs/operators"; import { EIJob } from "@interfaces/ei.types"; import { EIService } from "@services/ei/ei.service"; @@ -59,11 +60,13 @@ export class JobsListComponent implements OnInit { jobForm: FormGroup; darkMode: boolean; - private jobsSubject = new BehaviorSubject([]); + private jobsSubject$ = new BehaviorSubject([]); private refresh$ = new BehaviorSubject(""); - private loadingSubject = new BehaviorSubject(false); - public loading$ = this.loadingSubject.asObservable(); + private loadingSubject$ = new BehaviorSubject(false); + private polling$ = new BehaviorSubject(true); + public loading$ = this.loadingSubject$.asObservable(); subscription: Subscription; + checked: boolean = false; constructor(private eiSvc: EIService, private ui: UiService) { this.jobForm = new FormGroup({ @@ -78,7 +81,7 @@ export class JobsListComponent implements OnInit { ngOnInit(): void { this.subscription = this.dataSubscription(); - this.jobsSubject.subscribe((data) => { + this.jobsSubject$.subscribe((data) => { this.jobsDataSource = new MatTableDataSource(data); this.jobsDataSource.paginator = this.paginator; @@ -110,22 +113,26 @@ export class JobsListComponent implements OnInit { mergeMap((prodIds) => forkJoin(prodIds.map((id) => this.eiSvc.getJobsForProducer(id))) ), - finalize(() => this.loadingSubject.next(false)) + finalize(() => this.loadingSubject$.next(false)) ); - return this.refresh$ + const refreshedJobs$ = this.refresh$ .pipe( - switchMap((_) => - timer(0, 10000).pipe( - tap((_) => { - this.loadingSubject.next(true); - }), - switchMap((_) => jobs$), - map((response) => this.extractJobs(prodId, response)) - ) + switchMap((_) => timer(0, 10000).pipe( + tap((_) => { + this.loadingSubject$.next(true); + }), + switchMap((_) => jobs$), + map((response) => this.extractJobs(prodId, response)) ) - ) - .subscribe(); + ) + ); + + return this.polling$.pipe( + switchMap(p => { + return p ? refreshedJobs$ : EMPTY; + }) + ).subscribe(); } ngOnDestroy() { @@ -162,6 +169,10 @@ export class JobsListComponent implements OnInit { this.jobsDataSource.data = data; } + stopPolling(checked){ + this.polling$.next(checked); + } + compare(a: any, b: any, isAsc: boolean) { return (a < b ? -1 : 1) * (isAsc ? 1 : -1); } @@ -190,17 +201,17 @@ export class JobsListComponent implements OnInit { } public jobs(): Job[] { - return this.jobsSubject.value; + return this.jobsSubject$.value; } private extractJobs(prodId: number[], res: EIJob[][]) { - console.log(res.length); + this.clearFilter(); let jobList = []; prodId.forEach((element, index) => { let jobs = res[index]; jobList = jobList.concat(jobs.map((job) => this.createJob(element, job))); }); - this.jobsSubject.next(jobList); + this.jobsSubject$.next(jobList); return jobList; } -- 2.16.6