Refactor customer graph to use new service for org graphs
This commit is contained in:
parent
7342db0713
commit
5e2471aebf
5 changed files with 41 additions and 10 deletions
|
@ -17,6 +17,8 @@ import { AppRoutingModule } from './app.routing';
|
|||
import { AuthGuard } from './_guards/auth.guard';
|
||||
import { ApiService } from './providers/api-service';
|
||||
|
||||
import { OrgGraphsService } from './providers/org-graphs.service';
|
||||
|
||||
// Layouts
|
||||
import { FullLayoutComponent } from './layouts/full-layout.component';
|
||||
import { SimpleLayoutComponent } from './layouts/simple-layout.component';
|
||||
|
@ -54,6 +56,7 @@ import { DashboardModule } from './dashboard/dashboard.module';
|
|||
providers: [
|
||||
AuthGuard,
|
||||
ApiService,
|
||||
OrgGraphsService,
|
||||
{
|
||||
provide: LocationStrategy,
|
||||
useClass: HashLocationStrategy
|
||||
|
|
|
@ -61,7 +61,7 @@
|
|||
</div>
|
||||
</div><!--/.col-->
|
||||
<div *ngIf="showGraph.customersthisweek" class="col-sm-6 col-lg-3">
|
||||
<widget-customer-7-days></widget-customer-7-days>
|
||||
<widget-customers-last-7-days></widget-customers-last-7-days>
|
||||
</div><!--/.col-->
|
||||
<div *ngIf="showGraph.customerslastweek" class="col-sm-6 col-lg-3">
|
||||
<div class="card card-inverse card-info">
|
||||
|
|
|
@ -18,6 +18,16 @@ export class ApiService {
|
|||
}
|
||||
}
|
||||
|
||||
public post(url, data) {
|
||||
if ( this.sessionKey != null ) {
|
||||
data.session_key = this.sessionKey;
|
||||
}
|
||||
return this.http.post(
|
||||
this.apiUrl + url,
|
||||
data
|
||||
).map( response => response.json() );
|
||||
}
|
||||
|
||||
// Login API
|
||||
|
||||
private getSessionKey() {
|
||||
|
|
13
src/app/providers/org-graphs.service.ts
Normal file
13
src/app/providers/org-graphs.service.ts
Normal file
|
@ -0,0 +1,13 @@
|
|||
import { Injectable } from '@angular/core';
|
||||
import { ApiService } from './api-service';
|
||||
|
||||
@Injectable()
|
||||
export class OrgGraphsService {
|
||||
private orgGraphUrl = '/v1/organisation/graphs';
|
||||
|
||||
constructor(private api: ApiService) { }
|
||||
|
||||
public getGraph(name: string) {
|
||||
return this.api.post(this.orgGraphUrl, { graph: name });
|
||||
}
|
||||
}
|
|
@ -1,18 +1,24 @@
|
|||
import { Component, OnInit } from '@angular/core';
|
||||
import { ApiService } from '../providers/api-service';
|
||||
import { OrgGraphsService } from '../providers/org-graphs.service';
|
||||
|
||||
interface ChartData {
|
||||
data: Array<number>;
|
||||
label: string;
|
||||
}
|
||||
|
||||
@Component({
|
||||
selector: 'widget-customer-7-days',
|
||||
selector: 'widget-customers-last-7-days',
|
||||
templateUrl: 'customers.component.html',
|
||||
})
|
||||
export class Customer7DayWidget implements OnInit {
|
||||
public lineChartData: Array<any> = [
|
||||
|
||||
public lineChartData: Array<ChartData> = [
|
||||
{
|
||||
data: [],
|
||||
label: 'Series A'
|
||||
}
|
||||
];
|
||||
public lineChartLabels: Array<any> = [];
|
||||
public lineChartLabels: Array<string>;
|
||||
public lineChartOptions: any = {
|
||||
maintainAspectRatio: false,
|
||||
scales: {
|
||||
|
@ -59,16 +65,15 @@ export class Customer7DayWidget implements OnInit {
|
|||
|
||||
public customerSum: Number = 0;
|
||||
|
||||
constructor(private api: ApiService) { }
|
||||
constructor(private graphService: OrgGraphsService) { }
|
||||
|
||||
ngOnInit(): void {
|
||||
this.api.graph_data(undefined)
|
||||
this.graphService.getGraph('customers_last_7_days')
|
||||
.subscribe(
|
||||
result => {
|
||||
console.log(result);
|
||||
const customersThisWeek = result.data.customersthisweek;
|
||||
this.lineChartData[0].data = customersThisWeek.customerno;
|
||||
this.lineChartLabels = customersThisWeek.day;
|
||||
this.lineChartData[0].data = result.graph.count;
|
||||
this.lineChartLabels = result.graph.day;
|
||||
this.customerSum = this.lineChartData[0].data.reduce((a, b) => a + b, 0);
|
||||
}
|
||||
);
|
||||
|
|
Reference in a new issue