diff options
Diffstat (limited to 'usecaseui-portal/src/app/views/services/services-list')
6 files changed, 165 insertions, 99 deletions
diff --git a/usecaseui-portal/src/app/views/services/services-list/scale-model/scale-model.component.html b/usecaseui-portal/src/app/views/services/services-list/scale-model/scale-model.component.html new file mode 100644 index 00000000..cb873149 --- /dev/null +++ b/usecaseui-portal/src/app/views/services/services-list/scale-model/scale-model.component.html @@ -0,0 +1,40 @@ +<nz-modal nzWidth="428" [nzVisible]="scaleModelVisible" nzTitle=" {{'i18nTextDefine_Scale' | translate}} " + (nzOnCancel)="scaleCancel()" (nzOnOk)="scaleOk()" + nzClassName="scaleModel" nzCancelText=" {{'i18nTextDefine_Cancel' | translate}} " + nzOkText=" {{'i18nTextDefine_modelOk' | translate}} "> + <h3><span style="color: red">* </span> {{"i18nTextDefine_SureScale" | translate}} </h3> + <div class="question"> + <h4> {{"i18nTextDefine_InstanceID" | translate}} :</h4> + <div class="scaleModelContent" style="width: 100%">{{ thisService["service-instance-id"] || + thisService["nsInstanceId"] || + thisService["vnfInstanceId"]}} + </div> + </div> + <div *ngFor="let item of e2e_nsData" style="margin-top: 20px"> + <h3>{{ item.netWorkServiceName }}</h3> + <div class="e2eScaleContent"> + <span class="e2eScaleLable"> {{"i18nTextDefine_ScaleType" | translate}} :</span> + <nz-select style="width: 165px;" [(ngModel)]="item.scaleType"> + <nz-option nzValue="SCALE_NS" nzLabel="SCALE_NS"></nz-option> + <nz-option nzValue="SCALE_VNF" nzLabel="SCALE_VNF"></nz-option> + </nz-select> + </div> + <div class="e2eScaleContent"> + <span class="e2eScaleLable"> {{"i18nTextDefine_AspectId" | translate}} :</span> + <input style="width: 165px;" nz-input [(ngModel)]="item.aspectId" placeholder="string"> + </div> + <div class="e2eScaleContent"> + <span class="e2eScaleLable"> {{"i18nTextDefine_Number_Of_Steps" | translate}} :</span> + <nz-input-number style="width: 165px;" [(ngModel)]="item.numberOfSteps" [nzMin]="1" [nzMax]="100" + nzPrecision=0 [nzStep]="1" nzPlaceHolder="number"></nz-input-number> + </div> + <div class="e2eScaleContent"> + <span class="e2eScaleLable"> {{"i18nTextDefine_ScalingDirection" | translate}} :</span> + <nz-select style="width: 165px;" nzPlaceHolder="Chose" [(ngModel)]="item.scalingDirection"> + <nz-option nzValue="SCALE_IN" nzLabel="SCALE_IN"></nz-option> + <nz-option nzValue="SCALE_OUT" nzLabel="SCALE_OUT"></nz-option> + </nz-select> + </div> + </div> + +</nz-modal>
\ No newline at end of file diff --git a/usecaseui-portal/src/app/views/services/services-list/scale-model/scale-model.component.less b/usecaseui-portal/src/app/views/services/services-list/scale-model/scale-model.component.less new file mode 100644 index 00000000..e69de29b --- /dev/null +++ b/usecaseui-portal/src/app/views/services/services-list/scale-model/scale-model.component.less diff --git a/usecaseui-portal/src/app/views/services/services-list/scale-model/scale-model.component.spec.ts b/usecaseui-portal/src/app/views/services/services-list/scale-model/scale-model.component.spec.ts new file mode 100644 index 00000000..5d069ee4 --- /dev/null +++ b/usecaseui-portal/src/app/views/services/services-list/scale-model/scale-model.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { ScaleModelComponent } from './scale-model.component'; + +describe('ScaleModelComponent', () => { + let component: ScaleModelComponent; + let fixture: ComponentFixture<ScaleModelComponent>; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ ScaleModelComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(ScaleModelComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/usecaseui-portal/src/app/views/services/services-list/scale-model/scale-model.component.ts b/usecaseui-portal/src/app/views/services/services-list/scale-model/scale-model.component.ts new file mode 100644 index 00000000..c1b9a86e --- /dev/null +++ b/usecaseui-portal/src/app/views/services/services-list/scale-model/scale-model.component.ts @@ -0,0 +1,53 @@ +import {Component, EventEmitter, Input, OnInit, Output} from '@angular/core'; + +@Component({ + selector: 'app-scale-model', + templateUrl: './scale-model.component.html', + styleUrls: ['./scale-model.component.less'] +}) +export class ScaleModelComponent implements OnInit { + @Input()scaleModelVisible: boolean; + @Input()templatescalestarting; + @Input()templateScaleSuccessFaild; + @Input()thisService; + @Input()e2e_nsData; + @Input()customerSelected; + @Input()serviceTypeSelected; + + @Output() cancel = new EventEmitter<boolean>(); + @Output() scaleModalOK = new EventEmitter<any>(); + constructor() { } + + ngOnInit() { + } + + scaleOk() { + this.scaleModelVisible = false; + let requestBody = { + "service": { + "serviceInstanceName": this.thisService["service-instance-name"], + "serviceType": this.serviceTypeSelected.name, + "globalSubscriberId": this.customerSelected.id, + "resources": this.e2e_nsData.map((item) => { + return { + "resourceInstanceId": item["netWorkServiceId"], + "scaleType": item["scaleType"], + "scaleNsData": { + "scaleNsByStepsData": { + "aspectId": item["aspectId"], + "numberOfSteps": item["numberOfSteps"], + "scalingDirection": item["scalingDirection"] + } + } + } + }) + } + }; + this.scaleModalOK.emit(requestBody) + } + + scaleCancel() { + this.scaleModelVisible = false; + } + +} diff --git a/usecaseui-portal/src/app/views/services/services-list/services-list.component.html b/usecaseui-portal/src/app/views/services/services-list/services-list.component.html index ce3844c1..ff1924fb 100644 --- a/usecaseui-portal/src/app/views/services/services-list/services-list.component.html +++ b/usecaseui-portal/src/app/views/services/services-list/services-list.component.html @@ -153,76 +153,8 @@ </ng-template> </tbody> </nz-table> - <nz-modal nzWidth="428" [nzVisible]="scaleModelVisible" nzTitle=" {{'i18nTextDefine_Scale' | translate}} " - (nzOnCancel)="scaleCancel()" (nzOnOk)="scaleOk(templatescalestarting,templateScaleSuccessFaild)" - nzClassName="scaleModel" nzCancelText=" {{'i18nTextDefine_Cancel' | translate}} " - nzOkText=" {{'i18nTextDefine_modelOk' | translate}} "> - <h3><span style="color: red">* </span> {{"i18nTextDefine_SureScale" | translate}} </h3> - <div class="question"> - <h4> {{"i18nTextDefine_InstanceID" | translate}} :</h4> - <div class="scaleModelContent" style="width: 100%">{{ thisService["service-instance-id"] || - thisService["nsInstanceId"] || - thisService["vnfInstanceId"]}} - </div> - </div> - <div *ngFor="let item of e2e_nsData" style="margin-top: 20px"> - <h3>{{ item.netWorkServiceName }}</h3> - <div class="e2eScaleContent"> - <span class="e2eScaleLable"> {{"i18nTextDefine_ScaleType" | translate}} :</span> - <nz-select style="width: 165px;" [(ngModel)]="item.scaleType"> - <nz-option nzValue="SCALE_NS" nzLabel="SCALE_NS"></nz-option> - <nz-option nzValue="SCALE_VNF" nzLabel="SCALE_VNF"></nz-option> - </nz-select> - </div> - <div class="e2eScaleContent"> - <span class="e2eScaleLable"> {{"i18nTextDefine_AspectId" | translate}} :</span> - <input style="width: 165px;" nz-input [(ngModel)]="item.aspectId" placeholder="string"> - </div> - <div class="e2eScaleContent"> - <span class="e2eScaleLable"> {{"i18nTextDefine_Number_Of_Steps" | translate}} :</span> - <nz-input-number style="width: 165px;" [(ngModel)]="item.numberOfSteps" [nzMin]="1" [nzMax]="100" - nzPrecision=0 [nzStep]="1" nzPlaceHolder="number"></nz-input-number> - </div> - <div class="e2eScaleContent"> - <span class="e2eScaleLable"> {{"i18nTextDefine_ScalingDirection" | translate}} :</span> - <nz-select style="width: 165px;" nzPlaceHolder="Chose" [(ngModel)]="item.scalingDirection"> - <nz-option nzValue="SCALE_IN" nzLabel="SCALE_IN"></nz-option> - <nz-option nzValue="SCALE_OUT" nzLabel="SCALE_OUT"></nz-option> - </nz-select> - </div> - </div> - <ng-template #templatescalestarting> - <div class="ant-notification-notice-content"> - <div class="ant-notification-notice-with-icon"> - <span class="ant-notification-notice-icon"> - <img src="assets/images/execute-inproess.png" alt="instance temination is starting"> - </span> - <div class="ant-notification-notice-message">E2E - {{"i18nTextDefine_InstanceTeminationStarting" | translate}} - </div> - <div class="ant-notification-notice-description"> - <div class="notificationlist"> - <p> {{"i18nTextDefine_InstanceName" | translate}} :</p> - <span>{{ thisService["service-instance-name"] || - thisService["nsInstanceName"] }} - </span> - </div> - <div class="notificationlist"> - <p> {{"i18nTextDefine_Customer" | translate}} :</p> - <span>{{ customerSelected.name }}</span> - </div> - <div class="notificationlist"> - <p> {{"i18nTextDefine_UseCase" | translate}} :</p> - <span>{{ thisService["serviceDomain"] }}</span> - </div> - </div> - <div class="close-icons">{{"i18nTextDefine_Close" | translate}}</div> - </div> - </div> - </ng-template> - </nz-modal> - <app-delete-model + <app-delete-model *ngIf="deleteModalVisible" [deleteModalVisible]="deleteModalVisible" [thisService]="thisService" @@ -234,8 +166,19 @@ (deleteModalOK)="deleteModalOK($event,templateDeleteSuccessFaild)" > </app-delete-model> - - + <app-scale-model + *ngIf="scaleModelVisible" + [scaleModelVisible]="scaleModelVisible" + [thisService]="thisService" + [e2e_nsData]="e2e_nsData" + [customerSelected]="customerSelected" + [serviceTypeSelected]="serviceTypeSelected" + [templatescalestarting]="templatescalestarting" + [templateScaleSuccessFaild]="templateScaleSuccessFaild" + (cancel)="scaleModelVisible=$event" + (scaleModalOK)="scaleModalOK($event,templatescalestarting,templateScaleSuccessFaild)" + > + </app-scale-model> <nz-modal nzWidth="428" [nzVisible]="healModelVisible" nzTitle=" {{'i18nTextDefine_Heal' | translate}} " (nzOnCancel)="healCancel()" (nzOnOk)="healOk(templatehealstarting,templatehealSuccessFaild)" nzClassName="healModel" nzCancelText=" {{'i18nTextDefine_Cancel' | translate}} " @@ -341,6 +284,7 @@ <app-notification #notification [isServicesList]="true" [customerSelected]="customerSelected"></app-notification> <!-- add notification--> + <ng-template #templateCreatestarting> <div class="ant-notification-notice-content"> <div class="ant-notification-notice-with-icon"> @@ -490,6 +434,35 @@ </div> </div> </ng-template> + <ng-template #templatescalestarting> + <div class="ant-notification-notice-content"> + <div class="ant-notification-notice-with-icon"> + <span class="ant-notification-notice-icon"> + <img src="assets/images/execute-inproess.png" alt="instance temination is starting"> + </span> + <div class="ant-notification-notice-message">E2E + {{"i18nTextDefine_InstanceTeminationStarting" | translate}} + </div> + <div class="ant-notification-notice-description"> + <div class="notificationlist"> + <p> {{"i18nTextDefine_InstanceName" | translate}} :</p> + <span>{{ thisService["service-instance-name"] || + thisService["nsInstanceName"] }} + </span> + </div> + <div class="notificationlist"> + <p> {{"i18nTextDefine_Customer" | translate}} :</p> + <span>{{ customerSelected.name }}</span> + </div> + <div class="notificationlist"> + <p> {{"i18nTextDefine_UseCase" | translate}} :</p> + <span>{{ thisService["serviceDomain"] }}</span> + </div> + </div> + <div class="close-icons">{{"i18nTextDefine_Close" | translate}}</div> + </div> + </div> + </ng-template> <ng-template #templateScaleSuccessFaild> <div class="ant-notification-notice-content"> <div class="ant-notification-notice-with-icon"> diff --git a/usecaseui-portal/src/app/views/services/services-list/services-list.component.ts b/usecaseui-portal/src/app/views/services/services-list/services-list.component.ts index 96b4310c..47ba6f9d 100644 --- a/usecaseui-portal/src/app/views/services/services-list/services-list.component.ts +++ b/usecaseui-portal/src/app/views/services/services-list/services-list.component.ts @@ -365,43 +365,18 @@ export class ServicesListComponent implements OnInit { customerId: this.customerSelected.id, serviceType: this.serviceTypeSelected.name, serviceId: service["service-instance-id"] - } + }; this.myhttp.getE2e_nsData(paramsObj) .subscribe((data) => { this.e2e_nsData = data; }) } - scaleOk(templatescalestarting, templateScaleSuccessFaild) { - this.scaleModelVisible = false; - let requestBody = { - "service": { - "serviceInstanceName": this.thisService["service-instance-name"], - "serviceType": this.serviceTypeSelected.name, - "globalSubscriberId": this.customerSelected.id, - "resources": this.e2e_nsData.map((item) => { - return { - "resourceInstanceId": item["netWorkServiceId"], - "scaleType": item["scaleType"], - "scaleNsData": { - "scaleNsByStepsData": { - "aspectId": item["aspectId"], - "numberOfSteps": item["numberOfSteps"], - "scalingDirection": item["scalingDirection"] - } - } - } - }) - } - } - this.scaleE2eService(this.thisService, requestBody, templateScaleSuccessFaild); + scaleModalOK(obj: any,templatescalestarting,templateScaleSuccessFaild) :void{ + this.scaleE2eService(this.thisService, obj, templateScaleSuccessFaild); this.scaleNotification(templatescalestarting); } - scaleCancel() { - this.scaleModelVisible = false; - } - scaleNotification(template: TemplateRef<{}>): void { this.notification.template(template); } |