X-Git-Url: https://gerrit.o-ran-sc.org/r/gitweb?a=blobdiff_plain;f=webapp-frontend%2Fsrc%2Fapp%2Fpolicy%2Ftyped-policy-editor%2Ftyped-policy-editor.component.ts;h=f9651a40ee6d9f97360131881f8f97d8c21f1361;hb=042a087cf3eea5e6f941ee9add6e1c50cb106e91;hp=d05c78ffc613758c8b8bce4190c274dd93cb79f8;hpb=b3f060ed6175d6dab20e16f51cb96a8ed02a6fc2;p=portal%2Fnonrtric-controlpanel.git diff --git a/webapp-frontend/src/app/policy/typed-policy-editor/typed-policy-editor.component.ts b/webapp-frontend/src/app/policy/typed-policy-editor/typed-policy-editor.component.ts index d05c78f..f9651a4 100644 --- a/webapp-frontend/src/app/policy/typed-policy-editor/typed-policy-editor.component.ts +++ b/webapp-frontend/src/app/policy/typed-policy-editor/typed-policy-editor.component.ts @@ -19,110 +19,98 @@ // import { animate, state, style, transition, trigger } from '@angular/animations'; -import { ChangeDetectorRef, Component, Input, OnInit } from '@angular/core'; +import { Component, Input, OnInit } from '@angular/core'; import { JsonPointer } from 'angular6-json-schema-form'; @Component({ - selector: 'nrcp-typed-policy-editor', - templateUrl: './typed-policy-editor.component.html', - styleUrls: ['./typed-policy-editor.component.scss'], - animations: [ - trigger('expandSection', [ - state('in', style({ height: '*' })), - transition(':enter', [ - style({ height: 0 }), animate(100), - ]), - transition(':leave', [ - style({ height: '*' }), - animate(100, style({ height: 0 })), - ]), - ]), - ], - + selector: "nrcp-typed-policy-editor", + templateUrl: "./typed-policy-editor.component.html", + styleUrls: ["./typed-policy-editor.component.scss"], + animations: [ + trigger("expandSection", [ + state("in", style({ height: "*" })), + transition(":enter", [style({ height: 0 }), animate(100)]), + transition(":leave", [ + style({ height: "*" }), + animate(100, style({ height: 0 })), + ]), + ]), + ], }) export class TypedPolicyEditorComponent implements OnInit { - jsonFormOptions: any = { - addSubmit: false, // Add a submit button if layout does not have one - debug: false, // Don't show inline debugging information - loadExternalAssets: false, // Load external css and JavaScript for frameworks - returnEmptyFields: false, // Don't return values for empty input fields - setSchemaDefaults: true, // Always use schema defaults for empty fields - defautWidgetOptions: { feedback: true }, // Show inline feedback icons - }; - - @Input() jsonSchemaObject: any = {}; - @Input() jsonObject: any = {}; - @Input() darkMode: boolean; - - isVisible = { - form: true, - json: false, - schema: false - }; - formActive: boolean = false; - jsonFormStatusMessage: string = 'Loading form...'; - liveFormData: any = {}; - formIsValid: boolean = false; - formValidationErrors: any; - - constructor( - private cdr: ChangeDetectorRef) { - this.formActive = false; - } - - ngOnInit(): void { - this.formActive = true; - } - - ngAfterViewInit() { - this.cdr.detectChanges(); - } - - public onChanges(formData: any) { - this.liveFormData = formData; - } - - get prettyLiveFormData(): string { - return JSON.stringify(this.liveFormData, null, 2); - } - - get schemaAsString(): string { - return JSON.stringify(this.jsonSchemaObject, null, 2); + jsonFormOptions: any = { + addSubmit: false, // Add a submit button if layout does not have one + debug: false, // Don't show inline debugging information + loadExternalAssets: false, // Load external css and JavaScript for frameworks + returnEmptyFields: false, // Don't return values for empty input fields + setSchemaDefaults: true, // Always use schema defaults for empty fields + defautWidgetOptions: { feedback: true }, // Show inline feedback icons + }; + + @Input() jsonSchemaObject: any = {}; + @Input() jsonObject: any = {}; + @Input() darkMode: boolean; + + isVisible = { + form: true, + json: false, + schema: false, + }; + liveFormData: any = {}; + formIsValid: boolean = false; + formValidationErrors: any; + + constructor() {} + + ngOnInit(): void {} + + public onChanges(formData: any) { + this.liveFormData = formData; + } + + get prettyLiveFormData(): string { + return JSON.stringify(this.liveFormData, null, 2); + } + + get schemaAsString(): string { + return JSON.stringify(this.jsonSchemaObject, null, 2); + } + + get jsonAsString(): string { + return JSON.stringify(this.jsonObject, null, 2); + } + + isValid(isValid: boolean): void { + this.formIsValid = isValid; + } + + validationErrors(validationErrors: any): void { + this.formValidationErrors = validationErrors; + } + + get prettyValidationErrors() { + if (!this.formValidationErrors) { + return null; } - - get jsonAsString(): string { - return JSON.stringify(this.jsonObject, null, 2); - } - - isValid(isValid: boolean): void { - this.formIsValid = isValid; - } - - validationErrors(validationErrors: any): void { - this.formValidationErrors = validationErrors; - } - - get prettyValidationErrors() { - if (!this.formValidationErrors) { return null; } - const errorArray = []; - for (const error of this.formValidationErrors) { - const message = error.message; - const dataPathArray = JsonPointer.parse(error.dataPath); - if (dataPathArray.length) { - let field = dataPathArray[0]; - for (let i = 1; i < dataPathArray.length; i++) { - const key = dataPathArray[i]; - field += /^\d+$/.test(key) ? `[${key}]` : `.${key}`; - } - errorArray.push(`${field}: ${message}`); - } else { - errorArray.push(message); - } + const errorArray = []; + for (const error of this.formValidationErrors) { + const message = error.message; + const dataPathArray = JsonPointer.parse(error.dataPath); + if (dataPathArray.length) { + let field = dataPathArray[0]; + for (let i = 1; i < dataPathArray.length; i++) { + const key = dataPathArray[i]; + field += /^\d+$/.test(key) ? `[${key}]` : `.${key}`; } - return errorArray.join('
'); + errorArray.push(`${field}: ${message}`); + } else { + errorArray.push(message); + } } + return errorArray.join("
"); + } - public toggleVisible(item: string) { - this.isVisible[item] = !this.isVisible[item]; - } + public toggleVisible(item: string) { + this.isVisible[item] = !this.isVisible[item]; + } }