aboutsummaryrefslogtreecommitdiffstats
path: root/catalog-ui/src/app/view-models
diff options
context:
space:
mode:
authormiriame <miriam.eini@amdocs.com>2019-02-13 15:17:26 +0200
committermiriame <miriam.eini@amdocs.com>2019-02-14 10:45:13 +0200
commitc2ce914541e694c7d1c8853b88936095e8b9ede4 (patch)
treed9d6dfa4b011c6868048d83a2116743b283b1cb1 /catalog-ui/src/app/view-models
parentd72aaa18d4dbfb8017dce566d9c41ccc00985528 (diff)
Add 'Service Dependencies' tab in composition page
Issue-ID: SDC-1987 Change-Id: Ib5b688c12234c81fe6f89b2b5d37dd16a75b0db9 Signed-off-by: miriame <miriam.eini@amdocs.com>
Diffstat (limited to 'catalog-ui/src/app/view-models')
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/composition/composition-view-model.ts48
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/composition/composition-view.html10
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/details/details-view-model.ts46
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/details/details-view.html2
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/service-dependencies/service-dependencies-view-model.ts125
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/service-dependencies/service-dependencies-view.html25
6 files changed, 235 insertions, 21 deletions
diff --git a/catalog-ui/src/app/view-models/workspace/tabs/composition/composition-view-model.ts b/catalog-ui/src/app/view-models/workspace/tabs/composition/composition-view-model.ts
index a77377bac4..2270a7b06e 100644
--- a/catalog-ui/src/app/view-models/workspace/tabs/composition/composition-view-model.ts
+++ b/catalog-ui/src/app/view-models/workspace/tabs/composition/composition-view-model.ts
@@ -71,6 +71,11 @@ export interface ICompositionViewModelScope extends IWorkspaceViewModelScope {
isPNF():boolean;
isConfiguration():boolean;
preventMoveTab(state: boolean):void;
+ registerCreateInstanceEvent(callback: Function):void;
+ unregisterCreateInstanceEvent():void;
+ registerChangeComponentInstanceNameEvent(callback: Function):void;
+ unregisterChangeComponentInstanceNameEvent():void;
+
ComponentServiceNg2:ComponentServiceNg2,
cacheComponentsInstancesFullData:Component;
}
@@ -116,7 +121,7 @@ export class CompositionViewModel {
private ComponentServiceFactoryNg2: ComponentServiceFactoryNg2,
private ComponentServiceNg2:ComponentServiceNg2,
private Notification:any
- ) {
+ ) {
this.$scope.setValidState(true);
this.initScope();
@@ -165,12 +170,12 @@ export class CompositionViewModel {
this.eventListenerService.registerObserverCallback(GRAPH_EVENTS.ON_NODE_SELECTED, scope.setSelectedInstance);
this.eventListenerService.registerObserverCallback(GRAPH_EVENTS.ON_ZONE_INSTANCE_SELECTED, scope.setSelectedZoneInstance);
this.eventListenerService.registerObserverCallback(GRAPH_EVENTS.ON_GRAPH_BACKGROUND_CLICKED, scope.onBackgroundClick);
- this.eventListenerService.registerObserverCallback(GRAPH_EVENTS.ON_CANVAS_TAG_START, () => {
+ this.eventListenerService.registerObserverCallback(GRAPH_EVENTS.ON_CANVAS_TAG_START, () => {
scope.isCanvasTagging = true;
this.eventListenerService.notifyObservers(EVENTS.ON_WORKSPACE_UNSAVED_CHANGES, true, this.showUnsavedChangesAlert);
});
- this.eventListenerService.registerObserverCallback(GRAPH_EVENTS.ON_CANVAS_TAG_END, () => {
- scope.isCanvasTagging = false;
+ this.eventListenerService.registerObserverCallback(GRAPH_EVENTS.ON_CANVAS_TAG_END, () => {
+ scope.isCanvasTagging = false;
this.resetUnsavedChanges();
});
this.eventListenerService.registerObserverCallback(GRAPH_EVENTS.ON_ZONE_INSTANCE_NAME_CHANGED, scope.changeZoneInstanceName);
@@ -184,13 +189,13 @@ export class CompositionViewModel {
title: "Unsaved Changes",
size: 'sm',
type: 'custom',
-
+
buttons: [
{id: 'cancelButton', text: 'Cancel', type: 'secondary', size: 'xsm', closeModal: true, callback: () => reject()},
{id: 'discardButton', text: 'Discard', type: 'secondary', size: 'xsm', closeModal: true, callback: () => { this.resetUnsavedChanges(); resolve()}},
{id: 'saveButton', text: 'Save', type: 'primary', size: 'xsm', closeModal: true, callback: () => { reject(); this.saveUnsavedChanges(afterSave); }}
- ] as IModalButtonComponent[]
- }, UnsavedChangesComponent, { isValidChangedData: true});
+ ] as IModalButtonComponent[]
+ }, UnsavedChangesComponent, { isValidChangedData: true});
});
return deferred;
@@ -225,7 +230,7 @@ export class CompositionViewModel {
testId: "renameInstanceModal",
buttons: [
{id: 'saveButton', text: 'OK', size: 'xsm', callback: this.saveInstanceName, closeModal: false},
- {id: 'cancelButton', text: 'Cancel', size: 'sm', closeModal: true}
+ {id: 'cancelButton', text: 'Cancel', size: 'sm', closeModal: true}
]
};
@@ -274,7 +279,7 @@ export class CompositionViewModel {
} else {
this.ModalServiceSdcUI.closeModal();
}
-
+
};
private removeSelectedComponentInstance = ():void => {
@@ -372,12 +377,12 @@ export class CompositionViewModel {
this.$scope.selectedZoneInstance = null;
this.$scope.updateSelectedComponent();
-
-
-
if (this.$state.current.name === 'workspace.composition.api') {
this.$state.go('workspace.composition.details');
}
+ if(!selectedComponent.isServiceProxy() && (this.$state.current.name === 'workspace.composition.consumption' || this.$state.current.name === 'workspace.composition.dependencies')) {
+ this.$state.go('workspace.composition.details');
+ }
};
this.$scope.setSelectedZoneInstance = (zoneInstance: ZoneInstance): void => {
@@ -390,7 +395,7 @@ export class CompositionViewModel {
this.$scope.selectedZoneInstance = null;
this.$scope.selectedComponent = this.$scope.currentComponent;
- if (this.$state.current.name === 'workspace.composition.api') {
+ if (this.$state.current.name === 'workspace.composition.api' || this.$state.current.name === 'workspace.composition.consumption' || this.$state.current.name === 'workspace.composition.dependencies') {
this.$state.go('workspace.composition.details');
}
@@ -406,7 +411,7 @@ export class CompositionViewModel {
this.$scope.changeZoneInstanceName = (newName:string):void => {
this.$scope.selectedZoneInstance.instanceData.name = newName;
};
-
+
this.$scope.deleteSelectedComponentInstance = ():void => {
const {currentComponent} = this.$scope;
const {title, message} = this.$scope.sdcMenu.alertMessages['deleteInstance'];
@@ -477,5 +482,20 @@ export class CompositionViewModel {
this.eventListenerService.registerObserverCallback(EVENTS.ON_LIFECYCLE_CHANGE, this.$scope.reload);
+ this.$scope.registerCreateInstanceEvent = (callback: Function): void => {
+ this.eventListenerService.registerObserverCallback(GRAPH_EVENTS.ON_CREATE_COMPONENT_INSTANCE, callback);
+ };
+
+ this.$scope.unregisterCreateInstanceEvent = (): void => {
+ this.eventListenerService.unRegisterObserver(GRAPH_EVENTS.ON_CREATE_COMPONENT_INSTANCE);
+ };
+
+ this.$scope.registerChangeComponentInstanceNameEvent = (callback: Function): void => {
+ this.eventListenerService.registerObserverCallback(GRAPH_EVENTS.ON_COMPONENT_INSTANCE_NAME_CHANGED, callback);
+ };
+
+ this.$scope.unregisterChangeComponentInstanceNameEvent = (): void => {
+ this.eventListenerService.unRegisterObserver(GRAPH_EVENTS.ON_COMPONENT_INSTANCE_NAME_CHANGED);
+ };
}
}
diff --git a/catalog-ui/src/app/view-models/workspace/tabs/composition/composition-view.html b/catalog-ui/src/app/view-models/workspace/tabs/composition/composition-view.html
index 75265d9137..a571fdca0d 100644
--- a/catalog-ui/src/app/view-models/workspace/tabs/composition/composition-view.html
+++ b/catalog-ui/src/app/view-models/workspace/tabs/composition/composition-view.html
@@ -103,7 +103,7 @@
</button>
<button data-ng-if="!selectedComponent.isService() || (isComponentInstanceSelected() && currentComponent.selectedInstance.isServiceProxy())" class="i-sdc-designer-sidebar-tab"
data-ui-sref-active="active" ui-sref="workspace.composition.relations"
- tooltips tooltip-class="tooltip-custom tab-tooltip tooltip-rightside"
+ tooltips tooltip-class="tooltip-custom tab-tooltip {{currentComponent.selectedInstance.isServiceProxy() ? '' : 'tooltip-rightside'}}"
data-tests-id="requirements-and-capabilities"
tooltip-content="Requirements and Capabilities"
data-ng-class="{'disabled': disabledTabs}">
@@ -115,6 +115,14 @@
data-ng-class="{'disabled': disabledTabs}">
<div class="i-sdc-designer-sidebar-tab-icon sprite-new api"></div>
</button>
+ <button class="i-sdc-designer-sidebar-tab" data-ui-sref-active="active"
+ data-ui-sref="workspace.composition.dependencies"
+ tooltips tooltip-class="tooltip-custom tab-tooltip " tooltip-content="Service Dependencies"
+ data-tests-id="service-dependency-tab"
+ data-ng-if="(isComponentInstanceSelected() && currentComponent.selectedInstance.isServiceProxy())"
+ data-ng-class="{'disabled': disabledTabs}">
+ <div class="i-sdc-designer-sidebar-tab-icon sprite-new dependencies-icon"></div>
+ </button>
</div>
<div data-ui-view="" class="w-sdc-designer-sidebar-tab-content-view"></div>
diff --git a/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/details/details-view-model.ts b/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/details/details-view-model.ts
index e389395142..36ceabfb42 100644
--- a/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/details/details-view-model.ts
+++ b/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/details/details-view-model.ts
@@ -20,7 +20,7 @@
'use strict';
import * as _ from "lodash";
-import {Component} from "app/models";
+import {Component, ModalModel, ButtonModel} from "app/models";
import {GRAPH_EVENTS} from "app/utils";
import {LeftPaletteLoaderService, EventListenerService} from "app/services";
import {ICompositionViewModelScope} from "../../composition-view-model";
@@ -28,6 +28,7 @@ import {LeftPaletteComponent} from "../../../../../../models/components/displayC
import {ComponentServiceFactoryNg2} from "app/ng2/services/component-services/component.service.factory";
import {ServiceServiceNg2} from 'app/ng2/services/component-services/service.service';
import {Service} from "app/models/components/service";
+import {ModalService} from 'app/ng2/services/modal.service';
export interface IEditResourceVersion {
allVersions:any;
@@ -41,24 +42,31 @@ interface IDetailsViewModelScope extends ICompositionViewModelScope {
editForm:ng.IFormController;
editResourceVersion:IEditResourceVersion;
- changeResourceVersion():void;
+ onChangeResourceVersion():void;
+ alertBeforeChangeResourceVersion():void;
+ changeVersion():void;
+ cancelChangeResourceVersion():void;
}
export class DetailsViewModel {
static '$inject' = [
'$scope',
+ '$filter',
'LeftPaletteLoaderService',
'EventListenerService',
'ComponentServiceFactoryNg2',
- 'ServiceServiceNg2'
+ 'ServiceServiceNg2',
+ 'ModalServiceNg2'
];
constructor(private $scope:IDetailsViewModelScope,
+ private $filter:ng.IFilterService,
private LeftPaletteLoaderService:LeftPaletteLoaderService,
private eventListenerService:EventListenerService,
private ComponentServiceFactoryNg2: ComponentServiceFactoryNg2,
- private serviceService: ServiceServiceNg2) {
+ private serviceService: ServiceServiceNg2,
+ private ModalServiceNg2: ModalService) {
this.initScope();
}
@@ -115,7 +123,35 @@ export class DetailsViewModel {
}
});
- this.$scope.changeResourceVersion = ():void => {
+ this.$scope.onChangeResourceVersion = ():void => {
+ if(this.$scope.isComponentInstanceSelected() && this.$scope.currentComponent.selectedInstance.isServiceProxy()) {
+ this.$scope.alertBeforeChangeResourceVersion();
+ }
+ else {
+ this.$scope.changeVersion();
+ }
+ };
+
+ this.$scope.alertBeforeChangeResourceVersion = ():void => {
+ let modalApproveTxt:string = this.$filter('translate')("MODAL_APPROVE");
+ let modalCancelTxt:string = this.$filter('translate')("MODAL_CANCEL");
+ let changeVersionModalTitle:string = this.$filter('translate')("DETAILS_TAB_CHANGE_VERSION_MODAL_TITLE");
+ let changeVersionModalMsg:string = this.$filter('translate')("DETAILS_TAB_CHANGE_VERSION_MODAL_MSG");
+
+ let actionButton: ButtonModel = new ButtonModel(modalApproveTxt, 'blue', this.$scope.changeVersion);
+ let cancelButton: ButtonModel = new ButtonModel(modalCancelTxt, 'grey', this.$scope.cancelChangeResourceVersion);
+ let modalModel: ModalModel = new ModalModel('sm', changeVersionModalTitle, changeVersionModalMsg, [actionButton, cancelButton]);
+ let customModal = this.ModalServiceNg2.createCustomModal(modalModel);
+ customModal.instance.open();
+ };
+
+ this.$scope.cancelChangeResourceVersion = () => {
+ this.ModalServiceNg2.closeCurrentModal();
+ this.$scope.editResourceVersion.changeVersion = this.$scope.currentComponent.selectedInstance.componentVersion;
+ };
+
+ this.$scope.changeVersion = ():void => {
+ this.ModalServiceNg2.closeCurrentModal();
this.$scope.isLoading = true;
this.$scope.$parent.isLoading = true;
diff --git a/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/details/details-view.html b/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/details/details-view.html
index 145943e9fd..db5322a859 100644
--- a/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/details/details-view.html
+++ b/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/details/details-view.html
@@ -46,7 +46,7 @@
data-ng-disabled="$parent.isViewOnly || selectedComponent.uniqueId != editResourceVersion.allVersions[editResourceVersion.changeVersion] || selectedComponent.archived"
class="i-sdc-designer-sidebar-section-content-item-value i-sdc-form-select"
data-ng-class="{'minor': (editResourceVersion.changeVersion)%1, 'disabled':selectedComponent.archived}"
- data-ng-change="changeResourceVersion()">
+ data-ng-change="onChangeResourceVersion()">
<option class="select-instance-version" data-ng-class="{'minor': key%1}"
ng-repeat="(key, value) in editResourceVersion.allVersions">{{key}}</option>
</select></ng-form>
diff --git a/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/service-dependencies/service-dependencies-view-model.ts b/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/service-dependencies/service-dependencies-view-model.ts
new file mode 100644
index 0000000000..b634e6021f
--- /dev/null
+++ b/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/service-dependencies/service-dependencies-view-model.ts
@@ -0,0 +1,125 @@
+/*!
+ * Copyright © 2016-2018 European Support Limited
+ *
+ * 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.
+ */
+
+
+import {ICompositionViewModelScope} from "../../composition-view-model";
+import {Service, ComponentInstance, PropertiesGroup, ServiceInstanceObject, PropertyBEModel} from 'app/models';
+import {ComponentServiceNg2} from "app/ng2/services/component-services/component.service";
+import {ConstraintObject} from "app/ng2/components/logic/service-dependencies/service-dependencies.component";
+import {ComponentGenericResponse} from 'app/ng2/services/responses/component-generic-response';
+import {DEPENDENCY_EVENTS} from "app/utils/constants";
+import {EventListenerService} from 'app/services';
+
+interface IServiceDependenciesViewModelScope extends ICompositionViewModelScope {
+ service: Service;
+ selectedInstanceSiblings: Array<ServiceInstanceObject>;
+ componentInstancesConstraints: Array<any>;
+ selectedInstanceConstraints: Array<ConstraintObject>;
+ selectedInstanceProperties: Array<PropertyBEModel>;
+ updateSelectedInstanceConstraints(constraintsList:Array<ConstraintObject>): void;
+ loadConstraints(): void;
+ componentInstanceProperties: PropertiesGroup;
+ notifyDependencyEventsObserver: Function;
+}
+
+
+
+export class ServiceDependenciesViewModel {
+
+ static '$inject' = [
+ '$scope',
+ 'ComponentServiceNg2',
+ 'EventListenerService'
+ ];
+
+ constructor(private $scope:IServiceDependenciesViewModelScope, private ComponentServiceNg2:ComponentServiceNg2, private eventListenerService: EventListenerService) {
+ this.$scope.service = <Service>this.$scope.currentComponent;
+ this.$scope.notifyDependencyEventsObserver = this.notifyDependencyEventsObserver;
+ this.initInstancesWithProperties();
+ this.loadConstraints();
+
+ this.initScope();
+ }
+
+ private initInstancesWithProperties = ():void => {
+ this.ComponentServiceNg2.getComponentInstanceProperties(this.$scope.currentComponent).subscribe((genericResponse:ComponentGenericResponse) => {
+ this.$scope.componentInstanceProperties = genericResponse.componentInstancesProperties;
+ this.updateInstanceAttributes();
+ });
+ }
+
+ private updateInstanceAttributes = ():void => {
+ if (this.$scope.isComponentInstanceSelected() && this.$scope.componentInstanceProperties) {
+ let instancesMappedList = this.$scope.service.componentInstances.map(coInstance => new ServiceInstanceObject({
+ id: coInstance.uniqueId,
+ name: coInstance.name,
+ properties: this.$scope.componentInstanceProperties[coInstance.uniqueId] || []
+ }));
+ this.$scope.selectedInstanceProperties = this.$scope.componentInstanceProperties[this.$scope.currentComponent.selectedInstance.uniqueId];
+ this.$scope.selectedInstanceSiblings = instancesMappedList.filter(coInstance => coInstance.id !== this.$scope.currentComponent.selectedInstance.uniqueId);
+ }
+ }
+
+ private initScope = ():void => {
+ this.$scope.$watch('currentComponent.selectedInstance', (newInstance:ComponentInstance):void => {
+ if (angular.isDefined(newInstance) && this.$scope.componentInstancesConstraints) {
+ this.updateInstanceAttributes();
+ this.$scope.selectedInstanceConstraints = this.$scope.componentInstancesConstraints[this.$scope.currentComponent.selectedInstance.uniqueId] ?
+ this.$scope.componentInstancesConstraints[this.$scope.currentComponent.selectedInstance.uniqueId].properties :
+ [];
+ }
+ });
+ this.$scope.$watch('componentInstancesConstraints', (constraints: Array<any>):void => {
+ if (angular.isDefined(constraints)) {
+ if(this.$scope.isComponentInstanceSelected()) {
+ this.$scope.selectedInstanceConstraints = this.$scope.componentInstancesConstraints[this.$scope.currentComponent.selectedInstance.uniqueId] ?
+ this.$scope.componentInstancesConstraints[this.$scope.currentComponent.selectedInstance.uniqueId].properties || [] :
+ [];
+ }
+ }
+ });
+
+ this.$scope.updateSelectedInstanceConstraints = (constraintsList:Array<ConstraintObject>):void => {
+ this.$scope.componentInstancesConstraints[this.$scope.currentComponent.selectedInstance.uniqueId].properties = constraintsList;
+ this.$scope.selectedInstanceConstraints = this.$scope.componentInstancesConstraints[this.$scope.currentComponent.selectedInstance.uniqueId].properties;
+ }
+
+ this.$scope.loadConstraints = ():void => {
+ this.loadConstraints();
+ }
+
+ this.$scope.registerCreateInstanceEvent(() => {
+ this.initInstancesWithProperties();
+ });
+
+ this.$scope.registerChangeComponentInstanceNameEvent((updatedComponentInstance) => {
+ this.$scope.currentComponent.selectedInstance = updatedComponentInstance;
+ });
+
+ this.$scope.$on('$destroy', this.$scope.unregisterCreateInstanceEvent);
+ this.$scope.$on('$destroy', this.$scope.unregisterChangeComponentInstanceNameEvent);
+ }
+
+ private loadConstraints = ():void => {
+ this.ComponentServiceNg2.getServiceFilterConstraints(this.$scope.service).subscribe((response) => {
+ this.$scope.componentInstancesConstraints = response.nodeFilterData;
+ });
+ }
+
+ public notifyDependencyEventsObserver = (isChecked: boolean):void => {
+ this.eventListenerService.notifyObservers(DEPENDENCY_EVENTS.ON_DEPENDENCY_CHANGE, isChecked);
+ }
+} \ No newline at end of file
diff --git a/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/service-dependencies/service-dependencies-view.html b/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/service-dependencies/service-dependencies-view.html
new file mode 100644
index 0000000000..ba50994529
--- /dev/null
+++ b/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/service-dependencies/service-dependencies-view.html
@@ -0,0 +1,25 @@
+
+<perfect-scrollbar class="w-sdc-designer-sidebar-tab-content service-dependencies">
+ <div class="w-sdc-designer-sidebar-section">
+ <expand-collapse expanded-selector=".w-sdc-designer-sidebar-section-content"
+ class="w-sdc-designer-sidebar-section-title">
+ <span class="w-sdc-designer-sidebar-section-title-text" tooltips tooltip-content="Service Dependencies">Service Dependencies</span>
+ <div class="w-sdc-designer-sidebar-section-title-icon"></div>
+ </expand-collapse>
+ <div class="w-sdc-designer-sidebar-section-content" data-ng-if="isComponentInstanceSelected()">
+ <div class="i-sdc-designer-sidebar-section-content-item">
+ <ng2-service-dependencies
+ [composite-service]="service"
+ [current-service-instance]="currentComponent.selectedInstance"
+ [selected-instance-properties]="selectedInstanceProperties"
+ [selected-instance-siblings]="selectedInstanceSiblings"
+ [selected-instance-constraints]="selectedInstanceConstraints"
+ [readonly]="isViewMode() || !isDesigner()"
+ (dependency-status)="notifyDependencyEventsObserver($event)"
+ (update-rules-list-event)="updateSelectedInstanceConstraints($event)"
+ (load-rules-list-event)="loadConstraints()">
+ </ng2-service-dependencies>
+ </div>
+ </div>
+ </div>
+</perfect-scrollbar> \ No newline at end of file