diff options
Diffstat (limited to 'vid-webpack-master/src/app/drawingBoard/service-planning/component-info')
6 files changed, 260 insertions, 0 deletions
diff --git a/vid-webpack-master/src/app/drawingBoard/service-planning/component-info/component-info-model.ts b/vid-webpack-master/src/app/drawingBoard/service-planning/component-info/component-info-model.ts new file mode 100644 index 000000000..4c5bf6747 --- /dev/null +++ b/vid-webpack-master/src/app/drawingBoard/service-planning/component-info/component-info-model.ts @@ -0,0 +1,26 @@ +import {ModelInformationItem} from "../../../shared/components/model-information/model-information.component"; + +export class ComponentInfoModel { + type: ComponentInfoType; + modelInfoItems: ModelInformationItem[]; + additionalInfoItems: ModelInformationItem[]; + title: string; + + + constructor(type: ComponentInfoType, modelInfoItems: ModelInformationItem[], additionalInfoItems: ModelInformationItem[], isInstance:boolean=true) { + this.type = type; + this.modelInfoItems = modelInfoItems; + this.additionalInfoItems = additionalInfoItems; + this.title=this.type+(isInstance ? " Instance" : ""); + } +} + + +export enum ComponentInfoType { + SERVICE = "Service", + VNF = "VNF", + NETWORK = "Network", + VFMODULE = "VFModule", + VNFGROUP = "Group", + VNFMEMBER = "VNF" +} diff --git a/vid-webpack-master/src/app/drawingBoard/service-planning/component-info/component-info.component.html b/vid-webpack-master/src/app/drawingBoard/service-planning/component-info/component-info.component.html new file mode 100644 index 000000000..8f08de076 --- /dev/null +++ b/vid-webpack-master/src/app/drawingBoard/service-planning/component-info/component-info.component.html @@ -0,0 +1,20 @@ +<div *ngIf="componentInfoModel"> + <div class="component-info-wrapper" [attr.data-tests-id]="'component-info-wrapper'"> + <div class="component-info-section" [attr.data-tests-id]="'component-info-section'"> + <div class="title" [attr.data-tests-id]="'component-info-section-title'">{{componentInfoModel?.title}} INFO</div> + <div class="component-info-list" [attr.data-tests-id]="'component-info-section-list'"> + <model-information [modelInformationItems]="componentInfoModel?.modelInfoItems" [itemClass]="'componentInfoItem'"></model-information> + </div> + </div> + </div> + <!-- commented out till we will have a data to show in additional info + <div class="component-info-wrapper" [attr.data-tests-id]="'additional-info-wrapper'">--> + <!--<div class="component-info-section" [attr.data-tests-id]="'additional-info-section'">--> + <!--<div class="title" [attr.data-tests-id]="'additional-info-section-title'">ADDITIONAL INFO</div>--> + <!--<div class="component-info-list" [attr.data-tests-id]="'additional-info-section-title'">--> + <!--<model-information [modelInformationItems]="componentInfoModel.additionalInfoItems" [itemClass]="'componentInfoItem'"></model-information>--> + <!--</div>--> + <!--</div>--> + <!--</div> + --> +</div> diff --git a/vid-webpack-master/src/app/drawingBoard/service-planning/component-info/component-info.component.scss b/vid-webpack-master/src/app/drawingBoard/service-planning/component-info/component-info.component.scss new file mode 100644 index 000000000..2d7735678 --- /dev/null +++ b/vid-webpack-master/src/app/drawingBoard/service-planning/component-info/component-info.component.scss @@ -0,0 +1,40 @@ +.component-info-wrapper { + + &:first-child { + border-bottom: 1px solid #D2D2D2; + } + .component-info-section { + margin: 15px 25px 0 25px; + + .title { + font-family: OpenSans-SemiBold; + font-size: 14px; + color: #191919; + text-transform: uppercase; + margin-bottom: 15px; + } + } + +} + +:host ::ng-deep .componentInfoItem { + border-top: 1px solid #D2D2D2; + padding-top: 10px; + margin-bottom: 10px; + + label { + font-family: OpenSans-Regular; + font-size: 12px; + color: #5A5A5A; + text-transform: capitalize; + } + + .model-item-value { + font-family: OpenSans-SemiBold; + font-size: 14px; + color: #191919; + line-height: 16px; + } +} + + diff --git a/vid-webpack-master/src/app/drawingBoard/service-planning/component-info/component-info.component.ts b/vid-webpack-master/src/app/drawingBoard/service-planning/component-info/component-info.component.ts new file mode 100644 index 000000000..c69ab52e1 --- /dev/null +++ b/vid-webpack-master/src/app/drawingBoard/service-planning/component-info/component-info.component.ts @@ -0,0 +1,40 @@ +import {ChangeDetectionStrategy, Component, OnInit} from '@angular/core'; +import {ComponentInfoService} from "./component-info.service"; +import {ComponentInfoModel, ComponentInfoType} from "./component-info-model"; +import {ActivatedRoute} from "@angular/router"; + + +@Component({ + selector: 'component-info', + templateUrl: './component-info.component.html', + styleUrls: ['./component-info.component.scss'], + changeDetection: ChangeDetectionStrategy.OnPush +}) +export class ComponentInfoComponent implements OnInit { + componentInfoModel: ComponentInfoModel = null; + + constructor(private _componentInfoService:ComponentInfoService, private route: ActivatedRoute) {} + + ngOnInit() { + ComponentInfoService.triggerComponentInfoChange.subscribe((input : ComponentInfoModel) => { + if(input.type === ComponentInfoType.SERVICE){ + this.getServiceInformation(); + }else { + this.componentInfoModel = input; + } + }); + + this.getServiceInformation(); + } + + + + getServiceInformation() : void { + this.route + .queryParams + .subscribe(params => { + let serviceModelId = params['serviceModelId']; + this.componentInfoModel = this._componentInfoService.getInfoForService(serviceModelId); + }); + } +} diff --git a/vid-webpack-master/src/app/drawingBoard/service-planning/component-info/component-info.service.spec.ts b/vid-webpack-master/src/app/drawingBoard/service-planning/component-info/component-info.service.spec.ts new file mode 100644 index 000000000..8b0da409b --- /dev/null +++ b/vid-webpack-master/src/app/drawingBoard/service-planning/component-info/component-info.service.spec.ts @@ -0,0 +1,93 @@ +import {ComponentInfoService} from './component-info.service'; +import {getTestBed, TestBed} from '@angular/core/testing'; +import {MockNgRedux, NgReduxTestingModule} from '@angular-redux/store/testing'; +import {NgRedux} from '@angular-redux/store'; +import {AaiService} from '../../../shared/services/aaiService/aai.service'; +import {HttpClient, HttpHandler} from '@angular/common/http'; +import {FeatureFlagsService} from '../../../shared/services/featureFlag/feature-flags.service'; +import {ModelInformationItem} from "../../../shared/components/model-information/model-information.component"; +import {ComponentInfoModel, ComponentInfoType} from "./component-info-model"; + +class MockAppStore<T> { + getState() { + return { + global: { + }, + service : { + serviceHierarchy : { + '1a80c596-27e5-4ca9-b5bb-e03a7fd4c0fd' : { + service:{ + serviceRole: 'Testing', + serviceType: 'pnf', + uuid: '1a80c596-27e5-4ca9-b5bb-e03a7fd4c0fd', + version: '1.0', + customizationUuid: '' + } + } + }, + serviceInstance : { + '1a80c596-27e5-4ca9-b5bb-e03a7fd4c0fd' : { + globalSubscriberId: 'e433710f-9217-458d-a79d-1c7aff376d89', + subscriptionServiceType:'TYLER SILVIA', + instanceId: '2f7130e8-27d6-4c01-8988-60ca67e8dae4' + } + }, + subscribers: [ + { + 'id': 'CAR_2020_ER', + 'name': 'CAR_2020_ER', + 'isPermitted': true + }, + { + 'id': 'e433710f-9217-458d-a79d-1c7aff376d89', + 'name': 'SILVIA ROBBINS', + 'isPermitted': true + } + ] + } + } + } +} + +beforeAll(done => (async () => { + TestBed.configureTestingModule({ + imports: [NgReduxTestingModule], + providers: [ + AaiService, + HttpClient, + HttpHandler, + FeatureFlagsService, + ComponentInfoService, + {provide: NgRedux, useClass: MockAppStore}, + MockNgRedux] + }); + await TestBed.compileComponents(); + let injector = getTestBed(); + service = injector.get(ComponentInfoService); + })().then(done).catch(done.fail)); + +let service: ComponentInfoService; +describe('Service Info Data', () => { + + test('ComponentInfoService should be defined', () => { + expect(service).toBeDefined(); + }); + + test('Info for service should be correct', () => { + let actualServiceInfo = service.getInfoForService('1a80c596-27e5-4ca9-b5bb-e03a7fd4c0fd'); + let expectedServiceInfo = [ + ModelInformationItem.createInstance('Type', 'pnf'), + ModelInformationItem.createInstance('Model Version', '1.0'), + ModelInformationItem.createInstance('Model Customization ID', ''), + ModelInformationItem.createInstance('Instance ID', '2f7130e8-27d6-4c01-8988-60ca67e8dae4'), + ModelInformationItem.createInstance('Subscriber Name', 'SILVIA ROBBINS'), + ModelInformationItem.createInstance('Service Type', 'TYLER SILVIA'), + ModelInformationItem.createInstance('Service Role', 'Testing'), + ]; + expect(actualServiceInfo).toEqual(new ComponentInfoModel(ComponentInfoType.SERVICE, expectedServiceInfo, [])); + + + }); + +}); + diff --git a/vid-webpack-master/src/app/drawingBoard/service-planning/component-info/component-info.service.ts b/vid-webpack-master/src/app/drawingBoard/service-planning/component-info/component-info.service.ts new file mode 100644 index 000000000..9318b3aa7 --- /dev/null +++ b/vid-webpack-master/src/app/drawingBoard/service-planning/component-info/component-info.service.ts @@ -0,0 +1,41 @@ +import {Injectable} from "@angular/core"; +import {NgRedux} from "@angular-redux/store"; +import {AppState} from "../../../shared/store/reducers"; +import {AaiService} from "../../../shared/services/aaiService/aai.service"; +import {Subject} from "rxjs"; +import {ComponentInfoModel, ComponentInfoType} from "./component-info-model"; +import {ModelInformationItem} from "../../../shared/components/model-information/model-information.component"; +import * as _ from 'lodash'; +@Injectable() +export class ComponentInfoService { + static triggerComponentInfoChange: Subject<ComponentInfoModel> = new Subject<ComponentInfoModel>(); + constructor( private _store: NgRedux<AppState>, private _aaiService : AaiService){ } + + getInfoForService(serviceModelId):ComponentInfoModel { + if(_.isNil(this._store.getState().service.serviceHierarchy[serviceModelId])) return null; + + let serviceHierarchy = this._store.getState().service.serviceHierarchy[serviceModelId].service; + const serviceInstance = this._store.getState().service.serviceInstance[serviceModelId]; + const modelInfoItems: ModelInformationItem[] = [ + ModelInformationItem.createInstance("Subscriber Name",this._aaiService.extractSubscriberNameBySubscriberId(serviceInstance.globalSubscriberId)), + ModelInformationItem.createInstance("Service Type",serviceInstance.subscriptionServiceType), + ModelInformationItem.createInstance("Service Role",serviceHierarchy.serviceRole), + ]; + serviceHierarchy.type = serviceHierarchy.serviceType; + return this.addGeneralInfoItems(modelInfoItems, ComponentInfoType.SERVICE, serviceHierarchy, serviceInstance ); + } + + + addGeneralInfoItems(modelInfoSpecificItems: ModelInformationItem[], type: ComponentInfoType, model, instance) { + let modelInfoItems: ModelInformationItem[] = [ + ModelInformationItem.createInstance("Type", (model && model.type) ? model.type : ((instance && instance.modelInfo) ? instance.modelInfo.modelType : null)), + ModelInformationItem.createInstance("Model Version", model ? model.version : null), + ModelInformationItem.createInstance("Model Customization ID", model ? model.customizationUuid : null), + ModelInformationItem.createInstance("Instance ID", instance ? instance.instanceId : null), + ModelInformationItem.createInstance("In Maintenance", instance? instance.inMaint : null), + ]; + modelInfoItems = modelInfoItems.concat(modelInfoSpecificItems); + const modelInfoItemsWithoutEmpty = _.filter(modelInfoItems, function(item){ return !item.values.every(_.isNil)}); + return new ComponentInfoModel(type, modelInfoItemsWithoutEmpty, []); + } +} |