X-Git-Url: https://gerrit.o-ran-sc.org/r/gitweb?a=blobdiff_plain;f=webapp-frontend%2Fsrc%2Fapp%2Fpolicy%2Fpolicy-instance%2Fpolicy-instance.component.ts;h=1649d397ef4b498026df0d83197e0e76d1ddb693;hb=01a9b9b679ae518584ab91e3c4b3ef6c6d5c474a;hp=24a7cc7a9cdfddc724f4612cd8745607783cc11d;hpb=41a57e4d75761207f2da883d0e4396c81159e58e;p=portal%2Fnonrtric-controlpanel.git diff --git a/webapp-frontend/src/app/policy/policy-instance/policy-instance.component.ts b/webapp-frontend/src/app/policy/policy-instance/policy-instance.component.ts index 24a7cc7..1649d39 100644 --- a/webapp-frontend/src/app/policy/policy-instance/policy-instance.component.ts +++ b/webapp-frontend/src/app/policy/policy-instance/policy-instance.component.ts @@ -18,196 +18,204 @@ * ========================LICENSE_END=================================== */ -import { MatSort, Sort } from '@angular/material/sort'; -import { Component, OnInit, ViewChild, Input, AfterViewInit } from '@angular/core'; -import { MatDialog } from '@angular/material/dialog'; -import { PolicyTypeSchema } from '@interfaces/policy.types'; -import { PolicyInstanceDataSource } from './policy-instance.datasource'; -import { ErrorDialogService } from '@services/ui/error-dialog.service'; -import { NotificationService } from '@services/ui/notification.service'; -import { PolicyService } from '@services/policy/policy.service'; -import { ConfirmDialogService } from '@services/ui/confirm-dialog.service'; -import { PolicyInstance } from '@interfaces/policy.types'; -import { PolicyInstanceDialogComponent } from '../policy-instance-dialog/policy-instance-dialog.component'; -import { getPolicyDialogProperties } from '../policy-instance-dialog/policy-instance-dialog.component'; -import { HttpErrorResponse, HttpResponse } from '@angular/common/http'; -import { BehaviorSubject, Observable } from 'rxjs'; -import { UiService } from '@services/ui/ui.service'; -import { FormControl, FormGroup } from '@angular/forms'; -import { MatTableDataSource } from '@angular/material/table'; - -class PolicyTypeInfo { - constructor(public type: PolicyTypeSchema) { } - - isExpanded: BehaviorSubject = new BehaviorSubject(false); -} +import { Sort } from "@angular/material/sort"; +import { Component, OnInit, Input } from "@angular/core"; +import { MatDialog } from "@angular/material/dialog"; +import { PolicyTypeSchema } from "@interfaces/policy.types"; +import { NotificationService } from "@services/ui/notification.service"; +import { PolicyService } from "@services/policy/policy.service"; +import { ConfirmDialogService } from "@services/ui/confirm-dialog.service"; +import { PolicyInstance } from "@interfaces/policy.types"; +import { PolicyInstanceDialogComponent } from "../policy-instance-dialog/policy-instance-dialog.component"; +import { getPolicyDialogProperties } from "../policy-instance-dialog/policy-instance-dialog.component"; +import { HttpResponse } from "@angular/common/http"; +import { BehaviorSubject, forkJoin } from "rxjs"; +import { UiService } from "@services/ui/ui.service"; +import { FormControl, FormGroup } from "@angular/forms"; +import { MatTableDataSource } from "@angular/material/table"; +import { mergeMap } from "rxjs/operators"; @Component({ - selector: 'nrcp-policy-instance', - templateUrl: './policy-instance.component.html', - styleUrls: ['./policy-instance.component.scss'] + selector: "nrcp-policy-instance", + templateUrl: "./policy-instance.component.html", + styleUrls: ["./policy-instance.component.scss"], }) - - -export class PolicyInstanceComponent implements OnInit, AfterViewInit { - policyInstanceDataSource: PolicyInstanceDataSource; - @Input() policyTypeSchema: PolicyTypeSchema; - @Input() expanded: Observable; - @ViewChild(MatSort, { static: true }) sort: MatSort; - policyTypeInfo = new Map(); - instanceDataSource: MatTableDataSource = new MatTableDataSource(); - policyInstanceForm: FormGroup; - darkMode: boolean; - - constructor( - private policySvc: PolicyService, - private dialog: MatDialog, - private errorDialogService: ErrorDialogService, - private notificationService: NotificationService, - private confirmDialogService: ConfirmDialogService, - private ui: UiService) { - this.policyInstanceForm = new FormGroup({ - id: new FormControl(''), - target: new FormControl(''), - owner: new FormControl(''), - lastModified: new FormControl('') +export class PolicyInstanceComponent implements OnInit { + @Input() policyTypeSchema: PolicyTypeSchema; + darkMode: boolean; + instanceDataSource: MatTableDataSource; + policyInstanceForm: FormGroup; + private policyInstanceSubject = new BehaviorSubject([]); + policyInstances: PolicyInstance[] = []; + + constructor( + private policySvc: PolicyService, + private dialog: MatDialog, + private notificationService: NotificationService, + private confirmDialogService: ConfirmDialogService, + private ui: UiService + ) { + this.policyInstanceForm = new FormGroup({ + id: new FormControl(""), + target: new FormControl(""), + owner: new FormControl(""), + lastModified: new FormControl(""), + }); + } + + ngOnInit() { + this.getPolicyInstances(); + this.policyInstanceSubject.subscribe((data) => { + this.instanceDataSource = new MatTableDataSource(data); + + this.instanceDataSource.filterPredicate = (( + data: PolicyInstance, + filter + ) => { + return ( + this.isDataIncluding(data.policy_id, filter.id) && + this.isDataIncluding(data.ric_id, filter.target) && + this.isDataIncluding(data.service_id, filter.owner) && + this.isDataIncluding(data.lastModified, filter.lastModified) + ); + }) as (data: PolicyInstance, filter: any) => boolean; + }); + + this.policyInstanceForm.valueChanges.subscribe((value) => { + const filter = { + ...value, + id: value.id.trim().toLowerCase(), + } as string; + this.instanceDataSource.filter = filter; + }); + + this.ui.darkModeState.subscribe((isDark) => { + this.darkMode = isDark; + }); + } + + getPolicyInstances() { + this.policyInstances = [] as PolicyInstance[]; + this.policySvc + .getPolicyInstancesByType(this.policyTypeSchema.id) + .pipe( + mergeMap((policyIds) => + forkJoin( + policyIds.policy_ids.map((id) => { + return forkJoin([ + this.policySvc.getPolicyInstance(id), + this.policySvc.getPolicyStatus(id), + ]); }) - } - - ngOnInit() { - let schemaId = this.policyTypeSchema.id; - if(schemaId.includes('')){ - schemaId = ''; - } - this.policyInstanceDataSource = new PolicyInstanceDataSource(this.policySvc, this.sort, this.notificationService, schemaId); - this.expanded.subscribe((isExpanded: boolean) => this.onExpand(isExpanded)); - - this.policyInstanceDataSource.connect().subscribe((data) => { - this.instanceDataSource.data = data; - }) - - this.policyInstanceForm.valueChanges.subscribe(value => { - const filter = {...value, id: value.id.trim().toLowerCase()} as string; - this.instanceDataSource.filter = filter; - }); - - this.instanceDataSource.filterPredicate = ((data: PolicyInstance, filter) => { - return this.isDataIncluding(data.policy_id, filter.id) - && this.isDataIncluding(data.ric_id, filter.target) - && this.isDataIncluding(data.service_id, filter.owner) - && this.isDataIncluding(data.lastModified, filter.lastModified); - }) as (data: PolicyInstance, filter: any) => boolean; - - this.ui.darkModeState.subscribe((isDark) => { - this.darkMode = isDark; + ) + ) + ) + .subscribe((res) => { + this.policyInstances = res.map((policy) => { + let policyInstance = {}; + policyInstance = policy[0]; + policyInstance.lastModified = policy[1].last_modified; + return policyInstance; }); - } - - 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); - } - - ngAfterViewInit() { - this.policyInstanceDataSource.sort = this.sort; - } + this.policyInstanceSubject.next(this.policyInstances); + }); + } + + getSortedData(sort: Sort) { + const data = this.instanceDataSource.data; + data.sort((a: PolicyInstance, b: PolicyInstance) => { + const isAsc = sort.direction === "asc"; + switch (sort.active) { + case "instanceId": + return compare(a.policy_id, b.policy_id, isAsc); + case "ric": + return compare(a.ric_id, b.ric_id, isAsc); + case "service": + return compare(a.service_id, b.service_id, isAsc); + case "lastModified": + return compare(a.lastModified, b.lastModified, isAsc); + default: + return 0; + } + }); + this.instanceDataSource.data = data; + } + + stopSort(event: any) { + event.stopPropagation(); + } + + isDataIncluding(data: string, filter: string): boolean { + return !filter || data.toLowerCase().includes(filter); + } + + createPolicyInstance(policyTypeSchema: PolicyTypeSchema): void { + this.openInstanceDialog(null); + } + + modifyInstance(instance: PolicyInstance): void { + this.policySvc + .getPolicyInstance(instance.policy_id) + .subscribe((refreshedJson: PolicyInstance) => { + this.openInstanceDialog(refreshedJson); + }); + } + + private openInstanceDialog(policy: PolicyInstance) { + const dialogData = getPolicyDialogProperties( + this.policyTypeSchema, + policy, + this.darkMode + ); + const dialogRef = this.dialog.open( + PolicyInstanceDialogComponent, + dialogData + ); + dialogRef.afterClosed().subscribe((ok: any) => { + if (ok) this.getPolicyInstances(); + }); + } + + hasInstances(): boolean { + return this.instanceCount() > 0; +} - private onExpand(isExpanded: boolean) { - if (isExpanded) { - this.policyInstanceDataSource.getPolicyInstances(); + instanceCount(): number { + return this.policyInstances.length; + } + + toLocalTime(utcTime: string): string { + const date = new Date(utcTime); + const toutc = date.toUTCString(); + return new Date(toutc + " UTC").toLocaleString(); + } + + deleteInstance(instance: PolicyInstance): void { + this.confirmDialogService + .openConfirmDialog( + "Delete Policy", + "Are you sure you want to delete this policy instance?" + ) + .afterClosed() + .subscribe((res: any) => { + if (res) { + this.policySvc + .deletePolicy(instance.policy_id) + .subscribe((response: HttpResponse) => { + if (response.status === 204) { + this.notificationService.success("Delete succeeded!"); + this.getPolicyInstances(); + } + }); } - } - - private isSchemaEmpty(): boolean { - return this.policyTypeSchema.schemaObject === '{}'; - } - - modifyInstance(instance: PolicyInstance): void { - this.policySvc.getPolicyInstance(instance.policy_id).subscribe( - (refreshedJson: any) => { - instance = refreshedJson; - this.dialog.open( - PolicyInstanceDialogComponent, - getPolicyDialogProperties(this.policyTypeSchema, instance, this.darkMode)).afterClosed().subscribe( - (_: any) => { - this.policyInstanceDataSource.getPolicyInstances(); - } - ); - }, - (httpError: HttpErrorResponse) => { - this.notificationService.error('Could not refresh instance. Please try again.' + httpError.message); - } - ); - } - - hasInstances(): boolean { - return this.policyInstanceDataSource.rowCount > 0; - } - - nbInstances(): number { - return this.policyInstanceDataSource.policyInstances.length; - } - - toLocalTime(utcTime: string): string { - const date = new Date(utcTime); - const toutc = date.toUTCString(); - return new Date(toutc + ' UTC').toLocaleString(); - - } - - createPolicyInstance(policyTypeSchema: PolicyTypeSchema): void { - let dialogRef = this.dialog.open(PolicyInstanceDialogComponent, - getPolicyDialogProperties(policyTypeSchema, null, this.darkMode)); - const info: PolicyTypeInfo = this.getPolicyTypeInfo(policyTypeSchema); - dialogRef.afterClosed().subscribe( - (_) => { - info.isExpanded.next(info.isExpanded.getValue()); - } - ); - } - - deleteInstance(instance: PolicyInstance): void { - this.confirmDialogService - .openConfirmDialog('Are you sure you want to delete this policy instance?') - .afterClosed().subscribe( - (res: any) => { - if (res) { - this.policySvc.deletePolicy(instance.policy_id) - .subscribe( - (response: HttpResponse) => { - switch (response.status) { - case 204: - this.notificationService.success('Delete succeeded!'); - this.policyInstanceDataSource.getPolicyInstances(); - break; - default: - this.notificationService.warn('Delete failed ' + response.status + ' ' + response.body); - } - }, - (error: HttpErrorResponse) => { - this.errorDialogService.displayError(error.statusText + ', ' + error.error); - }); - } - }); - } - - getPolicyTypeInfo(policyTypeSchema: PolicyTypeSchema): PolicyTypeInfo { - let info: PolicyTypeInfo = this.policyTypeInfo.get(policyTypeSchema.name); - if (!info) { - info = new PolicyTypeInfo(policyTypeSchema); - this.policyTypeInfo.set(policyTypeSchema.name, info); - } - return info; - } + }); + } + + refreshTable() { + this.getPolicyInstances(); + } +} - refreshTable() { - this.policyInstanceDataSource.getPolicyInstances(); - } +function compare(a: string, b: string, isAsc: boolean) { + return (a < b ? -1 : 1) * (isAsc ? 1 : -1); }