feat: add loading for page

Change-Id: I23a0076ffb14779e60e0aa810a6c0f1fa046a3ac
Issue-ID: USECASEUI-306
Signed-off-by: cyuamber <xuranyjy@chinamobile.com>

3 files changed, 7 insertions, 2 deletions

diff --git a/usecaseui-portal/src/app/ccvpn-network/ccvpn-network.component.html b/usecaseui-portal/src/app/ccvpn-network/ccvpn-network.component.html
index 1a1a2a46..25687f67 100644
--- a/usecaseui-portal/src/app/ccvpn-network/ccvpn-network.component.html
+++ b/usecaseui-portal/src/app/ccvpn-network/ccvpn-network.component.html
@@ -13,6 +13,7 @@
     See the License for the specific language governing permissions and
     limitations under the License.
 -->
+<nz-spin [nzSpinning]="isSpinning" nzSize="large">
 <div class="model">
   <!--chart-->
   <button nz-button nzType="primary" *ngIf="!nonetwork" style="margin-top: 2px;display: inline-block" (click)="showForm()"
@@ -148,4 +149,4 @@
     <button nz-button nzType="default" nzSize="small" class="del-button" style="width: 60px;" (click)="hideForm()"> {{"i18nTextDefine_Cancel" | translate}} </button>
   </div>
 </div>
-
+</nz-spin>
diff --git a/usecaseui-portal/src/app/ccvpn-network/ccvpn-network.component.ts b/usecaseui-portal/src/app/ccvpn-network/ccvpn-network.component.ts
index 9620a977..b49b6902 100644
--- a/usecaseui-portal/src/app/ccvpn-network/ccvpn-network.component.ts
+++ b/usecaseui-portal/src/app/ccvpn-network/ccvpn-network.component.ts
@@ -87,6 +87,7 @@ export class CcvpnNetworkComponent implements OnInit {
     outCloudShow = false;
     inputshow = false;
     delBoxisVisible = false;
+    isSpinning = true;
 
     d3Data = [];//D3Render the required data
     logicalLinks = [];//logicalLinks Existing connection data returned by the interface
@@ -166,8 +167,10 @@ export class CcvpnNetworkComponent implements OnInit {
 
     //Get cloud image data
     getD3Data() {
+        this.isSpinning = true;
         this.myhttp.getNetworkD3Data()
             .subscribe((data) => {
+                this.isSpinning = false;
                 if (data.length == 0) {
                     this.addLinkDisabled = false;
                     this.nonetwork = true;
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 5856442e..a17c195d 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
@@ -275,7 +275,7 @@ export class ServicesListComponent implements OnInit {
   pageIndex = 1;
   pageSize = 10;
   total = 100;
-  loading = false;
+  loading = true;
 
 
     getTableData(){
@@ -288,6 +288,7 @@ export class ServicesListComponent implements OnInit {
     }
     this.myhttp.getServicesTableData(paramsObj)
       .subscribe((data)=>{
+        this.loading = false;
         console.log(data);
         this.total = data.body.total;
         this.tableData = data.body.tableList.map((item)=>{