summaryrefslogtreecommitdiffstats
path: root/usecaseui-portal
diff options
context:
space:
mode:
authorcyuamber <xuranyjy@chinamobile.com>2019-10-15 15:45:40 +0800
committercyuamber <xuranyjy@chinamobile.com>2019-10-15 15:45:45 +0800
commit58372d3b8c3f99cbd199ea2c717388bb6b2eed16 (patch)
tree72516a5096569faf5de115bb7bbf9c1403b2d4c7 /usecaseui-portal
parent816841486589afe416ebd65a55f6010b0ea338ab (diff)
feat:add scaleModel component of services-list page
Change-Id: I713eeb7a038a2c959740ff08f8c5d677f2d7152f Issue-ID: USECASEUI-307 Signed-off-by: cyuamber <xuranyjy@chinamobile.com>
Diffstat (limited to 'usecaseui-portal')
-rw-r--r--usecaseui-portal/src/app/app.module.ts4
-rw-r--r--usecaseui-portal/src/app/views/services/services-list/scale-model/scale-model.component.html40
-rw-r--r--usecaseui-portal/src/app/views/services/services-list/scale-model/scale-model.component.less0
-rw-r--r--usecaseui-portal/src/app/views/services/services-list/scale-model/scale-model.component.spec.ts25
-rw-r--r--usecaseui-portal/src/app/views/services/services-list/scale-model/scale-model.component.ts53
-rw-r--r--usecaseui-portal/src/app/views/services/services-list/services-list.component.html115
-rw-r--r--usecaseui-portal/src/app/views/services/services-list/services-list.component.ts31
7 files changed, 168 insertions, 100 deletions
diff --git a/usecaseui-portal/src/app/app.module.ts b/usecaseui-portal/src/app/app.module.ts
index cbc95de9..04651d01 100644
--- a/usecaseui-portal/src/app/app.module.ts
+++ b/usecaseui-portal/src/app/app.module.ts
@@ -77,6 +77,7 @@ import { TopCardComponent } from './views/services/services-list/top-card/top-ca
import { CreateModelComponent } from './views/services/services-list/create-model/create-model.component';
import { DeleteModelComponent } from './views/services/services-list/delete-model/delete-model.component';
import { NotificationComponent } from './shared/components/notification/notification.component';
+import { ScaleModelComponent } from './views/services/services-list/scale-model/scale-model.component';
@NgModule({
providers: [
@@ -120,7 +121,8 @@ import { NotificationComponent } from './shared/components/notification/notifica
TopCardComponent,
CreateModelComponent,
DeleteModelComponent,
- NotificationComponent
+ NotificationComponent,
+ ScaleModelComponent,
],
imports: [
BrowserModule,
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">*&nbsp;</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">*&nbsp;</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 &nbsp;
- {{"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 &nbsp;
+ {{"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);
}