From 6eb6425fb813c83c8450c788ca3e1d0afc757277 Mon Sep 17 00:00:00 2001 From: piratefinn Date: Tue, 12 Dec 2017 15:10:44 +0000 Subject: [PATCH] More placeholder code for customer dashboard --- src/app/app.module.ts | 4 + .../dashboard-customer.component.html | 134 ++---------------- .../dashboard/dashboard-customer.component.ts | 76 +++++++--- src/app/dashboard/dashboard.component.html | 3 +- src/app/dashboard/dashboard.module.ts | 2 + src/app/providers/cust-graphs.service.ts | 14 ++ src/app/providers/cust-snippets.service.ts | 15 ++ .../snippets/cust-snippet-bar.component.html | 27 ++++ .../snippets/cust-snippet-bar.component.ts | 48 +++++++ 9 files changed, 174 insertions(+), 149 deletions(-) create mode 100644 src/app/providers/cust-graphs.service.ts create mode 100644 src/app/providers/cust-snippets.service.ts create mode 100644 src/app/snippets/cust-snippet-bar.component.html create mode 100644 src/app/snippets/cust-snippet-bar.component.ts diff --git a/src/app/app.module.ts b/src/app/app.module.ts index 07d74ad..8821973 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -21,7 +21,9 @@ import { CustomerGuard } from './_guards/customer.guard'; import { ApiService } from './providers/api-service'; import { OrgGraphsService } from './providers/org-graphs.service'; +import { CustGraphsService } from './providers/cust-graphs.service'; import { OrgSnippetsService } from './providers/org-snippets.service'; +import { CustSnippetsService } from './providers/cust-snippets.service'; // Layouts import { FullLayoutComponent } from './layouts/full-layout.component'; @@ -65,6 +67,8 @@ import { DashboardModule } from './dashboard/dashboard.module'; ApiService, OrgGraphsService, OrgSnippetsService, + CustGraphsService, + CustSnippetsService, { provide: LocationStrategy, useClass: HashLocationStrategy diff --git a/src/app/dashboard/dashboard-customer.component.html b/src/app/dashboard/dashboard-customer.component.html index 6a7c209..494c09a 100644 --- a/src/app/dashboard/dashboard-customer.component.html +++ b/src/app/dashboard/dashboard-customer.component.html @@ -1,131 +1,13 @@
-
- - -
+
-
-
-
-
{{ basicStats.today_sum | currency:'GBP':'symbol':'1.2-2' }}
-
Total Today
- -
-
-
-
-
-
-
{{ basicStats.today_sum / (basicStats.today_count ? basicStats.today_count : 1) | currency:'GBP':'symbol':'1.2-2' }}
-
Avg. Spend Today
- -
-
-
-
-
-
-
{{ basicStats.week_sum | currency:'GBP':'symbol':'1.2-2' }}
-
Last Week Total
- -
-
-
-
-
-
-
{{ basicStats.week_sum / (basicStats.week_count ? basicStats.week_count : 1) | currency:'GBP':'symbol':'1.2-2' }}
-
Last Week Avg. Spend
- -
-
-
-
-
-
-
{{ basicStats.month_sum | currency:'GBP':'symbol':'1.2-2' }}
-
Last Month Total
- -
-
-
-
-
-
-
{{ basicStats.month_sum / (basicStats.month_count ? basicStats.month_count : 1) | currency:'GBP':'symbol':'1.2-2' }}
-
Last Month Avg. Spend
- -
-
-
-
-
-
-
{{ basicStats.user_sum | currency:'GBP':'symbol':'1.2-2' }}
-
User Total
- -
-
-
-
-
-
-
{{ basicStats.user_sum / (basicStats.user_count ? basicStats.user_count : 1) | currency:'GBP':'symbol':'1.2-2' }}
-
User Avg. Spend
- -
-
+
+ +
diff --git a/src/app/dashboard/dashboard-customer.component.ts b/src/app/dashboard/dashboard-customer.component.ts index 39230e3..e80fb9f 100644 --- a/src/app/dashboard/dashboard-customer.component.ts +++ b/src/app/dashboard/dashboard-customer.component.ts @@ -2,6 +2,8 @@ import { Directive, Component, OnInit } from '@angular/core'; import { ApiService } from '../providers/api-service'; import { Router } from '@angular/router'; import { GraphWidget } from '../widgets/graph-widget.component'; +import { CustBarSnippetComponent } from '../snippets/cust-snippet-bar.component'; +import { DataType } from '../shared/data-types.enum'; @Component({ templateUrl: 'dashboard-customer.component.html' @@ -20,32 +22,62 @@ export class DashboardCustomerComponent implements OnInit { myRank: any; username: any; - basicStats = { - today_sum: 0, - today_count: 0, - week_sum: 0, - week_count: 0, - month_sum: 0, - month_count: 0, - user_sum: 0, - user_count: 0, - global_sum: 0, - global_count: 0, - user_position: 0, - }; + public widgetList = [ + { + type: 'graph', + name: 'total_today', + title: 'Total Today', + dataType: DataType.currency, + }, + { + type: 'graph', + name: 'avg_spend_today', + title: 'Avg. Spend Today', + dataType: DataType.currency, + }, + { + type: 'graph', + name: 'total_last_week', + icon: 'icon-diamond', + title: 'Last Week Total', + dataType: DataType.currency, + }, + { + type: 'graph', + name: 'avg_spend_last_week', + icon: 'icon-diamond', + title: 'Last Week Avg. Spend', + dataType: DataType.currency, + }, + { + type: 'graph', + name: 'total_last_month', + title: 'Last Month Total', + dataType: DataType.currency, + }, + { + type: 'graph', + name: 'avg_spend_last_month', + title: 'Last Month Avg. Spend', + dataType: DataType.currency, + }, + { + type: 'graph', + name: 'total_user', + title: 'User Total', + dataType: DataType.currency, + }, + { + type: 'graph', + name: 'avg_spend_user', + title: 'User Avg. Spend', + dataType: DataType.currency, + }, + ]; constructor( private api: ApiService, ) { - this.api.basicStats().subscribe( - result => { - this.basicStats = result; - }, - error => { - console.log('Retrieval Error'); - console.log( error._body ); - } - ); } ngOnInit(): void { diff --git a/src/app/dashboard/dashboard.component.html b/src/app/dashboard/dashboard.component.html index 4ee858b..ff6f092 100644 --- a/src/app/dashboard/dashboard.component.html +++ b/src/app/dashboard/dashboard.component.html @@ -6,7 +6,8 @@ [graphName]="widget.name" [graphTitle]="widget.title" [graphIcon]="widget.icon" - [dataType]="widget.dataType"> + [dataType]="widget.dataType"> +
diff --git a/src/app/dashboard/dashboard.module.ts b/src/app/dashboard/dashboard.module.ts index 0e5302b..57f439f 100644 --- a/src/app/dashboard/dashboard.module.ts +++ b/src/app/dashboard/dashboard.module.ts @@ -23,6 +23,7 @@ import { TrailMapComponent } from './trail-map.component'; import { GraphWidget } from '../widgets/graph-widget.component'; import { OrgBarSnippetComponent } from '../snippets/org-snippet-bar.component'; +import { CustBarSnippetComponent } from '../snippets/cust-snippet-bar.component'; import { GraphPanel } from '../panels/graph-panel.component'; import { DashboardRoutingModule } from './dashboard.routing'; @@ -69,6 +70,7 @@ import { environment } from '../../environments/environment'; FeedbackComponent, GraphWidget, OrgBarSnippetComponent, + CustBarSnippetComponent, GraphPanel, ], providers: [ diff --git a/src/app/providers/cust-graphs.service.ts b/src/app/providers/cust-graphs.service.ts new file mode 100644 index 0000000..e03da37 --- /dev/null +++ b/src/app/providers/cust-graphs.service.ts @@ -0,0 +1,14 @@ +import { Injectable } from '@angular/core'; +import { ApiService } from './api-service'; + +@Injectable() +export class CustGraphsService { + private custGraphUrl = '/v1/customer/graphs'; + + constructor(private api: ApiService) { } + + public getGraph(name: string, data: any = {}) { + data.graph = name; + return this.api.post(this.custGraphUrl, data); + } +} diff --git a/src/app/providers/cust-snippets.service.ts b/src/app/providers/cust-snippets.service.ts new file mode 100644 index 0000000..b70ac36 --- /dev/null +++ b/src/app/providers/cust-snippets.service.ts @@ -0,0 +1,15 @@ +import { Injectable } from '@angular/core'; +import { ApiService } from './api-service'; +import { Observable } from 'rxjs/Rx'; + +@Injectable() +export class CustSnippetsService { + private orgSnippetsUrl = '/v1/organisation/snippets'; + + constructor(private api: ApiService) { } + + // This endpoint should mimic basicStats + public getData(): Observable { + return this.api.post(this.orgSnippetsUrl); + } +} diff --git a/src/app/snippets/cust-snippet-bar.component.html b/src/app/snippets/cust-snippet-bar.component.html new file mode 100644 index 0000000..6f7176d --- /dev/null +++ b/src/app/snippets/cust-snippet-bar.component.html @@ -0,0 +1,27 @@ +
+ +
diff --git a/src/app/snippets/cust-snippet-bar.component.ts b/src/app/snippets/cust-snippet-bar.component.ts new file mode 100644 index 0000000..c680ece --- /dev/null +++ b/src/app/snippets/cust-snippet-bar.component.ts @@ -0,0 +1,48 @@ +import { Component, OnInit } from '@angular/core'; +import { OrgSnippetsService } from '../providers/org-snippets.service'; + +@Component({ + selector: 'snippet-bar-cust', + templateUrl: 'cust-snippet-bar.component.html', +}) +export class CustBarSnippetComponent implements OnInit { + + public thisMonthSalesCount = 0; + public thisMonthSalesTotal = 0; + public thisWeekSalesCount = 0; + public thisWeekSalesTotal = 0; + public todaySalesCount = 0; + public todaySalesTotal = 0; + + public thisMonthPurchasesCount = 0; + public thisMonthPurchasesTotal = 0; + public thisWeekPurchasesCount = 0; + public thisWeekPurchasesTotal = 0; + public todayPurchasesCount = 0; + public todayPurchasesTotal = 0; + + constructor( + private snippetsService: OrgSnippetsService, + ) { } + + public ngOnInit(): void { + this.snippetsService.getData() + .subscribe( + result => { + this.thisMonthSalesCount = result.snippets.this_month_sales_count; + this.thisMonthSalesTotal = result.snippets.this_month_sales_total; + this.thisWeekSalesCount = result.snippets.this_week_sales_count; + this.thisWeekSalesTotal = result.snippets.this_week_sales_total; + this.todaySalesCount = result.snippets.today_sales_count; + this.todaySalesTotal = result.snippets.today_sales_total; + + this.thisMonthPurchasesCount = result.snippets.this_week_purchases_count; + this.thisMonthPurchasesTotal = result.snippets.this_week_purchases_total; + this.thisWeekPurchasesCount = result.snippets.this_month_purchases_count; + this.thisWeekPurchasesTotal = result.snippets.this_month_purchases_total; + this.todayPurchasesCount = result.snippets.today_purchases_count; + this.todayPurchasesTotal = result.snippets.today_purchases_total; + } + ); + } +}