* ============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;
}
}
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) => {});
+ }
+ };
}
Code Review / sdc.git / blobdiff