From 44740d5dd4cabfd0e520e0cdfee42bf31106549f Mon Sep 17 00:00:00 2001 From: piratefinn Date: Fri, 8 Dec 2017 20:34:58 +0000 Subject: [PATCH 01/21] Changed from dropdown to modal --- src/app/dashboard/trail-map.component.html | 38 ++++++++++++++++++--- src/app/dashboard/trail-map.component.ts | 5 +++ src/assets/img/association/esta-logo.png | Bin 15019 -> 18997 bytes 3 files changed, 38 insertions(+), 5 deletions(-) diff --git a/src/app/dashboard/trail-map.component.html b/src/app/dashboard/trail-map.component.html index 7e0f811..e2d3c53 100644 --- a/src/app/dashboard/trail-map.component.html +++ b/src/app/dashboard/trail-map.component.html @@ -4,11 +4,39 @@
Story Trail - Click a marker to get location details. - +
+ +
+ Select a Story Trail to see all the businesses in that story on the map.
+ Click an icon on the map to get more information. +
+
+ +
+
+ +
+

Select View

+ +
+
+
+
+ lis logo
+ +
+
+ lis logo
+ +
+
+
+
+ +
+
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 @@ +
+
+
    +
  • +
    My Points
    + {{ basicStats.user_sum / 10 | number:'1.0-0' }} +
    • +
  • +
    My Rank
    +
    + Unranked +
    +
    + {{ basicStats.user_position }} +
    +
    • +
  • +
    My Total Spend
    + {{ basicStats.user_sum | currency:'GBP':'symbol':'1.2-2' }} +
    • +
  • +
    Value to Local Economy
    + {{ basicStats.user_sum * 2.3 | currency:'GBP':'symbol':'1.2-2' }} +
    • +
+
+
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; + } + ); + } +} From 32bebd7c24fc88428f51e6a847afe4fcd57b9ecf Mon Sep 17 00:00:00 2001 From: piratefinn Date: Wed, 13 Dec 2017 12:37:11 +0000 Subject: [PATCH 04/21] Added working snippets and placeholder pie chart --- .../dashboard-customer.component.html | 6 ++ .../dashboard/dashboard-customer.component.ts | 11 ++- src/app/dashboard/dashboard.module.ts | 2 + src/app/panels/pie-panel.component.html | 27 ++++++ src/app/panels/pie-panel.component.ts | 85 +++++++++++++++++++ src/app/providers/cust-snippets.service.ts | 4 +- src/app/providers/org-graphs.service.ts | 2 +- .../snippets/cust-snippet-bar.component.html | 12 +-- .../snippets/cust-snippet-bar.component.ts | 34 ++------ 9 files changed, 142 insertions(+), 41 deletions(-) create mode 100644 src/app/panels/pie-panel.component.html create mode 100644 src/app/panels/pie-panel.component.ts diff --git a/src/app/dashboard/dashboard-customer.component.html b/src/app/dashboard/dashboard-customer.component.html index 494c09a..c1fdcf6 100644 --- a/src/app/dashboard/dashboard-customer.component.html +++ b/src/app/dashboard/dashboard-customer.component.html @@ -10,4 +10,10 @@
+ +
+
+ +
+
diff --git a/src/app/dashboard/dashboard-customer.component.ts b/src/app/dashboard/dashboard-customer.component.ts index e80fb9f..68c4913 100644 --- a/src/app/dashboard/dashboard-customer.component.ts +++ b/src/app/dashboard/dashboard-customer.component.ts @@ -3,16 +3,13 @@ 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 { PiePanel } from '../panels/pie-panel.component'; import { DataType } from '../shared/data-types.enum'; @Component({ templateUrl: 'dashboard-customer.component.html' }) export class DashboardCustomerComponent implements OnInit { - customersThisMonth: any; - moneySpentThisMonth: any; - pointsTotal: any; - averageTransactionToday: any; /* Setting up dashboard's main variables*/ name: any; @@ -22,6 +19,12 @@ export class DashboardCustomerComponent implements OnInit { myRank: any; username: any; + // PolarArea + public polarAreaChartLabels: string[] = ['Local', 'Not Local']; + public polarAreaChartData: number[] = [400, 100]; + public polarAreaLegend = true; + public polarAreaChartType = 'polarArea'; + public widgetList = [ { type: 'graph', diff --git a/src/app/dashboard/dashboard.module.ts b/src/app/dashboard/dashboard.module.ts index 57f439f..d6fcfca 100644 --- a/src/app/dashboard/dashboard.module.ts +++ b/src/app/dashboard/dashboard.module.ts @@ -25,6 +25,7 @@ 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 { PiePanel } from '../panels/pie-panel.component'; import { DashboardRoutingModule } from './dashboard.routing'; import { OrgResultComponent } from '../shared/org-result.component'; @@ -72,6 +73,7 @@ import { environment } from '../../environments/environment'; OrgBarSnippetComponent, CustBarSnippetComponent, GraphPanel, + PiePanel, ], providers: [ CurrencyPipe, diff --git a/src/app/panels/pie-panel.component.html b/src/app/panels/pie-panel.component.html new file mode 100644 index 0000000..291c778 --- /dev/null +++ b/src/app/panels/pie-panel.component.html @@ -0,0 +1,27 @@ +
+
+
+
+

Local Purchases

+
+
+ +
+
+
+ +
+
+
diff --git a/src/app/panels/pie-panel.component.ts b/src/app/panels/pie-panel.component.ts new file mode 100644 index 0000000..adfebc5 --- /dev/null +++ b/src/app/panels/pie-panel.component.ts @@ -0,0 +1,85 @@ +import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core'; +import { OrgGraphsService } from '../providers/org-graphs.service'; +import { DataType } from '../shared/data-types.enum'; +import { ChartData } from '../_interfaces/chart-data'; +import * as moment from 'moment'; + +@Component({ + selector: 'panel-pie', + templateUrl: 'pie-panel.component.html', +}) +export class PiePanel implements OnInit { + + // Placeholder + public placeholderChartLabels: string[] = ['Local to Me', 'Local Store', 'Not Local']; + public placeholderChartData: number[] = [400, 100, 100]; + + + public chartType = 'doughnut'; + public chartLegend = true; + + //Old + + public rawChartData: Array = []; + + public chartData: Array = [ + { + data: [], + label: 'This Week' + }, + { + data: [], + label: 'Last Week' + }, + { + data: [], + label: 'Week Before Last' + } + ]; + + public rawChartLabels: Array = []; + public chartLabels: Array = []; + + // public mainChartElements = 7; + + constructor( + private graphService: OrgGraphsService, + ) { } + + public ngOnInit(): void { + // const end = moment().startOf('day'); + // const start = end.clone().subtract(this.mainChartElements * 3, 'days'); + // this.graphService.getGraph('customers_range', { + // start: start.format('YYYY-MM-DD'), + // end: end.format('YYYY-MM-DD'), + // }).subscribe( result => this.setData(result.graph) ); + } + + // private setData(data: any) { + // this.chartLabels = data.labels.slice(this.mainChartElements * 2, this.mainChartElements * 3); + // this.chartData[2].data = data.data.slice(0, this.mainChartElements); + // this.chartData[1].data = data.data.slice(this.mainChartElements, this.mainChartElements * 2); + // this.chartData[0].data = data.data.slice(this.mainChartElements * 2, this.mainChartElements * 3); + // } + + // convert Hex to RGBA + public convertHex(hex: string, opacity: number) { + hex = hex.replace('#', ''); + const r = parseInt(hex.substring(0, 2), 16); + const g = parseInt(hex.substring(2, 4), 16); + const b = parseInt(hex.substring(4, 6), 16); + + const rgba = 'rgba(' + r + ', ' + g + ', ' + b + ', ' + opacity / 100 + ')'; + return rgba; + } + + // events + public chartClicked(e: any): void { + console.log(e); + } + + public chartHovered(e: any): void { + console.log(e); + } + +} diff --git a/src/app/providers/cust-snippets.service.ts b/src/app/providers/cust-snippets.service.ts index b70ac36..9c75c5e 100644 --- a/src/app/providers/cust-snippets.service.ts +++ b/src/app/providers/cust-snippets.service.ts @@ -4,12 +4,12 @@ import { Observable } from 'rxjs/Rx'; @Injectable() export class CustSnippetsService { - private orgSnippetsUrl = '/v1/organisation/snippets'; + private custSnippetsUrl = '/v1/customer/snippets'; constructor(private api: ApiService) { } // This endpoint should mimic basicStats public getData(): Observable { - return this.api.post(this.orgSnippetsUrl); + return this.api.post(this.custSnippetsUrl); } } diff --git a/src/app/providers/org-graphs.service.ts b/src/app/providers/org-graphs.service.ts index 859361c..d19a53b 100644 --- a/src/app/providers/org-graphs.service.ts +++ b/src/app/providers/org-graphs.service.ts @@ -3,7 +3,7 @@ import { ApiService } from './api-service'; @Injectable() export class OrgGraphsService { - private orgGraphUrl = '/v1/organisation/graphs'; + private orgGraphUrl = '/v1/customer/graphs'; constructor(private api: ApiService) { } diff --git a/src/app/snippets/cust-snippet-bar.component.html b/src/app/snippets/cust-snippet-bar.component.html index 6f7176d..80a44ef 100644 --- a/src/app/snippets/cust-snippet-bar.component.html +++ b/src/app/snippets/cust-snippet-bar.component.html @@ -3,24 +3,24 @@
  • My Points
    - {{ basicStats.user_sum / 10 | number:'1.0-0' }} + {{ userSum / 10 | number:'1.0-0' }}
  • My Rank
    -
    +
    Unranked
    -
    - {{ basicStats.user_position }} +
    + {{ userPosition }}
  • My Total Spend
    - {{ basicStats.user_sum | currency:'GBP':'symbol':'1.2-2' }} + {{ userSum | currency:'GBP':'symbol':'1.2-2' }}
  • Value to Local Economy
    - {{ basicStats.user_sum * 2.3 | currency:'GBP':'symbol':'1.2-2' }} + {{ userSum * 2.3 | currency:'GBP':'symbol':'1.2-2' }}
diff --git a/src/app/snippets/cust-snippet-bar.component.ts b/src/app/snippets/cust-snippet-bar.component.ts index c680ece..93ac86d 100644 --- a/src/app/snippets/cust-snippet-bar.component.ts +++ b/src/app/snippets/cust-snippet-bar.component.ts @@ -1,5 +1,5 @@ import { Component, OnInit } from '@angular/core'; -import { OrgSnippetsService } from '../providers/org-snippets.service'; +import { CustSnippetsService } from '../providers/cust-snippets.service'; @Component({ selector: 'snippet-bar-cust', @@ -7,41 +7,19 @@ import { OrgSnippetsService } from '../providers/org-snippets.service'; }) 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; + public userSum = 0; + public userPosition = 0; constructor( - private snippetsService: OrgSnippetsService, + private snippetsService: CustSnippetsService, ) { } 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; + this.userSum = result.snippets.user_sum; + this.userPosition = result.snippets.user_position; } ); } From 9545601d01838fc2185e1e313d1a5c545b0aa857 Mon Sep 17 00:00:00 2001 From: piratefinn Date: Thu, 14 Dec 2017 16:44:23 +0000 Subject: [PATCH 05/21] working graph widgets and local doughnut chart --- src/app/app.module.ts | 2 + .../dashboard-customer.component.html | 151 +++++++++++++++++- .../dashboard/dashboard-customer.component.ts | 24 --- src/app/panels/pie-panel.component.html | 4 +- src/app/panels/pie-panel.component.ts | 54 ++----- src/app/providers/cust-pies.service.ts | 14 ++ src/app/widgets/graph-widget.component.ts | 15 ++ 7 files changed, 194 insertions(+), 70 deletions(-) create mode 100644 src/app/providers/cust-pies.service.ts diff --git a/src/app/app.module.ts b/src/app/app.module.ts index 8821973..0f257e7 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -24,6 +24,7 @@ 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'; +import { CustPiesService } from './providers/cust-pies.service'; // Layouts import { FullLayoutComponent } from './layouts/full-layout.component'; @@ -69,6 +70,7 @@ import { DashboardModule } from './dashboard/dashboard.module'; OrgSnippetsService, CustGraphsService, CustSnippetsService, + CustPiesService, { provide: LocationStrategy, useClass: HashLocationStrategy diff --git a/src/app/dashboard/dashboard-customer.component.html b/src/app/dashboard/dashboard-customer.component.html index c1fdcf6..3b9f793 100644 --- a/src/app/dashboard/dashboard-customer.component.html +++ b/src/app/dashboard/dashboard-customer.component.html @@ -12,8 +12,151 @@
-
- -
-
+
+ +
+
+
+
+
+
+

Purchases Per Week

+
+
+
+
    +
  • + This Week + 191,235 (56%) +
    +
    +
    +
    +
    +
    • +
  • + Last Week + 51,223 (15%) +
    +
    +
    +
    +
    +
    • +
  • + 2 Weeks Ago + 37,564 (11%) +
    +
    +
    +
    +
    +
    • +
  • + 3 Weeks Ago + 27,319 (8%) +
    +
    +
    +
    +
    +
    • +
+
+
+
+
+
+
+
+
+
+

Sector Purchase Amounts

+
+
+
+
    +
  • + +
    +
    Sector A
    + Lorem ipsum dolor sit amet +
    +
    +
    Bought this week
    + 1.924 +
    +
    • +
  • + +
    +
    Sector B
    + Lorem ipsum dolor sit amet +
    +
    +
    Bought this week
    + 1.224 +
    +
    • +
  • + +
    +
    Sector C
    + Lorem ipsum dolor sit amet +
    +
    +
    Bought this week
    + 1.163 +
    +
    • +
  • + +
    +
    Sector D
    + Lorem ipsum dolor sit amet +
    +
    +
    Bought this week
    + 928 +
    +
    • +
  • + +
    +
    Sector E
    + Lorem ipsum dolor sit amet +
    +
    +
    Bought this week
    + 893 +
    +
    • +
  • + +
    +
    Sector F
    + Lorem ipsum dolor sit amet +
    +
    +
    Bought this week
    + 121.924 +
    +
    • +
  • + +
    +
    Sector G
    + Lorem ipsum dolor sit amet +
    +
    +
    Bought this week
    + 12.125 +
    +
    • +
+
+
+
+
+ diff --git a/src/app/dashboard/dashboard-customer.component.ts b/src/app/dashboard/dashboard-customer.component.ts index 68c4913..87b5419 100644 --- a/src/app/dashboard/dashboard-customer.component.ts +++ b/src/app/dashboard/dashboard-customer.component.ts @@ -26,18 +26,6 @@ export class DashboardCustomerComponent implements OnInit { public polarAreaChartType = 'polarArea'; 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', @@ -64,18 +52,6 @@ export class DashboardCustomerComponent implements OnInit { 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( diff --git a/src/app/panels/pie-panel.component.html b/src/app/panels/pie-panel.component.html index 291c778..bb90dff 100644 --- a/src/app/panels/pie-panel.component.html +++ b/src/app/panels/pie-panel.component.html @@ -16,8 +16,8 @@
= []; - - public chartData: Array = [ - { - data: [], - label: 'This Week' - }, - { - data: [], - label: 'Last Week' - }, - { - data: [], - label: 'Week Before Last' - } - ]; - - public rawChartLabels: Array = []; - public chartLabels: Array = []; - // public mainChartElements = 7; constructor( - private graphService: OrgGraphsService, + private pieService: CustPiesService, ) { } public ngOnInit(): void { - // const end = moment().startOf('day'); - // const start = end.clone().subtract(this.mainChartElements * 3, 'days'); - // this.graphService.getGraph('customers_range', { - // start: start.format('YYYY-MM-DD'), - // end: end.format('YYYY-MM-DD'), - // }).subscribe( result => this.setData(result.graph) ); + this.pieService.getPie() + .subscribe( result => this.setData(result.pie) ); } - // private setData(data: any) { - // this.chartLabels = data.labels.slice(this.mainChartElements * 2, this.mainChartElements * 3); - // this.chartData[2].data = data.data.slice(0, this.mainChartElements); - // this.chartData[1].data = data.data.slice(this.mainChartElements, this.mainChartElements * 2); - // this.chartData[0].data = data.data.slice(this.mainChartElements * 2, this.mainChartElements * 3); - // } + private setData(data: any) { + this.doughnutChartData = Object.values(data); + console.log(this.chartData); + // setTimeout is currently a workaround for ng2-charts labels + setTimeout(() => this.doughnutChartLabels = Object.keys(data), 0); + console.log(this.chartLabels); + } // convert Hex to RGBA public convertHex(hex: string, opacity: number) { diff --git a/src/app/providers/cust-pies.service.ts b/src/app/providers/cust-pies.service.ts new file mode 100644 index 0000000..4608369 --- /dev/null +++ b/src/app/providers/cust-pies.service.ts @@ -0,0 +1,14 @@ +import { Injectable } from '@angular/core'; +import { ApiService } from './api-service'; +import { Observable } from 'rxjs/Rx'; + +@Injectable() +export class CustPiesService { + private custPieUrl = '/v1/customer/pies'; + + constructor(private api: ApiService) { } + + public getPie(): Observable { + return this.api.post(this.custPieUrl); + } +} diff --git a/src/app/widgets/graph-widget.component.ts b/src/app/widgets/graph-widget.component.ts index 3d99096..8c5b55d 100644 --- a/src/app/widgets/graph-widget.component.ts +++ b/src/app/widgets/graph-widget.component.ts @@ -35,12 +35,21 @@ export class GraphWidget implements OnInit { maintainAspectRatio: false, scales: { xAxes: [{ + type: 'time', + time: { + unit: 'day', + displayFormats: { + day: 'MMM D', + }, + tooltipFormat: 'MMM D', + }, gridLines: { color: 'transparent', zeroLineColor: 'transparent' }, ticks: { fontSize: 2, + source: 'data', fontColor: 'transparent', } @@ -106,6 +115,12 @@ export class GraphWidget implements OnInit { private setData(data: any) { this.setChartData(data.data); this.setChartLabels(data.labels); + this.setChartBounds(data.bounds); + } + + private setChartBounds(data) { + this.lineChartOptions.scales.xAxes[0].time.max = data.max; + this.lineChartOptions.scales.xAxes[0].time.min = data.min; } private setChartData(data: Array) { From 93f15ae6de46a8a25246f858ceaebc9aa9f3cca9 Mon Sep 17 00:00:00 2001 From: piratefinn Date: Thu, 14 Dec 2017 17:51:00 +0000 Subject: [PATCH 06/21] improved doughnut header layout --- src/app/panels/pie-panel.component.html | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/app/panels/pie-panel.component.html b/src/app/panels/pie-panel.component.html index bb90dff..eb0c194 100644 --- a/src/app/panels/pie-panel.component.html +++ b/src/app/panels/pie-panel.component.html @@ -1,10 +1,10 @@
-
+

Local Purchases

-
+
-
-
+
-
+
@@ -27,37 +26,78 @@
  • This Week - 191,235 (56%) + {{ (weekPurchaseList.week_0 || 0 ) }} ({{ (weekPurchaseList.week_0 || 0 ) / maxPurchase | percent:'1.0-0' }})
    -
    -
    +
    +
  • Last Week - 51,223 (15%) + {{ weekPurchaseList.week_1 || 0 }} ({{ (weekPurchaseList.week_1 || 0 ) / maxPurchase | percent:'1.0-0' }})
    -
    -
    +
    +
  • 2 Weeks Ago - 37,564 (11%) + {{ weekPurchaseList.week_2 || 0 }} ({{ (weekPurchaseList.week_2 || 0 ) / maxPurchase | percent:'1.0-0' }})
    -
    -
    +
    +
  • 3 Weeks Ago - 27,319 (8%) + {{ weekPurchaseList.week_3 || 0 }} ({{ (weekPurchaseList.week_3 || 0 ) / maxPurchase | percent:'1.0-0' }})
    -
    -
    +
    +
    +
    +
    +
    • +
  • + 4 Weeks Ago + {{ weekPurchaseList.week_4 || 0 }} ({{ (weekPurchaseList.week_4 || 0 ) / maxPurchase | percent:'1.0-0' }}) +
    +
    +
    +
    +
    +
    • +
  • + 5 Weeks Ago + {{ weekPurchaseList.week_5 || 0 }} ({{ (weekPurchaseList.week_5 || 0 ) / maxPurchase | percent:'1.0-0' }}) +
    +
    +
    +
    +
    +
    • +
  • + 6 Weeks Ago + {{ weekPurchaseList.week_6 || 0 }} ({{ (weekPurchaseList.week_6 || 0 ) / maxPurchase | percent:'1.0-0' }}) +
    +
    +
    • @@ -66,7 +106,7 @@
-
+
@@ -83,7 +123,7 @@ Lorem ipsum dolor sit amet
-
Bought this week
+
Bought from Sector
1.924
@@ -94,7 +134,7 @@ Lorem ipsum dolor sit amet
-
Bought this week
+
Bought from Sector
1.224
@@ -105,7 +145,7 @@ Lorem ipsum dolor sit amet
-
Bought this week
+
Bought from Sector
1.163
@@ -116,7 +156,7 @@ Lorem ipsum dolor sit amet
-
Bought this week
+
Bought from Sector
928
@@ -127,7 +167,7 @@ Lorem ipsum dolor sit amet
-
Bought this week
+
Bought from Sector
893
@@ -138,7 +178,7 @@ Lorem ipsum dolor sit amet
-
Bought this week
+
Bought from Sector
121.924
@@ -149,7 +189,7 @@ Lorem ipsum dolor sit amet
-
Bought this week
+
Bought from Sector
12.125
diff --git a/src/app/dashboard/dashboard-customer.component.ts b/src/app/dashboard/dashboard-customer.component.ts index 87b5419..f404496 100644 --- a/src/app/dashboard/dashboard-customer.component.ts +++ b/src/app/dashboard/dashboard-customer.component.ts @@ -19,12 +19,19 @@ export class DashboardCustomerComponent implements OnInit { myRank: any; username: any; - // PolarArea - public polarAreaChartLabels: string[] = ['Local', 'Not Local']; - public polarAreaChartData: number[] = [400, 100]; - public polarAreaLegend = true; - public polarAreaChartType = 'polarArea'; + weekPurchaseList = { + week_0: 0, + week_1: 0, + week_2: 0, + week_3: 0, + week_4: 0, + week_5: 0, + week_6: 0, + }; + sectorList: any; + + // Graph widgets public widgetList = [ { type: 'graph', @@ -57,6 +64,35 @@ export class DashboardCustomerComponent implements OnInit { constructor( private api: ApiService, ) { + this.api.basicStats().subscribe( + result => { + this.setWeekPurchaseList(result.data); + + }, + error => { + console.log('Retrieval Error'); + console.log( error._body ); + } + ); + } + + public setWeekPurchaseList (data: any) { + this.weekPurchaseList = { + week_0: data.purchases[0], + week_1: data.purchases[1], + week_2: data.purchases[2], + week_3: data.purchases[3], + week_4: data.purchases[4], + week_5: data.purchases[5], + week_6: data.purchases[6], + }; + //this.maxPurchase = Math.max(...this.weekPurchaseList); + this.maxPurchase = Object.values(this.weekPurchaseList).reduce((a,b) => { + if (! a) { a = 0 } + if (! b) { b = 0 } + return Math.max(a,b); + }); + console.log(this.maxPurchase); } ngOnInit(): void { diff --git a/src/app/panels/pie-panel.component.ts b/src/app/panels/pie-panel.component.ts index e102b33..3e8d2ac 100644 --- a/src/app/panels/pie-panel.component.ts +++ b/src/app/panels/pie-panel.component.ts @@ -30,10 +30,8 @@ export class PiePanel implements OnInit { private setData(data: any) { this.doughnutChartData = Object.values(data); - console.log(this.chartData); // setTimeout is currently a workaround for ng2-charts labels setTimeout(() => this.doughnutChartLabels = Object.keys(data), 0); - console.log(this.chartLabels); } // convert Hex to RGBA From e16cf3e801fba5150c5af811b3c96f60de3dda8d Mon Sep 17 00:00:00 2001 From: piratefinn Date: Fri, 15 Dec 2017 17:20:18 +0000 Subject: [PATCH 08/21] sector list code fully working --- .../dashboard-customer.component.html | 56 +++++++++--------- .../dashboard/dashboard-customer.component.ts | 59 ++++++++++++++++++- 2 files changed, 84 insertions(+), 31 deletions(-) diff --git a/src/app/dashboard/dashboard-customer.component.html b/src/app/dashboard/dashboard-customer.component.html index 1278c05..5be3628 100644 --- a/src/app/dashboard/dashboard-customer.component.html +++ b/src/app/dashboard/dashboard-customer.component.html @@ -117,80 +117,80 @@
  • - +
    -
    Sector A
    - Lorem ipsum dolor sit amet +
    Sector {{ sectorLetters[0] || 'N/A' }}
    +
    {{ sectorNames [sectorLetters[0]] }}
    Bought from Sector
    - 1.924 + {{ sectorPurchases[0] || 'N/A' }}
  • - +
    -
    Sector B
    - Lorem ipsum dolor sit amet +
    Sector {{ sectorLetters[1] || 'N/A' }}
    + {{ sectorNames [sectorLetters[1]] || 'N/A' }}
    Bought from Sector
    - 1.224 + {{ sectorPurchases[1] || 'N/A' }}
  • - +
    -
    Sector C
    - Lorem ipsum dolor sit amet +
    Sector {{ sectorLetters[2] || 'N/A' }}
    + {{ sectorNames [sectorLetters[2]] || 'N/A' }}
    Bought from Sector
    - 1.163 + {{ sectorPurchases[2] || 'N/A' }}
  • - +
    -
    Sector D
    - Lorem ipsum dolor sit amet +
    Sector {{ sectorLetters[3] || 'N/A' }}
    + {{ sectorNames [sectorLetters[3]] || 'N/A' }}
    Bought from Sector
    - 928 + {{ sectorPurchases[3] || 'N/A' }}
  • - +
    -
    Sector E
    - Lorem ipsum dolor sit amet +
    Sector {{ sectorLetters[4] || 'N/A' }}
    + {{ sectorNames [sectorLetters[4]] || 'N/A' }}
    Bought from Sector
    - 893 + {{ sectorPurchases[4] || 'N/A' }}
  • - +
    -
    Sector F
    - Lorem ipsum dolor sit amet +
    Sector {{ sectorLetters[5] || 'N/A' }}
    + {{ sectorNames [sectorLetters[5]] || 'N/A' }}
    Bought from Sector
    - 121.924 + {{ sectorPurchases[5] || 'N/A' }}
  • - +
    -
    Sector G
    - Lorem ipsum dolor sit amet +
    Sector {{ sectorLetters[6] || 'N/A' }}
    + {{ sectorNames [sectorLetters[6]] || 'N/A' }}
    Bought from Sector
    - 12.125 + {{ sectorPurchases[6] || 'N/A' }}
diff --git a/src/app/dashboard/dashboard-customer.component.ts b/src/app/dashboard/dashboard-customer.component.ts index f404496..5b84574 100644 --- a/src/app/dashboard/dashboard-customer.component.ts +++ b/src/app/dashboard/dashboard-customer.component.ts @@ -29,6 +29,55 @@ export class DashboardCustomerComponent implements OnInit { week_6: 0, }; + sectorNames = { + A: 'Agriculture, Forestry & Fishing', + B: 'Mining & Quarrying', + C: 'Manufacturing', + D: 'Electricity, Gas, Steam & Air Conditioning', + E: 'Water & Waste Management', + F: 'Construction', + G: 'Wholesale & Retail Trade', + H: 'Transportation & Storage', + I: 'Accomodation & Food Services', + J: 'Information & Communication', + K: 'Financial & Insurance Activities', + L: 'Real Estate', + M: 'Professional, Scientfic & Technical', + N: 'Administrative & Support Services', + O: 'Public Administration, Defence & Social Security', + P: 'Education', + Q: 'Human Health & Social Work', + R: 'Arts, Entertainment & Recreation', + S: 'Other Service Activities', + T: 'Household Domestic Business', + } + + sectorIcons = { + A: 'icon-drop', + B: 'icon-diamond', + C: 'icon-settings', + D: 'icon-energy', + E: 'icon-trash', + F: 'icon-wrench', + G: 'icon-tag', + H: 'icon-speedometer', + I: 'icon-cup', + J: 'icon-globe', + K: 'icon-credit-card', + L: 'icon-graph', + M: 'icon-chemistry', + N: 'icon-drawer', + O: 'icon-pie-chart', + P: 'icon-graduation', + Q: 'icon-support', + R: 'icon-film', + S: 'icon-calendar', + T: 'icon-home', + } + + sectorLetters: string[] = []; + sectorPurchases: number[] = []; + sectorList: any; // Graph widgets @@ -66,8 +115,8 @@ export class DashboardCustomerComponent implements OnInit { ) { this.api.basicStats().subscribe( result => { - this.setWeekPurchaseList(result.data); - + this.setWeekPurchaseList(result.weeks); + this.setSectorList(result.sectors); }, error => { console.log('Retrieval Error'); @@ -92,7 +141,11 @@ export class DashboardCustomerComponent implements OnInit { if (! b) { b = 0 } return Math.max(a,b); }); - console.log(this.maxPurchase); + } + + public setSectorList (data: any) { + this.sectorLetters = Object.values(data.sectors); + this.sectorPurchases = Object.values(data.purchases); } ngOnInit(): void { From 728f9e3d47a22012b67a7847710315f9d34bfb53 Mon Sep 17 00:00:00 2001 From: piratefinn Date: Fri, 15 Dec 2017 17:38:59 +0000 Subject: [PATCH 09/21] fixed es5 compatibility --- src/app/dashboard/dashboard-customer.component.ts | 7 +++---- src/app/panels/pie-panel.component.ts | 2 +- 2 files changed, 4 insertions(+), 5 deletions(-) diff --git a/src/app/dashboard/dashboard-customer.component.ts b/src/app/dashboard/dashboard-customer.component.ts index 5b84574..706db64 100644 --- a/src/app/dashboard/dashboard-customer.component.ts +++ b/src/app/dashboard/dashboard-customer.component.ts @@ -135,8 +135,7 @@ export class DashboardCustomerComponent implements OnInit { week_5: data.purchases[5], week_6: data.purchases[6], }; - //this.maxPurchase = Math.max(...this.weekPurchaseList); - this.maxPurchase = Object.values(this.weekPurchaseList).reduce((a,b) => { + this.maxPurchase = Object.keys(this.weekPurchaseList).map(key => this.weekPurchaseList[key]).reduce((a,b) => { if (! a) { a = 0 } if (! b) { b = 0 } return Math.max(a,b); @@ -144,8 +143,8 @@ export class DashboardCustomerComponent implements OnInit { } public setSectorList (data: any) { - this.sectorLetters = Object.values(data.sectors); - this.sectorPurchases = Object.values(data.purchases); + this.sectorLetters = Object.keys(data.sectors).map(key => data.sectors[key]); + this.sectorPurchases = Object.keys(data.purchases).map(key => data.purchases[key]); } ngOnInit(): void { diff --git a/src/app/panels/pie-panel.component.ts b/src/app/panels/pie-panel.component.ts index 3e8d2ac..bae839f 100644 --- a/src/app/panels/pie-panel.component.ts +++ b/src/app/panels/pie-panel.component.ts @@ -29,7 +29,7 @@ export class PiePanel implements OnInit { } private setData(data: any) { - this.doughnutChartData = Object.values(data); + this.doughnutChartData = Object.keys(data).map(key => data[key]); // setTimeout is currently a workaround for ng2-charts labels setTimeout(() => this.doughnutChartLabels = Object.keys(data), 0); } From 46d99d11f97616f90fb14e2c1a5e1a38f48f5a13 Mon Sep 17 00:00:00 2001 From: piratefinn Date: Fri, 15 Dec 2017 17:44:50 +0000 Subject: [PATCH 10/21] fixed variable definition --- src/app/dashboard/dashboard-customer.component.ts | 1 + 1 file changed, 1 insertion(+) diff --git a/src/app/dashboard/dashboard-customer.component.ts b/src/app/dashboard/dashboard-customer.component.ts index 706db64..e781f78 100644 --- a/src/app/dashboard/dashboard-customer.component.ts +++ b/src/app/dashboard/dashboard-customer.component.ts @@ -18,6 +18,7 @@ export class DashboardCustomerComponent implements OnInit { trends: any; myRank: any; username: any; + maxPurchase: number = 0; weekPurchaseList = { week_0: 0, From b50c65ba3dbdb414edf8cd3a012a8e17a2b8ed27 Mon Sep 17 00:00:00 2001 From: piratefinn Date: Fri, 15 Dec 2017 17:59:09 +0000 Subject: [PATCH 11/21] Changelog updated --- CHANGELOG.md | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index a5859ba..35748e4 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -3,6 +3,10 @@ # Next Release * Changed Story Trail choosing to modals +* Revamped snippets and graph widgets on customer dashboard +* Added local purchase pie chart for customer dashboard +* Added week by week purchase list for customer dashboard +* Added sector purchase amount list for customer dashboard # v0.0.7 From b8f5687ac2ab4b8b4457c53a27fc2512e315e22b Mon Sep 17 00:00:00 2001 From: piratefinn Date: Mon, 18 Dec 2017 12:57:40 +0000 Subject: [PATCH 12/21] changed customer dashboard endpoint --- src/app/dashboard/dashboard-customer.component.ts | 2 +- src/app/dashboard/leaderboard.component.html | 4 ++-- src/app/providers/api-service.ts | 4 ++-- 3 files changed, 5 insertions(+), 5 deletions(-) diff --git a/src/app/dashboard/dashboard-customer.component.ts b/src/app/dashboard/dashboard-customer.component.ts index e781f78..b304d54 100644 --- a/src/app/dashboard/dashboard-customer.component.ts +++ b/src/app/dashboard/dashboard-customer.component.ts @@ -114,7 +114,7 @@ export class DashboardCustomerComponent implements OnInit { constructor( private api: ApiService, ) { - this.api.basicStats().subscribe( + this.api.customerStats().subscribe( result => { this.setWeekPurchaseList(result.weeks); this.setSectorList(result.sectors); diff --git a/src/app/dashboard/leaderboard.component.html b/src/app/dashboard/leaderboard.component.html index 34345f3..c5014ea 100644 --- a/src/app/dashboard/leaderboard.component.html +++ b/src/app/dashboard/leaderboard.component.html @@ -23,8 +23,8 @@ Position - Value - Purchase Time + Name + Amount diff --git a/src/app/providers/api-service.ts b/src/app/providers/api-service.ts index 9533acd..131eee3 100644 --- a/src/app/providers/api-service.ts +++ b/src/app/providers/api-service.ts @@ -286,10 +286,10 @@ export class ApiService { } // Basic Customer User stats API - public basicStats() { + public customerStats() { const key = this.sessionKey; return this.http.post( - this.apiUrl + '/stats', + this.apiUrl + '/stats/customer', { session_key : key, } From 13d84905b823eb384096b8be49e6d50a35c903fe Mon Sep 17 00:00:00 2001 From: piratefinn Date: Mon, 18 Dec 2017 16:20:31 +0000 Subject: [PATCH 13/21] added new sector --- CHANGELOG.md | 1 + src/app/auth/register.component.html | 1 + src/app/dashboard/account-edit.component.html | 1 + src/app/dashboard/dashboard-customer.component.ts | 4 +++- 4 files changed, 6 insertions(+), 1 deletion(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 35748e4..22b48ce 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -7,6 +7,7 @@ * Added local purchase pie chart for customer dashboard * Added week by week purchase list for customer dashboard * Added sector purchase amount list for customer dashboard +* Added sector U to available ones # v0.0.7 diff --git a/src/app/auth/register.component.html b/src/app/auth/register.component.html index 34c50ca..0983b97 100644 --- a/src/app/auth/register.component.html +++ b/src/app/auth/register.component.html @@ -106,6 +106,7 @@ +
diff --git a/src/app/dashboard/account-edit.component.html b/src/app/dashboard/account-edit.component.html index 5d4e7b4..9c6ed5c 100644 --- a/src/app/dashboard/account-edit.component.html +++ b/src/app/dashboard/account-edit.component.html @@ -99,6 +99,7 @@ + Alter this if your business sector has changed.
diff --git a/src/app/dashboard/dashboard-customer.component.ts b/src/app/dashboard/dashboard-customer.component.ts index b304d54..832fbac 100644 --- a/src/app/dashboard/dashboard-customer.component.ts +++ b/src/app/dashboard/dashboard-customer.component.ts @@ -51,6 +51,7 @@ export class DashboardCustomerComponent implements OnInit { R: 'Arts, Entertainment & Recreation', S: 'Other Service Activities', T: 'Household Domestic Business', + U: 'Extraterritorial Organisations and Bodies' } sectorIcons = { @@ -63,7 +64,7 @@ export class DashboardCustomerComponent implements OnInit { G: 'icon-tag', H: 'icon-speedometer', I: 'icon-cup', - J: 'icon-globe', + J: 'icon-feed', K: 'icon-credit-card', L: 'icon-graph', M: 'icon-chemistry', @@ -74,6 +75,7 @@ export class DashboardCustomerComponent implements OnInit { R: 'icon-film', S: 'icon-calendar', T: 'icon-home', + U: 'cion-globe', } sectorLetters: string[] = []; From f4c9724097b850c431fb10f090e588d5d43b1162 Mon Sep 17 00:00:00 2001 From: piratefinn Date: Mon, 18 Dec 2017 17:20:38 +0000 Subject: [PATCH 14/21] added initial looping --- .../dashboard-customer.component.html | 36 ++++++++++++------- 1 file changed, 24 insertions(+), 12 deletions(-) diff --git a/src/app/dashboard/dashboard-customer.component.html b/src/app/dashboard/dashboard-customer.component.html index 5be3628..3d4b094 100644 --- a/src/app/dashboard/dashboard-customer.component.html +++ b/src/app/dashboard/dashboard-customer.component.html @@ -116,14 +116,26 @@
    -
  • - + +
  • +
    -
    Sector {{ sectorLetters[0] || 'N/A' }}
    -
    {{ sectorNames [sectorLetters[0]] }}
    +
    {{ sectorNames [sector] || 'N/A' }}
    -
    Bought from Sector
    +
    Bought
    + {{ sectorPurchases[i] || 'N/A' }} +
    +
    • + + +
From d8fab7c4dfee35e4658349a99a11ca3675ebedbd Mon Sep 17 00:00:00 2001 From: piratefinn Date: Tue, 19 Dec 2017 18:01:29 +0000 Subject: [PATCH 15/21] frontpage sectors and week stats amended --- .../dashboard-customer.component.html | 144 +++--------------- .../dashboard/dashboard-customer.component.ts | 39 +++-- 2 files changed, 37 insertions(+), 146 deletions(-) diff --git a/src/app/dashboard/dashboard-customer.component.html b/src/app/dashboard/dashboard-customer.component.html index 3d4b094..697c23c 100644 --- a/src/app/dashboard/dashboard-customer.component.html +++ b/src/app/dashboard/dashboard-customer.component.html @@ -19,85 +19,52 @@
-

Purchases Per Week

+

Purchases by Week

  • This Week - {{ (weekPurchaseList.week_0 || 0 ) }} ({{ (weekPurchaseList.week_0 || 0 ) / maxPurchase | percent:'1.0-0' }}) + {{ (weekPurchaseList.first || 0 ) }} + ({{ (weekPurchaseList.first || 0 ) / weekPurchaseList.max | percent:'1.0-0' }})
    + [style.width]="(weekPurchaseList.first || 0 ) / weekPurchaseList.max | percent:'1.0-0'" aria-valuemin="0" aria-valuemax="100">
  • Last Week - {{ weekPurchaseList.week_1 || 0 }} ({{ (weekPurchaseList.week_1 || 0 ) / maxPurchase | percent:'1.0-0' }}) + {{ weekPurchaseList.second || 0 }} + ({{ (weekPurchaseList.second || 0 ) / weekPurchaseList.max | percent:'1.0-0' }})
    + [style.width]="(weekPurchaseList.second || 0 ) / weekPurchaseList.max | percent:'1.0-0'" aria-valuemin="0" aria-valuemax="100">
  • - 2 Weeks Ago - {{ weekPurchaseList.week_2 || 0 }} ({{ (weekPurchaseList.week_2 || 0 ) / maxPurchase | percent:'1.0-0' }}) + Week Maximum + {{ weekPurchaseList.max || 0 }} + (100%)
    + style="width: 100%" aria-valuemin="0" aria-valuemax="100">
  • - 3 Weeks Ago - {{ weekPurchaseList.week_3 || 0 }} ({{ (weekPurchaseList.week_3 || 0 ) / maxPurchase | percent:'1.0-0' }}) + Weekly Average + {{ (weekPurchaseList.sum / weekPurchaseList.count) || 0 | number:'1.0-0'}} + ({{ ((weekPurchaseList.sum / weekPurchaseList.count) || 0) / weekPurchaseList.max | percent:'1.0-0' }})
    -
    -
    -
    • -
  • - 4 Weeks Ago - {{ weekPurchaseList.week_4 || 0 }} ({{ (weekPurchaseList.week_4 || 0 ) / maxPurchase | percent:'1.0-0' }}) -
    -
    -
    -
    -
    -
    • -
  • - 5 Weeks Ago - {{ weekPurchaseList.week_5 || 0 }} ({{ (weekPurchaseList.week_5 || 0 ) / maxPurchase | percent:'1.0-0' }}) -
    -
    -
    -
    -
    -
    • -
  • - 6 Weeks Ago - {{ weekPurchaseList.week_6 || 0 }} ({{ (weekPurchaseList.week_6 || 0 ) / maxPurchase | percent:'1.0-0' }}) -
    -
    -
    + [style.width]="((weekPurchaseList.sum / weekPurchaseList.count) || 0) / weekPurchaseList.max | percent:'1.0-0'" aria-valuemin="0" aria-valuemax="100">
    • @@ -117,7 +84,7 @@
      -
    • +
    • {{ sectorNames [sector] || 'N/A' }}
      @@ -127,84 +94,9 @@ {{ sectorPurchases[i] || 'N/A' }}
      • - - -
    diff --git a/src/app/dashboard/dashboard-customer.component.ts b/src/app/dashboard/dashboard-customer.component.ts index 832fbac..1d9b145 100644 --- a/src/app/dashboard/dashboard-customer.component.ts +++ b/src/app/dashboard/dashboard-customer.component.ts @@ -20,14 +20,14 @@ export class DashboardCustomerComponent implements OnInit { username: any; maxPurchase: number = 0; + disableSectorButton: boolean = false; + weekPurchaseList = { - week_0: 0, - week_1: 0, - week_2: 0, - week_3: 0, - week_4: 0, - week_5: 0, - week_6: 0, + first: 0, + second: 0, + max: 0, + sum: 0, + count: 0, }; sectorNames = { @@ -75,11 +75,12 @@ export class DashboardCustomerComponent implements OnInit { R: 'icon-film', S: 'icon-calendar', T: 'icon-home', - U: 'cion-globe', + U: 'icon-globe', } sectorLetters: string[] = []; sectorPurchases: number[] = []; + sectorLimit: number = 10; sectorList: any; @@ -130,19 +131,12 @@ export class DashboardCustomerComponent implements OnInit { public setWeekPurchaseList (data: any) { this.weekPurchaseList = { - week_0: data.purchases[0], - week_1: data.purchases[1], - week_2: data.purchases[2], - week_3: data.purchases[3], - week_4: data.purchases[4], - week_5: data.purchases[5], - week_6: data.purchases[6], + first: data.first, + second: data.second, + max: data.max, + sum: data.sum, + count: data.count, }; - this.maxPurchase = Object.keys(this.weekPurchaseList).map(key => this.weekPurchaseList[key]).reduce((a,b) => { - if (! a) { a = 0 } - if (! b) { b = 0 } - return Math.max(a,b); - }); } public setSectorList (data: any) { @@ -150,6 +144,11 @@ export class DashboardCustomerComponent implements OnInit { this.sectorPurchases = Object.keys(data.purchases).map(key => data.purchases[key]); } + public loadMore () { + this.disableSectorButton = true; + this.sectorLimit = 22; + } + ngOnInit(): void { } } From 30919e6eb2397264dc75158e6996d7c7cdc54d92 Mon Sep 17 00:00:00 2001 From: piratefinn Date: Wed, 20 Dec 2017 12:32:23 +0000 Subject: [PATCH 16/21] added circles to snippets WARNING: They are a fixed size, therefore will spill content on larger numbers --- .../snippets/cust-snippet-bar.component.html | 18 +++++++++--------- src/scss/_custom.scss | 11 +++++++++++ 2 files changed, 20 insertions(+), 9 deletions(-) diff --git a/src/app/snippets/cust-snippet-bar.component.html b/src/app/snippets/cust-snippet-bar.component.html index 80a44ef..9c9647f 100644 --- a/src/app/snippets/cust-snippet-bar.component.html +++ b/src/app/snippets/cust-snippet-bar.component.html @@ -2,25 +2,25 @@
    • -
      My Points
      - {{ userSum / 10 | number:'1.0-0' }} +
      My Points
      +
      {{ userSum / 10 | number:'1.0-0' }}
    • -
      My Rank
      +
      My Rank
      - Unranked +
      Unranked
      - {{ userPosition }} +
      {{ userPosition }}
    • -
      My Total Spend
      - {{ userSum | currency:'GBP':'symbol':'1.2-2' }} +
      My Total Spend
      +
      {{ userSum | currency:'GBP':'symbol':'1.2-2' }}
    • -
      Value to Local Economy
      - {{ userSum * 2.3 | currency:'GBP':'symbol':'1.2-2' }} +
      Value to Local Economy
      +
      {{ userSum * 2.3 | currency:'GBP':'symbol':'1.2-2' }}
    diff --git a/src/scss/_custom.scss b/src/scss/_custom.scss index 269a40a..de94c75 100644 --- a/src/scss/_custom.scss +++ b/src/scss/_custom.scss @@ -24,6 +24,17 @@ agm-map { width: 15%; } +// circle for text +.number-circle { + width:24%; + border-radius:50%; + text-align:center; + padding:12% 0; + line-height:0; + position:relative; + background: #20a8d8; + color: white; +} // white title font variant on type-2 as defined in _widgets.css .horizontal-bars { padding: 0; From 2d4a64cef417482de184e50cbae44bd41b819aa8 Mon Sep 17 00:00:00 2001 From: piratefinn Date: Wed, 20 Dec 2017 12:33:04 +0000 Subject: [PATCH 17/21] clarified a TODO in css --- src/scss/_custom.scss | 1 + 1 file changed, 1 insertion(+) diff --git a/src/scss/_custom.scss b/src/scss/_custom.scss index de94c75..c9858d6 100644 --- a/src/scss/_custom.scss +++ b/src/scss/_custom.scss @@ -25,6 +25,7 @@ agm-map { } // circle for text +// TODO: Make these resize based on inside content .number-circle { width:24%; border-radius:50%; From 2784387b12861fffd28cba1b5c1b2d7dbcb352c8 Mon Sep 17 00:00:00 2001 From: piratefinn Date: Wed, 20 Dec 2017 13:41:13 +0000 Subject: [PATCH 18/21] added varying colors based on sector --- .../dashboard-customer.component.html | 2 +- .../dashboard/dashboard-customer.component.ts | 24 +++++++++++++++++++ 2 files changed, 25 insertions(+), 1 deletion(-) diff --git a/src/app/dashboard/dashboard-customer.component.html b/src/app/dashboard/dashboard-customer.component.html index 697c23c..ab19c9b 100644 --- a/src/app/dashboard/dashboard-customer.component.html +++ b/src/app/dashboard/dashboard-customer.component.html @@ -85,7 +85,7 @@
    • - +
      {{ sectorNames [sector] || 'N/A' }}
      diff --git a/src/app/dashboard/dashboard-customer.component.ts b/src/app/dashboard/dashboard-customer.component.ts index 1d9b145..54867f2 100644 --- a/src/app/dashboard/dashboard-customer.component.ts +++ b/src/app/dashboard/dashboard-customer.component.ts @@ -78,6 +78,30 @@ export class DashboardCustomerComponent implements OnInit { U: 'icon-globe', } + sectorClasses = { + A: 'bg-primary', + B: 'bg-success', + C: 'bg-danger', + D: 'bg-warning', + E: 'bg-info', + F: 'bg-primary', + G: 'bg-success', + H: 'bg-danger', + I: 'bg-warning', + J: 'bg-info', + K: 'bg-primary', + L: 'bg-success', + M: 'bg-danger', + N: 'bg-warning', + O: 'bg-info', + P: 'bg-primary', + Q: 'bg-success', + R: 'bg-danger', + S: 'bg-warning', + T: 'bg-info', + U: 'bg-primary', + } + sectorLetters: string[] = []; sectorPurchases: number[] = []; sectorLimit: number = 10; From 95a918076a241596b2e7d509b0187f2e56f796d0 Mon Sep 17 00:00:00 2001 From: piratefinn Date: Wed, 20 Dec 2017 16:46:25 +0000 Subject: [PATCH 19/21] snippet circles fixed --- .../snippets/cust-snippet-bar.component.html | 54 +++++++++++-------- src/scss/_custom.scss | 10 ++-- 2 files changed, 38 insertions(+), 26 deletions(-) diff --git a/src/app/snippets/cust-snippet-bar.component.html b/src/app/snippets/cust-snippet-bar.component.html index 9c9647f..968c2f0 100644 --- a/src/app/snippets/cust-snippet-bar.component.html +++ b/src/app/snippets/cust-snippet-bar.component.html @@ -1,27 +1,37 @@ -
      -
      -
        -
      • -
        My Points
        -
        {{ userSum / 10 | number:'1.0-0' }}
        -
        • -
      • -
        My Rank
        -
        -
        Unranked
        +
        +
        +
          +
          +
          +
        • +
          My Points
          +
          {{ userSum / 10 | number:'1.0-0' }}
          +
          • -
          -
          {{ userPosition }}
          +
          +
        • +
          My Rank
          +
          +
          Unranked
          +
          +
          +
          {{ userPosition }}
          +
          +
          • - -
        • -
          My Total Spend
          -
          {{ userSum | currency:'GBP':'symbol':'1.2-2' }}
          -
          • -
        • -
          Value to Local Economy
          -
          {{ userSum * 2.3 | currency:'GBP':'symbol':'1.2-2' }}
          -
          • +
          +
        • +
          My Total Spend
          +
          {{ userSum | currency:'GBP':'symbol':'1.2-2' }}
          +
          • +
          +
          +
        • +
          Value to Local Economy
          +
          {{ userSum * 2.3 | currency:'GBP':'symbol':'1.2-2' }}
          +
          • +
          +
        diff --git a/src/scss/_custom.scss b/src/scss/_custom.scss index c9858d6..9efb502 100644 --- a/src/scss/_custom.scss +++ b/src/scss/_custom.scss @@ -27,14 +27,16 @@ agm-map { // circle for text // TODO: Make these resize based on inside content .number-circle { - width:24%; + height: 10rem; border-radius:50%; text-align:center; - padding:12% 0; - line-height:0; - position:relative; + width: 10rem; + padding: 5rem 5%; + line-height: 0; + position: relative; background: #20a8d8; color: white; + font-size: 0.875rem; } // white title font variant on type-2 as defined in _widgets.css .horizontal-bars { From 11fcf170ba2ff679a2aaa6e6cf925b96f91dfddd Mon Sep 17 00:00:00 2001 From: piratefinn Date: Wed, 20 Dec 2017 16:46:57 +0000 Subject: [PATCH 20/21] updated changelog --- CHANGELOG.md | 1 + 1 file changed, 1 insertion(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index 22b48ce..9c9218e 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -8,6 +8,7 @@ * Added week by week purchase list for customer dashboard * Added sector purchase amount list for customer dashboard * Added sector U to available ones +* Fixed snippet layout # v0.0.7 From 057487db4ce1cc49fa536d5e8a83e37f6d0f255a Mon Sep 17 00:00:00 2001 From: piratefinn Date: Thu, 21 Dec 2017 15:31:58 +0000 Subject: [PATCH 21/21] versioning updated --- CHANGELOG.md | 2 ++ package-lock.json | 2 +- package.json | 2 +- 3 files changed, 4 insertions(+), 2 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 9c9218e..4fb614e 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -2,6 +2,8 @@ # Next Release +# v0.1.0 + * Changed Story Trail choosing to modals * Revamped snippets and graph widgets on customer dashboard * Added local purchase pie chart for customer dashboard diff --git a/package-lock.json b/package-lock.json index d9f03df..4438a01 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,6 +1,6 @@ { "name": "localloop-web", - "version": "0.0.7", + "version": "0.1.0", "lockfileVersion": 1, "requires": true, "dependencies": { diff --git a/package.json b/package.json index bb4c050..b2811a6 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "localloop-web", - "version": "0.0.7", + "version": "0.1.0", "description": "LocalLoop Web - Web interface for LocalLoop app", "author": "", "url": "http://www.peartrade.org",