diff --git a/src/app/dashboard/dashboard.component.ts b/src/app/dashboard/dashboard.component.ts
index 93489c6..2174eae 100644
--- a/src/app/dashboard/dashboard.component.ts
+++ b/src/app/dashboard/dashboard.component.ts
@@ -2,6 +2,7 @@ import { Directive, Component, OnInit } from '@angular/core';
import { Http, Response } from '@angular/http';
import { ApiService } from '../providers/api-service';
import { Router } from '@angular/router';
+import { Customer7DayWidget } from '../widgets/customers.component';
@Component({
templateUrl: 'dashboard.component.html'
diff --git a/src/app/dashboard/dashboard.module.ts b/src/app/dashboard/dashboard.module.ts
index a365b86..fca2e05 100644
--- a/src/app/dashboard/dashboard.module.ts
+++ b/src/app/dashboard/dashboard.module.ts
@@ -9,6 +9,8 @@ import { LeaderboardsComponent } from './leaderboards.component';
import { AccountEditComponent } from './account-edit.component';
import { AddDataComponent } from './add-data.component';
+import { Customer7DayWidget } from '../widgets/customers.component';
+
import { DashboardRoutingModule } from './dashboard.routing';
@NgModule({
@@ -26,6 +28,7 @@ import { DashboardRoutingModule } from './dashboard.routing';
LeaderboardsComponent,
AccountEditComponent,
AddDataComponent,
+ Customer7DayWidget,
]
})
export class DashboardModule { }
diff --git a/src/app/widgets/customers.component.html b/src/app/widgets/customers.component.html
new file mode 100644
index 0000000..2eb47af
--- /dev/null
+++ b/src/app/widgets/customers.component.html
@@ -0,0 +1,28 @@
+
+
+
+
+
+
+
{{ customerSum }}
+
Customers this week
+
+
+
+
+
diff --git a/src/app/widgets/customers.component.ts b/src/app/widgets/customers.component.ts
new file mode 100644
index 0000000..f9bebe4
--- /dev/null
+++ b/src/app/widgets/customers.component.ts
@@ -0,0 +1,85 @@
+import { Component, OnInit } from '@angular/core';
+import { ApiService } from '../providers/api-service';
+
+@Component({
+ selector: 'widget-customer-7-days',
+ templateUrl: 'customers.component.html',
+})
+export class Customer7DayWidget implements OnInit {
+ public lineChartData: Array
= [
+ {
+ data: [],
+ label: 'Series A'
+ }
+ ];
+ public lineChartLabels: Array = [];
+ public lineChartOptions: any = {
+ maintainAspectRatio: false,
+ scales: {
+ xAxes: [{
+ gridLines: {
+ color: 'transparent',
+ zeroLineColor: 'transparent'
+ },
+ ticks: {
+ fontSize: 2,
+ fontColor: 'transparent',
+ }
+
+ }],
+ yAxes: [{
+ display: false,
+ ticks: {
+ display: false,
+ }
+ }],
+ },
+ elements: {
+ line: {
+ borderWidth: 1
+ },
+ point: {
+ radius: 4,
+ hitRadius: 10,
+ hoverRadius: 4,
+ },
+ },
+ legend: {
+ display: false
+ }
+ };
+ public lineChartColours: Array = [
+ { // grey
+ backgroundColor: '#20a8d8',
+ borderColor: 'rgba(255,255,255,.55)'
+ }
+ ];
+ public lineChartLegend = false;
+ public lineChartType = 'line';
+
+ public customerSum: Number = 0;
+
+ constructor(private api: ApiService) { }
+
+ ngOnInit(): void {
+ this.api.graph_data(undefined)
+ .subscribe(
+ result => {
+ console.log(result);
+ const customersThisWeek = result.data.customersthisweek;
+ this.lineChartData[0].data = customersThisWeek.customerno;
+ this.lineChartLabels = customersThisWeek.day;
+ this.customerSum = this.lineChartData[0].data.reduce((a, b) => a + b, 0);
+ }
+ );
+ }
+
+ // events
+ public chartClicked(e: any): void {
+ console.log(e);
+ }
+
+ public chartHovered(e: any): void {
+ console.log(e);
+ }
+}
diff --git a/src/scss/_custom.scss b/src/scss/_custom.scss
index 4832c87..4ff87f5 100644
--- a/src/scss/_custom.scss
+++ b/src/scss/_custom.scss
@@ -87,4 +87,4 @@
}
}
}
-}
\ No newline at end of file
+}