diff options
Diffstat (limited to 'usecaseui-portal/src/app/services')
3 files changed, 96 insertions, 25 deletions
diff --git a/usecaseui-portal/src/app/services/services-list/services-list.component.html b/usecaseui-portal/src/app/services/services-list/services-list.component.html index 24b2af67..c6626379 100644 --- a/usecaseui-portal/src/app/services/services-list/services-list.component.html +++ b/usecaseui-portal/src/app/services/services-list/services-list.component.html @@ -150,7 +150,14 @@ <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'}">{{data.tips}}</span> + '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"> + <img src="assets/images/wancheng-icon.png" alt="Available"> + </span> + <span *ngIf="data.tips == 'Unavailable' " style="margin-left: 10px"> + <img src="assets/images/shibai-icon.png" alt="Unavailable"> + </span> <nz-progress *ngIf="data.status == 'In Progress'" [nzPercent]="data.rate" [nzShowInfo]="false" nzStatus="active"></nz-progress> </td> @@ -163,14 +170,14 @@ (click)="iconMoreShow(data,tableData)" style="transform: rotate(90deg);"></i> <ul *ngIf="data.iconMore==true " class="icon-more"> - <li> + <li (click)="scaleService(data)"> <i [ngClass]="{'cannotclick':data.serviceDomain!='E2E Service' || data.status == 'In Progress'||(data.status=='Failed' && data.operationType=='1001')||(data.status=='Failed' && data.operationType=='1002')}" - class="anticon anticon-setting" (click)="scaleService(data)"></i> + class="anticon anticon-scale"></i> <span> {{"i18nTextDefine_Scale" | translate}} </span> </li> - <li> + <li (click)="update(data)"> <i [ngClass]="{'cannotclick':data.serviceDomain!='CCVPN' || data.status == 'In Progress'||(data.status=='Failed' && data.operationType=='1001')||(data.status=='Failed' && data.operationType=='1002')}" - class="anticon anticon-cloud-upload-o" (click)="update(data)"></i> + class="anticon anticon-update" ></i> <span> {{"i18nTextDefine_Update" | translate}} </span> </li> </ul> @@ -264,6 +271,7 @@ <span>{{ thisService["serviceDomain"] }}</span> </div> </div> + <div class="close-icons">{{"i18nTextDefine_Close" | translate}}</div> </div> </div> </ng-template> @@ -329,6 +337,7 @@ <span>{{ thisService["serviceDomain"] }}</span> </div> </div> + <div class="close-icons">{{"i18nTextDefine_Close" | translate}}</div> </div> </div> </ng-template> @@ -424,6 +433,7 @@ <span>{{ thisService["serviceDomain"] }}</span> </div> </div> + <div class="close-icons">{{"i18nTextDefine_Close" | translate}}</div> </div> </div> </ng-template> @@ -455,6 +465,7 @@ <span>{{ thisCreateService['serviceDomain'] }}</span> </div> </div> + <div class="close-icons">{{"i18nTextDefine_Close" | translate}}</div> </div> </div> </ng-template> @@ -489,6 +500,7 @@ <span>{{ thisCreateService["serviceDomain"] }}</span> </div> </div> + <div class="close-icons">{{"i18nTextDefine_Close" | translate}}</div> </div> </div> </ng-template> @@ -523,6 +535,7 @@ <span>{{ thisService["serviceDomain"] }}</span> </div> </div> + <div class="close-icons">{{"i18nTextDefine_Close" | translate}}</div> </div> </div> </ng-template> @@ -551,6 +564,7 @@ <span>{{ thisService["serviceDomain"] }}</span> </div> </div> + <div class="close-icons">{{"i18nTextDefine_Close" | translate}}</div> </div> </div> </ng-template> @@ -579,6 +593,7 @@ <span>{{ thisService["serviceDomain"] }}</span> </div> </div> + <div class="close-icons">{{"i18nTextDefine_Close" | translate}}</div> </div> </div> </ng-template> @@ -607,6 +622,7 @@ <span>{{ thisService["serviceDomain"] }}</span> </div> </div> + <div class="close-icons">{{"i18nTextDefine_Close" | translate}}</div> </div> </div> </ng-template> diff --git a/usecaseui-portal/src/app/services/services-list/services-list.component.less b/usecaseui-portal/src/app/services/services-list/services-list.component.less index c1cf7598..b7499724 100644 --- a/usecaseui-portal/src/app/services/services-list/services-list.component.less +++ b/usecaseui-portal/src/app/services/services-list/services-list.component.less @@ -238,8 +238,7 @@ hr { .icon-more{ position: absolute; width: 115px; - height: 135px; - //height: 156px; + height: 90px; top:50px; padding:15px 0 0 15px; background: #ffffff; @@ -250,10 +249,28 @@ hr { margin-bottom:10px; line-height: 20px; text-align: left; + cursor: pointer; + .anticon{ + width: 18px; + height: 18px; + background: url("../../../assets/images/scale.png") no-repeat; + } + .anticon.anticon-update{ + background: url("../../../assets/images/update.png") no-repeat; + } span{ margin-left: 5px; } } + li:hover{ + color: #0DA9E2; + .anticon{ + background: url("../../../assets/images/scale-active.png") no-repeat; + } + .anticon.anticon-update{ + background: url("../../../assets/images/update-active.png") no-repeat; + } + } } } tr.childtr { @@ -275,7 +292,7 @@ hr { height: 100vh; background-color: #f3f3f3; overflow-y: auto; - padding: 20px 32px; + //padding: 20px 32px; z-index: 3; } .createComponent { @@ -291,29 +308,32 @@ hr { } /*2019.01.14*/ .e2eColor,.nsColor,.ccvpnColor,.sotnColor,.voLTEColor{ - color: #FFFFFF; + color: #3671AB; width:120px; height: 34px; line-height: 34px; margin-bottom: 0!important; text-align: center; - background:linear-gradient(131deg,rgba(79,151,239,1) 0%,rgba(48,217,196,1) 100%); + background:linear-gradient(131deg,rgba(147,196,255,1) 0%,rgba(120,241,226,1) 100%); border-radius:4px } .nsColor{ - background:linear-gradient(135deg,rgba(252,167,91,1) 0%,rgba(253,203,106,1) 100%); + background:linear-gradient(135deg,rgba(253,187,127,1) 0%,rgba(250,215,153,1) 100%); border-radius:4px; + color: #A16C39; } -.ccvpnColor{ - background:linear-gradient(135deg,rgba(81,113,251,1) 0%,rgba(201,123,254,1) 100%); +.ccvpnColor{ + background:linear-gradient(135deg,rgba(198,222,251,1) 0%,rgba(217,215,252,1) 100%); border-radius:4px; + color: #7C74BB; } .sotnColor{ - background:linear-gradient(133deg,rgba(24,179,170,1) 0%,rgba(70,216,178,1) 100%); + background:rgba(201,243,239,1); border-radius:4px; + color: #30B0A0; } -.voLTEColor{ - background:#0AD251; +.voLTEColor{ + background:rgba(201,243,239,1); } .vnfColor,.siteColor,.SDWANColor{ color:rgba(60,79,140,0.5); diff --git a/usecaseui-portal/src/app/services/services-list/services-list.component.ts b/usecaseui-portal/src/app/services/services-list/services-list.component.ts index 55e339f1..06991b47 100644 --- a/usecaseui-portal/src/app/services/services-list/services-list.component.ts +++ b/usecaseui-portal/src/app/services/services-list/services-list.component.ts @@ -54,23 +54,23 @@ export class ServicesListComponent implements OnInit { serviceMunber = [ { "serviceDomain": "E2E", - "Success": 16, - "failed": 4, - "InProgress": 11, + "Success": 0, + "failed": 0, + "InProgress": 0, "detailName":"i18nTextDefine_End_To_End_Service" }, { "serviceDomain": "NS", - "Success": 21, - "failed": 2, - "InProgress": 17, + "Success": 0, + "failed": 0, + "InProgress": 0, "detailName":"i18nTextDefine_Network_Service" }, { "serviceDomain": "CCVPN", - "Success": 36, - "failed": 15, - "InProgress": 6, + "Success": 0, + "failed": 0, + "InProgress": 0, "detailName":"i18nTextDefine_Cross_Domain_and_Cross_Layer_VPN" } ]; @@ -361,6 +361,36 @@ export class ServicesListComponent implements OnInit { return item; }) console.log(this.tableData) + this.tableData.map((item,index) => { + if(item.serviceDomain == 'E2E Service'){ + if(item.operationResult == 2001){ + this.serviceMunber[0]["Success"]+=1; + }else if(item.operationResult == 2002){ + this.serviceMunber[0]["failed"]+=1; + }else if(item.operationResult == 2003){ + this.serviceMunber[0]["InProgress"]+=1; + } + } + else if(item.serviceDomain == 'Network Service'){ + if(item.operationResult == 2001){ + this.serviceMunber[1]["Success"]+=1; + }else if(item.operationResult == 2002){ + this.serviceMunber[1]["failed"]+=1; + }else if(item.operationResult == 2003){ + this.serviceMunber[1]["InProgress"]+=1; + } + } + else if(item.serviceDomain == 'CCVPN'){ + if(item.operationResult == 2001){ + this.serviceMunber[2]["Success"]+=1; + }else if(item.operationResult == 2002){ + this.serviceMunber[2]["failed"]+=1; + }else if(item.operationResult == 2003){ + this.serviceMunber[2]["InProgress"]+=1; + } + } + }) + console.log(this.serviceMunber) },(err)=>{ console.log(err); }) @@ -838,6 +868,11 @@ e2eCloseCreate(obj,templateCreatestarting,templateCreateSuccessFaild) { if(data.status == "FAILED"){ console.log("scale E2e service failed :" + JSON.stringify(data)); service.status = "failed"; + service.tips = this.listSortMasters["operationTypes"].find((its) => { + return its["sortCode"] == service.statusClass && its["language"] == this.language + })["sortValue"] + '\xa0\xa0\xa0' + this.listSortMasters["operationResults"].find((its) => { + return its["sortCode"] == 2002 && its["language"] == this.language + })["sortValue"]; this.scaleSuccessNotification(templateScaleSuccessFaild); return false; } |