X-Git-Url: https://gerrit.o-ran-sc.org/r/gitweb?a=blobdiff_plain;f=webapp-frontend%2Fsrc%2Fapp%2Fpolicy%2Fpolicy-instance-dialog%2Fpolicy-instance-dialog.component.ts;h=f47bbe27e54adcb4a13c4dc1c881f93aee871b23;hb=refs%2Fchanges%2F18%2F5818%2F1;hp=3c2ea2b0da28c0e13d963e3807d8ab074e5ce13a;hpb=b3f060ed6175d6dab20e16f51cb96a8ed02a6fc2;p=portal%2Fnonrtric-controlpanel.git diff --git a/webapp-frontend/src/app/policy/policy-instance-dialog/policy-instance-dialog.component.ts b/webapp-frontend/src/app/policy/policy-instance-dialog/policy-instance-dialog.component.ts index 3c2ea2b..f47bbe2 100644 --- a/webapp-frontend/src/app/policy/policy-instance-dialog/policy-instance-dialog.component.ts +++ b/webapp-frontend/src/app/policy/policy-instance-dialog/policy-instance-dialog.component.ts @@ -2,7 +2,7 @@ * ========================LICENSE_START================================= * O-RAN-SC * %% - * Copyright (C) 2019 Nordix Foundation + * Copyright (C) 2020 Nordix Foundation * %% * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. @@ -17,145 +17,133 @@ * limitations under the License. * ========================LICENSE_END=================================== */ -import { AfterViewInit, Component, Inject, OnInit, ViewChild } from '@angular/core'; -import { MatDialogConfig, MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog'; -import * as uuid from 'uuid'; -import { CreatePolicyInstance, PolicyInstance, PolicyTypeSchema } from '../../interfaces/policy.types'; -import { PolicyService } from '../../services/policy/policy.service'; -import { ErrorDialogService } from '../../services/ui/error-dialog.service'; -import { NotificationService } from './../../services/ui/notification.service'; -import { UiService } from '../../services/ui/ui.service'; -import { HttpErrorResponse } from '@angular/common/http'; -import { FormGroup, FormControl, Validators } from '@angular/forms'; -import { ChangeDetectorRef } from '@angular/core'; -import { Ric, Rics } from '../../interfaces/ric'; -import { TypedPolicyEditorComponent } from '../typed-policy-editor/typed-policy-editor.component'; - +import { + AfterViewInit, + ChangeDetectorRef, + Component, + Inject, + OnInit, +} from "@angular/core"; +import { + MatDialogConfig, + MatDialogRef, + MAT_DIALOG_DATA, +} from "@angular/material/dialog"; +import { PolicyService } from "@services/policy/policy.service"; +import { NotificationService } from "@services/ui/notification.service"; +import { UiService } from "@services/ui/ui.service"; +import { HttpErrorResponse } from "@angular/common/http"; +import { ErrorDialogService } from "@services/ui/error-dialog.service"; +import * as uuid from "uuid"; +import { + CreatePolicyInstance, + PolicyInstance, + PolicyTypeSchema, +} from "@interfaces/policy.types"; @Component({ - selector: 'nrcp-policy-instance-dialog', - templateUrl: './policy-instance-dialog.component.html', - styleUrls: ['./policy-instance-dialog.component.scss'] + selector: "nrcp-policy-instance-dialog", + templateUrl: "./policy-instance-dialog.component.html", + styleUrls: ["./policy-instance-dialog.component.scss"], }) export class PolicyInstanceDialogComponent implements OnInit, AfterViewInit { - @ViewChild(TypedPolicyEditorComponent) - policyEditor: TypedPolicyEditorComponent; - instanceForm: FormGroup; - - - ric: string; - allRics: Ric[]; - policyInstanceId: string; // null if not yet created - policyTypeName: string; - jsonSchemaObject: any = {}; - darkMode: boolean; + policyInstance = {} as CreatePolicyInstance; + policyJson: string; + jsonSchemaObject: any; + darkMode: boolean; + allRicIds: string[] = []; - private fetchRics() { - console.log('fetchRics ' + this.policyTypeName); - const self: PolicyInstanceDialogComponent = this; - this.dataService.getRics(this.policyTypeName).subscribe( - { - next(value: Rics) { - self.allRics = value.rics; - console.log(value); - } - }); - } - - constructor( - private cdr: ChangeDetectorRef, - private dataService: PolicyService, - private errorService: ErrorDialogService, - private notificationService: NotificationService, - @Inject(MAT_DIALOG_DATA) public data, - private dialogRef: MatDialogRef, - private ui: UiService) { - this.policyInstanceId = data.instanceId; - this.policyTypeName = data.name; - this.jsonSchemaObject = data.createSchema; - this.ric = data.ric; - } + constructor( + private cdr: ChangeDetectorRef, + public dialogRef: MatDialogRef, + private policySvc: PolicyService, + private errorService: ErrorDialogService, + private notificationService: NotificationService, + @Inject(MAT_DIALOG_DATA) private data, + private ui: UiService + ) { + this.policyInstance.policy_id = data.instanceId; + this.policyInstance.policytype_id = data.name; + this.policyInstance.policy_data = data.instanceJson; + this.policyJson = data.instanceJson; + this.jsonSchemaObject = data.createSchema; + this.policyInstance.ric_id = data.ric; + this.policyInstance.service_id = "controlpanel"; + } - ngOnInit() { - this.ui.darkModeState.subscribe((isDark) => { - this.darkMode = isDark; - }); - this.instanceForm = new FormGroup({ - 'ricSelector': new FormControl(this.ric, [ - Validators.required - ]) - }); - if (!this.policyInstanceId) { - this.fetchRics(); - } - } + ngOnInit() { + this.ui.darkModeState.subscribe((isDark) => { + this.darkMode = isDark; + }); + } - ngAfterViewInit() { - this.cdr.detectChanges(); - } + // Do not remove! Needed to avoid "Expression has changed after it was checked" warning + ngAfterViewInit() { + this.cdr.detectChanges(); + } - get ricSelector() { return this.instanceForm.get('ricSelector'); } + onSelectedRicChanged(newRic: string): void { + this.policyInstance.ric_id = newRic; + } - onSubmit() { - if (this.policyInstanceId == null) { - this.policyInstanceId = uuid.v4(); - } - const policyJson: string = this.policyEditor.prettyLiveFormData; - const self: PolicyInstanceDialogComponent = this; - let createPolicyInstance: CreatePolicyInstance = this.createPolicyInstance(policyJson); - this.dataService.putPolicy(createPolicyInstance).subscribe( - { - next(_) { - self.notificationService.success('Policy ' + self.policyTypeName + ':' + self.policyInstanceId + - ' submitted'); - self.dialogRef.close(); - }, - error(error: HttpErrorResponse) { - self.errorService.displayError('Submit failed: ' + error.error); - }, - complete() { } - }); - } + onJsonChanged(newJson: string): void { + this.policyInstance.policy_data = newJson ? JSON.parse(newJson) : null; + } - private createPolicyInstance(policyJson: string) { - let createPolicyInstance = {} as CreatePolicyInstance; - createPolicyInstance.policy_data = JSON.parse(policyJson); - createPolicyInstance.policy_id = this.policyInstanceId; - createPolicyInstance.policytype_id = this.policyTypeName; - createPolicyInstance.ric_id = (!this.ricSelector.value.ric_id) ? this.ric : this.ricSelector.value.ric_id; - createPolicyInstance.service_id = 'controlpanel'; - return createPolicyInstance; + onSubmit() { + if (this.policyInstance.policy_id == null) { + this.policyInstance.policy_id = uuid.v4(); } + const self: PolicyInstanceDialogComponent = this; + this.policySvc.putPolicy(this.policyInstance).subscribe({ + next(_) { + self.notificationService.success( + "Policy " + self.policyInstance.policy_id + " submitted" + ); + self.dialogRef.close(); + }, + error(error: HttpErrorResponse) { + self.errorService.displayError("Submit failed: " + error.error); + }, + complete() {}, + }); + } - onClose() { - this.dialogRef.close(); - } + typeHasSchema(): boolean { + return this.jsonSchemaObject !== "{}"; + } - get isJsonFormValid(): boolean { - return this.policyEditor ? this.policyEditor.formIsValid : false; - } + isFormValid(): boolean { + return ( + this.policyInstance.ric_id !== null && + this.policyInstance.policy_data !== null + ); + } } -export function getPolicyDialogProperties(policyTypeSchema: PolicyTypeSchema, instance: PolicyInstance, darkMode: boolean): MatDialogConfig { - const createSchema = policyTypeSchema.schemaObject; - const instanceId = instance ? instance.policy_id : null; - const instanceJson = instance ? instance.policy_data : null; - const name = policyTypeSchema.name; - const ric = instance ? instance.ric_id : null; - return { - maxWidth: '1200px', - maxHeight: '900px', - width: '900px', - role: 'dialog', - disableClose: false, - panelClass: darkMode ? 'dark-theme' : '', - data: { - createSchema, - instanceId, - instanceJson, - name, - ric - } - }; +export function getPolicyDialogProperties( + policyTypeSchema: PolicyTypeSchema, + instance: PolicyInstance, + darkMode: boolean +): MatDialogConfig { + const createSchema = policyTypeSchema.schemaObject; + const instanceId = instance ? instance.policy_id : null; + const instanceJson = instance ? instance.policy_data : null; + const name = policyTypeSchema.name; + const ric = instance ? instance.ric_id : null; + return { + maxWidth: "1200px", + maxHeight: "900px", + width: "900px", + role: "dialog", + disableClose: false, + panelClass: darkMode ? "dark-theme" : "", + data: { + createSchema, + instanceId, + instanceJson, + name, + ric, + }, + }; } -