Web app leaderboard done

This commit is contained in:
piratefinn 2017-11-10 18:41:35 +00:00
parent faea82d2cc
commit c4a9790eb8
5 changed files with 29 additions and 28 deletions

View file

@ -13,6 +13,7 @@ import { AddDataComponent } from './add-data.component';
import { FeedbackComponent } from './feedback.component';
import { TransactionLogComponent } from './transaction-log.component';
import { PayrollLogComponent } from './payroll-log.component';
import { LeaderboardComponent } from './leaderboard.component';
import { MapComponent } from './map.component';
// Using child path to allow for FullLayout theming

View file

@ -7,15 +7,17 @@
<small>By default this loads the page with your position.</small>
</div>
<div *ngIf="!noLeaderboardList" class="card-block">
<div class="dropdown">
<button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Choose Leaderboard type
</button>
<div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
<a class="dropdown-item">Action</a>
<a class="dropdown-item">Another action</a>
<a class="dropdown-item">Something else here</a>
</div>
<div class="input-group mb-3">
<select type="text" [(ngModel)]="listType" (ngModelChange)="changeLeaderboard($event)">
<option value="daily_total">Yesterday Total</option>
<option value="daily_count">Yesterday Count</option>
<option value="weekly_total" selected>Last Week Total</option>
<option value="weekly_count">Last Week Count</option>
<option value="monthly_total">Last Month Total</option>
<option value="monthly_count">Last Month Count</option>
<option value="all_time_total">All Time Total</option>
<option value="all_time_count">All Time Count</option>
</select>
</div>
<table class="table table-striped table-hover">
<thead>
@ -26,7 +28,7 @@
</tr>
</thead>
<tbody>
<tr transaction-result *ngFor="let leaderboard of leaderboardList | paginate: paginateConfig" [leaderboard]="leaderboard"></tr>
<tr leaderboard-result *ngFor="let leaderboard of leaderboardList | paginate: paginateConfig" [leaderboard]="leaderboard" [listType]="listType"></tr>
</tbody>
</table>
<pagination-template #p="paginationApi"

View file

@ -13,7 +13,7 @@ import 'rxjs/add/operator/map';
})
export class LeaderboardComponent implements OnInit {
transactionList;
leaderboardList;
noLeaderboardList = false;
public p: any;
@ -31,10 +31,7 @@ export class LeaderboardComponent implements OnInit {
constructor(
private http: Http,
private api: ApiService,
) {
this.myDate = moment().format('YYYY-MM-DD[T]HH:mm');
// this.myDate = new Date().toISOString().slice(0, 16);
}
) { }
ngOnInit(): void {
this.loadLeaderboard(0);
@ -51,22 +48,22 @@ export class LeaderboardComponent implements OnInit {
// }
public changeLeaderboard(event) {
this.loadLeaderboard();
this.loadLeaderboard(0);
}
loadLeaderboard(leadPage: number) {
console.log(leadPage, listType);
this.api.leaderboard_fetch(listType,leadPage).subscribe(
console.log(leadPage, this.listType);
this.api.leaderboard_fetch(this.listType,leadPage).subscribe(
result => {
if (result.transactions.length > 0) {
this.transactionList = result.transactions;
if (result.leaderboard.length > 0) {
this.leaderboardList = result.leaderboard;
// TODO Rename in server
this.paginateConfig.totalItems = result.page_no;
this.paginateConfig.totalItems = result.count;
this.paginateConfig.currentPage = result.page;
this.noLeaderboardList = false;
} else {
// handle the case when the transactionList is empty
// handle the case when the leaderboardList is empty
this.leaderboardList = null;
this.noLeaderboardList = true;
}

View file

@ -1,3 +1,3 @@
<td>{{ item.position }}</td>
<td class="text-truncate">{{ item.display_name }}</td>
<td>{{ listType.includes('total') ? (item.value | currency:'GBP':true:'1.2-2') : (item.value | number:'1.0-0') }}</td>
<td>{{ leaderboard.position }}</td>
<td class="text-truncate">{{ leaderboard.display_name }}</td>
<td>{{ listType.includes('total') ? (leaderboard.value | currency:'GBP':true:'1.2-2') : (leaderboard.value | number:'1.0-0') }}</td>

View file

@ -1,9 +1,9 @@
import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core';
interface LeaderboardData {
seller: number;
position: number;
display_name: number,
value: number;
purchase_time: string;
}
@Component({
@ -12,7 +12,8 @@ interface LeaderboardData {
templateUrl: 'leaderboard-result.component.html',
})
export class LeaderboardResultComponent implements OnInit {
@Input() public leaderboard: leaderboardData;
@Input() public leaderboard: LeaderboardData;
@Input() public listType: string;
ngOnInit(): void {
}