webapp-frontend/src/app/policy/typed-policy-editor/typed-policy-editor.component.ts

   1 // -
   2 //   ========================LICENSE_START=================================
   3 //   O-RAN-SC
   4 //   %%
   5 //   Copyright (C) 2021: Nordix Foundation
   6 //   %%
   7 //   Licensed under the Apache License, Version 2.0 (the "License");
   8 //   you may not use this file except in compliance with the License.
   9 //   You may obtain a copy of the License at
  10 //
  11 //        http://www.apache.org/licenses/LICENSE-2.0
  12 //
  13 //   Unless required by applicable law or agreed to in writing, software
  14 //   distributed under the License is distributed on an "AS IS" BASIS,
  15 //   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  16 //   See the License for the specific language governing permissions and
  17 //   limitations under the License.
  18 //   ========================LICENSE_END===================================
  19 //
  20
  21 import { animate, state, style, transition, trigger } from '@angular/animations';
  22 import { Component, Input, OnInit } from '@angular/core';
  23 import { JsonPointer } from 'angular6-json-schema-form';
  24
  25 @Component({
  26   selector: "nrcp-typed-policy-editor",
  27   templateUrl: "./typed-policy-editor.component.html",
  28   styleUrls: ["./typed-policy-editor.component.scss"],
  29   animations: [
  30     trigger("expandSection", [
  31       state("in", style({ height: "*" })),
  32       transition(":enter", [style({ height: 0 }), animate(100)]),
  33       transition(":leave", [
  34         style({ height: "*" }),
  35         animate(100, style({ height: 0 })),
  36       ]),
  37     ]),
  38   ],
  39 })
  40 export class TypedPolicyEditorComponent implements OnInit {
  41   jsonFormOptions: any = {
  42     addSubmit: false, // Add a submit button if layout does not have one
  43     debug: false, // Don't show inline debugging information
  44     loadExternalAssets: false, // Load external css and JavaScript for frameworks
  45     returnEmptyFields: false, // Don't return values for empty input fields
  46     setSchemaDefaults: true, // Always use schema defaults for empty fields
  47     defautWidgetOptions: { feedback: true }, // Show inline feedback icons
  48   };
  49
  50   @Input() jsonSchemaObject: any = {};
  51   @Input() jsonObject: any = {};
  52   @Input() darkMode: boolean;
  53
  54   isVisible = {
  55     form: true,
  56     json: false,
  57     schema: false,
  58   };
  59   liveFormData: any = {};
  60   formIsValid: boolean = false;
  61   formValidationErrors: any;
  62
  63   constructor() {}
  64
  65   ngOnInit(): void {}
  66
  67   public onChanges(formData: any) {
  68     this.liveFormData = formData;
  69   }
  70
  71   get prettyLiveFormData(): string {
  72     return JSON.stringify(this.liveFormData, null, 2);
  73   }
  74
  75   get schemaAsString(): string {
  76     return JSON.stringify(this.jsonSchemaObject, null, 2);
  77   }
  78
  79   get jsonAsString(): string {
  80     return JSON.stringify(this.jsonObject, null, 2);
  81   }
  82
  83   isValid(isValid: boolean): void {
  84     this.formIsValid = isValid;
  85   }
  86
  87   validationErrors(validationErrors: any): void {
  88     this.formValidationErrors = validationErrors;
  89   }
  90
  91   get prettyValidationErrors() {
  92     if (!this.formValidationErrors) {
  93       return null;
  94     }
  95     const errorArray = [];
  96     for (const error of this.formValidationErrors) {
  97       const message = error.message;
  98       const dataPathArray = JsonPointer.parse(error.dataPath);
  99       if (dataPathArray.length) {
 100         let field = dataPathArray[0];
 101         for (let i = 1; i < dataPathArray.length; i++) {
 102           const key = dataPathArray[i];
 103           field += /^\d+$/.test(key) ? `[${key}]` : `.${key}`;
 104         }
 105         errorArray.push(`${field}: ${message}`);
 106       } else {
 107         errorArray.push(message);
 108       }
 109     }
 110     return errorArray.join("<br>");
 111   }
 112
 113   public toggleVisible(item: string) {
 114     this.isVisible[item] = !this.isVisible[item];
 115   }
 116 }