summaryrefslogtreecommitdiffstats
path: root/usecaseui-portal/src/app/views
diff options
context:
space:
mode:
authorcyuamber <xuranyjy@chinamobile.com>2019-10-11 09:15:43 +0800
committercyuamber <xuranyjy@chinamobile.com>2019-10-11 09:16:09 +0800
commit97832708ef615e7c32413e3c462ea669d5856450 (patch)
tree275ebfef5b344d340a0c27ceffef49e8271ff23d /usecaseui-portal/src/app/views
parent39f1403b2e4cbe8bc6189c3ff132d12d558bf0fa (diff)
feat: optimize the code for the service-list component
Change-Id: I99c497d700c988fcb6569a4a907ca2a5489f08bf Issue-ID: USECASEUI-307 Signed-off-by: cyuamber <xuranyjy@chinamobile.com>
Diffstat (limited to 'usecaseui-portal/src/app/views')
-rw-r--r--usecaseui-portal/src/app/views/services/services-list/services-list.component.html36
-rw-r--r--usecaseui-portal/src/app/views/services/services-list/services-list.component.less5
-rw-r--r--usecaseui-portal/src/app/views/services/services-list/services-list.component.ts26
3 files changed, 31 insertions, 36 deletions
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 431228d8..a82c8a2b 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
@@ -55,7 +55,7 @@
</app-create-model>
</div>
-<nz-layout style=" padding: 20px 32px; ">
+<nz-layout>
<div class="top-num">
<app-top-card
*ngFor="let item of serviceNunber"
@@ -67,9 +67,9 @@
</app-top-card>
</div>
<div class="list" id="services-list" [ngClass]="{'listdisplay':listDisplay == true}">
- <nz-table *ngIf="1" #nzTable [nzData]="tableData" nzShowSizeChanger [nzFrontPagination]="false"
+ <nz-table #nzTable [nzData]="tableData" nzShowSizeChanger [nzFrontPagination]="false"
[nzShowQuickJumper]="true" [nzPageSizeOptions]="[5,10,15,20]" [nzTotal]='total' [(nzPageSize)]="pageSize"
- [(nzPageIndex)]='pageIndex' [nzLoading]="loading" [nzSize]="'middle'" [nzScroll]="{ y: '58vh' }"
+ [(nzPageIndex)]='pageIndex' [nzLoading]="loading" [nzSize]="'middle'"
(nzPageIndexChange)="searchData()" (nzPageSizeChange)="searchData(true)">
<thead>
<tr>
@@ -90,31 +90,30 @@
<td>{{data["service-instance-name"] || data.nsName}}</td>
<td>{{data["service-instance-id"] || data.nsInstanceId}}</td>
<td>
- <p
- [ngClass]="{'e2eColor':data.serviceDomain=='E2E Service','nsColor':data.serviceDomain=='Network Service','ccvpnColor':data.serviceDomain=='CCVPN','sotnColor':data.serviceDomain=='SOTN','voLTEColor':data.serviceDomain=='voLTE type'}">
+ <p class="usecase">
{{data.serviceDomain}}
</p>
</td>
<td>
- <span [ngClass]="{'active':data.statusClass=='2001','closed':data.statusClass=='Closed','onboarding':data.statusClass=='Onboarding',
- 'updating':data.statusClass=='Updating','deleting':data.statusClass=='1002','creating':data.statusClass=='1001',
- 'scaling':data.statusClass=='1003','healing':data.statusClass=='1004'}"
- *ngIf="data.tips != 'Available' && data.tips != 'Unavailable'">{{data.tips}}</span>
- <span *ngIf="data.tips == 'Available' " style="margin-left: 10px">
+ <span [ngClass]="{'active':data.statusClass==='2001','closed':data.statusClass==='Closed','onboarding':data.statusClass==='Onboarding',
+ 'updating':data.statusClass==='Updating','deleting':data.statusClass==='1002','creating':data.statusClass==='1001',
+ 'scaling':data.statusClass==='1003','healing':data.statusClass==='1004'}"
+ *ngIf="data.tips !== 'Available' && data.tips !== 'Unavailable'">{{data.tips}}</span>
+ <span *ngIf="data.tips === 'Available' " class="marginLeft10">
<img src="assets/images/wancheng-icon.png" alt="Available">
</span>
- <span *ngIf="data.tips == 'Unavailable' " style="margin-left: 10px">
+ <span *ngIf="data.tips === 'Unavailable' " class="marginLeft10">
<img src="assets/images/shibai-icon.png" alt="Unavailable">
</span>
- <nz-progress *ngIf="data.status == 'In Progress'" [nzPercent]="data.rate"
+ <nz-progress *ngIf="data.status === 'In Progress'" [nzPercent]="data.rate"
[nzShowInfo]="false" nzStatus="active"></nz-progress>
</td>
<td>
- <i [ngClass]="{'cannotclick':data.status == 'In Progress'||(data.status=='Failed' && data.operationType=='1001')||(data.status=='Failed' && data.operationType=='1002')}"
+ <i [ngClass]="{'cannotclick':data.status === 'In Progress'||(data.status=='Failed' && data.operationType=='1001')||(data.status==='Failed' && data.operationType=='1002')}"
class="anticon anticon-bars" (click)="serviceDetail(data,1)"></i>
- <i [ngClass]="{'cannotclick':data.status == 'In Progress'}" class="anticon anticon-delete"
+ <i [ngClass]="{'cannotclick':data.status === 'In Progress'}" class="anticon anticon-delete"
(click)="deleteModel(data)"></i>
- <i [ngClass]="{'cannotclick':data.status == 'In Progress'}" class="anticon anticon-ellipsis"
+ <i [ngClass]="{'cannotclick':data.status === 'In Progress'}" class="anticon anticon-ellipsis"
(click)="iconMoreShow(data,tableData)" style="transform: rotate(90deg);"></i>
<ul *ngIf="data.iconMore==true " class="icon-more">
@@ -154,7 +153,6 @@
</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}} "
@@ -224,8 +222,8 @@
</div>
</ng-template>
</nz-modal>
-
- <nz-modal nzWidth="428" [(nzVisible)]="deleteModelVisible" nzTitle=" {{'i18nTextDefine_delete' | translate}} "
+ <!-- <app-delete-modal *ngIf="deleteModalVisible" [deleteModalVisible]="deleteModalVisible"></app-delete-modal> -->
+ <nz-modal nzWidth="428" [(nzVisible)]="deleteModalVisible" nzTitle=" {{'i18nTextDefine_delete' | translate}}"
(nzOnCancel)="deleteCancel()" (nzOnOk)="deleteOk(templatedeletestarting,templateDeleteSuccessFaild)"
nzClassName="{{thisService['serviceDomain'] == 'Network Service'?'nsdeleteModel':'deleteModel'}}"
nzCancelText=" {{'i18nTextDefine_Cancel' | translate}} "
@@ -665,7 +663,7 @@
</div>
<div class="detailComponent" *ngIf="detailshow2">
<app-e2e-detail [detailParams]="detailData" (closeDetail)="detailshow2 = false;listDisplay = false;">
- </app-e2e-detail>
+ </app-e2e-detail>
</div>
<div class="createComponent" *ngIf="createshow">
<app-ccvpn-creation [createParams]="createData" [ccvpn_temParametersContent]="ccvpn_temParametersContent"
diff --git a/usecaseui-portal/src/app/views/services/services-list/services-list.component.less b/usecaseui-portal/src/app/views/services/services-list/services-list.component.less
index dd26bcb7..454e3bc8 100644
--- a/usecaseui-portal/src/app/views/services/services-list/services-list.component.less
+++ b/usecaseui-portal/src/app/views/services/services-list/services-list.component.less
@@ -252,6 +252,9 @@ nz-layout{
font-size: 12px;
color: orangered;
}
+ span.marginLeft10{
+ margin-left: 10px;
+ }
i.anticon {
cursor: pointer;
font-size: 18px;
@@ -335,7 +338,7 @@ nz-layout{
z-index: 3;
}
-.e2eColor,.nsColor,.ccvpnColor,.sotnColor,.voLTEColor{
+.usecase{
width:120px;
height: 34px;
line-height: 34px;
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 0fc46aae..5a1a1ab0 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
@@ -51,11 +51,9 @@ export class ServicesListComponent implements OnInit {
isSol005Interface = false;
orchestratorList = [];
customerList = [];
- customerList2 = [];
customerSelected = { name: null, id: null };
customerSelected2 = { name: null, id: null };
serviceTypeList = [];
- serviceTypeList2 = [];
serviceTypeSelected = { name: '' };
serviceTypeSelected2 = { name: '' };
serviceTypeSelectedName = "";
@@ -89,7 +87,7 @@ export class ServicesListComponent implements OnInit {
}
];
- progressCcvpnOutTimer :any; // ccvpn¡¢NS progress Timer
+ progressCcvpnOutTimer :any; // ccvpn��NS progress Timer
progressingCcvpnTimer :any;
progressNsOutTimer :any;
progressingNsTimer :any;
@@ -116,7 +114,6 @@ export class ServicesListComponent implements OnInit {
.subscribe((data) => {
this.customerList = data.map(item => ({ name: item["subscriber-name"], id: item["global-customer-id"] }) );
if(data.length !== 0){
- // this.customerList2 = data.map(item => ({ name: item["subscriber-name"], id: item["global-customer-id"] }) );
this.customerSelected = this.customerList[0];
this.choseCustomer();
}
@@ -156,9 +153,6 @@ export class ServicesListComponent implements OnInit {
// Create modal box 2 (dialog box) create -------------------------------
isVisible = false;
-
-
-
createModal(): void {
this.isVisible = true;
}
@@ -347,6 +341,7 @@ export class ServicesListComponent implements OnInit {
}
}
})
+ console.log(this.tableData)
this.loading = false;
}, (err) => {
console.log(err);
@@ -513,39 +508,38 @@ export class ServicesListComponent implements OnInit {
service["serviceType"] = this.serviceTypeSelected;
service.childServiceInstances.forEach((item) => {
- if (item.serviceDomain == "SITE") {
+ if (item.serviceDomain === "SITE") {
service.siteSer.push(item);
- } else if (item.serviceDomain == "SDWAN") {
+ } else if (item.serviceDomain === "SDWAN") {
service.sdwanSer.push(item);
}
})
- if (service["serviceDomain"] == 'CCVPN' || service["serviceDomain"] == 'SOTN') {
+ if (service["serviceDomain"] === 'CCVPN' || service["serviceDomain"] === 'SOTN') {
this.detailshow = true;
if (typeNum == 1) {
this.upDateShow = false;
} else {
this.upDateShow = true;
}
- } else if (service["serviceDomain"] == 'E2E Service' || service["serviceDomain"] == 'Network Service') {
+ } else if (service["serviceDomain"] === 'E2E Service' || service["serviceDomain"] === 'Network Service') {
this.detailshow2 = true;
}
this.listDisplay = true;
this.detailData = service;
- console.log(service);
}
- deleteModelVisible = false;
+ deleteModalVisible = false;
terminationType = "graceful";
gracefulTerminationTimeout = 120;
// delete Model show
deleteModel(service) {
this.thisService = service;
- this.deleteModelVisible = true;
+ this.deleteModalVisible = true;
}
deleteOk(templatedeletestarting, templateDeleteSuccessFaild) {
- this.deleteModelVisible = false;
+ this.deleteModalVisible = false;
this.loadingAnimateShow = true;
if (this.thisService["serviceDomain"] == "Network Service") {
this.deleteNsService(this.thisService, templateDeleteSuccessFaild);
@@ -556,7 +550,7 @@ export class ServicesListComponent implements OnInit {
}
deleteCancel() {
- this.deleteModelVisible = false;
+ this.deleteModalVisible = false;
}
deleteNotification(template: TemplateRef<{}>): void {