Avoid cache problems
[portal/nonrtric-controlpanel.git] / webapp-frontend / src / app / policy / policy-instance / policy-instance.component.html
index 29f0579..db676a6 100644 (file)
   ========================LICENSE_END===================================
   -->
 <div>
-    Number of instances: {{noInstances()}}
+    Number of instances: {{instanceCount()}}
     <button id="createButton" mat-icon-button (click)="createPolicyInstance(policyTypeSchema)">
         <mat-icon id="createIcon" matTooltip="Create instance">add_box</mat-icon>
     </button>
     <button id="refreshButton" mat-icon-button color="primary" (click)="refreshTable()">
         <mat-icon id="refreshIcon">refresh</mat-icon>
     </button>
+    <div class="spinner-container" style="display: flex; justify-content: center; align-items: center;"
+        *ngIf="loading$ | async">
+        <mat-spinner></mat-spinner>
+    </div>
+    <div id="truncated" *ngIf="truncated" class="alert">
+        Too many instances! Only {{slice}} results will be shown.
+    </div>
 </div>
 
 <mat-table class="instances-table mat-elevation-z8" id="policiesTable" [dataSource]="instanceDataSource" matSort
         <mat-footer-cell *matFooterCellDef>No records found.</mat-footer-cell>
     </ng-container>
 
-    <mat-header-row *matHeaderRowDef="['instanceId', 'ric', 'service', 'lastModified', 'action']">
+    <mat-header-row *matHeaderRowDef="['instanceId', 'ric', 'service', 'lastModified', 'action']" [ngClass]="{'display-none': !this.hasInstances()}">
     </mat-header-row>
     <mat-row *matRowDef="let instance; columns: ['instanceId', 'ric', 'service', 'lastModified', 'action'];"></mat-row>
-</mat-table>
\ No newline at end of file
+
+    <mat-footer-row *matFooterRowDef="['noRecordsFound']" [ngClass]="{'display-none': this.hasInstances()}">
+    </mat-footer-row>
+
+</mat-table>