From 6d65fde29c1859a7099d91ed0e8911bcb1823a38 Mon Sep 17 00:00:00 2001 From: KrupaNagabhushan Date: Tue, 12 Jan 2021 13:41:59 +0000 Subject: Allow property to take its value from defined input list Issue-ID: SDC-3547 Change-Id: Ic438e8f8943d0f1c656e386611b88b25f879e83b Signed-off-by: KrupaNagabhushan Signed-off-by: andre.schmid --- .../models/properties-inputs/property-be-model.ts | 20 +- .../properties-inputs/property-input-detail.ts | 1 + .../src/app/models/tosca-get-function-type.enum.ts | 24 ++ catalog-ui/src/app/ng2/app.module.ts | 2 + .../dynamic-property.component.html | 21 +- .../dynamic-property/dynamic-property.component.ts | 2 +- .../input-list/input-list.component.html | 31 ++ .../input-list/input-list.component.less | 43 ++ .../input-list/input-list.component.ts | 67 ++++ .../input-list/input-list.module.ts | 48 +++ .../properties-assignment.module.ts | 3 +- .../properties-assignment.page.component.html | 7 +- .../properties-assignment.page.component.ts | 432 ++++++++++++++------- .../services/properties.utils.ts | 3 + .../topology-template.service.ts | 6 +- .../src/app/ng2/services/properties.service.ts | 10 + catalog-ui/src/assets/languages/en_US.json | 4 + 17 files changed, 553 insertions(+), 171 deletions(-) create mode 100644 catalog-ui/src/app/models/tosca-get-function-type.enum.ts create mode 100644 catalog-ui/src/app/ng2/pages/properties-assignment/input-list/input-list.component.html create mode 100644 catalog-ui/src/app/ng2/pages/properties-assignment/input-list/input-list.component.less create mode 100644 catalog-ui/src/app/ng2/pages/properties-assignment/input-list/input-list.component.ts create mode 100644 catalog-ui/src/app/ng2/pages/properties-assignment/input-list/input-list.module.ts (limited to 'catalog-ui') 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 aea5707d89..bd65c3a70a 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 @@ -18,11 +18,12 @@ * ============LICENSE_END========================================================= */ -import { PROPERTY_DATA, PROPERTY_TYPES } from 'app/utils/constants'; -import { SchemaProperty, SchemaPropertyGroupModel } from '../schema-property'; -import { ToscaPresentationData } from '../tosca-presentation'; -import { PropertyInputDetail } from './property-input-detail'; -import { Metadata } from '../metadata'; +import {PROPERTY_DATA, PROPERTY_TYPES} from 'app/utils/constants'; +import {SchemaProperty, SchemaPropertyGroupModel} from '../schema-property'; +import {ToscaPresentationData} from '../tosca-presentation'; +import {PropertyInputDetail} from './property-input-detail'; +import {Metadata} from '../metadata'; +import {ToscaGetFunctionType} from "../tosca-get-function-type.enum"; export enum DerivedPropertyType { SIMPLE, @@ -65,6 +66,7 @@ export class PropertyBEModel { inputPath: string; toscaPresentation: ToscaPresentationData; metadata: Metadata; + toscaGetFunctionType: ToscaGetFunctionType; constructor(property?: PropertyBEModel) { if (property) { @@ -90,6 +92,7 @@ export class PropertyBEModel { this.getPolicyValues = property.getPolicyValues; this.inputPath = property.inputPath; this.metadata = property.metadata; + this.toscaGetFunctionType = property.toscaGetFunctionType; } if (!this.schema || !this.schema.property) { @@ -117,5 +120,12 @@ export class PropertyBEModel { return DerivedPropertyType.COMPLEX; } } + + /** + * Checks whether the property value is a tosca get function (e.g. get_input, get_property, get_attribute) + */ + public isToscaGetFunction(): boolean { + return this.toscaGetFunctionType != null; + } } diff --git a/catalog-ui/src/app/models/properties-inputs/property-input-detail.ts b/catalog-ui/src/app/models/properties-inputs/property-input-detail.ts index 8c1028c45b..38a14e607d 100644 --- a/catalog-ui/src/app/models/properties-inputs/property-input-detail.ts +++ b/catalog-ui/src/app/models/properties-inputs/property-input-detail.ts @@ -21,6 +21,7 @@ export class PropertyInputDetail { inputId: string; inputName: string; + inputType: string; inputPath: string; list: boolean; } diff --git a/catalog-ui/src/app/models/tosca-get-function-type.enum.ts b/catalog-ui/src/app/models/tosca-get-function-type.enum.ts new file mode 100644 index 0000000000..1ee4ae1eae --- /dev/null +++ b/catalog-ui/src/app/models/tosca-get-function-type.enum.ts @@ -0,0 +1,24 @@ +/* + * ============LICENSE_START======================================================= + * Copyright (C) 2021 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========================================================= + */ + +export enum ToscaGetFunctionType { + GET_INPUT = 'GET_INPUT', + GET_ATTRIBUTE = 'GET_ATTRIBUTE', + GET_PROPERTY = 'GET_PROPERTY' +} diff --git a/catalog-ui/src/app/ng2/app.module.ts b/catalog-ui/src/app/ng2/app.module.ts index 55dd969a88..88a56100fe 100644 --- a/catalog-ui/src/app/ng2/app.module.ts +++ b/catalog-ui/src/app/ng2/app.module.ts @@ -93,6 +93,7 @@ import {ServiceDependenciesModule} from './components/logic/service-dependencies import {ServiceDependenciesEditorModule} from './pages/service-dependencies-editor/service-dependencies-editor.module'; import {PropertyCreatorModule} from './pages/properties-assignment/property-creator/property-creator.module'; import {DeclareListModule} from './pages/properties-assignment/declare-list/declare-list.module'; +import { InputListModule } from "./pages/properties-assignment/input-list/input-list.module"; import {WorkflowServiceNg2} from './services/workflow.service'; import {ToscaTypesServiceNg2} from "./services/tosca-types.service"; import {CapabilitiesFilterPropertiesEditorComponentModule} from "./pages/composition/capabilities-filter-properties-editor/capabilities-filter-properties-editor.module"; @@ -149,6 +150,7 @@ export function configServiceFactory(config: ConfigService, authService: Authent AttributesOutputsModule, PropertyCreatorModule, DeclareListModule, + InputListModule, PluginFrameModule, PluginsModule, InterfaceOperationModule, diff --git a/catalog-ui/src/app/ng2/components/logic/properties-table/dynamic-property/dynamic-property.component.html b/catalog-ui/src/app/ng2/components/logic/properties-table/dynamic-property/dynamic-property.component.html index f6396e6f2c..78c3030842 100644 --- a/catalog-ui/src/app/ng2/components/logic/properties-table/dynamic-property/dynamic-property.component.html +++ b/catalog-ui/src/app/ng2/components/logic/properties-table/dynamic-property/dynamic-property.component.html @@ -15,20 +15,19 @@
- +
{{property.name}}
{{property.name}}
- - +
- +
{{property.type | contentAfterLastDot }}
{{property.schema.property.type | contentAfterLastDot }}
 - +
- + Add value to list @@ -74,7 +73,7 @@
-
+
+ +
+ +
+
+ + +
+
+
diff --git a/catalog-ui/src/app/ng2/pages/properties-assignment/input-list/input-list.component.less b/catalog-ui/src/app/ng2/pages/properties-assignment/input-list/input-list.component.less new file mode 100644 index 0000000000..e1e9b0d20d --- /dev/null +++ b/catalog-ui/src/app/ng2/pages/properties-assignment/input-list/input-list.component.less @@ -0,0 +1,43 @@ +/* + * ============LICENSE_START======================================================= + * Copyright (C) 2021 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 '../../../../../assets/styles/variables.less'; + +.input-list { + font-family: @font-opensans-regular; + user-select: none; + padding-top: 12px; + padding-bottom: 20px; + + .i-sdc-form-label { + font-size: 12px; + } + + .w-sdc-form .i-sdc-form-item { + margin-bottom: 15px; + } + + .side-by-side { + display: flex; + + .i-sdc-form-item { + flex-basis: 100%; + } + } +} diff --git a/catalog-ui/src/app/ng2/pages/properties-assignment/input-list/input-list.component.ts b/catalog-ui/src/app/ng2/pages/properties-assignment/input-list/input-list.component.ts new file mode 100644 index 0000000000..64ebcaa540 --- /dev/null +++ b/catalog-ui/src/app/ng2/pages/properties-assignment/input-list/input-list.component.ts @@ -0,0 +1,67 @@ +/* + * ============LICENSE_START======================================================= + * Copyright (C) 2021 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} from '@angular/core'; +import {InputBEModel, ComponentMetadata} from 'app/models'; +import {TopologyTemplateService} from "../../../services/component-services/topology-template.service"; +import {WorkspaceService} from "../../workspace/workspace.service"; +import {PropertiesService} from "../../../services/properties.service"; + +@Component({ + selector: 'input-list', + templateUrl: './input-list.component.html', + styleUrls: ['./input-list.component.less'], +}) + +export class InputListComponent { + + selectInputValue; + inputModel: Array = []; + isLoading: boolean; + propertyType: string; + + private componentMetadata: ComponentMetadata; + + constructor(private topologyTemplateService: TopologyTemplateService, + private workspaceService: WorkspaceService, + private propertiesService: PropertiesService + ) {} + + ngOnInit() { + this.componentMetadata = this.workspaceService.metadata; + this.propertyType = this.propertiesService.getCheckedPropertyType(); + this.loadInputValues(this.propertyType); + } + + private loadInputValues(propertyType: string): void { + this.isLoading = true; + this.topologyTemplateService.getComponentInputsValues(this.componentMetadata.componentType, this.componentMetadata.uniqueId) + .subscribe((response) => { + response.inputs.forEach((input: any) => { + if (input.type === propertyType) { + this.inputModel.push(input); + } + }); + }, () => { + //error ignored + }, () => { + this.isLoading = false; + }); + } +} diff --git a/catalog-ui/src/app/ng2/pages/properties-assignment/input-list/input-list.module.ts b/catalog-ui/src/app/ng2/pages/properties-assignment/input-list/input-list.module.ts new file mode 100644 index 0000000000..50d7b08314 --- /dev/null +++ b/catalog-ui/src/app/ng2/pages/properties-assignment/input-list/input-list.module.ts @@ -0,0 +1,48 @@ +/* + * ============LICENSE_START======================================================= + * Copyright (C) 2021 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 { CommonModule } from '@angular/common'; +import { NgModule } from '@angular/core'; +import { FormsModule } from '@angular/forms'; +import { FormElementsModule } from 'app/ng2/components/ui/form-components/form-elements.module'; +import { UiElementsModule } from 'app/ng2/components/ui/ui-elements.module'; +import { TranslateModule } from '../../../shared/translator/translate.module'; +import { InputListComponent } from './input-list.component'; +import { SdcUiComponentsModule } from 'onap-ui-angular'; + +@NgModule({ + declarations: [ + InputListComponent, + ], + imports: [ + CommonModule, + FormsModule, + FormElementsModule, + UiElementsModule, + TranslateModule, + SdcUiComponentsModule + ], + exports: [], + entryComponents: [ + InputListComponent + ], + providers: [] +}) + +export class InputListModule {} diff --git a/catalog-ui/src/app/ng2/pages/properties-assignment/properties-assignment.module.ts b/catalog-ui/src/app/ng2/pages/properties-assignment/properties-assignment.module.ts index 0d676ed950..ae4aa57572 100644 --- a/catalog-ui/src/app/ng2/pages/properties-assignment/properties-assignment.module.ts +++ b/catalog-ui/src/app/ng2/pages/properties-assignment/properties-assignment.module.ts @@ -52,7 +52,8 @@ import {HierarchyNavigationModule} from "../../components/logic/hierarchy-navigt HierarchyNavigationModule, UiElementsModule, SdcUiComponentsModule, - ModalFormsModule], + ModalFormsModule + ], entryComponents: [PropertiesAssignmentComponent], exports: [ 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 6b3e92adfd..7da0ecdbbd 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 @@ -75,9 +75,14 @@
+ - +
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 8cdc761ed4..6d009a8039 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 @@ -19,34 +19,54 @@ */ import * as _ from "lodash"; -import { Component, ViewChild, Inject, TemplateRef } from "@angular/core"; -import { PropertiesService } from "../../services/properties.service"; -import { PropertyFEModel, InstanceFePropertiesMap, InstanceBePropertiesMap, InstancePropertiesAPIMap, Component as ComponentData, FilterPropertiesAssignmentData, ModalModel, ButtonModel } from "app/models"; -import { ResourceType } from "app/utils"; -import { ComponentServiceNg2 } from "../../services/component-services/component.service"; -import { TopologyTemplateService } from "../../services/component-services/topology-template.service"; -import { ComponentInstanceServiceNg2 } from "../../services/component-instance-services/component-instance.service" -import { InputBEModel, InputFEModel, ComponentInstance, GroupInstance, PolicyInstance, PropertyBEModel, DerivedFEProperty, SimpleFlatProperty } from "app/models"; -import { KeysPipe } from 'app/ng2/pipes/keys.pipe'; -import { WorkspaceMode, EVENTS, PROPERTY_TYPES } from "../../../utils/constants"; -import { EventListenerService } from "app/services/event-listener-service" -import { HierarchyDisplayOptions } from "../../components/logic/hierarchy-navigtion/hierarchy-display-options"; -import { FilterPropertiesAssignmentComponent } from "../../components/logic/filter-properties-assignment/filter-properties-assignment.component"; -import { PropertyRowSelectedEvent } from "../../components/logic/properties-table/properties-table.component"; -import { HierarchyNavService } from "./services/hierarchy-nav.service"; -import { PropertiesUtils } from "./services/properties.utils"; -import { ComponentModeService } from "../../services/component-services/component-mode.service"; -import { Tabs, Tab } from "../../components/ui/tabs/tabs.component"; -import { InputsUtils } from "./services/inputs.utils"; -import { InstanceFeDetails } from "../../../models/instance-fe-details"; -import { SdcUiServices, SdcUiCommon } from "onap-ui-angular"; -import { UnsavedChangesComponent } from "app/ng2/components/ui/forms/unsaved-changes/unsaved-changes.component"; +import {Component, Inject, ViewChild} from "@angular/core"; +import {PropertiesService} from "../../services/properties.service"; +import { + ButtonModel, + Component as ComponentData, + ComponentInstance, + DerivedFEProperty, + FilterPropertiesAssignmentData, + GroupInstance, + InputBEModel, + InputFEModel, + InstanceBePropertiesMap, + InstanceFePropertiesMap, + InstancePropertiesAPIMap, + ModalModel, + PolicyInstance, + PropertyBEModel, + PropertyFEModel, + PropertyInputDetail, + SimpleFlatProperty +} from "app/models"; +import {ResourceType} from "app/utils"; +import {ComponentServiceNg2} from "../../services/component-services/component.service"; +import {TopologyTemplateService} from "../../services/component-services/topology-template.service"; +import {ComponentInstanceServiceNg2} from "../../services/component-instance-services/component-instance.service" +import {KeysPipe} from 'app/ng2/pipes/keys.pipe'; +import {EVENTS, PROPERTY_TYPES, WorkspaceMode} from "../../../utils/constants"; +import {EventListenerService} from "app/services/event-listener-service" +import {HierarchyDisplayOptions} from "../../components/logic/hierarchy-navigtion/hierarchy-display-options"; +import {FilterPropertiesAssignmentComponent} from "../../components/logic/filter-properties-assignment/filter-properties-assignment.component"; +import {PropertyRowSelectedEvent} from "../../components/logic/properties-table/properties-table.component"; +import {HierarchyNavService} from "./services/hierarchy-nav.service"; +import {PropertiesUtils} from "./services/properties.utils"; +import {ComponentModeService} from "../../services/component-services/component-mode.service"; +import {Tab, Tabs} from "../../components/ui/tabs/tabs.component"; +import {InputsUtils} from "./services/inputs.utils"; +import {InstanceFeDetails} from "../../../models/instance-fe-details"; +import {SdcUiCommon, SdcUiServices} from "onap-ui-angular"; +import {UnsavedChangesComponent} from "app/ng2/components/ui/forms/unsaved-changes/unsaved-changes.component"; import {PropertyCreatorComponent} from "./property-creator/property-creator.component"; import {ModalService} from "../../services/modal.service"; -import { DeclareListComponent } from "./declare-list/declare-list.component"; -import { CapabilitiesGroup, Capability } from "../../../models/capability"; -import { ToscaPresentationData } from "../../../models/tosca-presentation"; -import { Observable } from "rxjs"; +import {DeclareListComponent} from "./declare-list/declare-list.component"; +import {InputListComponent} from "./input-list/input-list.component"; +import {CapabilitiesGroup, Capability} from "../../../models/capability"; +import {ToscaPresentationData} from "../../../models/tosca-presentation"; +import {Observable} from "rxjs"; +import {ToscaGetFunctionType} from "../../../models/tosca-get-function-type.enum"; +import {TranslateService} from "../../shared/translator/translate.service"; const SERVICE_SELF_TITLE = "SELF"; @Component({ @@ -62,61 +82,65 @@ export class PropertiesAssignmentComponent { propertiesNavigationData = []; instancesNavigationData = []; - instanceFePropertiesMap:InstanceFePropertiesMap; + instanceFePropertiesMap: InstanceFePropertiesMap; inputs: Array = []; policies: Array = []; - instances: Array = []; + instances: Array = []; searchQuery: string; propertyStructureHeader: string; selectedFlatProperty: SimpleFlatProperty = new SimpleFlatProperty(); - selectedInstanceData: ComponentInstance|GroupInstance|PolicyInstance = null; + selectedInstanceData: ComponentInstance | GroupInstance | PolicyInstance = null; checkedPropertiesCount: number = 0; checkedChildPropertiesCount: number = 0; - hierarchyPropertiesDisplayOptions:HierarchyDisplayOptions = new HierarchyDisplayOptions('path', 'name', 'childrens'); - hierarchyInstancesDisplayOptions:HierarchyDisplayOptions = new HierarchyDisplayOptions('uniqueId', 'name', 'archived', null, 'iconClass'); + hierarchyPropertiesDisplayOptions: HierarchyDisplayOptions = new HierarchyDisplayOptions('path', 'name', 'childrens'); + hierarchyInstancesDisplayOptions: HierarchyDisplayOptions = new HierarchyDisplayOptions('uniqueId', 'name', 'archived', null, 'iconClass'); displayClearSearch = false; - searchPropertyName:string; - currentMainTab:Tab; - isInputsTabSelected:boolean; - isPropertiesTabSelected:boolean; - isPoliciesTabSelected:boolean; - isReadonly:boolean; - resourceIsReadonly:boolean; - loadingInstances:boolean = false; - loadingInputs:boolean = false; - loadingPolicies:boolean = false; - loadingProperties:boolean = false; - changedData:Array; - hasChangedData:boolean; - isValidChangedData:boolean; - savingChangedData:boolean; - stateChangeStartUnregister:Function; + searchPropertyName: string; + currentMainTab: Tab; + isInputsTabSelected: boolean; + isPropertiesTabSelected: boolean; + isInputValueSelected: boolean = false; + isPoliciesTabSelected: boolean; + isReadonly: boolean; + resourceIsReadonly: boolean; + loadingInstances: boolean = false; + loadingInputs: boolean = false; + loadingPolicies: boolean = false; + loadingProperties: boolean = false; + changedData: Array; + hasChangedData: boolean; + isValidChangedData: boolean; + savingChangedData: boolean; + stateChangeStartUnregister: Function; serviceBePropertiesMap: InstanceBePropertiesMap; serviceBeCapabilitiesPropertiesMap: InstanceBePropertiesMap; selectedInstance_FlattenCapabilitiesList: Capability[]; + propertyType: string; + btnSelectInputText: string; @ViewChild('hierarchyNavTabs') hierarchyNavTabs: Tabs; @ViewChild('propertyInputTabs') propertyInputTabs: Tabs; @ViewChild('advanceSearch') advanceSearch: FilterPropertiesAssignmentComponent; - + constructor(private propertiesService: PropertiesService, private hierarchyNavService: HierarchyNavService, - private propertiesUtils:PropertiesUtils, - private inputsUtils:InputsUtils, - private componentServiceNg2:ComponentServiceNg2, - private componentInstanceServiceNg2:ComponentInstanceServiceNg2, + private propertiesUtils: PropertiesUtils, + private inputsUtils: InputsUtils, + private componentServiceNg2: ComponentServiceNg2, + private componentInstanceServiceNg2: ComponentInstanceServiceNg2, @Inject("$stateParams") _stateParams, - @Inject("$scope") private $scope:ng.IScope, - @Inject("$state") private $state:ng.ui.IStateService, - @Inject("Notification") private Notification:any, - private componentModeService:ComponentModeService, - private EventListenerService:EventListenerService, + @Inject("$scope") private $scope: ng.IScope, + @Inject("$state") private $state: ng.ui.IStateService, + @Inject("Notification") private Notification: any, + private componentModeService: ComponentModeService, + private EventListenerService: EventListenerService, private ModalServiceSdcUI: SdcUiServices.ModalService, private ModalService: ModalService, - private keysPipe:KeysPipe, - private topologyTemplateService: TopologyTemplateService) { + private keysPipe: KeysPipe, + private topologyTemplateService: TopologyTemplateService, + private translateService: TranslateService) { this.instanceFePropertiesMap = new InstanceFePropertiesMap(); /* This is the way you can access the component data, please do not use any data except metadata, all other data should be received from the new api calls on the first time @@ -124,7 +148,6 @@ export class PropertiesAssignmentComponent { this.component = _stateParams.component; this.EventListenerService.registerObserverCallback(EVENTS.ON_LIFECYCLE_CHANGE, this.onCheckout); this.updateViewMode(); - this.changedData = []; this.updateHasChangedData(); this.isValidChangedData = true; @@ -132,52 +155,60 @@ export class PropertiesAssignmentComponent { ngOnInit() { console.log("==>" + this.constructor.name + ": ngOnInit"); + this.btnSelectInputText = this.translateService.translate('SELECT_INPUT_LABEL'); this.loadingInputs = true; this.loadingPolicies = true; this.loadingInstances = true; this.loadingProperties = true; this.topologyTemplateService - .getComponentInputsWithProperties(this.component.componentType, this.component.uniqueId) - .subscribe(response => { - _.forEach(response.inputs, (input: InputBEModel) => { - const newInput: InputFEModel = new InputFEModel(input); - this.inputsUtils.resetInputDefaultValue(newInput, input.defaultValue); - this.inputs.push(newInput); //only push items that were declared via SDC - }); - this.loadingInputs = false; + .getComponentInputsWithProperties(this.component.componentType, this.component.uniqueId) + .subscribe(response => { + _.forEach(response.inputs, (input: InputBEModel) => { + const newInput: InputFEModel = new InputFEModel(input); + this.inputsUtils.resetInputDefaultValue(newInput, input.defaultValue); + this.inputs.push(newInput); //only push items that were declared via SDC + }); + this.loadingInputs = false; - }, error => {}); //ignore error + }, error => { + }); //ignore error this.componentServiceNg2 - .getComponentResourcePropertiesData(this.component) - .subscribe(response => { - this.loadingPolicies = false; - this.instances = []; - this.instances.push(...response.componentInstances); - this.instances.push(...response.groupInstances); - this.instances.push(...response.policies); - - _.forEach(response.policies, (policy: any) => { - const newPolicy: InputFEModel = new InputFEModel(policy); - this.inputsUtils.resetInputDefaultValue(newPolicy, policy.defaultValue); - this.policies.push(policy); - }); - - // add the service self instance to the top of the list. - const serviceInstance = new ComponentInstance(); - serviceInstance.name = SERVICE_SELF_TITLE; - serviceInstance.uniqueId = this.component.uniqueId; - this.instances.unshift(serviceInstance); + .getComponentResourcePropertiesData(this.component) + .subscribe(response => { + this.loadingPolicies = false; + this.instances = []; + this.instances.push(...response.componentInstances); + this.instances.push(...response.groupInstances); + this.instances.push(...response.policies); + + _.forEach(response.policies, (policy: any) => { + const newPolicy: InputFEModel = new InputFEModel(policy); + this.inputsUtils.resetInputDefaultValue(newPolicy, policy.defaultValue); + this.policies.push(policy); + }); - _.forEach(this.instances, (instance) => { - this.instancesNavigationData.push(instance); - this.componentInstanceNamesMap[instance.uniqueId] = {name: instance.name, iconClass:instance.iconClass, originArchived:instance.originArchived}; - }); - this.loadingInstances = false; - if (this.instancesNavigationData[0] == undefined) { - this.loadingProperties = false; - } - this.selectFirstInstanceByDefault(); - }, error => { this.loadingInstances = false; }); //ignore error + // add the service self instance to the top of the list. + const serviceInstance = new ComponentInstance(); + serviceInstance.name = SERVICE_SELF_TITLE; + serviceInstance.uniqueId = this.component.uniqueId; + this.instances.unshift(serviceInstance); + + _.forEach(this.instances, (instance) => { + this.instancesNavigationData.push(instance); + this.componentInstanceNamesMap[instance.uniqueId] = { + name: instance.name, + iconClass: instance.iconClass, + originArchived: instance.originArchived + }; + }); + this.loadingInstances = false; + if (this.instancesNavigationData[0] == undefined) { + this.loadingProperties = false; + } + this.selectFirstInstanceByDefault(); + }, error => { + this.loadingInstances = false; + }); //ignore error this.stateChangeStartUnregister = this.$scope.$on('$stateChangeStart', (event, toState, toParams) => { // stop if has changed properties @@ -185,7 +216,8 @@ export class PropertiesAssignmentComponent { event.preventDefault(); this.showUnsavedChangesAlert().then(() => { this.$state.go(toState, toParams); - }, () => {}); + }, () => { + }); } }); }; @@ -205,33 +237,33 @@ export class PropertiesAssignmentComponent { this.isReadonly = this.componentModeService.getComponentMode(this.component) === WorkspaceMode.VIEW; } - onCheckout = (component:ComponentData) => { + onCheckout = (component: ComponentData) => { this.component = component; this.updateViewMode(); } - isSelf = ():boolean => { + isSelf = (): boolean => { return this.selectedInstanceData && this.selectedInstanceData.uniqueId == this.component.uniqueId; } - getServiceProperties(){ - this.loadingProperties = false; + getServiceProperties() { + this.loadingProperties = true; this.topologyTemplateService - .getServiceProperties(this.component.uniqueId) - .subscribe((response) => { - this.serviceBePropertiesMap = new InstanceBePropertiesMap(); - this.serviceBePropertiesMap[this.component.uniqueId] = response; - this.processInstancePropertiesResponse(this.serviceBePropertiesMap, false); - this.loadingProperties = false; - }, (error) => { - this.loadingProperties = false; - }); + .getServiceProperties(this.component.uniqueId) + .subscribe((response) => { + this.serviceBePropertiesMap = new InstanceBePropertiesMap(); + this.serviceBePropertiesMap[this.component.uniqueId] = response; + this.processInstancePropertiesResponse(this.serviceBePropertiesMap, false); + this.loadingProperties = false; + }, (error) => { + this.loadingProperties = false; + }); } - onInstanceSelectedUpdate = (instance: ComponentInstance|GroupInstance|PolicyInstance) => { + onInstanceSelectedUpdate = (instance: ComponentInstance | GroupInstance | PolicyInstance) => { // stop if has changed properties if (this.hasChangedData) { - this.showUnsavedChangesAlert().then((resolve)=> { + this.showUnsavedChangesAlert().then((resolve) => { this.changeSelectedInstance(instance) }, (reject) => { }); @@ -240,52 +272,62 @@ export class PropertiesAssignmentComponent { this.changeSelectedInstance(instance); }; - changeSelectedInstance = (instance: ComponentInstance|GroupInstance|PolicyInstance) => { + changeSelectedInstance = (instance: ComponentInstance | GroupInstance | PolicyInstance) => { this.selectedInstanceData = instance; this.loadingProperties = true; if (instance instanceof ComponentInstance) { let instanceBePropertiesMap: InstanceBePropertiesMap = new InstanceBePropertiesMap(); if (this.isInput(instance.originType)) { this.componentInstanceServiceNg2 - .getComponentInstanceInputs(this.component, instance) - .subscribe(response => { - instanceBePropertiesMap[instance.uniqueId] = response; - this.processInstancePropertiesResponse(instanceBePropertiesMap, true); - this.loadingProperties = false; - }, error => { - }); //ignore error + .getComponentInstanceInputs(this.component, instance) + .subscribe(response => { + instanceBePropertiesMap[instance.uniqueId] = response; + this.processInstancePropertiesResponse(instanceBePropertiesMap, true); + }, () => { + //ignore error + }, () => { + this.loadingProperties = false; + }); } else if (this.isSelf()) { this.getServiceProperties(); } else { this.componentInstanceServiceNg2 - .getComponentInstanceProperties(this.component, instance.uniqueId) - .subscribe(response => { - instanceBePropertiesMap[instance.uniqueId] = response; - this.processInstancePropertiesResponse(instanceBePropertiesMap, false); - this.loadingProperties = false; - }, error => { - }); //ignore error + .getComponentInstanceProperties(this.component, instance.uniqueId) + .subscribe(response => { + instanceBePropertiesMap[instance.uniqueId] = response; + this.processInstancePropertiesResponse(instanceBePropertiesMap, false); + }, () => { + //ignore error + }, () => { + this.loadingProperties = false; + }); } - + this.loadingProperties = false; this.resourceIsReadonly = (instance.componentName === "vnfConfiguration"); } else if (instance instanceof GroupInstance) { let instanceBePropertiesMap: InstanceBePropertiesMap = new InstanceBePropertiesMap(); this.componentInstanceServiceNg2 - .getComponentGroupInstanceProperties(this.component, this.selectedInstanceData.uniqueId) - .subscribe((response) => { - instanceBePropertiesMap[instance.uniqueId] = response; - this.processInstancePropertiesResponse(instanceBePropertiesMap, false); - this.loadingProperties = false; - }); + .getComponentGroupInstanceProperties(this.component, this.selectedInstanceData.uniqueId) + .subscribe((response) => { + instanceBePropertiesMap[instance.uniqueId] = response; + this.processInstancePropertiesResponse(instanceBePropertiesMap, false); + }, () => { + //ignore error + }, () => { + this.loadingProperties = false; + }); } else if (instance instanceof PolicyInstance) { let instanceBePropertiesMap: InstanceBePropertiesMap = new InstanceBePropertiesMap(); this.componentInstanceServiceNg2 - .getComponentPolicyInstanceProperties(this.component.componentType, this.component.uniqueId, this.selectedInstanceData.uniqueId) - .subscribe((response) => { - instanceBePropertiesMap[instance.uniqueId] = response; - this.processInstancePropertiesResponse(instanceBePropertiesMap, false); - this.loadingProperties = false; - }); + .getComponentPolicyInstanceProperties(this.component.componentType, this.component.uniqueId, this.selectedInstanceData.uniqueId) + .subscribe((response) => { + instanceBePropertiesMap[instance.uniqueId] = response; + this.processInstancePropertiesResponse(instanceBePropertiesMap, false); + }, () => { + //ignore error + }, () => { + this.loadingProperties = false; + }); } else { this.loadingProperties = false; } @@ -316,7 +358,7 @@ export class PropertiesAssignmentComponent { this.selectedInstance_FlattenCapabilitiesList, (result, cap: Capability) => { isCapabilityOwnedByInstance = cap.ownerId === currentUniqueId || - selectedComponentInstanceData.isServiceProxy() || selectedComponentInstanceData.isServiceSubstitution() && + selectedComponentInstanceData.isServiceProxy() || selectedComponentInstanceData.isServiceSubstitution() && cap.ownerId === selectedComponentInstanceData.sourceModelUid; if (cap.properties && isCapabilityOwnedByInstance) { _.forEach(cap.properties, prop => { @@ -344,7 +386,7 @@ export class PropertiesAssignmentComponent { }; /*** VALUE CHANGE EVENTS ***/ - dataChanged = (item:PropertyFEModel|InputFEModel) => { + dataChanged = (item: PropertyFEModel | InputFEModel) => { let itemHasChanged; if (this.isPropertiesTabSelected && item instanceof PropertyFEModel) { itemHasChanged = item.hasValueObjChanged(); @@ -384,14 +426,14 @@ export class PropertiesAssignmentComponent { onPropertySelectedUpdate = ($event) => { console.log("==>" + this.constructor.name + ": onPropertySelectedUpdate"); this.selectedFlatProperty = $event; - let parentProperty:PropertyFEModel = this.propertiesService.getParentPropertyFEModelFromPath(this.instanceFePropertiesMap[this.selectedFlatProperty.instanceName], this.selectedFlatProperty.path); + let parentProperty: PropertyFEModel = this.propertiesService.getParentPropertyFEModelFromPath(this.instanceFePropertiesMap[this.selectedFlatProperty.instanceName], this.selectedFlatProperty.path); parentProperty.expandedChildPropertyId = this.selectedFlatProperty.path; }; /** * When user select row in table, this will prepare the hirarchy object for the tree. */ - selectPropertyRow = (propertyRowSelectedEvent:PropertyRowSelectedEvent) => { + selectPropertyRow = (propertyRowSelectedEvent: PropertyRowSelectedEvent) => { console.log("==>" + this.constructor.name + ": selectPropertyRow " + propertyRowSelectedEvent.propertyModel.name); let property = propertyRowSelectedEvent.propertyModel; let instanceName = propertyRowSelectedEvent.instanceName; @@ -399,13 +441,13 @@ export class PropertiesAssignmentComponent { // Build hirarchy tree for the navigation and update propertiesNavigationData with it. if (!(this.selectedInstanceData instanceof ComponentInstance) || this.selectedInstanceData.originType !== ResourceType.VF) { - let simpleFlatProperty:Array; + let simpleFlatProperty: Array; if (property instanceof PropertyFEModel) { simpleFlatProperty = this.hierarchyNavService.getSimplePropertiesTree(property, instanceName); } else if (property instanceof DerivedFEProperty) { // Need to find parent PropertyFEModel - let parentPropertyFEModel:PropertyFEModel = _.find(this.instanceFePropertiesMap[instanceName], (tmpFeProperty):boolean => { - return property.propertiesName.indexOf(tmpFeProperty.name)===0; + let parentPropertyFEModel: PropertyFEModel = _.find(this.instanceFePropertiesMap[instanceName], (tmpFeProperty): boolean => { + return property.propertiesName.indexOf(tmpFeProperty.name) === 0; }); simpleFlatProperty = this.hierarchyNavService.getSimplePropertiesTree(parentPropertyFEModel, instanceName); } @@ -422,7 +464,7 @@ export class PropertiesAssignmentComponent { selectInstanceRow = ($event) => {//get instance name - this.selectedInstanceData = _.find(this.instancesNavigationData, (instance:ComponentInstance) => { + this.selectedInstanceData = _.find(this.instancesNavigationData, (instance: ComponentInstance) => { return instance.name == $event; }); this.hierarchyNavTabs.triggerTabChange('Composition'); @@ -434,7 +476,7 @@ export class PropertiesAssignmentComponent { this.propertyInputTabs.triggerTabChange(this.currentMainTab.title); this.showUnsavedChangesAlert().then((proceed) => { this.propertyInputTabs.selectTab(this.propertyInputTabs.tabs.find((tab) => tab.title === event.title)); - }, ()=> { + }, () => { }); return; } @@ -448,6 +490,92 @@ export class PropertiesAssignmentComponent { this.searchQuery = ''; }; + /**Select Properties value from defined input values**/ + selectInput = (): void => { + let instancesIds = this.keysPipe.transform(this.instanceFePropertiesMap, []); + angular.forEach(instancesIds, (instanceId: string): void => { + let selectedInstanceData: any = this.instances.find(instance => instance.uniqueId == instanceId + && instance instanceof ComponentInstance); + if (selectedInstanceData) { + let checkedProperties: PropertyBEModel[] = this.propertiesService.getCheckedProperties(this.instanceFePropertiesMap[instanceId]); + angular.forEach(checkedProperties, (property: PropertyBEModel) => { + this.propertiesService.setCheckedPropertyType(property.type); + if (property.toscaGetFunctionType != null) { + this.loadingProperties = true; + property.getInputValues = null; + property.value = null; + property.toscaGetFunctionType = null; + this.updateInstancePropertiesWithInput(checkedProperties, selectedInstanceData); + } else { + let modalTitle = 'Select value from Input'; + const modal = this.ModalService.createCustomModal(new ModalModel( + 'sm', + modalTitle, + null, + [ + new ButtonModel('Save', 'blue', + () => { + this.loadingProperties = true; + let selectInputValue: InputFEModel = modal.instance.dynamicContent.instance.selectInputValue; + property.getInputValues = []; + const propertyInputDetail = new PropertyInputDetail(); + propertyInputDetail.inputId = selectInputValue.uniqueId; + propertyInputDetail.inputName = selectInputValue.name; + propertyInputDetail.inputType = selectInputValue.type; + property.getInputValues.push(propertyInputDetail); + property.value = '{"get_input":"' + selectInputValue.name + '"}'; + property.toscaGetFunctionType = ToscaGetFunctionType.GET_INPUT; + this.updateInstancePropertiesWithInput(checkedProperties, selectedInstanceData); + modal.instance.close(); + } + ), + new ButtonModel('Cancel', 'outline grey', () => { + modal.instance.close(); + }), + ], + null /* type */ + )); //modal + this.ModalService.addDynamicContentToModal(modal, InputListComponent); + modal.instance.open(); + } + }); + } + }); + }; + + updateInstancePropertiesWithInput(checkedProperties: PropertyBEModel[], selectedInstanceData: any) { + this.componentInstanceServiceNg2.updateInstanceProperties(this.component.componentType, this.component.uniqueId, + this.selectedInstanceData.uniqueId, checkedProperties) + .subscribe(() => { + this.changeSelectedInstance(selectedInstanceData); + }, (error) => { + this.Notification.error({ + message: 'Failed to select/deselect get_input call: ' + error, + title: 'Failure' + }); + }, () => { + this.loadingProperties = false; + this.btnSelectInputText = this.translateService.translate('SELECT_INPUT_LABEL'); + }); + } + + selectInputBtnLabel = () => { + let instancesIds = this.keysPipe.transform(this.instanceFePropertiesMap, []); + angular.forEach(instancesIds, (instanceId: string): void => { + let checkedProperties: PropertyBEModel[] = this.propertiesService.getCheckedProperties(this.instanceFePropertiesMap[instanceId]); + angular.forEach(checkedProperties, (property: PropertyBEModel) => { + if(this.checkedPropertiesCount == 1) { + if (property.toscaGetFunctionType == null) { + this.btnSelectInputText = this.translateService.translate('SELECT_INPUT_LABEL'); + } else { + this.btnSelectInputText = this.translateService.translate('DESELECT_INPUT_LABEL'); + } + } else { + this.btnSelectInputText = this.translateService.translate('SELECT_INPUT_LABEL'); + } + }); + }); + } /*** DECLARE PROPERTIES/INPUTS ***/ @@ -735,6 +863,7 @@ export class PropertiesAssignmentComponent { }; } else { if (this.isSelf()) { + console.log("changedProperties", changedProperties); request = this.topologyTemplateService.updateServiceProperties(this.component.uniqueId, _.map(changedProperties, cp => { delete cp.constraints; return cp; @@ -932,6 +1061,7 @@ export class PropertiesAssignmentComponent { updateCheckedPropertyCount = (increment: boolean): void => { this.checkedPropertiesCount += (increment) ? 1 : -1; console.log("CheckedProperties count is now.... " + this.checkedPropertiesCount); + this.selectInputBtnLabel(); }; updateCheckedChildPropertyCount = (increment: boolean): void => { 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 bd7ccd1bfd..544eb8173d 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 @@ -53,6 +53,9 @@ export class PropertiesUtils { newFEProp.updateExpandedChildPropertyId(newFEProp.name); //display only the first level of children this.dataTypeService.checkForCustomBehavior(newFEProp); + if (newFEProp.isToscaGetFunction()) { + 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/app/ng2/services/component-services/topology-template.service.ts b/catalog-ui/src/app/ng2/services/component-services/topology-template.service.ts index 0249912862..992149976e 100644 --- a/catalog-ui/src/app/ng2/services/component-services/topology-template.service.ts +++ b/catalog-ui/src/app/ng2/services/component-services/topology-template.service.ts @@ -123,6 +123,10 @@ export class TopologyTemplateService { return this.getComponentDataByFieldsName(component.componentType, component.uniqueId, [COMPONENT_FIELDS.COMPONENT_INPUTS]); } + getComponentInputsValues(componentType: string, componentId: string): Observable { + return this.getComponentDataByFieldsName(componentType, componentId, [COMPONENT_FIELDS.COMPONENT_INPUTS]); + } + getComponentInputsWithProperties(componentType: string, componentId: string): Observable { return this.getComponentDataByFieldsName(componentType, componentId, [COMPONENT_FIELDS.COMPONENT_INPUTS, COMPONENT_FIELDS.COMPONENT_INSTANCES, COMPONENT_FIELDS.COMPONENT_INSTANCES_PROPERTIES, COMPONENT_FIELDS.COMPONENT_PROPERTIES]); @@ -208,7 +212,7 @@ export class TopologyTemplateService { return this.http.get(this.baseUrl + component.getTypeUrl() + component.uniqueId + '/filteredproperties/' + filterData.propertyName, {params: params}); } - createServiceProperty(componentId: string, propertyModel: PropertyBEModel): Observable { + createServiceProperty(componentId: string, propertyModel: PropertyBEModel): Observable { const serverObject = {}; serverObject[propertyModel.name] = propertyModel; return this.http.post(this.baseUrl + 'services/' + componentId + '/properties', serverObject) diff --git a/catalog-ui/src/app/ng2/services/properties.service.ts b/catalog-ui/src/app/ng2/services/properties.service.ts index c86d207915..f6b77320df 100644 --- a/catalog-ui/src/app/ng2/services/properties.service.ts +++ b/catalog-ui/src/app/ng2/services/properties.service.ts @@ -25,6 +25,8 @@ import { PropertyFEModel, PropertyBEModel, PropertyDeclareAPIModel, DerivedFEPro @Injectable() export class PropertiesService { + checkedPropertyType: string; + constructor() { } @@ -81,5 +83,13 @@ export class PropertiesService { return selectedProps; } + setCheckedPropertyType(type: string){ + this.checkedPropertyType = type; + } + + getCheckedPropertyType(){ + return this.checkedPropertyType; + } + } diff --git a/catalog-ui/src/assets/languages/en_US.json b/catalog-ui/src/assets/languages/en_US.json index df869c3057..cf277839b5 100644 --- a/catalog-ui/src/assets/languages/en_US.json +++ b/catalog-ui/src/assets/languages/en_US.json @@ -556,6 +556,10 @@ "DELETE_POLICY_TITLE": "Delete Policy", "DELETE_POLICY_MSG": "Are you sure you want to delete policy '{{policyName}}'?", + "=========== PROPERTIES ASSIGNMENT SELECT INPUT BUTTON ===========": "", + "SELECT_INPUT_LABEL": "Select Input" , + "DESELECT_INPUT_LABEL": "Deselect Input", + "=========== AUTOMATED UPGRADE ===========": "", "RESOURCE_UPGRADE_TITLE" : "Upgrade Services", "SERVICE_UPGRADE_TITLE" : "Update Service References", -- cgit 1.2.3-korg