Feature-9518: Scale-in/Scale-out commands triggered from the UI
* In NS Instances page. Click "Manual Scaling" in the actions menu.
* Then a new pop-up page will opened.
* In the popup there will be a list box which is filled with the all scaling-group-descriptor names captured from all VNFDs in the NSD and whoose scaling-type is "manual".
* Select scale in / scale out.
* When the scaling-group-descriptor name and the scaling direction are selected then Click Apply button.
* The pop-up window is closed and the page is directed to "History of operations" page for this NS.
Change-Id: Iaaa1500bcabea4ebda89f6c11ea91b28396aa42f
Signed-off-by: Barath Kumar R <barath.r@tataelxsi.co.in>
diff --git a/src/app/utilities/ns-instances-action/NSInstancesActionComponent.html b/src/app/utilities/ns-instances-action/NSInstancesActionComponent.html
index 823d99f..977a87e 100644
--- a/src/app/utilities/ns-instances-action/NSInstancesActionComponent.html
+++ b/src/app/utilities/ns-instances-action/NSInstancesActionComponent.html
@@ -36,6 +36,10 @@
<button type="button" class="btn btn-primary dropdown-item" (click)="execNSPrimitiveModal()" placement="left" container="body" ngbTooltip="{{'EXECPRIMITIVE' | translate}}" [disabled]="operationalStatus == 'failed' || configStatus == 'failed'">
<i class="fas fa-magic"></i> {{'EXECPRIMITIVE' | translate}}
</button>
+ <button type="button" class="btn btn-primary dropdown-item" [disabled]="operationalStatus === 'scaling'" (click)="manualScaling()"
+ placement="left" data-container="body" ngbTooltip="{{'SCALING' | translate}}">
+ <i class="fas fa-cubes"></i> {{'SCALING' | translate}}
+ </button>
<button type="button" class="btn btn-primary dropdown-item" (click)="historyOfOperations()" placement="left" container="body" ngbTooltip="{{'HISTORYOFOPERATIONS' | translate}}">
<i class="fas fa-history"></i> {{'HISTORYOFOPERATIONS' | translate}}
</button>
@@ -45,4 +49,4 @@
</div>
</div>
</div>
-<app-loader [waitingMessage]="message" *ngIf="isLoadingMetricsResult"></app-loader>
\ No newline at end of file
+<app-loader [waitingMessage]="message" *ngIf="isLoadingNSInstanceAction"></app-loader>
\ No newline at end of file
diff --git a/src/app/utilities/ns-instances-action/NSInstancesActionComponent.ts b/src/app/utilities/ns-instances-action/NSInstancesActionComponent.ts
index c3533ea..ed24a67 100644
--- a/src/app/utilities/ns-instances-action/NSInstancesActionComponent.ts
+++ b/src/app/utilities/ns-instances-action/NSInstancesActionComponent.ts
@@ -30,9 +30,12 @@
import { NSDInstanceData } from 'NSInstanceModel';
import { NSPrimitiveComponent } from 'NSPrimitiveComponent';
import { RestService } from 'RestService';
+import { forkJoin, Observable } from 'rxjs';
+import { ScalingComponent } from 'ScalingComponent';
import { SharedService } from 'SharedService';
import { ShowInfoComponent } from 'ShowInfoComponent';
-import { VDU, VNFD } from 'VNFDModel';
+import { isNullOrUndefined } from 'util';
+import { DF, VDU, VNFD } from 'VNFDModel';
/**
* Creating component
* @Component takes NSInstancesActionComponent.html as template url
@@ -59,12 +62,21 @@
/** Operational Status Check @public */
public operationalStatus: string;
+ /** get Admin Details @public */
+ public getAdminDetails: {};
+
+ /** Scaling is accepted @public */
+ public isScalingPresent: boolean = false;
+
/** Check the loading results for loader status @public */
- public isLoadingMetricsResult: boolean = false;
+ public isLoadingNSInstanceAction: boolean = false;
/** Give the message for the loading @public */
public message: string = 'PLEASEWAIT';
+ /** Assign the VNF Details @public */
+ public vnfDetails: VNFD[] = [];
+
/** Instance of the modal service @private */
private modalService: NgbModal;
@@ -87,7 +99,7 @@
private cd: ChangeDetectorRef;
/** Set timeout @private */
- private timeOut: number = 1000;
+ private timeOut: number = 100;
constructor(injector: Injector) {
this.injector = injector;
@@ -107,6 +119,7 @@
this.configStatus = this.value.ConfigStatus;
this.operationalStatus = this.value.OperationalStatus;
this.instanceID = this.value.identifier;
+ this.getAdminDetails = this.value.adminDetails;
}
/** Shows information using modalservice @public */
@@ -154,32 +167,96 @@
/** Redirect to Grafana Metrics @public */
public metrics(): void {
- this.isLoadingMetricsResult = true;
+ this.isLoadingNSInstanceAction = true;
this.restService.getResource(environment.NSDINSTANCES_URL + '/' + this.instanceID).subscribe((nsData: NSDDetails[]): void => {
nsData['vnfd-id'].forEach((vnfdID: string[]): void => {
this.restService.getResource(environment.VNFPACKAGES_URL + '/' + vnfdID)
.subscribe((vnfd: VNFD): void => {
vnfd.vdu.forEach((vduData: VDU): void => {
if (vduData['monitoring-parameter'] !== undefined && vduData['monitoring-parameter'].length > 0) {
- this.isLoadingMetricsResult = false;
+ this.isLoadingNSInstanceAction = false;
const location: string = environment.GRAFANA_URL + '/' + this.instanceID + '/osm-ns-metrics-metrics';
window.open(location);
} else {
- this.isLoadingMetricsResult = false;
+ this.isLoadingNSInstanceAction = false;
this.notifierService.notify('error', this.translateService.instant('GRAFANA.METRICSERROR'));
}
});
- setTimeout((): void => {
- this.cd.detectChanges();
- }, this.timeOut);
+ this.doChanges();
}, (error: ERRORDATA): void => {
this.restService.handleError(error, 'get');
- this.isLoadingMetricsResult = false;
+ this.isLoadingNSInstanceAction = false;
});
});
}, (error: ERRORDATA): void => {
this.restService.handleError(error, 'get');
- this.isLoadingMetricsResult = false;
+ this.isLoadingNSInstanceAction = false;
});
}
+
+ /**
+ * Do the manual scaling
+ * Here we are going to get a list of VNFD ID used in the instances
+ * and have this in array with URL created then pass to checkscaling method for forkjoin to get the data @public
+ */
+ public manualScaling(): void {
+ this.isLoadingNSInstanceAction = true;
+ const tempURL: Observable<{}>[] = [];
+ this.value.vnfID.forEach((id: string): void => {
+ const apiUrl: string = environment.VNFPACKAGESCONTENT_URL + '/' + id;
+ tempURL.push(this.restService.getResource(apiUrl));
+ });
+ this.checkScaling(tempURL);
+ }
+
+ /**
+ * Used to forkjoin to all the request to send parallely, get the data and check 'scaling-aspect' key is present @public
+ */
+ public checkScaling(URLS: Observable<{}>[]): void {
+ forkJoin(URLS).subscribe((data: VNFD[]): void => {
+ this.vnfDetails = data;
+ if (this.vnfDetails.length > 0) {
+ this.vnfDetails.forEach((vnfdData: VNFD): void => {
+ vnfdData.df.forEach((dfData: DF): void => {
+ if (!isNullOrUndefined(dfData['scaling-aspect']) && dfData['scaling-aspect'].length > 0) {
+ this.isScalingPresent = true;
+ }
+ });
+ });
+ }
+ this.isLoadingNSInstanceAction = false;
+ if (this.isScalingPresent) {
+ this.openScaling();
+ } else {
+ this.notifierService.notify('error', this.translateService.instant('SCALINGNOTFOUND'));
+ }
+ this.doChanges();
+ });
+ }
+
+ /** Open the scaling pop-up @public */
+ public openScaling(): void {
+ const modalRef: NgbModalRef = this.modalService.open(ScalingComponent, { backdrop: 'static' });
+ modalRef.componentInstance.params = {
+ id: this.instanceID,
+ vnfID: this.value.vnfID,
+ nsID: this.value['nsd-id'],
+ nsd: this.value.nsd,
+ data: this.vnfDetails
+ };
+ modalRef.result.then((result: MODALCLOSERESPONSEDATA): void => {
+ if (result) {
+ this.sharedService.callData();
+ }
+ }).catch();
+ }
+
+ /**
+ * Check any changes in the child component @public
+ */
+ public doChanges(): void {
+ setTimeout((): void => {
+ this.cd.detectChanges();
+ }, this.timeOut);
+ }
}
diff --git a/src/app/utilities/scaling/ScalingComponent.html b/src/app/utilities/scaling/ScalingComponent.html
new file mode 100644
index 0000000..4bcb084
--- /dev/null
+++ b/src/app/utilities/scaling/ScalingComponent.html
@@ -0,0 +1,62 @@
+<!--
+Copyright 2020 TATA ELXSI
+
+Licensed under the Apache License, Version 2.0 (the 'License');
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+Author: KUMARAN M (kumaran.m@tataelxsi.co.in), RAJESH S (rajesh.s@tataelxsi.co.in), BARATH KUMAR R (barath.r@tataelxsi.co.in)
+-->
+<div class="modal-header">
+ <h4 class="modal-title" id="modal-basic-title">{{ 'SCALING' | translate }}</h4>
+ <button class="button-xs" type="button" class="close" aria-label="Close" (click)="activeModal.close()">
+ <i class="fas fa-times-circle text-danger"></i>
+ </button>
+</div>
+<form [formGroup]="scalingForm" (ngSubmit)="manualScalingTrigger()" autocomplete="off">
+ <div class="modal-body">
+ <div class="form-group row">
+ <label class="col-sm-12 col-form-label mandatory-label"
+ [ngClass]="{'text-danger': scalingForm.invalid === true && submitted === true}">
+ {{'MANDATORYCHECK' | translate}}
+ </label>
+ <div class="col-sm-12">
+ <ng-select formControlName="memberIndex" [clearable]="false"
+ (change)="getScalingGroupDescriptorName($event.name)" placeholder="Select Member VNF Index *"
+ [items]="memberVNFIndex" bindLabel="id" bindValue="id"
+ [ngClass]="{ 'is-invalid': submitted && f.memberIndex.errors }">
+ </ng-select>
+ <small class="form-text text-muted" *ngIf="selectedVNFID !== ''">vnfd-id : {{ selectedVNFID }}</small>
+ </div>
+ </div>
+ <div class="form-group row">
+ <div class="col-sm-12">
+ <ng-select formControlName="scalingname" [clearable]="false" placeholder="Select scaling-aspect *"
+ [items]="scalingGroup" bindLabel="name" bindValue="id"
+ [ngClass]="{ 'is-invalid': submitted && f.scalingname.errors }">
+ </ng-select>
+ </div>
+ </div>
+ <div class="form-group row">
+ <div class="col-sm-12">
+ <ng-select formControlName="scaleType" [clearable]="false" placeholder="Select Scale Type *"
+ [items]="scaleTypes" bindLabel="name" bindValue="id"
+ [ngClass]="{ 'is-invalid': submitted && f.scaleType.errors }">
+ </ng-select>
+ </div>
+ </div>
+ </div>
+ <div class="modal-footer">
+ <button type="button" (click)="activeModal.close()" class="btn btn-danger">{{'CANCEL' | translate}}</button>
+ <button type="submit" class="btn btn-primary">{{'APPLY' | translate }}</button>
+ </div>
+</form>
+<app-loader [waitingMessage]="message" *ngIf="isLoadingResults"></app-loader>
\ No newline at end of file
diff --git a/src/app/utilities/scaling/ScalingComponent.scss b/src/app/utilities/scaling/ScalingComponent.scss
new file mode 100644
index 0000000..b11bf46
--- /dev/null
+++ b/src/app/utilities/scaling/ScalingComponent.scss
@@ -0,0 +1,17 @@
+/*
+ Copyright 2020 TATA ELXSI
+
+ Licensed under the Apache License, Version 2.0 (the 'License');
+ you may not use this file except in compliance with the License.
+ You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+
+ Author: BARATH KUMAR R (barath.r@tataelxsi.co.in)
+*/
diff --git a/src/app/utilities/scaling/ScalingComponent.ts b/src/app/utilities/scaling/ScalingComponent.ts
new file mode 100644
index 0000000..930eb86
--- /dev/null
+++ b/src/app/utilities/scaling/ScalingComponent.ts
@@ -0,0 +1,200 @@
+/*
+ Copyright 2020 TATA ELXSI
+
+ Licensed under the Apache License, Version 2.0 (the 'License');
+ you may not use this file except in compliance with the License.
+ You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+
+ Author: BARATH KUMAR R (barath.r@tataelxsi.co.in)
+*/
+/**
+ * @file Scaling Component
+ */
+import { HttpHeaders } from '@angular/common/http';
+import { Component, Injector, Input, OnInit } from '@angular/core';
+import { AbstractControl, FormBuilder, FormGroup, Validators } from '@angular/forms';
+import { Router } from '@angular/router';
+import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
+import { TranslateService } from '@ngx-translate/core';
+import { APIURLHEADER, ERRORDATA, MODALCLOSERESPONSEDATA, URLPARAMS } from 'CommonModel';
+import { environment } from 'environment';
+import { DF as NSDF, VNFPROFILE } from 'NSDModel';
+import { RestService } from 'RestService';
+import { SharedService } from 'SharedService';
+import { isNullOrUndefined } from 'util';
+import { DF, SCALING, VNFD } from 'VNFDModel';
+
+/**
+ * Creating component
+ * @Component takes ScalingComponent.html as template url
+ */
+@Component({
+ selector: 'app-scaling',
+ templateUrl: './ScalingComponent.html',
+ styleUrls: ['./ScalingComponent.scss']
+})
+export class ScalingComponent implements OnInit {
+ /** To inject services @public */
+ public injector: Injector;
+ /** Instance for active modal service @public */
+ public activeModal: NgbActiveModal;
+ /** Check the loading results @public */
+ public isLoadingResults: Boolean = false;
+ /** Give the message for the loading @public */
+ public message: string = 'PLEASEWAIT';
+ /** Contains the scaling group descriptor names @public */
+ public scalingGroup: {}[];
+ /** Member index of the NS @public */
+ public memberVNFIndex: {}[];
+ /** handles the selected VNFID @public */
+ public selectedVNFID: string = '';
+ /** Items for the Scale Types @public */
+ public scaleTypes: {}[];
+ /** FormGroup instance added to the form @ html @public */
+ public scalingForm: FormGroup;
+ /** Form valid on submit trigger @public */
+ public submitted: boolean = false;
+ /** FormBuilder instance added to the formBuilder @private */
+ private formBuilder: FormBuilder;
+ /** Instance of the rest service @private */
+ private restService: RestService;
+ /** Controls the header form @private */
+ private headers: HttpHeaders;
+ /** Contains tranlsate instance @private */
+ private translateService: TranslateService;
+ /** Input contains component objects @private */
+ @Input() private params: URLPARAMS;
+ /** Contains all methods related to shared @private */
+ private sharedService: SharedService;
+ /** Holds teh instance of AuthService class of type AuthService @private */
+ private router: Router;
+
+ constructor(injector: Injector) {
+ this.injector = injector;
+ this.restService = this.injector.get(RestService);
+ this.activeModal = this.injector.get(NgbActiveModal);
+ this.translateService = this.injector.get(TranslateService);
+ this.formBuilder = this.injector.get(FormBuilder);
+ this.sharedService = this.injector.get(SharedService);
+ this.router = this.injector.get(Router);
+ }
+
+ /** convenience getter for easy access to form fields */
+ get f(): FormGroup['controls'] { return this.scalingForm.controls; }
+
+ /**
+ * Lifecyle Hooks the trigger before component is instantiate
+ */
+ public ngOnInit(): void {
+ this.initializeForm();
+ this.getmemberIndex();
+ this.scaleTypes = [
+ { id: 'SCALE_OUT', name: this.translateService.instant('SCALEOUT') },
+ { id: 'SCALE_IN', name: this.translateService.instant('SCALEIN') }
+ ];
+ this.headers = new HttpHeaders({
+ 'Content-Type': 'application/json',
+ Accept: 'application/json',
+ 'Cache-Control': 'no-cache, no-store, must-revalidate, max-age=0'
+ });
+ }
+
+ /** Initialize Scaling Forms @public */
+ public initializeForm(): void {
+ this.scalingForm = this.formBuilder.group({
+ memberIndex: [null, [Validators.required]],
+ scalingname: [null, [Validators.required]],
+ scaleType: [null, [Validators.required]]
+ });
+ }
+
+ /** Get the member-vnf-index from NS Package -> vnf-profile @public */
+ public getmemberIndex(): void {
+ if (this.params.nsd.df.length > 0) {
+ const getconstituentVNFD: {}[] = [];
+ this.params.nsd.df.forEach((data: NSDF): void => {
+ data['vnf-profile'].forEach((vnfProfile: VNFPROFILE): void => {
+ const assignMemberIndex: {} = {
+ id: vnfProfile.id,
+ name: vnfProfile['vnfd-id']
+ };
+ getconstituentVNFD.push(assignMemberIndex);
+ });
+ });
+ this.memberVNFIndex = getconstituentVNFD;
+ }
+ }
+
+ /** Get the scaling-group-descriptor name @public */
+ public getScalingGroupDescriptorName(vnfID: string): void {
+ this.selectedVNFID = vnfID;
+ this.scalingGroup = [];
+ this.getFormControl('scalingname').setValue(null);
+ const scalingGroupDescriptorName: SCALING[] = [];
+ if (!isNullOrUndefined(this.params.data)) {
+ console.log(this.params.data);
+ const vnfdPackageDetails: VNFD = this.params.data.filter((vnfdData: VNFD): boolean => vnfdData.id === vnfID)[0];
+ if (vnfdPackageDetails.df.length > 0) {
+ vnfdPackageDetails.df.forEach((df: DF): void => {
+ if (!isNullOrUndefined(df['scaling-aspect']) && df['scaling-aspect'].length > 0) {
+ df['scaling-aspect'].forEach((scalingAspect: SCALING): void => {
+ scalingGroupDescriptorName.push(scalingAspect);
+ });
+ }
+ });
+ this.scalingGroup = scalingGroupDescriptorName;
+ }
+ }
+ }
+
+ /** If form is valid and call scaleInstances method to initialize scaling @public */
+ public manualScalingTrigger(): void {
+ this.submitted = true;
+ this.sharedService.cleanForm(this.scalingForm);
+ if (this.scalingForm.invalid) { return; } // Proceed, onces form is valid
+ const scalingPayload: object = {
+ scaleType: 'SCALE_VNF',
+ scaleVnfData:
+ {
+ scaleVnfType: this.scalingForm.value.scaleType,
+ scaleByStepData: {
+ 'scaling-group-descriptor': this.scalingForm.value.scalingname,
+ 'member-vnf-index': this.scalingForm.value.memberIndex
+ }
+ }
+ };
+ this.scaleInstances(scalingPayload);
+ }
+
+ /** Initialize the scaling @public */
+ public scaleInstances(scalingPayload: object): void {
+ this.isLoadingResults = true;
+ const apiURLHeader: APIURLHEADER = {
+ url: environment.NSDINSTANCES_URL + '/' + this.params.id + '/scale',
+ httpOptions: { headers: this.headers }
+ };
+ const modalData: MODALCLOSERESPONSEDATA = {
+ message: 'Done'
+ };
+ this.restService.postResource(apiURLHeader, scalingPayload).subscribe((result: {}): void => {
+ this.activeModal.close(modalData);
+ this.router.navigate(['/instances/ns/history-operations/' + this.params.id]).catch();
+ }, (error: ERRORDATA): void => {
+ this.restService.handleError(error, 'post');
+ this.isLoadingResults = false;
+ });
+ }
+
+ /** Used to get the AbstractControl of controlName passed @private */
+ private getFormControl(controlName: string): AbstractControl {
+ return this.scalingForm.controls[controlName];
+ }
+}