From 7c41e83299c8afc2d647d0d25069152b89ce6bd8 Mon Sep 17 00:00:00 2001
From: wangyuerg <wangyuerg@chinamobile.com>
Date: Fri, 26 Mar 2021 17:48:55 +0800
Subject: style: add loading after click the OK button to submit new
 communication service

Signed-off-by: wangyuerg <wangyuerg@chinamobile.com>
Change-Id: Iffd508a7a08df29d0c9eacb6baa9841cd8f5e071
Issue-ID: USECASEUI-527
---
 .../business-order/business-order.component.html   | 29 ++++++++++++++--------
 1 file changed, 18 insertions(+), 11 deletions(-)

(limited to 'usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/business-order/business-order.component.html')

diff --git a/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/business-order/business-order.component.html b/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/business-order/business-order.component.html
index 57e08be7..e41e1113 100644
--- a/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/business-order/business-order.component.html
+++ b/usecaseui-portal/src/app/views/services/slicing-management/csmf-slicing-business-management/business-order/business-order.component.html
@@ -1,5 +1,5 @@
-<nz-modal [(nzVisible)]="showModel" nzTitle="Create Communication Service" (nzOnCancel)="handleCancel()"
-    (nzOnOk)="handleOk()" nzWidth="80%">
+<nz-modal [(nzVisible)]="showModel" nzTitle="Create Communication Service" (nzOnCancel)="handleCancel()" nzWidth="80%"
+    [nzFooter]="modalFooter">
     <div class="subnet_params_container">
         <form nz-form>
             <nz-form-item *ngFor="let item of comunicationFormItems; let i = index">
@@ -7,20 +7,22 @@
                     {{ item.title }}
                 </nz-form-label>
                 <nz-form-control [nzSpan]="16">
-                    <nz-tooltip    [nzTitle]="item.scoped&&item.scopedText?item.scopedText:''" [nzPlacement]="'right'"
+                    <nz-tooltip [nzTitle]="item.scoped&&item.scopedText?item.scopedText:''" [nzPlacement]="'right'"
                         [nzTrigger]="'focus'">
-                        <input nz-input nz-tooltip   [id]="item.key" [name]="item.key" *ngIf="item.type === 'input'"
+                        <input nz-input nz-tooltip [id]="item.key" [name]="item.key" *ngIf="item.type === 'input'"
                             [(ngModel)]="slicing_order_info[item.key]"
                             [ngClass]="{'error-input-border' : validateRulesShow[i] === true}"
                             [placeholder]="item.placeholder ? item.placeholder : ''"
                             (blur)="item.required ? this.Util.validator(item.title,item.key,slicing_order_info[item.key],i,rulesText,validateRulesShow) : this.Util.validator()" />
-                            <div *ngIf="item.coverflag" class="detail-wrap">
-                               <p>
-                                   {{ masktext }}
-                                </p> 
-                                <img src="assets/images/coverageAreaMap.png" class="detail-img"/>
-                            </div>
-                            <img src="assets/images/ask-img.png" alt="" class="detail-icon" *ngIf="item.key === 'coverageAreaNumber'" (mouseover)="detailFn(item.coverflag)" (mouseleave)="detailFn(item.coverflag)" />
+                        <div *ngIf="item.coverflag" class="detail-wrap">
+                            <p>
+                                {{ masktext }}
+                            </p>
+                            <img src="assets/images/coverageAreaMap.png" class="detail-img" />
+                        </div>
+                        <img src="assets/images/ask-img.png" alt="" class="detail-icon"
+                            *ngIf="item.key === 'coverageAreaNumber'" (mouseover)="detailFn(item.coverflag)"
+                            (mouseleave)="detailFn(item.coverflag)" />
                     </nz-tooltip>
                     <nz-radio-group [name]="item.key" [(ngModel)]="slicing_order_info[item.key]"
                         *ngIf="item.type === 'radio'">
@@ -44,4 +46,9 @@
             </nz-form-item>
         </form>
     </div>
+    <ng-template #modalFooter>
+        <span>Modal Footer:</span>
+        <button nz-button nzType="default" (click)="handleCancel()">Cancel</button>
+        <button nz-button nzType="primary" (click)="handleOk()" [nzLoading]="loading">OK</button>
+    </ng-template>
 </nz-modal>
\ No newline at end of file
-- 
cgit 1.2.3-korg