diff options
Diffstat (limited to 'catalog-ui/src/app/ng2/pages/composition/panel/panel-header/panel-header.component.ts')
-rw-r--r-- | catalog-ui/src/app/ng2/pages/composition/panel/panel-header/panel-header.component.ts | 184 |
1 files changed, 116 insertions, 68 deletions
diff --git a/catalog-ui/src/app/ng2/pages/composition/panel/panel-header/panel-header.component.ts b/catalog-ui/src/app/ng2/pages/composition/panel/panel-header/panel-header.component.ts index ab659a3b8f..90a98147e9 100644 --- a/catalog-ui/src/app/ng2/pages/composition/panel/panel-header/panel-header.component.ts +++ b/catalog-ui/src/app/ng2/pages/composition/panel/panel-header/panel-header.component.ts @@ -18,64 +18,70 @@ * ============LICENSE_END========================================================= */ -import { Component, Input, AfterViewInit, SimpleChanges, OnInit, OnChanges } from "@angular/core"; -import { SdcUiComponents } from "sdc-ui/lib/angular"; -import { IModalConfig } from 'sdc-ui/lib/angular/modals/models/modal-config'; -import { ZoneInstanceType } from 'app/models/graph/zones/zone-instance'; -import { ValueEditComponent } from './../../../../components/ui/forms/value-edit/value-edit.component'; -import { Component as TopologyTemplate, ComponentInstance, IAppMenu } from "app/models"; -import { PoliciesService } from '../../../../services/policies.service'; -import { GroupsService } from '../../../../services/groups.service'; -import {IZoneService} from "../../../../../models/graph/zones/zone"; -import { EventListenerService, LoaderService } from "../../../../../services"; -import { GRAPH_EVENTS, EVENTS } from "../../../../../utils"; +import { Component, Input, OnInit } from "@angular/core"; +import { SdcUiComponents, SdcUiCommon, SdcUiServices } from "onap-ui-angular"; +import { EditNameModalComponent } from "app/ng2/pages/composition/panel/panel-header/edit-name-modal/edit-name-modal.component"; +import {Component as TopologyTemplate, FullComponentInstance, GroupInstance, PolicyInstance, Requirement, Capability, ComponentInstance} from "app/models"; +import { Select } from "@ngxs/store"; +import { Observable } from "rxjs/Observable"; +import { Subscription } from "rxjs"; +import {GRAPH_EVENTS} from "../../../../../utils/constants"; +import { CompositionService } from "app/ng2/pages/composition/composition.service"; +import {EventListenerService} from "../../../../../services/event-listener-service"; +import { ComponentInstanceServiceNg2 } from "app/ng2/services/component-instance-services/component-instance.service"; +import { WorkspaceService } from "app/ng2/pages/workspace/workspace.service"; +import { GroupsService, PoliciesService } from "app/services-ng2"; import { UIZoneInstanceObject } from "../../../../../models/ui-models/ui-zone-instance-object"; -import { ModalButtonComponent } from "sdc-ui/lib/angular/components"; +import {SelectedComponentType} from "../../common/store/graph.actions"; +import * as _ from 'lodash'; +import {GraphState} from "../../common/store/graph.state"; + @Component({ selector: 'ng2-composition-panel-header', templateUrl: './panel-header.component.html', styleUrls: ['./panel-header.component.less'] }) -export class CompositionPanelHeaderComponent implements OnInit, OnChanges { - - @Input() topologyTemplate: TopologyTemplate; - @Input() selectedZoneInstanceType: ZoneInstanceType; - @Input() selectedZoneInstanceId: string; - @Input() name: string; - @Input() nonCertified: boolean; +export class CompositionPanelHeaderComponent implements OnInit { @Input() isViewOnly: boolean; - @Input() isLoading: boolean; + @Input() selectedComponent: FullComponentInstance | TopologyTemplate | GroupInstance | PolicyInstance; + @Select(GraphState.getSelectedComponentType) selectedComponentType$:Observable<SelectedComponentType>; + - constructor(private groupsService:GroupsService, private policiesService: PoliciesService, - private modalService:SdcUiComponents.ModalService, private eventListenerService:EventListenerService) { } + constructor(private modalService: SdcUiServices.ModalService, + private groupService: GroupsService, + private policiesService: PoliciesService, + private eventListenerService: EventListenerService, + private compositionService: CompositionService, + private workspaceService: WorkspaceService, + private componentInstanceService: ComponentInstanceServiceNg2) { } - private service:IZoneService; private iconClassName: string; + private valueEditModalInstance: SdcUiComponents.ModalComponent; + private isTopologyTemplateSelected: boolean; + private componentTypeSubscription: Subscription; ngOnInit(): void { - this.init(); - } + this.componentTypeSubscription = this.selectedComponentType$.subscribe((newComponentType) => { - ngOnChanges (changes:SimpleChanges):void { - if(changes.selectedZoneInstanceId){ - this.init(); - } + this.initClasses(newComponentType); + this.isTopologyTemplateSelected = (newComponentType === SelectedComponentType.TOPOLOGY_TEMPLATE) ? true : false; + }); } ngOnDestroy() { - - + if(this.componentTypeSubscription) { + this.componentTypeSubscription.unsubscribe(); + } } - private init = (): void => { - if (this.selectedZoneInstanceType === ZoneInstanceType.POLICY) { + + private initClasses = (componentType:SelectedComponentType): void => { + if (componentType === SelectedComponentType.POLICY) { this.iconClassName = "sprite-policy-icons policy"; - this.service = this.policiesService; - } else if (this.selectedZoneInstanceType === ZoneInstanceType.GROUP) { + } else if (componentType === SelectedComponentType.GROUP) { this.iconClassName = "sprite-group-icons group"; - this.service = this.groupsService; } else { - this.iconClassName = "sprite-resource-icons defaulticon"; + this.iconClassName = undefined; } } @@ -83,53 +89,95 @@ export class CompositionPanelHeaderComponent implements OnInit, OnChanges { const modalConfig = { title: "Edit Name", size: "sm", - type: "custom", + type: SdcUiCommon.ModalType.custom, testId: "renameInstanceModal", buttons: [ {id: 'saveButton', text: 'OK', size: 'xsm', callback: this.saveInstanceName, closeModal: false}, - {id: 'cancelButton', text: 'Cancel', size: 'sm', closeModal: true} - ] as ModalButtonComponent[] - } as IModalConfig; - this.modalService.openCustomModal(modalConfig, ValueEditComponent, {name: this.name, validityChangedCallback: this.enableOrDisableSaveButton}); + {id: 'cancelButton', text: 'Cancel', size: 'sm', closeModal: true} + ] as SdcUiCommon.IModalButtonComponent[] + } as SdcUiCommon.IModalConfig; + this.valueEditModalInstance = this.modalService.openCustomModal(modalConfig, EditNameModalComponent, {name: this.selectedComponent.name, validityChangedCallback: this.enableOrDisableSaveButton}); }; private enableOrDisableSaveButton = (shouldEnable: boolean): void => { - let saveButton: ModalButtonComponent = this.modalService.getCurrentInstance().getButtonById('saveButton'); + let saveButton: SdcUiComponents.ModalButtonComponent = this.valueEditModalInstance.getButtonById('saveButton'); saveButton.disabled = !shouldEnable; } private saveInstanceName = ():void => { - let currentModal = this.modalService.getCurrentInstance(); - let nameFromModal:string = currentModal.innerModalContent.instance.name; - - if(nameFromModal != this.name){ - currentModal.buttons[0].disabled = true; - this.service.updateName(this.topologyTemplate.componentType, this.topologyTemplate.uniqueId, this.selectedZoneInstanceId, nameFromModal).subscribe((success)=>{ - this.eventListenerService.notifyObservers(GRAPH_EVENTS.ON_ZONE_INSTANCE_NAME_CHANGED, nameFromModal); - this.modalService.closeModal(); - }, (error)=> { - currentModal.buttons[0].disabled = false; - }); - } else { - this.modalService.closeModal(); + let nameFromModal:string = this.valueEditModalInstance.innerModalContent.instance.name; + + if(nameFromModal != this.selectedComponent.name){ + let oldName = this.selectedComponent.name; + this.selectedComponent.name = nameFromModal; + this.valueEditModalInstance.buttons[0].disabled = true; + + let onFailed = (error) => { + this.selectedComponent.name = oldName; + this.valueEditModalInstance.buttons[0].disabled = false; + }; + + if(this.selectedComponent instanceof FullComponentInstance){ + let onSuccess = (componentInstance:ComponentInstance) => { + //update requirements and capabilities owner name + _.forEach((<FullComponentInstance>this.selectedComponent).requirements, (requirementsArray:Array<Requirement>) => { + _.forEach(requirementsArray, (requirement:Requirement):void => { + requirement.ownerName = componentInstance.name; + }); + }); + + _.forEach((<FullComponentInstance>this.selectedComponent).capabilities, (capabilitiesArray:Array<Capability>) => { + _.forEach(capabilitiesArray, (capability:Capability):void => { + capability.ownerName = componentInstance.name; + }); + }); + this.valueEditModalInstance.closeModal(); + this.eventListenerService.notifyObservers(GRAPH_EVENTS.ON_COMPONENT_INSTANCE_NAME_CHANGED, this.selectedComponent); + }; + + this.componentInstanceService.updateComponentInstance(this.workspaceService.metadata.componentType, this.workspaceService.metadata.uniqueId, new ComponentInstance(this.selectedComponent)) + .subscribe(onSuccess, onFailed); + } else if (this.selectedComponent instanceof PolicyInstance) { + this.policiesService.updateName(this.workspaceService.metadata.componentType, this.workspaceService.metadata.uniqueId, this.selectedComponent.uniqueId, nameFromModal).subscribe((success)=>{ + this.eventListenerService.notifyObservers(GRAPH_EVENTS.ON_POLICY_INSTANCE_UPDATE, this.selectedComponent); + this.valueEditModalInstance.closeModal(); + }, onFailed); + } else if (this.selectedComponent instanceof GroupInstance){ + this.groupService.updateName(this.workspaceService.metadata.componentType, this.workspaceService.metadata.uniqueId, this.selectedComponent.uniqueId, nameFromModal).subscribe((success)=>{ + this.eventListenerService.notifyObservers(GRAPH_EVENTS.ON_GROUP_INSTANCE_UPDATE, this.selectedComponent); + this.valueEditModalInstance.closeModal(); + }, onFailed); + } + } else { + this.valueEditModalInstance.closeModal(); } }; - + private deleteInstance = (): void => { let title:string = "Delete Confirmation"; - let message:string = "Are you sure you would like to delete "+ this.name + "?"; - this.modalService.openAlertModal(title, message, "OK", this.deleteInstanceConfirmed, "deleteInstanceModal"); + let message:string = "Are you sure you would like to delete "+ this.selectedComponent.name + "?"; + const okButton = {testId: "OK", text: "OK", type: SdcUiCommon.ButtonType.warning, callback: this.deleteInstanceConfirmed, closeModal: true} as SdcUiComponents.ModalButtonComponent; + this.modalService.openWarningModal(title, message, "delete-modal", [okButton]); }; - private deleteInstanceConfirmed = () => { - this.eventListenerService.notifyObservers(EVENTS.SHOW_LOADER_EVENT + 'composition-graph'); - this.service.deleteZoneInstance(this.topologyTemplate.componentType, this.topologyTemplate.uniqueId, this.selectedZoneInstanceId).finally(()=> { - this.eventListenerService.notifyObservers(EVENTS.HIDE_LOADER_EVENT + 'composition-graph'); - }).subscribe(()=> { - let deletedItem:UIZoneInstanceObject = new UIZoneInstanceObject(this.selectedZoneInstanceId, this.selectedZoneInstanceType, this.name); - this.eventListenerService.notifyObservers(GRAPH_EVENTS.ON_DELETE_ZONE_INSTANCE, deletedItem); - }); - }; + private deleteInstanceConfirmed: Function = () => { + if(this.selectedComponent instanceof FullComponentInstance){ + this.eventListenerService.notifyObservers(GRAPH_EVENTS.ON_DELETE_COMPONENT_INSTANCE , this.selectedComponent.uniqueId); + } + else if(this.selectedComponent instanceof PolicyInstance){ + this.policiesService.deletePolicy(this.workspaceService.metadata.componentType, this.workspaceService.metadata.uniqueId, this.selectedComponent.uniqueId).subscribe((success)=>{ + this.eventListenerService.notifyObservers(GRAPH_EVENTS.ON_DELETE_ZONE_INSTANCE , + new UIZoneInstanceObject(this.selectedComponent.uniqueId, 1)); + }, (err) => {}); + + } + else if(this.selectedComponent instanceof GroupInstance){ + this.groupService.deleteGroup(this.workspaceService.metadata.componentType, this.workspaceService.metadata.uniqueId, this.selectedComponent.uniqueId).subscribe((success)=>{ + this.eventListenerService.notifyObservers(GRAPH_EVENTS.ON_DELETE_ZONE_INSTANCE , + new UIZoneInstanceObject(this.selectedComponent.uniqueId, 0)); + }, (err) => {}); + } + }; } |