catalog-ui/src/app/ng2/pages/composition/interface-operatons/operation-creator/interface-operation-handler.component.ts

   1 /*
   2 * ============LICENSE_START=======================================================
   3 * SDC
   4 * ================================================================================
   5 *  Copyright (C) 2021 Nordix Foundation. All rights reserved.
   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 *  Unless required by applicable law or agreed to in writing, software
  13 *  distributed under the License is distributed on an "AS IS" BASIS,
  14 *  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  15 *  See the License for the specific language governing permissions and
  16 *  limitations under the License.
  17 *
  18 *  SPDX-License-Identifier: Apache-2.0
  19 *  ============LICENSE_END=========================================================
  20 */
  21
  22 import {Component, EventEmitter, Output} from '@angular/core';
  23 import {UIInterfaceModel} from "../interface-operations.component";
  24 import {
  25     InputOperationParameter,
  26     InterfaceOperationModel,
  27     IOperationParamsList
  28 } from "../../../../../models/interfaceOperation";
  29 import {TranslateService} from "../../../../shared/translator/translate.service";
  30 import {IDropDownOption} from "onap-ui-angular/dist/form-elements/dropdown/dropdown-models";
  31 import {DropdownValue} from "../../../../components/ui/form-components/dropdown/ui-element-dropdown.component";
  32 import {ArtifactModel} from "../../../../../models/artifacts";
  33 import {PropertyBEModel} from "../../../../../models/properties-inputs/property-be-model";
  34 import {PropertyParamRowComponent} from "./property-param-row/property-param-row.component";
  35 import {PropertyFEModel} from "../../../../../models/properties-inputs/property-fe-model";
  36
  37 @Component({
  38     selector: 'operation-handler',
  39     templateUrl: './interface-operation-handler.component.html',
  40     styleUrls: ['./interface-operation-handler.component.less'],
  41     providers: [TranslateService]
  42 })
  43
  44 export class InterfaceOperationHandlerComponent {
  45     @Output('propertyChanged') emitter: EventEmitter<PropertyFEModel> = new EventEmitter<PropertyFEModel>();
  46
  47     input: {
  48         toscaArtifactTypes: Array<DropdownValue>;
  49         selectedInterface: UIInterfaceModel;
  50         selectedInterfaceOperation: InterfaceOperationModel;
  51         validityChangedCallback: Function;
  52     };
  53
  54     interfaceType: string;
  55     artifactVersion: string;
  56     artifactName: string;
  57     interfaceOperationName: string;
  58     operationToUpdate: InterfaceOperationModel;
  59     inputs: Array<InputOperationParameter> = [];
  60     properties: Array<PropertyParamRowComponent> = [];
  61     isLoading: boolean = false;
  62     readonly: boolean;
  63
  64     toscaArtifactTypeSelected: string;
  65     toscaArtifactTypeProperties: Array<PropertyBEModel> = [];
  66
  67     toscaArtifactTypes: Array<DropdownValue> = [];
  68
  69     enableAddArtifactImplementation: boolean;
  70
  71     ngOnInit() {
  72         this.interfaceType = this.input.selectedInterface.displayType();
  73         this.operationToUpdate = new InterfaceOperationModel(this.input.selectedInterfaceOperation);
  74         this.operationToUpdate.interfaceId = this.input.selectedInterface.uniqueId;
  75         this.operationToUpdate.interfaceType = this.input.selectedInterface.type;
  76         if (!this.operationToUpdate.inputs) {
  77             this.operationToUpdate.inputs = new class implements IOperationParamsList {
  78                 listToscaDataDefinition: Array<InputOperationParameter> = [];
  79             }
  80         }
  81
  82         this.inputs = this.operationToUpdate.inputs.listToscaDataDefinition;
  83         this.removeImplementationQuote();
  84         this.validityChanged();
  85         this.loadInterfaceOperationImplementation();
  86     }
  87
  88     private loadInterfaceOperationImplementation() {
  89         this.toscaArtifactTypes = this.input.toscaArtifactTypes;
  90         this.artifactVersion = this.operationToUpdate.implementation.artifactVersion;
  91         this.artifactName = this.operationToUpdate.implementation.artifactName;
  92         this.toscaArtifactTypeProperties = this.operationToUpdate.implementation.properties;
  93         this.getArtifactTypesSelected();
  94     }
  95
  96     onDescriptionChange= (value: any): void => {
  97         this.operationToUpdate.description = value;
  98     }
  99
 100     onImplementationNameChange(value: any) {
 101         this.readonly = true
 102         if (value) {
 103             let artifact = new ArtifactModel();
 104             artifact.artifactName = value;
 105             this.operationToUpdate.implementation = artifact;
 106             this.enableAddArtifactImplementation = false;
 107             this.readonly = false;
 108         }
 109     }
 110
 111     onPropertyValueChange = (propertyValue) => {
 112         this.emitter.emit(propertyValue);
 113     }
 114
 115     onMarkToAddArtifactToImplementation(event: any) {
 116         if (!event) {
 117             this.toscaArtifactTypeSelected = undefined;
 118             this.artifactVersion = undefined;
 119             if (this.operationToUpdate.implementation.artifactType) {
 120                 this.artifactName = undefined;
 121             }
 122             this.toscaArtifactTypeProperties = undefined;
 123         } else {
 124             this.getArtifactTypesSelected();
 125         }
 126         this.enableAddArtifactImplementation = event;
 127         this.validateRequiredField();
 128     }
 129
 130     onSelectToscaArtifactType(type: IDropDownOption) {
 131         if (type) {
 132             let toscaArtifactType = type.value;
 133             let artifact = new ArtifactModel();
 134             this.artifactName = undefined;
 135             this.artifactVersion = undefined;
 136             artifact.artifactType = toscaArtifactType.type;
 137             artifact.properties = toscaArtifactType.properties;
 138             this.toscaArtifactTypeProperties = artifact.properties;
 139             this.toscaArtifactTypeSelected = artifact.artifactType;
 140             this.operationToUpdate.implementation = artifact;
 141             this.getArtifactTypesSelected();
 142         }
 143         this.validateRequiredField();
 144     }
 145
 146     onArtifactFileChange(value: any) {
 147         if (value) {
 148             this.operationToUpdate.implementation.artifactName = value;
 149         }
 150         this.validateRequiredField();
 151     }
 152
 153     onArtifactVersionChange(value: any) {
 154         if (value) {
 155             this.operationToUpdate.implementation.artifactVersion = value;
 156         }
 157     }
 158
 159     onAddInput(inputOperationParameter?: InputOperationParameter): void {
 160         let newInput = new InputOperationParameter(inputOperationParameter)
 161         newInput.type = "string";
 162         newInput.inputId = this.generateUniqueId();
 163         this.inputs.push(newInput);
 164         this.validityChanged();
 165     }
 166
 167     propertyValueValidation = (propertyValue): void => {
 168         this.onPropertyValueChange(propertyValue);
 169         this.readonly = !propertyValue.isValid;
 170     }
 171
 172     onRemoveInput = (inputParam: InputOperationParameter): void => {
 173         let index = this.inputs.indexOf(inputParam);
 174         this.inputs.splice(index, 1);
 175         this.validityChanged();
 176     }
 177
 178     private removeImplementationQuote(): void {
 179         if (this.operationToUpdate.implementation) {
 180             if (!this.operationToUpdate.implementation
 181                 || !this.operationToUpdate.implementation.artifactName) {
 182                 return;
 183             }
 184
 185             let implementation = this.operationToUpdate.implementation.artifactName.trim();
 186
 187             if (implementation.startsWith("'") && implementation.endsWith("'")) {
 188                 this.operationToUpdate.implementation.artifactName = implementation.slice(1, -1);
 189             }
 190         }
 191     }
 192
 193     private generateUniqueId = (): string => {
 194         let result = '';
 195         const characters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
 196         const charactersLength = characters.length;
 197         for (let i = 0; i < 36; i++ ) {
 198             result += characters.charAt(Math.floor(Math.random() * charactersLength));
 199         }
 200         return result;
 201     }
 202
 203     validityChanged = () => {
 204         let validState = this.checkFormValidForSubmit();
 205         this.input.validityChangedCallback(validState);
 206         if (validState) {
 207             this.readonly = false;
 208         }
 209     }
 210
 211     private getArtifactTypesSelected() {
 212         if (this.operationToUpdate.implementation && this.operationToUpdate.implementation.artifactType) {
 213             this.artifactName = this.operationToUpdate.implementation.artifactName;
 214             this.toscaArtifactTypeSelected = this.operationToUpdate.implementation.artifactType;
 215             this.artifactVersion = this.operationToUpdate.implementation.artifactVersion;
 216             this.toscaArtifactTypeProperties = this.operationToUpdate.implementation.properties;
 217             this.enableAddArtifactImplementation = true;
 218         }
 219         this.validateRequiredField();
 220     }
 221
 222     validateRequiredField = () => {
 223         this.readonly = true;
 224         let requiredFieldSelected = this.toscaArtifactTypeSelected && this.artifactName ? true : false;
 225         this.input.validityChangedCallback(requiredFieldSelected);
 226         if (requiredFieldSelected) {
 227             this.readonly = false;
 228         }
 229     }
 230
 231     private checkFormValidForSubmit = (): boolean => {
 232         return this.operationToUpdate.name && this.isParamsValid();
 233     }
 234
 235     private isParamsValid = (): boolean => {
 236         const isInputValid = (input) => input.name && input.inputId;
 237         const isValid = this.inputs.every(isInputValid);
 238         if (!isValid) {
 239             this.readonly = true;
 240         }
 241         return isValid;
 242     }
 243
 244     toDropDownOption(val: string) {
 245         return { value : val, label: val };
 246     }
 247
 248 }