2019-09-09 16:13:34 +01:00
< div class = "animated fadeIn" >
< div class = "row" >
< div class = "col-lg-12" >
< div class = "card" >
< div class = "card-header" >
< strong > List of Transaction Types< / strong >
< / div >
< div * ngIf = "metaTypeListAvailable" class = "card-block" >
< table class = "table table-striped table-hover" >
< thead >
< tr >
< th > Ward< / th >
< th > Amount of Transactions< / th >
< th > Sum of Transactions< / th >
< / tr >
< / thead >
< tbody >
< tr meta-type-result * ngFor = "let type of metaTypeList" [ type ] = " type " > < / tr >
< / tbody >
< / table >
< / div >
< div * ngIf = "!metaTypeListAvailable" class = "card-block" >
No Data available.
< / div >
< / div >
< / div >
< / div >
< / div >
2019-07-10 13:04:07 +01:00
< div class = "animated fadeIn" >
2019-09-04 18:21:21 +01:00
< div class = "row" >
< div class = "col-lg-12" >
< div class = "card" >
< div class = "card-header" >
< strong > List of Ward Transactions< / strong >
< / div >
< div * ngIf = "wardListAvailable" class = "card-block" >
< table class = "table table-striped table-hover" >
< thead >
< tr >
< th > Ward< / th >
< th > Amount of Transactions< / th >
< th > Sum of Transactions< / th >
< / tr >
< / thead >
< tbody >
< tr ward-result * ngFor = "let ward of wardList" [ ward ] = " ward " > < / tr >
< / tbody >
< / table >
< / div >
< div * ngIf = "!wardListAvailable" class = "card-block" >
No Data available.
< / div >
< / div >
< / div >
< / div >
< / div >
< div class = "animated fadeIn" >
< div class = "card" >
< div class = "row" >
< div class = "col-sm-8" >
< h4 class = "card-title mb-0" > Blah< / h4 >
< / div >
< div * ngIf = "" class = "card-block" >
< table class = "table table-striped table-hover" >
< thead >
< tr >
< th > Ward< / th >
< th > Amount of Transactions< / th >
< th > Sum of Transactions< / th >
< / tr >
< / thead >
< tbody >
< tr ward-result * ngFor = "let ward of wardList" > < / tr >
< / tbody >
< / table >
< / div >
< / div >
< / div >
2019-07-15 01:17:01 +01:00
< div class = "card" >
< div class = "card-block" >
< div class = "row" >
2019-08-16 12:27:05 +01:00
< div class = "col-sm-8" >
< h4 class = "card-title mb-0" > Supplier spend amount and number of purchases< / h4 >
2019-07-10 13:04:07 +01:00
< / div >
2019-08-20 16:47:20 +01:00
< div class = "col-sm-4 hidden-sm-down" * ngIf = "isBubbleChartLoaded" >
2019-08-15 16:51:06 +01:00
< input type = "date" [ ( ngModel ) ] = " bubbleChartBegin " ( change ) = " bubbleChartUpdate ( ) " >
< input type = "date" [ ( ngModel ) ] = " bubbleChartEnd " ( change ) = " bubbleChartUpdate ( ) " >
2019-08-09 10:21:40 +01:00
< / div >
2019-07-15 01:17:01 +01:00
< / div >
2019-08-30 16:50:19 +01:00
< small > vertical shows number of purchases, size of bubble shows the total spend amount, horizontal shows date< / small >
2019-08-20 16:47:20 +01:00
< div class = "col-sm-12" * ngIf = "!isBubbleChartLoaded" >
2019-08-16 15:23:18 +01:00
< div class = "spinner" > < / div >
< / div >
< div * ngIf = "isBubbleChartLoaded" >
2019-07-15 01:17:01 +01:00
< canvas baseChart
[datasets]="supplierBubbleChartData"
[options]="supplierBubbleChartOptions"
[labels]="supplierBubbleChartLabels"
[legend]="showLegend"
[chartType]="supplierBubbleChartType">
< / canvas >
< / div >
2019-07-10 13:04:07 +01:00
< / div >
2019-07-15 01:17:01 +01:00
< / div >
< div class = "card" >
< div class = "card-block" >
< div class = "row" >
2019-08-30 16:50:19 +01:00
< div class = "col-sm-12" >
2019-08-06 16:51:44 +01:00
< h4 class = "card-title mb-0" > Spend amount and number of organisations< / h4 >
2019-08-30 16:50:19 +01:00
< small > horizontal axis shows date, vertical axis shows total number of orgs and amount spent< / small >
2019-08-22 16:59:51 +01:00
< / div >
2019-07-15 01:17:01 +01:00
< / div >
< div >
< canvas baseChart
[datasets]="yearSpendChartData"
[options]="yearSpendChartOptions"
[labels]="yearSpendChartLabels"
[legend]="showLegend"
[chartType]="yearSpendChartType">
< / canvas >
< / div >
< / div >
< / div >
< div class = "card" >
< div class = "card-block" >
< div class = "row" >
2019-08-30 16:50:19 +01:00
< div class = "col-sm-6" >
2019-07-15 01:17:01 +01:00
< h4 class = "card-title mb-0" > Supplier Spend History< / h4 >
< / div >
2019-08-30 16:50:19 +01:00
< div class = "col-sm-6 hidden-sm-down" >
< button type = "button" class = "btn btn-danger" ( click ) = " supplierChartPrevious ( ) " > Previous Suppliers< / button >
< button type = "button" class = "btn btn-info" ( click ) = " supplierChartNext ( ) " > Next Suppliers< / button >
2019-08-22 16:59:51 +01:00
< / div >
2019-07-15 01:17:01 +01:00
< / div >
2019-08-30 16:50:19 +01:00
< div * ngIf = "isSupplierChartLoaded" >
2019-07-15 12:38:06 +01:00
< canvas baseChart # supplierChart
2019-07-15 01:17:01 +01:00
[datasets]="supplierMonthChartData"
[options]="supplierMonthChartOptions"
2019-08-06 16:51:44 +01:00
[colors]="supplierMonthChartColours"
2019-07-15 01:17:01 +01:00
[labels]="supplierMonthChartLabels"
[legend]="showLegend"
[chartType]="supplierMonthChartType">
< / canvas >
< / div >
< / div >
< / div >
2019-08-20 16:47:20 +01:00
< / div >