Added initial dashboard display

Uses mock API
This commit is contained in:
piratefinn 2017-06-19 17:20:21 +01:00
parent 7c55779a0f
commit ee253f263f
4 changed files with 37 additions and 8 deletions

View file

@ -13,8 +13,8 @@
<a class="dropdown-item" href="#">Something else here</a>
</div>
</div>
<h4 class="mb-0">£183.98</h4>
<p>Money spent this week</p>
<h4 class="mb-0">138</h4>
<p>Customers this week</p>
</div>
<div class="chart-wrapper px-3" style="height:70px;">
<canvas baseChart class="chart"
@ -36,7 +36,7 @@
<i class="icon-location-pin"></i>
</button>
<h4 class="mb-0">9.823</h4>
<p>Money spent last week</p>
<p>Customers last week</p>
</div>
<div class="chart-wrapper px-3" style="height:70px;">
<canvas baseChart class="chart"

View file

@ -1,12 +1,29 @@
import { Component, OnInit } from '@angular/core';
import { Http, Response } from '@angular/http';
import { ApiService } from '../providers/api-service';
import { Router } from '@angular/router';
@Component({
templateUrl: 'dashboard.component.html'
})
export class DashboardComponent implements OnInit {
thisweekcustomerno: any;
// constructor( ) { }
constructor(
private http: Http,
private api: ApiService,
) {
this.api.graph_data(undefined)
.subscribe(
result => {
console.log(result);
this.thisweekcustomerno = result;
this.lineChart1Data[0].data = this.thisweekcustomerno.customerno;
this.lineChart1Labels = this.thisweekcustomerno.day;
}
)
}
public brandPrimary = '#20a8d8';
public brandSuccess = '#4dbd74';
@ -45,11 +62,11 @@ export class DashboardComponent implements OnInit {
// lineChart1
public lineChart1Data: Array<any> = [
{
data: [44.72, 29.97, 16.65, 30.99, 47.75, 6.95, 6.95],
data: [],
label: 'Series A'
}
];
public lineChart1Labels: Array<any> = ['January', 'February', 'March', 'April', 'May', 'June', 'July'];
public lineChart1Labels: Array<any> = [];
public lineChart1Options: any = {
maintainAspectRatio: false,
scales: {
@ -68,8 +85,6 @@ export class DashboardComponent implements OnInit {
display: false,
ticks: {
display: false,
min: 5 - 5,
max: 50 + 5,
}
}],
},

View file

@ -36,6 +36,10 @@ export class LoginComponent implements OnInit {
}
);
this.api.graph_data(undefined).subscribe(
result => { console.log(result) }
)
// get return url from route parameters or default to '/'
this.returnUrl = this.route.snapshot.queryParams['returnUrl'] || '/';
}

View file

@ -84,4 +84,14 @@ export class ApiService {
).map( response => response.json() );
}
// Fake data to mimic
public graph_data(data) {
return Observable.of(
{
day : ['Monday', 'tuesday','wednesday','thursday','friday','saturday','sunday'],
customerno : [1,2,3,4,5,6,7],
}
)
}
}