diff options
Diffstat (limited to 'catalog-ui/src/app/ng2')
8 files changed, 181 insertions, 6 deletions
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 => { |