From ec7af57361e6be0329461e3f2acf2d72e41c3b97 Mon Sep 17 00:00:00 2001 From: davsad Date: Fri, 19 Feb 2021 17:13:51 +0000 Subject: [PATCH] Fix requirement external toggle when deselecting and reselecting node Issue-ID: SDC-3501 Signed-off-by: davsad Change-Id: Ib4b1913adc54fb15277af324e8eaf5bbd82c0f95 --- .../graph/composition-graph.component.ts | 8 ++++++- .../requirement-list/requirement-list.component.ts | 26 ++++++++++++++-------- catalog-ui/src/app/utils/constants.ts | 1 + 3 files changed, 25 insertions(+), 10 deletions(-) diff --git a/catalog-ui/src/app/ng2/pages/composition/graph/composition-graph.component.ts b/catalog-ui/src/app/ng2/pages/composition/graph/composition-graph.component.ts index c48231f2c6..3cab4b300f 100644 --- a/catalog-ui/src/app/ng2/pages/composition/graph/composition-graph.component.ts +++ b/catalog-ui/src/app/ng2/pages/composition/graph/composition-graph.component.ts @@ -24,7 +24,8 @@ import { ZoneInstance, ZoneInstanceAssignmentType, ZoneInstanceMode, - ZoneInstanceType + ZoneInstanceType, + Requirement } from 'app/models'; import { ForwardingPath } from 'app/models/forwarding-path'; import { CompositionCiServicePathLink } from 'app/models/graph/graph-links/composition-graph-links/composition-ci-service-path-link'; @@ -643,6 +644,11 @@ export class CompositionGraphComponent implements AfterViewInit { selectedNode.data('displayName', selectedNode.data().getDisplayName()); // abbreviated }); + this.eventListenerService.registerObserverCallback(GRAPH_EVENTS.ON_COMPONENT_INSTANCE_REQUIREMENT_EXTERNAL_CHANGED, (uniqueId:string, requirement:Requirement) => { + this._cy.getElementById(uniqueId).data().componentInstance.requirements[requirement.capability] + .find(r => r.uniqueId === requirement.uniqueId).external = requirement.external; + }); + this.eventListenerService.registerObserverCallback(GRAPH_EVENTS.ON_DELETE_COMPONENT_INSTANCE, (componentInstanceId: string) => { const nodeToDelete = this._cy.getElementById(componentInstanceId); this.nodesGraphUtils.deleteNode(this._cy, this.topologyTemplate, nodeToDelete); diff --git a/catalog-ui/src/app/ng2/pages/composition/panel/panel-tabs/req-capabilities-tab/requirement-list/requirement-list.component.ts b/catalog-ui/src/app/ng2/pages/composition/panel/panel-tabs/req-capabilities-tab/requirement-list/requirement-list.component.ts index 3716ef0af0..6a082efb10 100644 --- a/catalog-ui/src/app/ng2/pages/composition/panel/panel-tabs/req-capabilities-tab/requirement-list/requirement-list.component.ts +++ b/catalog-ui/src/app/ng2/pages/composition/panel/panel-tabs/req-capabilities-tab/requirement-list/requirement-list.component.ts @@ -4,6 +4,10 @@ import { CompositionService } from "app/ng2/pages/composition/composition.servic import { ResourceNamePipe } from "app/ng2/pipes/resource-name.pipe"; import { ComponentInstanceServiceNg2 } from "app/ng2/services/component-instance-services/component-instance.service"; import { WorkspaceService } from "app/ng2/pages/workspace/workspace.service"; +import { Store } from "@ngxs/store"; +import {TogglePanelLoadingAction} from "../../../../common/store/graph.actions"; +import { EventListenerService } from "app/services"; +import { GRAPH_EVENTS } from "app/utils"; @Component({ selector: 'requirement-list', @@ -18,7 +22,9 @@ export class RequirementListComponent { constructor(private compositionService: CompositionService, private workspaceService: WorkspaceService, - private componentInstanceServiceNg2: ComponentInstanceServiceNg2) {} + private componentInstanceServiceNg2: ComponentInstanceServiceNg2, + private store:Store, + private eventListenerService:EventListenerService) {} public getRelation = (requirement:any):any => { if (this.isInstanceSelected && this.component.componentInstancesRelations) { @@ -41,14 +47,16 @@ export class RequirementListComponent { }; onMarkAsExternal(requirement:Requirement) { - if (requirement.external){ - requirement.external = false; - } else { - requirement.external = true; - } - this.componentInstanceServiceNg2.updateInstanceRequirement(this.workspaceService.metadata.getTypeUrl(), this.workspaceService.metadata.uniqueId, this.component.uniqueId, requirement).subscribe((response:any) => { - }, (error) => { console.log("An error has occured setting external: ", error); });; - + this.store.dispatch(new TogglePanelLoadingAction({isLoading: true})); + requirement.external = !requirement.external; + this.componentInstanceServiceNg2.updateInstanceRequirement(this.workspaceService.metadata.getTypeUrl(), this.workspaceService.metadata.uniqueId, this.component.uniqueId, requirement) + .subscribe(() => { + this.eventListenerService.notifyObservers(GRAPH_EVENTS.ON_COMPONENT_INSTANCE_REQUIREMENT_EXTERNAL_CHANGED, this.component.uniqueId, requirement); + this.store.dispatch(new TogglePanelLoadingAction({isLoading: false})); + } , (error) => { console.log("An error has occured setting external: ", error); + requirement.external = !requirement.external; + this.store.dispatch(new TogglePanelLoadingAction({isLoading: false})); + }); } }; diff --git a/catalog-ui/src/app/utils/constants.ts b/catalog-ui/src/app/utils/constants.ts index 230cb544f2..0df1a6522c 100644 --- a/catalog-ui/src/app/utils/constants.ts +++ b/catalog-ui/src/app/utils/constants.ts @@ -348,6 +348,7 @@ export class GRAPH_EVENTS { static ON_PALETTE_COMPONENT_SHOW_POPUP_PANEL = 'onPaletteComponentShowPopupPanel'; static ON_PALETTE_COMPONENT_HIDE_POPUP_PANEL = 'onPaletteComponentHidePopupPanel'; static ON_COMPONENT_INSTANCE_NAME_CHANGED = 'onComponentInstanceNameChanged'; + static ON_COMPONENT_INSTANCE_REQUIREMENT_EXTERNAL_CHANGED = 'onComponentInstanceRequirementExternalChanged' static ON_ZONE_INSTANCE_NAME_CHANGED = 'onZoneInstanceNameChanged'; static ON_DELETE_COMPONENT_INSTANCE = 'onDeleteComponentInstance'; static ON_DELETE_ZONE_INSTANCE = 'onDeleteZoneInstance'; -- 2.16.6