diff options
Diffstat (limited to 'catalog-ui')
13 files changed, 198 insertions, 8 deletions
diff --git a/catalog-ui/src/app/models/properties-inputs/derived-fe-property.ts b/catalog-ui/src/app/models/properties-inputs/derived-fe-property.ts index c2ea1ecbdf..7ca1fee21d 100644 --- a/catalog-ui/src/app/models/properties-inputs/derived-fe-property.ts +++ b/catalog-ui/src/app/models/properties-inputs/derived-fe-property.ts @@ -45,7 +45,8 @@ export class DerivedFEProperty extends PropertyBEModel { canBeDeclared: boolean; mapKey: string; mapKeyError: string; - mapInlist: boolean; + mapInlist: boolean + inputName: string; parentMapKey: string; constructor(property: PropertyBEModel, parentName?: string, createChildOfListOrMap?: boolean, key?:string, value?:any) { @@ -69,7 +70,7 @@ export class DerivedFEProperty extends PropertyBEModel { this.parentName = parentName; this.propertiesName = parentName + '#' + this.name; - if (property.type == PROPERTY_TYPES.LIST) { + if (property.type == PROPERTY_TYPES.LIST) { let parentKey : string = null; if(property.value != null) { const valueJson = JSON.parse(property.value); @@ -128,6 +129,7 @@ export class DerivedFEProperty extends PropertyBEModel { // this.constraints = property ? property.constraints : null; this.valueObjIsValid = true; this.derivedDataType = this.getDerivedPropertyType(); + this.inputName = property.inputName; } public getActualMapKey() { diff --git a/catalog-ui/src/app/models/properties-inputs/property-be-model.ts b/catalog-ui/src/app/models/properties-inputs/property-be-model.ts index ae72977b80..e4c0f8165c 100644 --- a/catalog-ui/src/app/models/properties-inputs/property-be-model.ts +++ b/catalog-ui/src/app/models/properties-inputs/property-be-model.ts @@ -69,6 +69,7 @@ export class PropertyBEModel { parentPropertyType: string; subPropertyInputPath: string; inputPath: string; + inputName: string; toscaPresentation: ToscaPresentationData; metadata: Metadata; propertyConstraints: any; @@ -103,6 +104,7 @@ export class PropertyBEModel { this.toscaPresentation = property.toscaPresentation; this.getPolicyValues = property.getPolicyValues; this.inputPath = property.inputPath; + this.inputName = property.inputName; this.metadata = property.metadata; if (property.toscaFunction) { this.toscaFunction = property.toscaFunction; diff --git a/catalog-ui/src/app/models/properties-inputs/property-declare-api-model.ts b/catalog-ui/src/app/models/properties-inputs/property-declare-api-model.ts index 5b1c12091b..84970ad0f9 100644 --- a/catalog-ui/src/app/models/properties-inputs/property-declare-api-model.ts +++ b/catalog-ui/src/app/models/properties-inputs/property-declare-api-model.ts @@ -25,6 +25,7 @@ import { PropertyBEModel, PropertyFEModel, DerivedFEProperty } from "../../model export class PropertyDeclareAPIModel extends PropertyBEModel{ input: PropertyBEModel; propertiesName: string; + inputName: string; constructor(property: PropertyFEModel, childProperty?: DerivedFEProperty) { @@ -32,6 +33,7 @@ export class PropertyDeclareAPIModel extends PropertyBEModel{ if (childProperty) { this.input = childProperty; this.propertiesName = childProperty.propertiesName; + this.inputName = childProperty.inputName; } } diff --git a/catalog-ui/src/app/modules/directive-module.ts b/catalog-ui/src/app/modules/directive-module.ts index adc88cbc6d..40e701aa35 100644 --- a/catalog-ui/src/app/modules/directive-module.ts +++ b/catalog-ui/src/app/modules/directive-module.ts @@ -99,6 +99,7 @@ import {ToscaFunctionComponent} from '../ng2/pages/properties-assignment/tosca-f import {ConstraintsComponent} from '../ng2/pages/properties-assignment/constraints/constraints.component'; import {TypeWorkspaceComponent} from "../ng2/pages/type-workspace/type-workspace.component"; import {TypeWorkspaceGeneralComponent} from "../ng2/pages/type-workspace/type-workspace-general/type-workspace-general.component"; +import {DeclareInputComponent} from "../ng2/pages/properties-assignment/declare-input/declare-input.component"; let moduleName: string = 'Sdc.Directives'; let directiveModule: ng.IModule = angular.module(moduleName, []); @@ -342,3 +343,9 @@ directiveModule.directive('appTypeWorkspaceGeneral', downgradeComponent({ inputs: [], outputs: [] }) as angular.IDirectiveFactory); + +directiveModule.directive('declareInput', downgradeComponent({ + component: DeclareInputComponent, + inputs: ['property'], + outputs: [] +}) as angular.IDirectiveFactory); diff --git a/catalog-ui/src/app/ng2/app.module.ts b/catalog-ui/src/app/ng2/app.module.ts index 1e23bb6c4e..0c5b10f1e4 100644 --- a/catalog-ui/src/app/ng2/app.module.ts +++ b/catalog-ui/src/app/ng2/app.module.ts @@ -110,6 +110,7 @@ import {ModelService} from "./services/model.service"; import {ToscaArtifactService} from "./services/tosca-artifact.service"; import {InterfaceDefinitionModule} from "./pages/interface-definition/interface-definition.module"; import {TypeWorkspaceModule} from "./pages/type-workspace/type-workspace.module"; +import {DeclareInputModule} from "./pages/properties-assignment/declare-input/declare-input.module"; declare const __ENV__: string; @@ -158,6 +159,7 @@ export function configServiceFactory(config: ConfigService, authService: Authent PropertiesAssignmentModule, AttributesOutputsModule, PropertyCreatorModule, + DeclareInputModule, DeclareListModule, ToscaFunctionModule, ConstraintsModule, diff --git a/catalog-ui/src/app/ng2/pages/properties-assignment/declare-input/declare-input.component.html b/catalog-ui/src/app/ng2/pages/properties-assignment/declare-input/declare-input.component.html new file mode 100644 index 0000000000..19b23598fa --- /dev/null +++ b/catalog-ui/src/app/ng2/pages/properties-assignment/declare-input/declare-input.component.html @@ -0,0 +1,22 @@ +<!-- + ~ ============LICENSE_START======================================================= + ~ Copyright (C) 2023 Nordix Foundation + ~ ================================================================================ + ~ Licensed under the Apache License, Version 2.0 (the "License"); + ~ you may not use this file except in compliance with the License. + ~ You may obtain a copy of the License at + ~ + ~ http://www.apache.org/licenses/LICENSE-2.0 + ~ Unless required by applicable law or agreed to in writing, software + ~ distributed under the License is distributed on an "AS IS" BASIS, + ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + ~ See the License for the specific language governing permissions and + ~ limitations under the License. + ~ + ~ SPDX-License-Identifier: Apache-2.0 + ~ ============LICENSE_END========================================================= + --> + +<div class="declare-input"> + <input id="myText" type="text" (keyup)="setInputName($event)"/> +</div> diff --git a/catalog-ui/src/app/ng2/pages/properties-assignment/declare-input/declare-input.component.spec.ts b/catalog-ui/src/app/ng2/pages/properties-assignment/declare-input/declare-input.component.spec.ts new file mode 100644 index 0000000000..c3fa1f506f --- /dev/null +++ b/catalog-ui/src/app/ng2/pages/properties-assignment/declare-input/declare-input.component.spec.ts @@ -0,0 +1,43 @@ +/* + * ============LICENSE_START======================================================= + * Copyright (C) 2023 Nordix Foundation + * ================================================================================ + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + * + * SPDX-License-Identifier: Apache-2.0 + * ============LICENSE_END========================================================= + */ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { DeclareInputComponent } from './declare-input.component'; + +describe('DeclareInputComponent', () => { + let component: DeclareInputComponent; + let fixture: ComponentFixture<DeclareInputComponent>; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ DeclareInputComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(DeclareInputComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/catalog-ui/src/app/ng2/pages/properties-assignment/declare-input/declare-input.component.ts b/catalog-ui/src/app/ng2/pages/properties-assignment/declare-input/declare-input.component.ts new file mode 100644 index 0000000000..d156383f6b --- /dev/null +++ b/catalog-ui/src/app/ng2/pages/properties-assignment/declare-input/declare-input.component.ts @@ -0,0 +1,40 @@ +/* + * ============LICENSE_START======================================================= + * Copyright (C) 2023 Nordix Foundation + * ================================================================================ + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + * + * SPDX-License-Identifier: Apache-2.0 + * ============LICENSE_END========================================================= + */ +import {Component, Input, OnInit} from '@angular/core'; +import {FormControl, FormGroup} from "@angular/forms"; + +@Component({ + selector: 'declare-input', + templateUrl: './declare-input.component.html' +}) +export class DeclareInputComponent implements OnInit { + inputNameForm: FormControl = new FormControl(undefined); + formGroup: FormGroup = new FormGroup({ + 'inputName': this.inputNameForm, + }); + inputName: string; + constructor() { } + ngOnInit() { + } + setInputName(event) { + this.inputName = event.target.value; + this.inputNameForm.setValue(this.inputName); + } + +} diff --git a/catalog-ui/src/app/ng2/pages/properties-assignment/declare-input/declare-input.module.ts b/catalog-ui/src/app/ng2/pages/properties-assignment/declare-input/declare-input.module.ts new file mode 100644 index 0000000000..0dae0a2421 --- /dev/null +++ b/catalog-ui/src/app/ng2/pages/properties-assignment/declare-input/declare-input.module.ts @@ -0,0 +1,36 @@ +/* + * ============LICENSE_START======================================================= + * Copyright (C) 2023 Nordix Foundation + * ================================================================================ + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + * + * SPDX-License-Identifier: Apache-2.0 + * ============LICENSE_END========================================================= + */ +import { NgModule } from '@angular/core'; +import { CommonModule } from '@angular/common'; +import { FormsModule } from '@angular/forms'; +import {DeclareInputComponent} from "./declare-input.component"; + +@NgModule({ + imports: [ + CommonModule, + FormsModule + ], + declarations: [DeclareInputComponent], + exports: [DeclareInputComponent], + entryComponents: [ + DeclareInputComponent + ], +}) + +export class DeclareInputModule { } diff --git a/catalog-ui/src/app/ng2/pages/properties-assignment/properties-assignment.page.component.html b/catalog-ui/src/app/ng2/pages/properties-assignment/properties-assignment.page.component.html index 1eed6dfba1..36d316ee5d 100644 --- a/catalog-ui/src/app/ng2/pages/properties-assignment/properties-assignment.page.component.html +++ b/catalog-ui/src/app/ng2/pages/properties-assignment/properties-assignment.page.component.html @@ -78,12 +78,12 @@ <span class="sprite search-icon" data-tests-id="search-button"></span> <filter-properties-assignment *ngIf="isPropertiesTabSelected" #advanceSearch class="advance-search" [componentType]="component.componentType" (searchProperties)="searchPropertiesInstances($event)"></filter-properties-assignment> </div> - <button (click)="selectToscaFunctionAndValues()" + <button (click)="openToscaGetFunctionModal()" *ngIf="isPropertiesTabSelected && !isSelf()" [disabled]="(checkedPropertiesCount != 1 || isReadonly || hasChangedData) && !enableToscaFunction" class="tlv-btn blue declare-button" data-tests-id="declare-button select-tosca-function">{{'TOSCA_FUNCTION_LABEL' | translate}}</button> - <button class="tlv-btn blue declare-button" [disabled]="!checkedPropertiesCount || isReadonly || hasChangedData" (click)="declareProperties()" data-tests-id="declare-button declare-input">Declare Input</button> + <button class="tlv-btn blue declare-button" [disabled]="!checkedPropertiesCount || isReadonly || hasChangedData" (click)="openAddInputNameAndDeclareInputModal()" data-tests-id="declare-button declare-input">Declare Input</button> <button class="tlv-btn blue declare-button" [disabled]="!checkedPropertiesCount || isReadonly || hasChangedData || isSelf()" (click)="declarePropertiesToPolicies()" data-tests-id="declare-button declare-policy">Declare Policy</button> <button class="tlv-btn blue declare-button" [disabled]="!checkedPropertiesCount || checkedChildPropertiesCount || isReadonly || hasChangedData" (click)="declareListProperties()" data-tests-id="declare-but($event)ton declare-list-input">Create List Input</button> </div> diff --git a/catalog-ui/src/app/ng2/pages/properties-assignment/properties-assignment.page.component.ts b/catalog-ui/src/app/ng2/pages/properties-assignment/properties-assignment.page.component.ts index a1e4f415be..2592227afa 100644 --- a/catalog-ui/src/app/ng2/pages/properties-assignment/properties-assignment.page.component.ts +++ b/catalog-ui/src/app/ng2/pages/properties-assignment/properties-assignment.page.component.ts @@ -70,6 +70,7 @@ import {Observable} from "rxjs"; import {TranslateService} from "../../shared/translator/translate.service"; import {ToscaFunction} from "../../../models/tosca-function"; import {SubPropertyToscaFunction} from "../../../models/sub-property-tosca-function"; +import {DeclareInputComponent} from "./declare-input/declare-input.component"; const SERVICE_SELF_TITLE = "SELF"; @Component({ @@ -728,7 +729,7 @@ export class PropertiesAssignmentComponent { } /*** DECLARE PROPERTIES/INPUTS ***/ - declareProperties = (): void => { + declareInputFromProperties = (inputName:string): void => { console.debug("==>" + this.constructor.name + ": declareProperties"); let selectedComponentInstancesProperties: InstanceBePropertiesMap = new InstanceBePropertiesMap(); @@ -743,6 +744,9 @@ export class PropertiesAssignmentComponent { if (!this.isInput(selectedInstanceData.originType)) { // convert Property FE model -> Property BE model, extract only checked selectedComponentInstancesProperties[instanceId] = this.propertiesService.getCheckedProperties(this.instanceFePropertiesMap[instanceId]); + if (inputName) { + selectedComponentInstancesProperties[instanceId][0].inputName = inputName; + } } else { selectedComponentInstancesInputs[instanceId] = this.propertiesService.getCheckedProperties(this.instanceFePropertiesMap[instanceId]); } @@ -801,6 +805,37 @@ export class PropertiesAssignmentComponent { }, error => {}); //ignore error }; + private openAddInputNameAndDeclareInputModal = (): void => { + const modalTitle = this.translateService.translate('ADD_INPUT_NAME_TO_DECLARE'); + const modalButtons = []; + const modal = this.modalService.createCustomModal(new ModalModel( + 'sm', + modalTitle, + null, + modalButtons, + null /* type */ + )); + modalButtons.push(new ButtonModel(this.translateService.translate('MODAL_SAVE'), 'blue', + () => { + const inputName: string = modal.instance.dynamicContent.instance.inputNameForm.value; + if (inputName) { + this.declareInputFromProperties(inputName); + } else { + this.notification.warning({ + message: 'Failed to set input name', + title: 'Warning' + }); + } + this.modalService.closeCurrentModal(); + } + )); + modalButtons.push(new ButtonModel(this.translateService.translate('MODAL_CANCEL'), 'outline grey', () => { + this.modalService.closeCurrentModal(); + })); + this.modalService.addDynamicContentToModal(modal, DeclareInputComponent, {}); + modal.instance.open(); + } + declareListProperties = (): void => { // get selected properties let selectedComponentInstancesProperties: InstanceBePropertiesMap = new InstanceBePropertiesMap(); diff --git a/catalog-ui/src/app/ng2/pages/properties-assignment/services/properties.utils.ts b/catalog-ui/src/app/ng2/pages/properties-assignment/services/properties.utils.ts index 0b984ac2a4..bc5345c386 100644 --- a/catalog-ui/src/app/ng2/pages/properties-assignment/services/properties.utils.ts +++ b/catalog-ui/src/app/ng2/pages/properties-assignment/services/properties.utils.ts @@ -65,9 +65,6 @@ export class PropertiesUtils { newFEProp.updateExpandedChildPropertyId(newFEProp.name); //display only the first level of children this.dataTypeService.checkForCustomBehavior(newFEProp); - if (newFEProp.isToscaFunction()) { - return; - } //if this prop (or any children) are declared, set isDeclared and disable checkbox on parents/children if (newFEProp.getInputValues && newFEProp.getInputValues.length) { newFEProp.getInputValues.forEach(propInputDetail => { diff --git a/catalog-ui/src/assets/languages/en_US.json b/catalog-ui/src/assets/languages/en_US.json index 58288840d6..18813280d6 100644 --- a/catalog-ui/src/assets/languages/en_US.json +++ b/catalog-ui/src/assets/languages/en_US.json @@ -518,6 +518,8 @@ "=========== PROPERTIES ASSIGNMENT DECLARE AS POLICY ===========": "", "DELETE_POLICY_TITLE": "Delete Policy", "DELETE_POLICY_MSG": "Are you sure you want to delete policy '{{policyName}}'?", + "=========== PROPERTIES ASSIGNMENT DECLARE AS INPUT ===========": "", + "ADD_INPUT_NAME_TO_DECLARE": "Enter name of input to be created", "=========== PROPERTIES ASSIGNMENT TOSCA FUNCTION BUTTON ===========": "", "TOSCA_FUNCTION_LABEL": "TOSCA function", "TOSCA_FUNCTION_PROPERTY_SOURCE_LABEL": "Property Source", |