BROKEN: Added wards table
This commit is contained in:
parent
1dc46a55e0
commit
db5f982ed3
5 changed files with 91 additions and 0 deletions
|
@ -38,6 +38,7 @@ import { RecurResultComponent } from '../shared/recur-result.component';
|
||||||
import { RecurTableComponent } from '../shared/recur-table.component';
|
import { RecurTableComponent } from '../shared/recur-table.component';
|
||||||
import { TransactionResultComponent } from '../shared/transaction-result.component';
|
import { TransactionResultComponent } from '../shared/transaction-result.component';
|
||||||
import { SupplierResultComponent } from '../shared/supplier-result.component';
|
import { SupplierResultComponent } from '../shared/supplier-result.component';
|
||||||
|
import { WardResultComponent } from '../shared/ward-result.component';
|
||||||
import { PayrollResultComponent } from '../shared/payroll-result.component';
|
import { PayrollResultComponent } from '../shared/payroll-result.component';
|
||||||
import { LeaderboardResultComponent } from '../shared/leaderboard-result.component';
|
import { LeaderboardResultComponent } from '../shared/leaderboard-result.component';
|
||||||
|
|
||||||
|
@ -73,6 +74,7 @@ import { environment } from '../../environments/environment';
|
||||||
CategoryMonthComponent,
|
CategoryMonthComponent,
|
||||||
TransactionResultComponent,
|
TransactionResultComponent,
|
||||||
SupplierResultComponent,
|
SupplierResultComponent,
|
||||||
|
WardResultComponent,
|
||||||
PayrollLogComponent,
|
PayrollLogComponent,
|
||||||
PayrollResultComponent,
|
PayrollResultComponent,
|
||||||
LeaderboardComponent,
|
LeaderboardComponent,
|
||||||
|
|
|
@ -1,4 +1,53 @@
|
||||||
<div class="animated fadeIn">
|
<div class="animated fadeIn">
|
||||||
|
<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>
|
||||||
<div class="card">
|
<div class="card">
|
||||||
<div class="card-block">
|
<div class="card-block">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
|
|
|
@ -20,11 +20,14 @@ export class MoreStuffComponent implements OnInit {
|
||||||
isBubbleChartLoaded:boolean = false;
|
isBubbleChartLoaded:boolean = false;
|
||||||
isLineChartLoaded:boolean = false;
|
isLineChartLoaded:boolean = false;
|
||||||
isSupplierChartLoaded:boolean = false;
|
isSupplierChartLoaded:boolean = false;
|
||||||
|
wardList: any;
|
||||||
|
wardListAvailable = false;
|
||||||
|
|
||||||
constructor(
|
constructor(
|
||||||
private api: ApiService,
|
private api: ApiService,
|
||||||
private currencyPipe: CurrencyPipe,
|
private currencyPipe: CurrencyPipe,
|
||||||
) {
|
) {
|
||||||
|
this.tableSummary();
|
||||||
this.bubbleChartBegin = moment().format('YYYY-MM-DD');
|
this.bubbleChartBegin = moment().format('YYYY-MM-DD');
|
||||||
this.bubbleChartEnd = moment().format('YYYY-MM-DD');
|
this.bubbleChartEnd = moment().format('YYYY-MM-DD');
|
||||||
this.lineChartBegin = moment().format('YYYY-MM-DD');
|
this.lineChartBegin = moment().format('YYYY-MM-DD');
|
||||||
|
@ -178,6 +181,21 @@ export class MoreStuffComponent implements OnInit {
|
||||||
return `${value.supplier}: ${this.currencyPipe.transform(value.value, 'GBP', 'symbol', '1.2-2')} over ${value.count} purchases`;
|
return `${value.supplier}: ${this.currencyPipe.transform(value.value, 'GBP', 'symbol', '1.2-2')} over ${value.count} purchases`;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
private tableSummary() {
|
||||||
|
this.api.loadMiscUrl('organisation/external/lcc_tables').subscribe(
|
||||||
|
result => {
|
||||||
|
this.wardList = result.wards;
|
||||||
|
if (this.wardList) {
|
||||||
|
this.wardListAvailable = true;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
error => {
|
||||||
|
console.log('Retrieval Error');
|
||||||
|
console.log( error._body );
|
||||||
|
}
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
private loadYearSpend() {
|
private loadYearSpend() {
|
||||||
this.api.loadMiscUrl('organisation/external/year_spend').subscribe(
|
this.api.loadMiscUrl('organisation/external/year_spend').subscribe(
|
||||||
|
|
3
src/app/shared/ward-result.component.html
Normal file
3
src/app/shared/ward-result.component.html
Normal file
|
@ -0,0 +1,3 @@
|
||||||
|
<td>{{ward.ward}}</td>
|
||||||
|
<td>{{ward.count}}</td>
|
||||||
|
<td>{{ward.sum | currency:'GBP':'symbol':'1.2-2' }}</td>
|
19
src/app/shared/ward-result.component.ts
Normal file
19
src/app/shared/ward-result.component.ts
Normal file
|
@ -0,0 +1,19 @@
|
||||||
|
import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core';
|
||||||
|
|
||||||
|
interface WardData {
|
||||||
|
ward: string;
|
||||||
|
sum: number;
|
||||||
|
count: number;
|
||||||
|
}
|
||||||
|
|
||||||
|
@Component({
|
||||||
|
// tslint:disable-next-line
|
||||||
|
selector: '[ward-result]',
|
||||||
|
templateUrl: 'ward-result.component.html',
|
||||||
|
})
|
||||||
|
export class WardResultComponent implements OnInit {
|
||||||
|
@Input() public ward: WardData;
|
||||||
|
|
||||||
|
ngOnInit(): void {
|
||||||
|
}
|
||||||
|
}
|
Reference in a new issue