Pear-Trading/FoodLoop-Web
Archived
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

added loading spinner for when graph is loading

Browse source
This commit is contained in:
Felix 2019-08-16 15:23:18 +01:00
parent ab72264521
commit 12a72c00eb
4 changed files with 46 additions and 12 deletions
Download patch file Download diff file Expand all files Collapse all files

14
src/app/dashboard/more-graphs-and-tables.component.html
View file

@ -5,13 +5,15 @@
<div class="col-sm-7">
<h4 class="card-title mb-0">Spend amount and number of purchases by supplier name</h4>
</div>
<div class="col-sm-5 hidden-sm-down">
<div class="col-sm-5 hidden-sm-down" *ngIf="isBubbleChartLoaded">
<input type="date" [(ngModel)]="bubbleChartBegin" (change)="bubbleChartUpdate()">
<!-- THESE INPUT BOXES DO NOT WORK. Their value remains the client machine's date/time despite changing. -->
<input type="date" [(ngModel)]="bubbleChartEnd" (change)="bubbleChartUpdate()">
</div>
</div>
<div>
<div class="col-sm-7" *ngIf="!isBubbleChartLoaded">
<div class="spinner"></div>
</div>
<div *ngIf="isBubbleChartLoaded">
<canvas baseChart
[datasets]="supplierBubbleChartData"
[options]="supplierBubbleChartOptions"
@ -28,10 +30,6 @@
<div class="col-sm-7">
<h4 class="card-title mb-0">Spend amount and number of organisations</h4>
</div>
<div class="col-sm-5 hidden-sm-down">
<!-- <input type="date" id="yearSpendChartBegin" name="yearSpendChartBegin" ng-model="yearSpendChartBegin" ng-change="yearSpendChartBegin"> -->
<!-- <input type="date" id="yearSpendChartEnd" name="yearSpendChartEnd" ng-model="yearSpendChartEnd" ng-change="yearSpendChartEnd"> -->
</div>
</div>
<div>
<canvas baseChart
@ -63,4 +61,4 @@
</div>
</div>
</div>
</div>
</div>