summaryrefslogtreecommitdiffstats
path: root/catalog-ui/src/app
diff options
context:
space:
mode:
Diffstat (limited to 'catalog-ui/src/app')
-rw-r--r--catalog-ui/src/app/models/capability-types.ts3
-rw-r--r--catalog-ui/src/app/models/capability.ts7
-rw-r--r--catalog-ui/src/app/models/properties-inputs/property-be-model.ts6
-rw-r--r--catalog-ui/src/app/models/properties-inputs/property-fe-model.ts2
-rw-r--r--catalog-ui/src/app/models/tosca-presentation.ts2
-rw-r--r--catalog-ui/src/app/modules/directive-module.ts2
-rw-r--r--catalog-ui/src/app/ng2/components/logic/service-consumption/service-consumption.component.ts22
-rw-r--r--catalog-ui/src/app/ng2/pages/interface-operation/interface-operation.page.component.ts18
-rw-r--r--catalog-ui/src/app/ng2/pages/interface-operation/operation-creator/operation-creator.component.html21
-rw-r--r--catalog-ui/src/app/ng2/pages/interface-operation/operation-creator/operation-creator.component.ts20
-rw-r--r--catalog-ui/src/app/ng2/pages/interface-operation/operation-creator/param-row/param-row.component.html9
-rw-r--r--catalog-ui/src/app/ng2/pages/interface-operation/operation-creator/param-row/param-row.component.ts31
-rw-r--r--catalog-ui/src/app/ng2/pages/properties-assignment/properties-assignment.page.component.ts138
-rw-r--r--catalog-ui/src/app/ng2/pages/req-and-capabilities-editor/capabilities-editor/capabilities-editor.component.ts4
-rw-r--r--catalog-ui/src/app/ng2/pages/service-consumption-editor/service-consumption-editor.component.html9
-rw-r--r--catalog-ui/src/app/ng2/pages/service-consumption-editor/service-consumption-editor.component.ts53
-rw-r--r--catalog-ui/src/app/ng2/services/component-services/service.service.ts4
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/service-consumption/service-consumption-view-model.ts24
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/service-consumption/service-consumption-view.html1
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/req-and-capabilities/req-and-capabilities-editable-view.html62
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/req-and-capabilities/req-and-capabilities.less141
21 files changed, 483 insertions, 96 deletions
diff --git a/catalog-ui/src/app/models/capability-types.ts b/catalog-ui/src/app/models/capability-types.ts
index fc01f540a7..278d3d397c 100644
--- a/catalog-ui/src/app/models/capability-types.ts
+++ b/catalog-ui/src/app/models/capability-types.ts
@@ -15,6 +15,7 @@
*/
import {ToscaPresentationData} from "./tosca-presentation";
+import {PropertyModel} from "./properties";
export class CapabilityTypesMap {
capabilityTypesMap: CapabilityTypesMapData;
@@ -30,12 +31,14 @@ export class CapabilityTypesMapData {
export class CapabilityTypeModel {
derivedFrom: string;
+ properties: Array<PropertyModel>;
toscaPresentation: ToscaPresentationData;
constructor(capabilityType?: CapabilityTypeModel) {
if (capabilityType) {
this.derivedFrom = capabilityType.derivedFrom;
this.toscaPresentation = capabilityType.toscaPresentation;
+ this.properties = capabilityType.properties;
}
}
} \ No newline at end of file
diff --git a/catalog-ui/src/app/models/capability.ts b/catalog-ui/src/app/models/capability.ts
index caef2e87dd..4a4f821e0c 100644
--- a/catalog-ui/src/app/models/capability.ts
+++ b/catalog-ui/src/app/models/capability.ts
@@ -45,6 +45,13 @@ export class CapabilitiesGroup {
});
return this[key];
}
+
+ public static getFlattenedCapabilities(capabilitiesGroup: CapabilitiesGroup): Array<Capability> {
+ return _.reduce(
+ _.toArray(capabilitiesGroup),
+ (allCaps, capArr) => allCaps.concat(capArr),
+ []);
+ }
}
export class Capability implements RequirementCapabilityModel{
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 15b9534b99..5d25142e5a 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,7 +18,7 @@
* ============LICENSE_END=========================================================
*/
-import { PropertyInputDetail, SchemaPropertyGroupModel, SchemaProperty } from "app/models";
+import {PropertyInputDetail, SchemaPropertyGroupModel, SchemaProperty, ToscaPresentationData} from "app/models";
import { PROPERTY_DATA, PROPERTY_TYPES } from 'app/utils';
export enum DerivedPropertyType {
SIMPLE,
@@ -47,6 +47,7 @@ export class PropertyBEModel {
getInputValues: Array<PropertyInputDetail>;
getPolicyValues: Array<PropertyPolicyDetail>;
name: string;
+ origName: string;
parentUniqueId: string;
password: boolean;
required: boolean;
@@ -58,6 +59,7 @@ export class PropertyBEModel {
parentPropertyType: string;
subPropertyInputPath: string;
inputPath: string;
+ toscaPresentation: ToscaPresentationData;
constructor(property?: PropertyBEModel) {
if (property) {
@@ -66,6 +68,7 @@ export class PropertyBEModel {
this.description = property.description;
this.fromDerived = property.fromDerived;
this.name = property.name;
+ this.origName = property.origName;
this.parentUniqueId = property.parentUniqueId;
this.password = property.password;
this.required = property.required;
@@ -78,6 +81,7 @@ export class PropertyBEModel {
this.getInputValues = property.getInputValues;
this.parentPropertyType = property.parentPropertyType;
this.subPropertyInputPath = property.subPropertyInputPath;
+ this.toscaPresentation = property.toscaPresentation;
this.getPolicyValues = property.getPolicyValues;
this.inputPath = property.inputPath;
}
diff --git a/catalog-ui/src/app/models/properties-inputs/property-fe-model.ts b/catalog-ui/src/app/models/properties-inputs/property-fe-model.ts
index c0af885d18..664d128313 100644
--- a/catalog-ui/src/app/models/properties-inputs/property-fe-model.ts
+++ b/catalog-ui/src/app/models/properties-inputs/property-fe-model.ts
@@ -40,6 +40,7 @@ export class PropertyFEModel extends PropertyBEModel {
valueObjOrig: any; //this is valueObj representation as saved in server
valueObjIsChanged: boolean;
derivedDataType: DerivedPropertyType;
+ origName: string;
constructor(property: PropertyBEModel){
super(property);
@@ -52,6 +53,7 @@ export class PropertyFEModel extends PropertyBEModel {
this.valueObj = null;
this.updateValueObjOrig();
this.resetValueObjValidation();
+ this.origName = this.name;
}
diff --git a/catalog-ui/src/app/models/tosca-presentation.ts b/catalog-ui/src/app/models/tosca-presentation.ts
index 3fdddde448..7cdc5c6be5 100644
--- a/catalog-ui/src/app/models/tosca-presentation.ts
+++ b/catalog-ui/src/app/models/tosca-presentation.ts
@@ -21,6 +21,7 @@ export class ToscaPresentationData {
validTargetTypes: Array<string>;
modificationTime: number;
uniqueId: string;
+ ownerId: string;
constructor(toscaPresentation?: ToscaPresentationData) {
if (toscaPresentation) {
@@ -30,6 +31,7 @@ export class ToscaPresentationData {
this.validTargetTypes = toscaPresentation.validTargetTypes;
this.modificationTime = toscaPresentation.modificationTime;
this.uniqueId = toscaPresentation.uniqueId;
+ this.ownerId = toscaPresentation.ownerId;
}
}
}
diff --git a/catalog-ui/src/app/modules/directive-module.ts b/catalog-ui/src/app/modules/directive-module.ts
index 126f99ff09..720d29f8ce 100644
--- a/catalog-ui/src/app/modules/directive-module.ts
+++ b/catalog-ui/src/app/modules/directive-module.ts
@@ -249,7 +249,7 @@ directiveModule.directive('ng2ServicePathSelector', downgradeComponent({
directiveModule.directive('ng2ServiceConsumption', downgradeComponent({
component: ServiceConsumptionComponent,
- inputs: ['parentService', 'selectedService', 'selectedServiceInstanceId', 'instancesMappedList','parentServiceInputs', 'readonly'],
+ inputs: ['parentService', 'selectedService', 'selectedServiceInstanceId', 'instancesMappedList', 'parentServiceInputs', 'instancesCapabilitiesMap', 'readonly'],
outputs: []
}) as angular.IDirectiveFactory);
diff --git a/catalog-ui/src/app/ng2/components/logic/service-consumption/service-consumption.component.ts b/catalog-ui/src/app/ng2/components/logic/service-consumption/service-consumption.component.ts
index ef8d63df97..ebcf9eba22 100644
--- a/catalog-ui/src/app/ng2/components/logic/service-consumption/service-consumption.component.ts
+++ b/catalog-ui/src/app/ng2/components/logic/service-consumption/service-consumption.component.ts
@@ -29,7 +29,9 @@ import {
PropertyFEModel,
PropertyBEModel,
InputBEModel,
- InterfaceModel
+ InterfaceModel,
+ CapabilitiesGroup,
+ Capability
} from 'app/models';
import {ServiceConsumptionCreatorComponent} from 'app/ng2/pages/service-consumption-editor/service-consumption-editor.component';
@@ -59,6 +61,7 @@ export class ConsumptionInputDetails extends ConsumptionInput {
assignValueLabel: string;
associatedProps: Array<string>;
associatedInterfaces: Array<any>;
+ associatedCapabilities: Array<Capability>;
origVal: string;
isValid: boolean;
@@ -70,6 +73,7 @@ export class ConsumptionInputDetails extends ConsumptionInput {
this.assignValueLabel = input.assignValueLabel;
this.associatedProps = input.associatedProps;
this.associatedInterfaces = input.associatedInterfaces;
+ this.associatedCapabilities = input.associatedCapabilities;
this.origVal = input.value || "";
this.isValid = input.isValid;
}
@@ -128,15 +132,18 @@ export class ServiceConsumptionComponent {
@Input() selectedService: Service;
@Input() selectedServiceInstanceId: string;
@Input() instancesMappedList: Array<ServiceInstanceObject>;
+ @Input() instancesCapabilitiesMap: Map<string, Array<Capability>>;
@Input() readonly: boolean;
selectedInstanceSiblings: Array<ServiceInstanceObject>;
selectedInstancePropertiesList: Array<PropertyBEModel> = [];
+ selectedInstanceCapabilitisList: Array<Capability> = [];
constructor(private ModalServiceNg2: ModalService, private serviceServiceNg2: ServiceServiceNg2, private componentServiceNg2: ComponentServiceNg2, private componentInstanceServiceNg2:ComponentInstanceServiceNg2) {}
ngOnInit() {
this.updateSelectedInstancePropertiesAndSiblings();
+ this.updateSelectedServiceCapabilities();
}
ngOnChanges(changes) {
@@ -146,9 +153,11 @@ export class ServiceConsumptionComponent {
this.selectedService = changes.selectedService.currentValue;
}
this.updateSelectedInstancePropertiesAndSiblings();
+ this.updateSelectedServiceCapabilities();
}
if(changes.instancesMappedList && !_.isEqual(changes.instancesMappedList.currentValue, changes.instancesMappedList.previousValue)) {
this.updateSelectedInstancePropertiesAndSiblings();
+ this.updateSelectedServiceCapabilities();
}
}
@@ -166,6 +175,13 @@ export class ServiceConsumptionComponent {
this.selectedInstanceSiblings = _.filter(this.instancesMappedList, coInstance => coInstance.id !== this.selectedServiceInstanceId);
}
+ updateSelectedServiceCapabilities() {
+ this.selectedInstanceCapabilitisList = _.filter(
+ CapabilitiesGroup.getFlattenedCapabilities(this.selectedService.capabilities),
+ cap => cap.properties && cap.ownerId === this.selectedService.uniqueId
+ );
+ }
+
expandCollapseInterfaceGroup(currInterface) {
currInterface.isExpanded = !currInterface.isExpanded;
}
@@ -190,7 +206,9 @@ export class ServiceConsumptionComponent {
parentServiceInputs: this.parentServiceInputs,
selectedServiceProperties: this.selectedInstancePropertiesList,
selectedServiceInstanceId: this.selectedServiceInstanceId,
- selectedInstanceSiblings: this.selectedInstanceSiblings
+ selectedInstanceSiblings: this.selectedInstanceSiblings,
+ selectedInstanceCapabilitisList: this.selectedInstanceCapabilitisList,
+ siblingsCapabilitiesList: this.instancesCapabilitiesMap
}
);
this.modalInstance.instance.open();
diff --git a/catalog-ui/src/app/ng2/pages/interface-operation/interface-operation.page.component.ts b/catalog-ui/src/app/ng2/pages/interface-operation/interface-operation.page.component.ts
index 9db24b6071..c2a9582ed4 100644
--- a/catalog-ui/src/app/ng2/pages/interface-operation/interface-operation.page.component.ts
+++ b/catalog-ui/src/app/ng2/pages/interface-operation/interface-operation.page.component.ts
@@ -9,14 +9,20 @@ import {Observable} from "rxjs/Observable";
import {ModalComponent} from 'app/ng2/components/ui/modal/modal.component';
import {ModalService} from 'app/ng2/services/modal.service';
-import {ModalModel, ButtonModel, InputBEModel, OperationModel, InterfaceModel, WORKFLOW_ASSOCIATION_OPTIONS} from 'app/models';
+import {
+ InputBEModel,
+ OperationModel,
+ InterfaceModel,
+ WORKFLOW_ASSOCIATION_OPTIONS,
+ CapabilitiesGroup,
+ Capability
+} from 'app/models';
import {IModalConfig, IModalButtonComponent} from "sdc-ui/lib/angular/modals/models/modal-config";
import {SdcUiComponents} from "sdc-ui/lib/angular";
import {ModalButtonComponent} from "sdc-ui/lib/angular/components";
import {ComponentServiceNg2} from 'app/ng2/services/component-services/component.service';
-import {ComponentGenericResponse} from 'app/ng2/services/responses/component-generic-response';
import {WorkflowServiceNg2} from 'app/ng2/services/workflow.service';
import {PluginsService} from "app/ng2/services/plugins.service";
@@ -114,6 +120,7 @@ export class InterfaceOperationComponent {
modalTranslation: ModalTranslation;
workflowIsOnline: boolean;
workflows: Array<any>;
+ capabilities: CapabilitiesGroup;
@Input() component: IComponent;
@Input() readonly: boolean;
@@ -141,7 +148,8 @@ export class InterfaceOperationComponent {
Observable.forkJoin(
this.ComponentServiceNg2.getInterfaces(this.component),
this.ComponentServiceNg2.getComponentInputs(this.component),
- this.ComponentServiceNg2.getInterfaceTypes(this.component)
+ this.ComponentServiceNg2.getInterfaceTypes(this.component),
+ this.ComponentServiceNg2.getCapabilitiesAndRequirements(this.component.componentType, this.component.uniqueId)
).subscribe((response: Array<any>) => {
const callback = (workflows) => {
this.isLoading = false;
@@ -150,6 +158,7 @@ export class InterfaceOperationComponent {
this.inputs = response[1].inputs;
this.interfaceTypes = response[2];
this.workflows = workflows;
+ this.capabilities = response[3].capabilities;
};
if (this.enableWorkflowAssociation && this.workflowIsOnline) {
this.WorkflowServiceNg2.getWorkflows().subscribe(
@@ -267,7 +276,8 @@ export class InterfaceOperationComponent {
readonly: this.readonly,
interfaceTypes: this.interfaceTypes,
validityChangedCallback: this.enableOrDisableSaveButton,
- workflowIsOnline: this.workflowIsOnline
+ workflowIsOnline: this.workflowIsOnline,
+ capabilities: _.filter(CapabilitiesGroup.getFlattenedCapabilities(this.capabilities), (capability: Capability) => capability.ownerId === this.component.uniqueId)
};
const modalConfig: IModalConfig = {
diff --git a/catalog-ui/src/app/ng2/pages/interface-operation/operation-creator/operation-creator.component.html b/catalog-ui/src/app/ng2/pages/interface-operation/operation-creator/operation-creator.component.html
index 8f70f7f584..ec056ad6f2 100644
--- a/catalog-ui/src/app/ng2/pages/interface-operation/operation-creator/operation-creator.component.html
+++ b/catalog-ui/src/app/ng2/pages/interface-operation/operation-creator/operation-creator.component.html
@@ -184,16 +184,17 @@
</div>
<param-row
- *ngFor="let param of tableParameters"
- class="data-row"
- [isInputParam]="currentTab === TYPE_INPUT"
- [isAssociateWorkflow]="isUsingExistingWF()"
- [param]="param"
- [inputProps]="inputProperties"
- [operationOutputs]="operationOutputs"
- [onRemoveParam]="onRemoveParam"
- [readonly]="readonly"
- [validityChanged]="validityChanged">
+ *ngFor="let param of tableParameters"
+ class="data-row"
+ [isInputParam]="currentTab === TYPE_INPUT"
+ [isAssociateWorkflow]="isUsingExistingWF()"
+ [param]="param"
+ [inputProps]="inputProperties"
+ [capabilitiesProps]="componentCapabilities"
+ [operationOutputs]="operationOutputs"
+ [onRemoveParam]="onRemoveParam"
+ [readonly]="readonly"
+ [validityChanged]="validityChanged">
</param-row>
</div>
diff --git a/catalog-ui/src/app/ng2/pages/interface-operation/operation-creator/operation-creator.component.ts b/catalog-ui/src/app/ng2/pages/interface-operation/operation-creator/operation-creator.component.ts
index a574460478..e12905654b 100644
--- a/catalog-ui/src/app/ng2/pages/interface-operation/operation-creator/operation-creator.component.ts
+++ b/catalog-ui/src/app/ng2/pages/interface-operation/operation-creator/operation-creator.component.ts
@@ -5,7 +5,15 @@ import {Subscription} from "rxjs/Subscription";
import {TranslateService} from "app/ng2/shared/translator/translate.service";
import {WorkflowServiceNg2} from 'app/ng2/services/workflow.service';
-import {InterfaceModel, OperationModel, OperationParameter, InputBEModel, RadioButtonModel, WORKFLOW_ASSOCIATION_OPTIONS} from 'app/models';
+import {
+ InterfaceModel,
+ OperationModel,
+ OperationParameter,
+ InputBEModel,
+ RadioButtonModel,
+ WORKFLOW_ASSOCIATION_OPTIONS,
+ Capability
+} from 'app/models';
import {IDropDownOption} from "sdc-ui/lib/angular/form-elements/dropdown/dropdown-models";
import {Tabs, Tab} from "app/ng2/components/ui/tabs/tabs.component";
@@ -39,7 +47,8 @@ export interface OperationCreatorInput {
readonly: boolean,
interfaceTypes: { [interfaceType: string]: Array<string> },
validityChangedCallback: Function,
- workflowIsOnline: boolean;
+ workflowIsOnline: boolean,
+ capabilities: Array<Capability>
}
@Component({
@@ -59,6 +68,7 @@ export class OperationCreatorComponent implements OperationCreatorInput {
interfaceTypes: { [interfaceType: string]: Array<string> };
operationNames: Array<TypedDropDownOption> = [];
validityChangedCallback: Function;
+ capabilities: Array<Capability>;
allWorkflows: Array<any>;
workflows: Array<DropdownValue> = [];
@@ -73,6 +83,7 @@ export class OperationCreatorComponent implements OperationCreatorInput {
outputParameters: Array<OperationParameter> = [];
noAssignOutputParameters: Array<OperationParameter> = [];
assignOutputParameters: { [key: string]: { [key: string]: Array<OperationParameter>; }; } = {};
+ componentCapabilities: Array<Capability> = [];
tableParameters: Array<OperationParameter> = [];
operationOutputs: Array<OperationModel> = [];
@@ -171,6 +182,7 @@ export class OperationCreatorComponent implements OperationCreatorInput {
}
}
this.reconstructOperation();
+ this.filterCapabilities();
this.validityChanged();
this.updateTable();
}
@@ -217,6 +229,10 @@ export class OperationCreatorComponent implements OperationCreatorInput {
}
+ filterCapabilities() {
+ this.componentCapabilities = _.filter(this.capabilities, (cap: Capability) => cap.properties);
+ }
+
buildParams = () => {
if (this.inputOperation.outputs) {
diff --git a/catalog-ui/src/app/ng2/pages/interface-operation/operation-creator/param-row/param-row.component.html b/catalog-ui/src/app/ng2/pages/interface-operation/operation-creator/param-row/param-row.component.html
index 3ac9328487..4a4782eaee 100644
--- a/catalog-ui/src/app/ng2/pages/interface-operation/operation-creator/param-row/param-row.component.html
+++ b/catalog-ui/src/app/ng2/pages/interface-operation/operation-creator/param-row/param-row.component.html
@@ -58,6 +58,15 @@
{{output.label}}
</option>
</optgroup>
+ <optgroup
+ *ngFor="let cap of filteredCapabilitiesProps"
+ label="{{cap.capabilityName}}">
+ <option
+ *ngFor="let prop of cap.properties"
+ [ngValue]="prop.value">
+ {{prop.label}}
+ </option>
+ </optgroup>
</select>
<span
*ngIf="!filteredInputProps.length && !operationOutputCats.length && isAssociateWorkflow"
diff --git a/catalog-ui/src/app/ng2/pages/interface-operation/operation-creator/param-row/param-row.component.ts b/catalog-ui/src/app/ng2/pages/interface-operation/operation-creator/param-row/param-row.component.ts
index bdf1003a64..c18fb82094 100644
--- a/catalog-ui/src/app/ng2/pages/interface-operation/operation-creator/param-row/param-row.component.ts
+++ b/catalog-ui/src/app/ng2/pages/interface-operation/operation-creator/param-row/param-row.component.ts
@@ -1,7 +1,6 @@
import {Component, Input} from '@angular/core';
import {DataTypeService} from "app/ng2/services/data-type.service";
-import {OperationModel, OperationParameter, InputBEModel, DataTypeModel} from 'app/models';
-import {DropDownOption} from "../operation-creator.component";
+import {OperationModel, OperationParameter, InputBEModel, DataTypeModel, Capability} from 'app/models';
import {DropdownValue} from "app/ng2/components/ui/form-components/dropdown/ui-element-dropdown.component";
class DropdownValueType extends DropdownValue {
@@ -25,6 +24,7 @@ export class ParamRowComponent {
@Input() param: OperationParameter;
@Input() inputProps: Array<InputBEModel>;
@Input() operationOutputs: Array<OperationModel>;
+ @Input() capabilitiesProps: Array<Capability>;
@Input() onRemoveParam: Function;
@Input() isAssociateWorkflow: boolean;
@Input() readonly: boolean;
@@ -34,6 +34,7 @@ export class ParamRowComponent {
propTypeEnum: Array<string> = [];
operationOutputCats: Array<{ operationName: string, outputs: Array<DropdownValueType> }> = [];
filteredInputProps: Array<DropdownValue> = [];
+ filteredCapabilitiesProps: Array<{capabilityName: string, properties: Array<DropdownValueType>}> = [];
constructor(private dataTypeService: DataTypeService) {}
@@ -113,6 +114,26 @@ export class ParamRowComponent {
category => category.outputs.length > 0
);
+ this.filteredCapabilitiesProps = _.filter(
+ _.map(
+ this.capabilitiesProps,
+ cap => {
+ return {
+ capabilityName: cap.name,
+ properties: _.map(
+ _.filter(cap.properties, prop => !this.param.type || prop.type === this.param.type),
+ prop => new DropdownValueType(
+ prop.uniqueId,
+ prop.name,
+ prop.type
+ )
+ )
+ };
+ }
+ ),
+ capability => capability.properties.length > 0
+ );
+
if (this.param.inputId) {
const selProp = this.getSelectedProp();
if (selProp && selProp.type === this.param.type) {
@@ -181,6 +202,12 @@ export class ParamRowComponent {
(acc, cat) => [...acc, ...cat.outputs],
[]),
(out: DropdownValueType) => this.param.inputId === out.value
+ ) || _.find(
+ _.reduce(
+ this.filteredCapabilitiesProps,
+ (acc, cap) => [...acc, ...cap.properties],
+ []),
+ (prop: DropdownValueType) => this.param.inputId === prop.value
);
}
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 9f406f8c76..061439800f 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
@@ -21,11 +21,32 @@
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 {
+ PropertyFEModel,
+ InstanceFePropertiesMap,
+ InstanceBePropertiesMap,
+ InstancePropertiesAPIMap,
+ Component as ComponentData,
+ FilterPropertiesAssignmentData,
+ ModalModel,
+ ButtonModel,
+ Capability,
+ ToscaPresentationData
+} from "app/models";
import { ResourceType } from "app/utils";
import {ComponentServiceNg2} from "../../services/component-services/component.service";
import {ComponentInstanceServiceNg2} from "../../services/component-instance-services/component-instance.service"
-import { InputBEModel, InputFEModel, ComponentInstance, GroupInstance, PolicyInstance, PropertyBEModel, DerivedFEProperty, SimpleFlatProperty } from "app/models";
+import {
+ InputBEModel,
+ InputFEModel,
+ ComponentInstance,
+ GroupInstance,
+ PolicyInstance,
+ PropertyBEModel,
+ DerivedFEProperty,
+ SimpleFlatProperty,
+ CapabilitiesGroup
+} from "app/models";
import { KeysPipe } from 'app/ng2/pipes/keys.pipe';
import {WorkspaceMode, EVENTS} from "../../../utils/constants";
import {EventListenerService} from "app/services/event-listener-service"
@@ -45,6 +66,7 @@ import { SdcUiComponents } from "sdc-ui/lib/angular";
//import { ModalService as ModalServiceSdcUI} from "sdc-ui/lib/angular/modals/modal.service";
import { IModalButtonComponent } from "sdc-ui/lib/angular/modals/models/modal-config";
import { UnsavedChangesComponent } from "app/ng2/components/ui/forms/unsaved-changes/unsaved-changes.component";
+import {Observable} from "rxjs";
import { DataTypeService } from "app/ng2/services/data-type.service";
import { DataTypeModel } from "app/models";
import { PROPERTY_DATA, PROPERTY_TYPES } from "app/utils";
@@ -96,6 +118,8 @@ export class PropertiesAssignmentComponent {
savingChangedData:boolean;
stateChangeStartUnregister:Function;
serviceBePropertiesMap: InstanceBePropertiesMap;
+ serviceBeCapabilitiesPropertiesMap: InstanceBePropertiesMap;
+ selectedInstance_FlattenCapabilitiesList: Array<Capability>;
@ViewChild('hierarchyNavTabs') hierarchyNavTabs: Tabs;
@ViewChild('propertyInputTabs') propertyInputTabs: Tabs;
@@ -243,12 +267,14 @@ export class PropertiesAssignmentComponent {
this.loadingProperties = true;
if (instance instanceof ComponentInstance) {
let instanceBePropertiesMap: InstanceBePropertiesMap = new InstanceBePropertiesMap();
+ this.selectedInstance_FlattenCapabilitiesList = instance.capabilities ? CapabilitiesGroup.getFlattenedCapabilities(instance.capabilities) : [];
if (this.isInput(instance.originType)) {
this.componentInstanceServiceNg2
.getComponentInstanceInputs(this.component, instance)
.subscribe(response => {
instanceBePropertiesMap[instance.uniqueId] = response;
this.processInstancePropertiesResponse(instanceBePropertiesMap, true);
+ this.processInstanceCapabilitiesPropertiesResponse(false);
this.loadingProperties = false;
}, error => {
}); //ignore error
@@ -260,6 +286,7 @@ export class PropertiesAssignmentComponent {
.subscribe(response => {
instanceBePropertiesMap[instance.uniqueId] = response;
this.processInstancePropertiesResponse(instanceBePropertiesMap, false);
+ this.processInstanceCapabilitiesPropertiesResponse(false);
this.loadingProperties = false;
}, error => {
}); //ignore error
@@ -305,6 +332,40 @@ export class PropertiesAssignmentComponent {
this.checkedChildPropertiesCount = 0;
};
+ processInstanceCapabilitiesPropertiesResponse = (originTypeIsVF: boolean) => {
+ let selectedComponentInstanceData = <ComponentInstance>(this.selectedInstanceData);
+ let currentUniqueId = this.selectedInstanceData.uniqueId;
+ this.serviceBeCapabilitiesPropertiesMap = new InstanceBePropertiesMap();
+ let isCapabilityOwnedByInstance: boolean;
+ this.serviceBeCapabilitiesPropertiesMap[currentUniqueId] = _.reduce(
+ this.selectedInstance_FlattenCapabilitiesList,
+ (result, cap: Capability) => {
+ isCapabilityOwnedByInstance = cap.ownerId === currentUniqueId ||
+ selectedComponentInstanceData.isServiceProxy() && cap.ownerId === selectedComponentInstanceData.sourceModelUid;
+ if (cap.properties && isCapabilityOwnedByInstance) {
+ _.forEach(cap.properties, prop => {
+ if (!prop.origName) {
+ prop.origName = prop.name;
+ prop.name = cap.name + '_' + prop.name;//for display. (before save - the name returns to its orig value: prop.name)
+ }
+ });
+ return result.concat(cap.properties);
+ }
+ return result;
+ }, []);
+ let instanceFECapabilitiesPropertiesMap = this.propertiesUtils.convertPropertiesMapToFEAndCreateChildren(this.serviceBeCapabilitiesPropertiesMap, originTypeIsVF, this.inputs); //create flattened children, disable declared props, and init values
+ //update FECapabilitiesProperties with their origName according to BeCapabilitiesProperties
+ _.forEach(instanceFECapabilitiesPropertiesMap[currentUniqueId], prop => {
+ prop.origName = _.find(this.serviceBeCapabilitiesPropertiesMap[currentUniqueId], p => p.uniqueId === prop.uniqueId).origName;
+ });
+ //concatenate capabilitiesProps to all props list
+ this.instanceFePropertiesMap[currentUniqueId] = (this.instanceFePropertiesMap[currentUniqueId] || []).concat(instanceFECapabilitiesPropertiesMap[currentUniqueId]);
+ this.checkedPropertiesCount = 0;
+ };
+
+ isCapabilityProperty = (prop: PropertyBEModel) => {
+ return _.find(this.selectedInstance_FlattenCapabilitiesList, cap => cap.uniqueId === prop.parentUniqueId);
+ };
/*** VALUE CHANGE EVENTS ***/
dataChanged = (item:PropertyFEModel|InputFEModel) => {
@@ -439,6 +500,33 @@ export class PropertiesAssignmentComponent {
let inputsToCreate: InstancePropertiesAPIMap = new InstancePropertiesAPIMap(selectedComponentInstancesInputs, selectedComponentInstancesProperties, selectedGroupInstancesProperties, selectedPolicyInstancesProperties);
+ //move changed capabilities properties from componentInstanceInputsMap obj to componentInstanceProperties
+ inputsToCreate.componentInstanceProperties[this.selectedInstanceData.uniqueId] =
+ (inputsToCreate.componentInstanceProperties[this.selectedInstanceData.uniqueId] || []).concat(
+ _.filter(
+ inputsToCreate.componentInstanceInputsMap[this.selectedInstanceData.uniqueId],
+ (prop: PropertyBEModel) => this.isCapabilityProperty(prop)
+ )
+ );
+ inputsToCreate.componentInstanceInputsMap[this.selectedInstanceData.uniqueId] = _.filter(
+ inputsToCreate.componentInstanceInputsMap[this.selectedInstanceData.uniqueId],
+ prop => !this.isCapabilityProperty(prop)
+ );
+ if (inputsToCreate.componentInstanceInputsMap[this.selectedInstanceData.uniqueId].length === 0) {
+ delete inputsToCreate.componentInstanceInputsMap[this.selectedInstanceData.uniqueId];
+ }
+
+ let isCapabilityPropertyChanged = false;
+ _.forEach(
+ inputsToCreate.componentInstanceProperties[this.selectedInstanceData.uniqueId],
+ (prop: PropertyBEModel) => {
+ prop.name = prop.origName || prop.name;
+ if (this.isCapabilityProperty(prop)) {
+ isCapabilityPropertyChanged = true;
+ }
+ }
+ );
+
this.componentServiceNg2
.createInput(this.component, inputsToCreate, this.isSelf())
.subscribe(response => {
@@ -451,6 +539,9 @@ export class PropertiesAssignmentComponent {
this.inputs.push(newInput);
this.updatePropertyValueAfterDeclare(newInput);
});
+ if (isCapabilityPropertyChanged) {
+ this.reloadInstanceCapabilities();
+ }
}, error => {}); //ignore error
};
@@ -625,18 +716,37 @@ export class PropertiesAssignmentComponent {
// make request and its handlers
let request;
let handleSuccess, handleError;
+ let changedInputsProperties = [], changedCapabilitiesProperties = [];
if (this.isPropertiesTabSelected) {
const changedProperties: PropertyBEModel[] = this.changedData.map((changedProp) => {
changedProp = <PropertyFEModel>changedProp;
const propBE = new PropertyBEModel(changedProp);
+ propBE.toscaPresentation = new ToscaPresentationData();
+ propBE.toscaPresentation.ownerId = changedProp.parentUniqueId;
propBE.value = changedProp.getJSONValue();
+ propBE.name = changedProp.origName || changedProp.name;
+ delete propBE.origName;
return propBE;
});
+ changedCapabilitiesProperties = _.filter(changedProperties, prop => this.isCapabilityProperty(prop));
if (this.selectedInstanceData instanceof ComponentInstance) {
if (this.isInput(this.selectedInstanceData.originType)) {
- request = this.componentInstanceServiceNg2
- .updateInstanceInputs(this.component, this.selectedInstanceData.uniqueId, changedProperties);
+ changedInputsProperties = _.filter(changedProperties, prop => !this.isCapabilityProperty(prop));
+ if (changedInputsProperties.length && changedCapabilitiesProperties.length) {
+ request = Observable.forkJoin(
+ this.componentInstanceServiceNg2.updateInstanceInputs(this.component, this.selectedInstanceData.uniqueId, changedInputsProperties),
+ this.componentInstanceServiceNg2.updateInstanceProperties(this.component, this.selectedInstanceData.uniqueId, changedCapabilitiesProperties)
+ );
+ }
+ else if (changedInputsProperties.length) {
+ request = this.componentInstanceServiceNg2
+ .updateInstanceInputs(this.component, this.selectedInstanceData.uniqueId, changedInputsProperties);
+ }
+ else if (changedCapabilitiesProperties.length) {
+ request = this.componentInstanceServiceNg2
+ .updateInstanceProperties(this.component, this.selectedInstanceData.uniqueId, changedCapabilitiesProperties);
+ }
handleSuccess = (response) => {
// reset each changed property with new value and remove it from changed properties list
response.forEach((resInput) => {
@@ -714,6 +824,9 @@ export class PropertiesAssignmentComponent {
request.subscribe(
(response) => {
this.savingChangedData = false;
+ if (changedCapabilitiesProperties.length) {
+ this.reloadInstanceCapabilities();
+ }
handleSuccess && handleSuccess(response);
this.updateHasChangedData();
resolve(response);
@@ -728,6 +841,19 @@ export class PropertiesAssignmentComponent {
});
};
+ reloadInstanceCapabilities = (): void => {
+ let currentInstanceIndex = _.findIndex(this.instances, instance => instance.uniqueId == this.selectedInstanceData.uniqueId);
+ this.componentServiceNg2.getComponentResourceInstances(this.component).subscribe(result => {
+ let instanceCapabilitiesData: CapabilitiesGroup = _.reduce(result.componentInstances, (res, instance) => {
+ if (instance.uniqueId === this.selectedInstanceData.uniqueId) {
+ return instance.capabilities;
+ }
+ return res;
+ }, new CapabilitiesGroup());
+ (<ComponentInstance>this.instances[currentInstanceIndex]).capabilities = instanceCapabilitiesData;
+ });
+ };
+
reverseChangedData = ():void => {
// make reverse item handler
let handleReverseItem;
@@ -814,8 +940,10 @@ export class PropertiesAssignmentComponent {
updatePropertyValueAfterDeclare = (input: InputFEModel) => {
if (this.instanceFePropertiesMap[input.instanceUniqueId]) {
+ let instanceName = input.instanceUniqueId.slice(input.instanceUniqueId.lastIndexOf('.') + 1);
let propertyForUpdatindVal = _.find(this.instanceFePropertiesMap[input.instanceUniqueId], (feProperty: PropertyFEModel) => {
- return feProperty.name == input.relatedPropertyName;
+ return feProperty.uniqueId === input.propertyId &&
+ (feProperty.name == input.relatedPropertyName || input.name === instanceName.concat('_').concat(feProperty.name.replace(/[.]/g, '_')));
});
let inputPath = (input.inputPath && input.inputPath != propertyForUpdatindVal.name) ? input.inputPath : undefined;
propertyForUpdatindVal.setAsDeclared(inputPath); //set prop as declared before assigning value
diff --git a/catalog-ui/src/app/ng2/pages/req-and-capabilities-editor/capabilities-editor/capabilities-editor.component.ts b/catalog-ui/src/app/ng2/pages/req-and-capabilities-editor/capabilities-editor/capabilities-editor.component.ts
index 82e2e464cc..32a73efa85 100644
--- a/catalog-ui/src/app/ng2/pages/req-and-capabilities-editor/capabilities-editor/capabilities-editor.component.ts
+++ b/catalog-ui/src/app/ng2/pages/req-and-capabilities-editor/capabilities-editor/capabilities-editor.component.ts
@@ -62,6 +62,10 @@ export class CapabilitiesEditorComponent {
let selectedCapabilityTypeObj: CapabilityTypeModel = this.input.capabilityTypesList.find(capType => capType.toscaPresentation.type === selectedCapType.value);
this.capabilityData.description = selectedCapabilityTypeObj.toscaPresentation.description;
this.capabilityData.validSourceTypes = selectedCapabilityTypeObj.toscaPresentation.validTargetTypes;
+ this.capabilityData.properties = _.forEach(
+ _.toArray(selectedCapabilityTypeObj.properties),
+ prop => prop.uniqueId = null //a requirement for the BE
+ );
}
this.validityChanged();
}
diff --git a/catalog-ui/src/app/ng2/pages/service-consumption-editor/service-consumption-editor.component.html b/catalog-ui/src/app/ng2/pages/service-consumption-editor/service-consumption-editor.component.html
index e77d880176..2c4e2886a1 100644
--- a/catalog-ui/src/app/ng2/pages/service-consumption-editor/service-consumption-editor.component.html
+++ b/catalog-ui/src/app/ng2/pages/service-consumption-editor/service-consumption-editor.component.html
@@ -77,6 +77,15 @@
{{output.name}}
</option>
</optgroup>
+ <optgroup
+ *ngFor="let cap of consumptionInput.associatedCapabilities"
+ label="{{cap.name}}">
+ <option
+ *ngFor="let prop of cap.properties"
+ [ngValue]="cap.name + '_' + prop.name">
+ {{prop.name}}
+ </option>
+ </optgroup>
</select>
</div>
</div>
diff --git a/catalog-ui/src/app/ng2/pages/service-consumption-editor/service-consumption-editor.component.ts b/catalog-ui/src/app/ng2/pages/service-consumption-editor/service-consumption-editor.component.ts
index 25f412671f..2c86cc5c5c 100644
--- a/catalog-ui/src/app/ng2/pages/service-consumption-editor/service-consumption-editor.component.ts
+++ b/catalog-ui/src/app/ng2/pages/service-consumption-editor/service-consumption-editor.component.ts
@@ -17,7 +17,17 @@
import * as _ from "lodash";
import { Component } from '@angular/core';
import {ServiceServiceNg2} from "app/ng2/services/component-services/service.service";
-import {Service, ServiceInstanceObject, InstanceFePropertiesMap, InstanceBePropertiesMap, PropertyBEModel, InputBEModel, OperationModel, InterfaceModel} from 'app/models';
+import {
+ Service,
+ ServiceInstanceObject,
+ InstanceFePropertiesMap,
+ InstanceBePropertiesMap,
+ PropertyBEModel,
+ InputBEModel,
+ OperationModel,
+ InterfaceModel,
+ Capability
+} from 'app/models';
import {ConsumptionInput, ConsumptionInputDetails, ServiceOperation} from 'app/ng2/components/logic/service-consumption/service-consumption.component';
import {PropertiesUtils} from "app/ng2/pages/properties-assignment/services/properties.utils";
import { PROPERTY_DATA } from 'app/utils';
@@ -33,7 +43,7 @@ import { PROPERTY_DATA } from 'app/utils';
export class ServiceConsumptionCreatorComponent {
input: {
- interfaceId: string;
+ interfaceId: string,
serviceOperationIndex: number,
serviceOperations: Array<ServiceOperation>,
parentService: Service,
@@ -41,7 +51,9 @@ export class ServiceConsumptionCreatorComponent {
parentServiceInputs: Array<InputBEModel>,
selectedServiceProperties: Array<PropertyBEModel>,
selectedServiceInstanceId: String,
- selectedInstanceSiblings: Array<ServiceInstanceObject>
+ selectedInstanceSiblings: Array<ServiceInstanceObject>,
+ selectedInstanceCapabilitisList: Array<Capability>,
+ siblingsCapabilitiesList: Map<string, Array<Capability>>
};
sourceTypes: Array<any> = [];
serviceOperationsList: Array<ServiceOperation>;
@@ -80,16 +92,24 @@ export class ServiceConsumptionCreatorComponent {
initSourceTypes() {
this.sourceTypes = [
- { label: this.SOURCE_TYPES.STATIC, value: this.SOURCE_TYPES.STATIC, options: [], interfaces: []},
+ {
+ label: this.SOURCE_TYPES.STATIC,
+ value: this.SOURCE_TYPES.STATIC,
+ options: [],
+ interfaces: [],
+ capabilities: []
+ },
{ label: this.SOURCE_TYPES.SELF + ' (' + this.selectedService.name + ')',
value: this.selectedServiceInstanceId,
options: this.selectedServiceProperties,
- interfaces: this.selectedService.interfaces
+ interfaces: this.selectedService.interfaces,
+ capabilities: this.input.selectedInstanceCapabilitisList
},
{ label: this.parentService.name,
value: this.parentService.uniqueId,
options: this.parentServiceInputs,
- interfaces: []
+ interfaces: [],
+ capabilities: []
}
];
_.forEach(this.input.selectedInstanceSiblings, sib =>
@@ -97,7 +117,8 @@ export class ServiceConsumptionCreatorComponent {
label: sib.name,
value: sib.id,
options: _.unionBy(sib.inputs, sib.properties, 'uniqueId'),
- interfaces: sib.interfaces
+ interfaces: sib.interfaces,
+ capabilities: this.input.siblingsCapabilitiesList[sib.id]
})
);
}
@@ -160,6 +181,7 @@ export class ServiceConsumptionCreatorComponent {
consumptionInputDetails.assignValueLabel = this.getAssignValueLabel(sourceVal);
consumptionInputDetails.associatedProps = filteredListsObj.associatedPropsList;
consumptionInputDetails.associatedInterfaces = filteredListsObj.associatedInterfacesList;
+ consumptionInputDetails.associatedCapabilities = filteredListsObj.associatedCapabilitiesList;
return new ConsumptionInputDetails(consumptionInputDetails);
});
}
@@ -171,6 +193,7 @@ export class ServiceConsumptionCreatorComponent {
let filteredListsObj = this.getFilteredProps(consumptionInput.source, consumptionInput.type);
consumptionInput.associatedProps = filteredListsObj.associatedPropsList;
consumptionInput.associatedInterfaces = filteredListsObj.associatedInterfacesList;
+ consumptionInput.associatedCapabilities = filteredListsObj.associatedCapabilitiesList;
if(consumptionInput.source === this.SOURCE_TYPES.STATIC) {
if(PROPERTY_DATA.SIMPLE_TYPES.indexOf(consumptionInput.type) !== -1) {
consumptionInput.value = consumptionInput.defaultValue || "";
@@ -184,7 +207,7 @@ export class ServiceConsumptionCreatorComponent {
private getFilteredProps(sourceVal, inputType) {
let currentSourceObj = this.sourceTypes.find(s => s.value === sourceVal);
- let associatedInterfacesList = [], associatedPropsList = [];
+ let associatedInterfacesList = [], associatedPropsList = [], associatedCapabilitiesPropsList: Array<Capability> = [];
if(currentSourceObj) {
if (currentSourceObj.interfaces) {
associatedInterfacesList = this.getFilteredInterfaceOutputs(currentSourceObj, inputType);
@@ -195,10 +218,22 @@ export class ServiceConsumptionCreatorComponent {
}
return result;
}, []);
+ associatedCapabilitiesPropsList =
+ _.reduce(currentSourceObj.capabilities,
+ (filteredCapsList, capability: Capability) => {
+ let filteredProps = _.filter(capability.properties, prop => prop.type === inputType);
+ if (filteredProps.length) {
+ let cap = new Capability(capability);
+ cap.properties = filteredProps;
+ filteredCapsList.push(cap);
+ }
+ return filteredCapsList
+ }, []);
}
return {
associatedPropsList: associatedPropsList,
- associatedInterfacesList: associatedInterfacesList
+ associatedInterfacesList: associatedInterfacesList,
+ associatedCapabilitiesList: associatedCapabilitiesPropsList
}
}
diff --git a/catalog-ui/src/app/ng2/services/component-services/service.service.ts b/catalog-ui/src/app/ng2/services/component-services/service.service.ts
index 406ac77ec4..dce4e814ec 100644
--- a/catalog-ui/src/app/ng2/services/component-services/service.service.ts
+++ b/catalog-ui/src/app/ng2/services/component-services/service.service.ts
@@ -115,7 +115,9 @@ export class ServiceServiceNg2 extends ComponentServiceNg2 {
COMPONENT_FIELDS.COMPONENT_INSTANCES_INTERFACES,
COMPONENT_FIELDS.COMPONENT_INSTANCES_PROPERTIES,
COMPONENT_FIELDS.COMPONENT_INSTANCES_INPUTS,
- COMPONENT_FIELDS.COMPONENT_INPUTS
+ COMPONENT_FIELDS.COMPONENT_INPUTS,
+ COMPONENT_FIELDS.COMPONENT_INSTANCES,
+ COMPONENT_FIELDS.COMPONENT_CAPABILITIES
]);
}
diff --git a/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/service-consumption/service-consumption-view-model.ts b/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/service-consumption/service-consumption-view-model.ts
index 20e99b0d39..737002303b 100644
--- a/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/service-consumption/service-consumption-view-model.ts
+++ b/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/service-consumption/service-consumption-view-model.ts
@@ -16,7 +16,17 @@
import {ICompositionViewModelScope} from "../../composition-view-model";
-import {Service, PropertiesGroup, InputsGroup, ServiceInstanceObject, InterfaceModel, InputBEModel} from 'app/models';
+import {
+ Service,
+ PropertiesGroup,
+ InputsGroup,
+ ServiceInstanceObject,
+ InterfaceModel,
+ InputBEModel,
+ CapabilitiesGroup,
+ Capability,
+ ComponentInstance
+} from 'app/models';
import {ComponentGenericResponse} from "app/ng2/services/responses/component-generic-response";
import {ServiceServiceNg2} from "app/ng2/services/component-services/service.service";
@@ -27,6 +37,8 @@ interface IServiceConsumptionViewModelScope extends ICompositionViewModelScope {
componentInstancesInputs: InputsGroup;
componentInstancesInterfaces: Map<string, Array<InterfaceModel>>;
componentInputs: Array<InputBEModel>;
+ componentCapabilities: Array<Capability>;
+ instancesCapabilitiesMap: Map<string, Array<Capability>>;
}
@@ -49,10 +61,20 @@ export class ServiceConsumptionViewModel {
this.$scope.componentInstancesInputs = genericResponse.componentInstancesInputs;
this.$scope.componentInstancesInterfaces = genericResponse.componentInstancesInterfaces;
this.$scope.componentInputs = genericResponse.inputs;
+ this.buildInstancesCapabilitiesMap(genericResponse.componentInstances);
this.updateInstanceAttributes();
});
}
+ buildInstancesCapabilitiesMap = (componentInstances: Array<ComponentInstance>): void => {
+ this.$scope.instancesCapabilitiesMap = new Map();
+ let flattenCapabilities = [];
+ _.forEach(componentInstances, componentInstance => {
+ flattenCapabilities = CapabilitiesGroup.getFlattenedCapabilities(componentInstance.capabilities);
+ this.$scope.instancesCapabilitiesMap[componentInstance.uniqueId] = _.filter(flattenCapabilities, cap => cap.properties && cap.ownerId === componentInstance.uniqueId);
+ });
+ }
+
private updateInstanceAttributes = ():void => {
if (this.$scope.isComponentInstanceSelected() && this.$scope.componentInstancesProperties) {
this.$scope.instancesMappedList = this.$scope.service.componentInstances.map(coInstance => new ServiceInstanceObject({
diff --git a/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/service-consumption/service-consumption-view.html b/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/service-consumption/service-consumption-view.html
index 835ded33f6..8404a7f653 100644
--- a/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/service-consumption/service-consumption-view.html
+++ b/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/service-consumption/service-consumption-view.html
@@ -14,6 +14,7 @@
[selected-service-instance-id]="currentComponent.selectedInstance.uniqueId"
[instances-mapped-list]="instancesMappedList"
[parent-service-inputs]="componentInputs"
+ [instances-capabilities-map]="instancesCapabilitiesMap"
[readonly]="isViewMode() || !isDesigner()">
</ng2-service-consumption>
</div>
diff --git a/catalog-ui/src/app/view-models/workspace/tabs/req-and-capabilities/req-and-capabilities-editable-view.html b/catalog-ui/src/app/view-models/workspace/tabs/req-and-capabilities/req-and-capabilities-editable-view.html
index 14bc49e28b..8e1822193b 100644
--- a/catalog-ui/src/app/view-models/workspace/tabs/req-and-capabilities/req-and-capabilities-editable-view.html
+++ b/catalog-ui/src/app/view-models/workspace/tabs/req-and-capabilities/req-and-capabilities-editable-view.html
@@ -96,8 +96,8 @@
<div class="flex-container data-row" data-ng-class="{'editable-row': req.isCreatedManually}"
data-ng-click="req.isCreatedManually && onEditRequirement(req)">
<div class="table-col-general flex-item text ellipsis-text" tooltips
- tooltip-content="{{req.name}}">
- <span data-tests-id="{{req.name}}">{{req.name}}</span>
+ tooltip-content="{{(!req.isCreatedManually ? req.ownerName + '.' : '') + req.name}}">
+ <span data-tests-id="{{(!req.isCreatedManually ? req.ownerName + '.' : '') + req.name}}">{{(!req.isCreatedManually ? req.ownerName + '.' : '') + req.name}}</span>
</div>
<div class="table-col-general flex-item text ellipsis-text" tooltips
tooltip-content="{{req.capability}}">
@@ -148,17 +148,22 @@
<div data-ng-if="filteredCapabilitiesList.length === 0" class="no-row-text"
data-tests-id="no-rows-in-table">
There are no capabilities to display
-
</div>
- <div data-ng-repeat="capability in filteredCapabilitiesList | orderBy:capabilitiesSortTableDefined.sortByField:capabilitiesSortTableDefined.reverse track by $index"
+ <div data-ng-repeat-start="capability in filteredCapabilitiesList | orderBy:capabilitiesSortTableDefined.sortByField:capabilitiesSortTableDefined.reverse track by $index"
class="flex-container data-row"
data-ng-class="{'selected': capability.selected, 'editable-row': capability.isCreatedManually}"
data-ng-click="capability.isCreatedManually && onEditCapability(capability)"
data-tests-id="capabilities-table-row">
<div class="table-col-general flex-item text ellipsis-text" tooltips
- tooltip-content="{{capability.name}}">
- <span data-tests-id="{{capability.name}}">{{capability.name}}</span>
+ tooltip-content="{{(!capability.isCreatedManually ? capability.ownerName + '.' : '') + capability.name}}">
+ <span class="sprite-new arrow-up-small hand"
+ data-ng-class="{'hideme': !capability.properties.length, 'opened': capability.selected}"
+ data-ng-click="capability.selected = !capability.selected; $event.stopPropagation();"></span>
+ <span data-tests-id="{{(!capability.isCreatedManually ? capability.ownerName + '.' : '') + capability.name}}"
+ class="name-col" data-ng-class="{'opened': capability.selected}">
+ {{(!capability.isCreatedManually ? capability.ownerName + '.' : '') + capability.name}}
+ </span>
</div>
<div class="table-col-general flex-item text ellipsis-text" tooltips
tooltip-content="{{capability.type}}">
@@ -188,6 +193,51 @@
data-ng-click="onDeleteCap($event, capability)"></svg-icon>
</div>
</div>
+ <div data-ng-repeat-end data-ng-if="capability.selected" class="item-opened properties-section">
+ <p class="properties-title">Properties</p>
+ <div class="table-container-flex properties-table">
+ <div class="table" data-ng-class="{'view-mode': true}">
+ <div class="head flex-container">
+ <div class="table-header head-row hand flex-item"
+ data-ng-repeat="header in capabilityPropertiesTableHeadersList track by $index"
+ data-ng-click="sort(header.property, propertiesSortTableDefined)">
+ {{header.title}}
+ <span data-ng-if="propertiesSortTableDefined.sortByField === header.property"
+ class="table-header-sort-arrow"
+ data-ng-class="{'down': propertiesSortTableDefined.reverse, 'up':!propertiesSortTableDefined.reverse}"> </span>
+ </div>
+ </div>
+
+ <div class="body">
+ <div data-ng-repeat="property in capability.properties | orderBy:propertiesSortTableDefined.sortByField:propertiesSortTableDefined.reverse track by $index"
+ data-tests-id="propertyRow"
+ class="flex-container data-row">
+ <div class="table-col-general flex-item text"
+ data-tests-id="{{property.name}}"
+ tooltips tooltip-content="{{property.name}}">
+ {{property.name}}
+ </div>
+ <div class="table-col-general flex-item text"
+ data-tests-id="{{property.type}}"
+ tooltips tooltip-content="{{property.type}}">
+ {{property.type}}
+ </div>
+ <div class="table-col-general flex-item text"
+ data-tests-id="{{property.schema.property.type}}"
+ tooltips tooltip-content="{{property.schema.property.type}}">
+ {{property.schema.property.type}}
+ </div>
+ <div class="table-col-general flex-item text"
+ tooltips tooltip-content="{{property.description}}"
+ data-tests-id="{{property.description}}">
+ {{property.description}}
+ </div>
+ </div>
+ </div>
+
+ </div>
+ </div>
+ </div>
</perfect-scrollbar>
</div>
diff --git a/catalog-ui/src/app/view-models/workspace/tabs/req-and-capabilities/req-and-capabilities.less b/catalog-ui/src/app/view-models/workspace/tabs/req-and-capabilities/req-and-capabilities.less
index fa6623f089..928f6719c6 100644
--- a/catalog-ui/src/app/view-models/workspace/tabs/req-and-capabilities/req-and-capabilities.less
+++ b/catalog-ui/src/app/view-models/workspace/tabs/req-and-capabilities/req-and-capabilities.less
@@ -319,63 +319,100 @@
}
}
}
- .table-container-flex .table .head .head-row {
- text-align: left;
- &.description {
- flex: 2;
- }
- &.other {
- flex: 0.25;
- text-align: center;
- }
- &.occurrences {
- flex: 0.75;
- }
- }
- .data-row {
- .ellipsis-text {
- overflow: hidden;
- text-overflow: ellipsis;
- }
- &:not(.editable-row) {
- background: @tlv_color_t;
- cursor: default;
- color: @main_color_n;
- }
- &.editable-row {
- cursor: pointer;
- .table-col-general:hover {
- color: @main_color_b;
+ .table-container-flex .table {
+ .head .head-row {
+ text-align: left;
+ &.description {
+ flex: 2;
}
- }
- .description-col {
- flex: 2;
- }
- .occurrences-col {
- flex: 0.75;
- }
- .other-col {
- display: flex;
- justify-content: center;
- align-items: center;
- flex: 0.25;
- .trash-icon {
- visibility: hidden;
+ &.other {
+ flex: 0.25;
+ text-align: center;
+ }
+ &.occurrences {
+ flex: 0.75;
}
}
- &:hover {
- .trash-icon {
- visibility: visible;
+ .body .data-row {
+ border-bottom: none;
+ border-top: @main_color_o solid 1px;
+ .ellipsis-text {
+ overflow: hidden;
+ text-overflow: ellipsis;
+ }
+ &:not(.editable-row) {
+ background-color: @tlv_color_t;
+ cursor: default;
+ color: @main_color_n;
+ }
+ &.editable-row {
+ cursor: pointer;
+ .table-col-general:hover {
+ color: @main_color_b;
+ }
+ }
+ &.selected {
+ background-color: @tlv_color_v;
+ .name-col {
+ color: @main_color_a;
+ }
+ .sprite-new.arrow-up-small {
+ background-position: -858px -137px;
+ margin-bottom: 2px;
+ }
}
+ .description-col {
+ flex: 2;
+ }
+ .occurrences-col {
+ flex: 0.75;
+ }
+ .other-col {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ flex: 0.25;
+ .trash-icon {
+ visibility: hidden;
+ }
+ }
+ &:hover {
+ .trash-icon {
+ visibility: visible;
+ }
+ }
+ .multiline-ellipsis {
+ line-height: 1.5em;
+ padding: 1px 0 1px 0;
+ /deep/ .ellipsis-directive-more-less {
+ float: none;
+ margin-left: 5px;
+ color: @main_color_a;
+ }
+ }
+ }
+ }
+
+ .item-opened.properties-section {
+ border: 4px solid @tlv_color_v !important;
+ max-height: 263px;
+ overflow: auto;
+ .properties-title {
+ .s_10;
+ margin-top: 10px;
}
- .multiline-ellipsis {
- line-height: 1.5em;
- padding: 1px 0 1px 0;
- /deep/ .ellipsis-directive-more-less {
- float: none;
- margin-left: 5px;
- color: @main_color_a;
+ .properties-table {
+ &.table-container-flex {
+ margin-top: 18px;
+ }
+ .table {
+ .head {
+ border-bottom: 1px solid @main_color_o;
+ }
+ .head, .table-col-general {
+ background-color: @main_color_p;
+ }
}
}
}
-}
+} \ No newline at end of file