Merge pull request #30 from thehyve/dev

Add spinner when loading items for item-table
thehyve · Oct 25, 2017 · 1c11e4b · 1c11e4b
2 parents e491047 + c772d93
commit 1c11e4b
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 1 deletion.
diff --git a/data-showcase/src/main/user-interface/src/app/item-table/item-table.component.html b/data-showcase/src/main/user-interface/src/app/item-table/item-table.component.html
@@ -11,7 +11,8 @@
                  [rows]="8" [paginator]="true"
                  [headerCheckboxToggleAllPages]="true"
                  [resizableColumns]="true"
-                 [(selection)]="itemsSelection">
+                 [(selection)]="itemsSelection"
+                 [loading]="dataService.loadingItems" loadingIcon="fa fa-spin fa-refresh fa-fw">
         <p-column selectionMode="multiple" [style]="{ width: '45px'}">
         </p-column>
         <p-column field="name" header="Name"

diff --git a/data-showcase/src/main/user-interface/src/app/services/data.service.ts b/data-showcase/src/main/user-interface/src/app/services/data.service.ts
@@ -26,6 +26,8 @@ export class DataService {
 
   // list of all items
   private items: Item[] = [];
+  // the flag indicating if Items are still being loaded
+  public loadingItems: boolean = false;
   // filtered list of items based on selected node and selected checkbox filters
   public filteredItems: Item[] = [];
   // items available for currently selected node
@@ -165,6 +167,7 @@ export class DataService {
   }
 
   updateItems() {
+    this.loadingItems = true;
     this.itemsPerNode.length = 0;
     this.items.length = 0;
     this.resourceService.getItems()
@@ -181,6 +184,7 @@ export class DataService {
           }
           this.setFilteredItems();
           this.getUniqueFilterValues();
+          this.loadingItems = false;
         },
         err => console.error(err)
       );