Misc Chart work

This commit is contained in:
Tom Slater 2019-08-16 16:58:35 +01:00
parent e9334cec6d
commit 156a2f3764
7 changed files with 17 additions and 49 deletions

View file

@ -121,14 +121,6 @@ export class DashboardCustomerComponent implements OnInit {
// Graph widgets
public widgetList = [
{
type: 'graph',
name: 'total_duration',
duration: '400',
icon: 'icon-diamond',
title: '(test) last 400 days',
dataType: DataType.currency,
},
{
type: 'graph',
name: 'total_last_week',

View file

@ -59,22 +59,9 @@
<div class="card">
<div class="card-block">
<div class="row">
<div class="col-7">
<div class="col-12">
<h4 class="card-title mb-0">Spending by Category</h4>
</div>
<div class="col-sm-5 hidden-sm-down">
<div class="btn-toolbar float-right" role="toolbar" aria-label="Toolbar with button groups">
<div class="btn-group mr-3" data-toggle="buttons" aria-label="First group">
<select>
<option value="Day">Day</option>
<option value="Week">Week</option>
<option value="Month">Month</option>
<option value="Year">Year</option>
<option value="All Time">All Time</option>
</select>
</div>
</div>
</div>
</div>
<div class="chart-wrapper">
<canvas baseChart class="chart"

View file

@ -22,7 +22,7 @@ export class LeaderboardComponent implements OnInit {
public paginateConfig: PaginationInstance = {
id: 'leadpaginate',
itemsPerPage: 10,
itemsPerPage: 20,
currentPage: 1,
totalItems: 0
};
@ -70,7 +70,7 @@ export class LeaderboardComponent implements OnInit {
console.log(error);
}
);
}
}org
// // dynamically changes the row style based on player's position
// // for instance, top three player and the player him/herself should

View file

@ -12,6 +12,8 @@ import { NgModel } from '@angular/forms';
export class MoreStuffComponent implements OnInit {
@Output() public onClick = new EventEmitter();
@Input() public categories: any;
lineChartBegin: any;
lineChartEnd: any;
bubbleChartBegin: any;
bubbleChartEnd: any;
cached_graph_data: any;
@ -27,8 +29,8 @@ export class MoreStuffComponent implements OnInit {
}
ngOnInit(): void {
this.loadYearSpend(false, ('January 1, 2018'), ('January 1, 2019'));
this.loadSupplierBubble(false, ('January 1, 2018'), ('January 1, 2019')); // pass start and end date ranges to this as Date()s
this.loadYearSpend();
this.loadSupplierBubble(false, ('January 1, 2018'), ('January 1, 2019')); // pass start and end date ranges to this as Date()s
this.loadSupplierHistory();
}
@ -63,7 +65,7 @@ export class MoreStuffComponent implements OnInit {
passed_graph_data.data.map(item=> {
let is_item_in_range = (new Date(item.date.substring(0, 10)) >= new Date(start_range) && new Date(item.date.substring(0, 10)) <= new Date(end_range));
// there are a lot of `new Date(blah)` but that is what works for some reason.
console.log("item.date : " + (item.date));
console.log("Date(item.date) : " + new Date(item.date));
console.log("Date(item.date.substring(0, 10)) : " + new Date(item.date.substring(0, 10)));
@ -75,7 +77,7 @@ export class MoreStuffComponent implements OnInit {
// console.log("item.date <= end_range: " + (new Date(item.date) <= new Date(end_range)));
// console.log("is_item_in_range: " + is_item_in_range);
console.log("----------------------");
if (is_item_in_range) {
graph_data.push({
t: new Date(item.date.substring(0, 10)),
@ -129,7 +131,7 @@ export class MoreStuffComponent implements OnInit {
this.api.loadMiscUrl('organisation/external/supplier_count').subscribe(
result => {
this.cached_graph_data = result;
this.supplierBubbleChartData[0].data = this.formatGraphData(result, useRange, start_range, end_range);
console.log("Graph fetched with " + this.supplierBubbleChartData[0].data.length + " items.");
}
@ -283,8 +285,8 @@ export class MoreStuffComponent implements OnInit {
console.log("end_range input box: " + this.lineChartEnd);
console.log("end_range : " + new Date(this.lineChartEnd));
this.loadSupplierBubble(true, (this.bubbleChartBegin), (this.bubbleChartEnd));
console.log("Bubble chart updating...");
this.loadYearSpend();
console.log("Line chart updating...");
}

View file

@ -82,12 +82,12 @@ export class GraphPanel implements OnInit {
pointHoverBackgroundColor: '#fff'
},
{ // brandSuccess
backgroundColor: 'transparent',
backgroundColor: this.convertHex(this.brandInfo, 10),
borderColor: this.brandSuccess,
pointHoverBackgroundColor: '#fff'
},
{ // brandDanger
backgroundColor: 'transparent',
backgroundColor: this.convertHex(this.brandDanger, 10),
borderColor: this.brandDanger,
pointHoverBackgroundColor: '#fff',
borderWidth: 1,

View file

@ -1,22 +1,9 @@
<div class="card">
<div class="card-block">
<div class="row">
<div class="col-7">
<div class="col-12">
<h4 class="card-title mb-0">All Purchases by Type</h4>
</div>
<div class="col-sm-5 hidden-sm-down">
<div class="btn-toolbar float-right" role="toolbar" aria-label="Toolbar with button groups">
<div class="btn-group mr-3" data-toggle="buttons" aria-label="First group">
<select>
<option value="Day">Day</option>
<option value="Week">Week</option>
<option value="Month">Month</option>
<option value="Year">Year</option>
<option value="All Time">All Time</option>
</select>
</div>
</div>
</div>
</div>
<div class="chart-wrapper">
<canvas baseChart class="chart"

View file

@ -44,8 +44,8 @@ export class OrgPiePanel implements OnInit {
'blue'
]
},
{ borderWidth: [10]
}
{ borderWidth: [100]
},
];
public doughnutChartLabelsLocal: string[] = [];