Sonsino, Ofir (os0695) | ff76b5e | 2018-07-10 15:57:37 +0300 | [diff] [blame] | 1 | import {Component, EventEmitter, Output, ViewChild} from '@angular/core'; |
| 2 | import {ITreeOptions, TreeComponent} from 'angular-tree-component'; |
| 3 | import '../../../../node_modules/angular-tree-component/dist/angular-tree-component.css'; |
| 4 | import {IDType, ITreeNode} from 'angular-tree-component/dist/defs/api'; |
| 5 | import {DialogService} from 'ng2-bootstrap-modal'; |
| 6 | import {AvailableModelsTreeService} from './available-models-tree.service'; |
| 7 | import {NgRedux} from "@angular-redux/store"; |
| 8 | import {ActivatedRoute} from '@angular/router'; |
| 9 | import {AppState} from '../../store/reducers'; |
| 10 | import {AaiService} from '../../services/aaiService/aai.service'; |
| 11 | import {ServicePlanningService} from '../../services/service-planning.service'; |
| 12 | import {VnfPopupComponent} from '../../components/vnf-popup/vnf-popup.components'; |
| 13 | import {ServiceNodeTypes} from '../../shared/models/ServiceNodeTypes'; |
| 14 | import {VfModuleMap} from '../../shared/models/vfModulesMap'; |
| 15 | import {IframeService} from "../../shared/utils/iframe.service"; |
| 16 | import {createVFModuleInstance} from "../../service.actions"; |
| 17 | import {DefaultDataGeneratorService} from "../../shared/services/defaultDataServiceGenerator/default.data.generator.service"; |
| 18 | |
| 19 | |
| 20 | @Component({ |
| 21 | selector: 'available-models-tree', |
| 22 | templateUrl: './available-models-tree.component.html', |
| 23 | styleUrls: ['./available-models-tree.component.scss'] |
| 24 | }) |
| 25 | |
| 26 | |
| 27 | export class AvailableModelsTreeComponent{ |
| 28 | |
| 29 | serviceModelId: string; |
| 30 | serviceHierarchy; |
| 31 | parentElementClassName = 'content'; |
| 32 | _store : NgRedux<AppState>; |
| 33 | constructor(private _servicePlanningService: ServicePlanningService, |
| 34 | private _iframeService: IframeService, |
| 35 | private _aaiService: AaiService, |
| 36 | private route: ActivatedRoute, |
| 37 | private dialogService: DialogService, |
| 38 | private _availableModelsTreeService: AvailableModelsTreeService, |
| 39 | private _defaultDataGeneratorService: DefaultDataGeneratorService, |
| 40 | private store: NgRedux<AppState>) { |
| 41 | this._store = store; |
| 42 | this.route |
| 43 | .queryParams |
| 44 | .subscribe(params => { |
| 45 | this.serviceModelId = params['serviceModelId']; |
| 46 | this._aaiService.getServiceModelById(this.serviceModelId).subscribe( |
| 47 | value => { |
| 48 | this.serviceHierarchy = value; |
| 49 | this.nodes = this._servicePlanningService.convertServiceModelToTreeNodes(this.serviceHierarchy); |
| 50 | }, |
| 51 | error => { |
| 52 | console.log('error is ', error) |
| 53 | } |
| 54 | ); |
| 55 | }); |
| 56 | |
| 57 | } |
| 58 | |
| 59 | @Output() |
| 60 | highlightInstances: EventEmitter<number> = new EventEmitter<number>(); |
| 61 | @ViewChild('tree') tree: TreeComponent; |
| 62 | |
| 63 | nodes = []; |
| 64 | service = {name: ''}; |
| 65 | isFilterEnabled: boolean = false; |
| 66 | |
| 67 | options: ITreeOptions = { |
| 68 | nodeHeight: 36, |
| 69 | dropSlotHeight: 0, |
| 70 | nodeClass: (node: ITreeNode) => { |
| 71 | if(node.data.type === ServiceNodeTypes.VFmodule && !this.getNodeCount(node.parent)) |
| 72 | { |
| 73 | node.data.disabled = true; |
| 74 | return 'tree-node tree-node-disabled'; |
| 75 | } |
| 76 | node.data.disabled = false; |
| 77 | return 'tree-node'; |
| 78 | } |
| 79 | }; |
| 80 | |
| 81 | expandParentByNodeId(id: IDType): void { |
| 82 | this.tree.treeModel.getNodeById(id).parent.expand(); |
| 83 | } |
| 84 | |
| 85 | searchTree(searchText: string, event: KeyboardEvent): void { |
| 86 | if (searchText === '') { |
| 87 | return; |
| 88 | } |
| 89 | this.isFilterEnabled = event.key === 'Delete' || event.key === 'Backspace' || searchText.length > 1; |
| 90 | if (this.isFilterEnabled) { |
| 91 | let __this = this; |
| 92 | let results: ITreeNode[] = []; |
| 93 | this.nodes.forEach(function (node) { |
| 94 | __this.searchTreeNode(node, searchText, results); |
| 95 | }); |
| 96 | results.forEach(function (result) { |
| 97 | __this.expandParentByNodeId(result.id) |
| 98 | }); |
| 99 | } |
| 100 | } |
| 101 | |
| 102 | searchTreeNode(node, searchText: string, results): void { |
| 103 | if (node.name.toLowerCase().indexOf(searchText.toLowerCase()) != -1) { |
| 104 | results.push(node); |
| 105 | } |
| 106 | if (node.children != null) { |
| 107 | for (let i = 0; i < node.children.length; i++) { |
| 108 | this.searchTreeNode(node.children[i], searchText, results); |
| 109 | } |
| 110 | } |
| 111 | } |
| 112 | |
| 113 | selectNode(node: ITreeNode): void { |
| 114 | node.expand(); |
| 115 | this.highlightInstances.emit(node.data.id); |
| 116 | } |
| 117 | |
| 118 | onClickAdd(e: MouseEvent, node: ITreeNode): void { |
| 119 | let data = node.data; |
| 120 | let dynamicInputs = data.dynamicInputs; |
| 121 | let userProvidedNaming:boolean = data.userProvidedNaming; |
| 122 | let type:string = data.type; |
| 123 | if(!this.store.getState().global.flags['FLAG_SETTING_DEFAULTS_IN_DRAWING_BOARD']|| node.data.type === ServiceNodeTypes.VF || this._availableModelsTreeService.shouldOpenDialog(type, dynamicInputs, userProvidedNaming)) { |
| 124 | this._iframeService.addClassOpenModal(this.parentElementClassName); |
| 125 | this.dialogService.addDialog(VnfPopupComponent, { |
| 126 | serviceModelId: this.serviceModelId, |
| 127 | parentModelName: node.parent && node.parent.data.name, |
| 128 | modelName: data.name, |
| 129 | modelType: type, |
| 130 | dynamicInputs: dynamicInputs, |
| 131 | userProvidedNaming: userProvidedNaming, |
| 132 | isNewVfModule : true |
| 133 | }); |
| 134 | } |
| 135 | else { |
| 136 | let vfModule = this._defaultDataGeneratorService.generateVFModule(this.serviceHierarchy, node.parent.data.name, node.data.name); |
| 137 | this.store.dispatch(createVFModuleInstance(vfModule, node.data.name, this.serviceModelId)); |
| 138 | } |
| 139 | e.preventDefault(); |
| 140 | e.stopPropagation(); |
| 141 | } |
| 142 | |
| 143 | getNodeCount(node: ITreeNode): number { |
| 144 | let modelName: string = node.data.name; |
| 145 | if (ServicePlanningService.isVfModule(node)) { |
| 146 | let parentVnfModelName = node.parent.data.name; |
| 147 | let vfModuleMap: VfModuleMap = this._servicePlanningService.getVfModuleMap(this.serviceModelId, parentVnfModelName, modelName); |
| 148 | return vfModuleMap ? Object.keys(vfModuleMap).length : 0; |
| 149 | } else if (ServicePlanningService.isVnf(node)) { |
| 150 | let vnfInstance = this._servicePlanningService.getVnfInstance(this.serviceModelId, modelName); |
| 151 | return vnfInstance ? 1 : 0; |
| 152 | } |
| 153 | } |
| 154 | |
| 155 | isShowIconV(node: ITreeNode): boolean { |
| 156 | return this.getNodeCount(node) > 0; |
| 157 | } |
| 158 | |
| 159 | isShowNodeCount(node: ITreeNode): boolean { |
| 160 | return this.getNodeCount(node) > 0; |
| 161 | } |
| 162 | |
| 163 | isShowIconAdd(node: ITreeNode): boolean { |
| 164 | return this._availableModelsTreeService.shouldShowAddIcon(node, this.store.getState().service.serviceHierarchy, this.serviceModelId, this.getNodeCount(node)); |
| 165 | } |
| 166 | } |