Added initial dashboard display
Uses mock API
This commit is contained in:
parent
7c55779a0f
commit
ee253f263f
4 changed files with 37 additions and 8 deletions
|
@ -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"
|
||||
|
|
|
@ -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,
|
||||
}
|
||||
}],
|
||||
},
|
||||
|
|
|
@ -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'] || '/';
|
||||
}
|
||||
|
|
|
@ -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],
|
||||
}
|
||||
)
|
||||
}
|
||||
}
|
Reference in a new issue