Automatic lint
This commit is contained in:
parent
9bbf6af75c
commit
06dfb7947b
16 changed files with 272 additions and 273 deletions
|
|
@ -2,7 +2,7 @@ import {Component, OnInit, Input, Output, EventEmitter, ViewChild} from '@angula
|
|||
import {ApiService} from '../providers/api-service';
|
||||
import {BaseChartDirective} from 'ng2-charts';
|
||||
import {CurrencyPipe} from '@angular/common';
|
||||
import {ChartType} from "chart.js";
|
||||
import {ChartType} from 'chart.js';
|
||||
import * as moment from 'moment';
|
||||
|
||||
@Component({
|
||||
|
|
@ -16,75 +16,20 @@ export class MoreStuffComponent implements OnInit {
|
|||
filterFrom: any;
|
||||
filterTo: any;
|
||||
|
||||
isBubbleChartLoaded: boolean = false;
|
||||
isSupplierChartLoaded: boolean = false;
|
||||
isBubbleChartLoaded = false;
|
||||
isSupplierChartLoaded = false;
|
||||
wardList: any;
|
||||
wardListAvailable = false;
|
||||
metaTypeList: any;
|
||||
metaTypeListAvailable = false;
|
||||
|
||||
constructor(
|
||||
private api: ApiService,
|
||||
private currencyPipe: CurrencyPipe,
|
||||
) {
|
||||
let now = moment();
|
||||
this.filterTo = now.format('YYYY-MM-DD');
|
||||
now.subtract(1, 'months');
|
||||
this.filterFrom = now.format('YYYY-MM-DD');
|
||||
this.tableSummary();
|
||||
}
|
||||
|
||||
ngOnInit(): void {
|
||||
this.loadData();
|
||||
}
|
||||
|
||||
public loadData() {
|
||||
this.tableSummary();
|
||||
this.loadYearSpend();
|
||||
this.loadSupplierBubble();
|
||||
this.loadSupplierHistory();
|
||||
}
|
||||
|
||||
public showLegend = true;
|
||||
|
||||
/*
|
||||
* Supplier Bubble Chart Setup
|
||||
*/
|
||||
|
||||
private formatGraphData(data: any): any[] {
|
||||
let graph_data = [];
|
||||
|
||||
data.data.map(item => {
|
||||
graph_data.push({
|
||||
t: item.date,
|
||||
r: item.value > 1000000 ? (item.value / 200000) : (item.value / 100000) + 5,
|
||||
supplier: item.seller,
|
||||
y: item.count,
|
||||
value: item.value,
|
||||
count: item.count,
|
||||
});
|
||||
});
|
||||
|
||||
return graph_data;
|
||||
}
|
||||
|
||||
private loadSupplierBubble() {
|
||||
this.api.loadMiscUrl('organisation/external/supplier_count', {
|
||||
from: this.filterFrom,
|
||||
to: this.filterTo,
|
||||
}).subscribe(
|
||||
result => {
|
||||
this.supplierBubbleChartData[0].data = this.formatGraphData(result);
|
||||
this.isBubbleChartLoaded = true;
|
||||
}
|
||||
)
|
||||
}
|
||||
|
||||
public supplierBubbleChartType: ChartType = 'bubble';
|
||||
public supplierBubbleChartData: any[] = [
|
||||
{
|
||||
data: [],
|
||||
label: ["Spend"],
|
||||
label: ['Spend'],
|
||||
borderColor: 'blue',
|
||||
hoverBorderColor: 'black',
|
||||
radius: 5,
|
||||
|
|
@ -120,9 +65,160 @@ export class MoreStuffComponent implements OnInit {
|
|||
},
|
||||
};
|
||||
|
||||
public yearSpendChartData: any[] = [
|
||||
{
|
||||
data: [],
|
||||
label: ['Value £'],
|
||||
fill: false,
|
||||
borderColor: 'red',
|
||||
hoverBackgroundColor: '#ffa1b5',
|
||||
hoverBorderColor: 'red',
|
||||
yAxisID: 'y-value',
|
||||
},
|
||||
{
|
||||
data: [],
|
||||
label: ['Count'],
|
||||
fill: false,
|
||||
borderColor: 'blue',
|
||||
hoverBackgroundColor: '#52afed',
|
||||
hoverBorderColor: 'blue',
|
||||
yAxisID: 'y-count',
|
||||
},
|
||||
];
|
||||
public yearSpendChartOptions: any = {
|
||||
elements: {line: {tension: 0}},
|
||||
responsive: true,
|
||||
scales: {
|
||||
xAxes: [{
|
||||
type: 'time',
|
||||
time: {
|
||||
unit: 'month'
|
||||
},
|
||||
scaleLabel: {
|
||||
display: true,
|
||||
labelString: 'Date'
|
||||
}
|
||||
}],
|
||||
yAxes: [
|
||||
{id: 'y-value', position: 'left', beginAtZero: true, type: 'linear'},
|
||||
{id: 'y-count', position: 'right', beginAtZero: true, type: 'linear'},
|
||||
]
|
||||
},
|
||||
};
|
||||
public yearSpendChartLabels: string[] = [];
|
||||
public yearSpendChartType: ChartType = 'line';
|
||||
|
||||
@ViewChild('supplierChart', { read: BaseChartDirective }) supplierChart: BaseChartDirective;
|
||||
|
||||
private _supplierHistoryData: any[];
|
||||
private _supplierHistoryPerPage = 15;
|
||||
public _supplierHistoryPage = 1;
|
||||
public _supplierHistoryPages = 1;
|
||||
public supplierMonthChartData: any[] = [
|
||||
{
|
||||
data: [],
|
||||
label: ['3 Month'],
|
||||
fill: false,
|
||||
borderColor: 'red',
|
||||
hoverBorderColor: 'red',
|
||||
hoverBackgroundColor: 'red',
|
||||
},
|
||||
{
|
||||
data: [],
|
||||
label: ['6 Month'],
|
||||
fill: false,
|
||||
borderColor: 'blue',
|
||||
hoverBorderColor: 'blue',
|
||||
hoverBackgroundColor: 'blue',
|
||||
},
|
||||
{
|
||||
data: [],
|
||||
label: ['12 Month'],
|
||||
fill: false,
|
||||
borderColor: 'orange',
|
||||
hoverBorderColor: 'orange',
|
||||
hoverBackgroundColor: 'orange',
|
||||
},
|
||||
];
|
||||
public supplierMonthChartOptions: any = {
|
||||
// maintainAspectRatio: false,
|
||||
responsive: true,
|
||||
scales: {
|
||||
xAxes: [{
|
||||
scaleLabel: {
|
||||
display: true,
|
||||
labelString: 'Spend amount £'
|
||||
}
|
||||
}],
|
||||
yAxes: [{
|
||||
scaleLabel: {
|
||||
display: true,
|
||||
labelString: 'Supplier Names'
|
||||
}
|
||||
}]
|
||||
},
|
||||
};
|
||||
public supplierMonthChartLabels: string[] = [];
|
||||
public supplierMonthChartType: ChartType = 'horizontalBar';
|
||||
|
||||
constructor(
|
||||
private api: ApiService,
|
||||
private currencyPipe: CurrencyPipe,
|
||||
) {
|
||||
const now = moment();
|
||||
this.filterTo = now.format('YYYY-MM-DD');
|
||||
now.subtract(1, 'months');
|
||||
this.filterFrom = now.format('YYYY-MM-DD');
|
||||
this.tableSummary();
|
||||
}
|
||||
|
||||
ngOnInit(): void {
|
||||
this.loadData();
|
||||
}
|
||||
|
||||
public loadData() {
|
||||
this.tableSummary();
|
||||
this.loadYearSpend();
|
||||
this.loadSupplierBubble();
|
||||
this.loadSupplierHistory();
|
||||
}
|
||||
|
||||
/*
|
||||
* Supplier Bubble Chart Setup
|
||||
*/
|
||||
|
||||
private formatGraphData(data: any): any[] {
|
||||
const graph_data = [];
|
||||
|
||||
data.data.map(item => {
|
||||
graph_data.push({
|
||||
t: item.date,
|
||||
r: item.value > 1000000 ? (item.value / 200000) : (item.value / 100000) + 5,
|
||||
supplier: item.seller,
|
||||
y: item.count,
|
||||
value: item.value,
|
||||
count: item.count,
|
||||
});
|
||||
});
|
||||
|
||||
return graph_data;
|
||||
}
|
||||
|
||||
private loadSupplierBubble() {
|
||||
this.api.loadMiscUrl('organisation/external/supplier_count', {
|
||||
from: this.filterFrom,
|
||||
to: this.filterTo,
|
||||
}).subscribe(
|
||||
result => {
|
||||
this.supplierBubbleChartData[0].data = this.formatGraphData(result);
|
||||
this.isBubbleChartLoaded = true;
|
||||
}
|
||||
)
|
||||
}
|
||||
|
||||
private bubbleTooltipCallback(tooltipItem: any, data: any) {
|
||||
let dataset = data.datasets[tooltipItem.datasetIndex];
|
||||
let value = dataset.data[tooltipItem.index];
|
||||
const dataset = data.datasets[tooltipItem.datasetIndex];
|
||||
const value = dataset.data[tooltipItem.index];
|
||||
return `${value.supplier}: ${this.currencyPipe.transform(value.value, 'GBP', 'symbol', '1.2-2')} over ${value.count} purchases`;
|
||||
}
|
||||
|
||||
|
|
@ -154,8 +250,8 @@ export class MoreStuffComponent implements OnInit {
|
|||
to: this.filterTo,
|
||||
}).subscribe(
|
||||
result => {
|
||||
let value_data = [];
|
||||
let count_data = [];
|
||||
const value_data = [];
|
||||
const count_data = [];
|
||||
|
||||
result.data.map(item => {
|
||||
value_data.push({
|
||||
|
|
@ -175,49 +271,6 @@ export class MoreStuffComponent implements OnInit {
|
|||
)
|
||||
}
|
||||
|
||||
public yearSpendChartData: any[] = [
|
||||
{
|
||||
data: [],
|
||||
label: ["Value £"],
|
||||
fill: false,
|
||||
borderColor: 'red',
|
||||
hoverBackgroundColor: '#ffa1b5',
|
||||
hoverBorderColor: 'red',
|
||||
yAxisID: 'y-value',
|
||||
},
|
||||
{
|
||||
data: [],
|
||||
label: ["Count"],
|
||||
fill: false,
|
||||
borderColor: 'blue',
|
||||
hoverBackgroundColor: '#52afed',
|
||||
hoverBorderColor: 'blue',
|
||||
yAxisID: 'y-count',
|
||||
},
|
||||
];
|
||||
public yearSpendChartOptions: any = {
|
||||
elements: {line: {tension: 0}},
|
||||
responsive: true,
|
||||
scales: {
|
||||
xAxes: [{
|
||||
type: 'time',
|
||||
time: {
|
||||
unit: 'month'
|
||||
},
|
||||
scaleLabel: {
|
||||
display: true,
|
||||
labelString: 'Date'
|
||||
}
|
||||
}],
|
||||
yAxes: [
|
||||
{id: 'y-value', position: 'left', beginAtZero: true, type: 'linear'},
|
||||
{id: 'y-count', position: 'right', beginAtZero: true, type: 'linear'},
|
||||
]
|
||||
},
|
||||
};
|
||||
public yearSpendChartLabels: string[] = [];
|
||||
public yearSpendChartType: ChartType = 'line';
|
||||
|
||||
randomData() {
|
||||
return Math.random();
|
||||
}
|
||||
|
|
@ -227,8 +280,6 @@ export class MoreStuffComponent implements OnInit {
|
|||
|
||||
}
|
||||
|
||||
@ViewChild('supplierChart', { read: BaseChartDirective }) supplierChart: BaseChartDirective;
|
||||
|
||||
private loadSupplierHistory() {
|
||||
this.api.loadMiscUrl('organisation/external/supplier_history').subscribe(
|
||||
result => {
|
||||
|
|
@ -251,10 +302,10 @@ export class MoreStuffComponent implements OnInit {
|
|||
const pageData = this._supplierHistoryData.slice(firstResult, lastResult);
|
||||
console.log(pageData);
|
||||
|
||||
let labels = [];
|
||||
let year = [];
|
||||
let half = [];
|
||||
let quarter = [];
|
||||
const labels = [];
|
||||
const year = [];
|
||||
const half = [];
|
||||
const quarter = [];
|
||||
pageData.map(item => {
|
||||
labels.push(item.name);
|
||||
year.push(item.year_total);
|
||||
|
|
@ -281,55 +332,4 @@ export class MoreStuffComponent implements OnInit {
|
|||
}
|
||||
this.updateSupplierHistoryData();
|
||||
}
|
||||
|
||||
private _supplierHistoryData: any[];
|
||||
private _supplierHistoryPerPage: number = 15;
|
||||
public _supplierHistoryPage: number = 1;
|
||||
public _supplierHistoryPages: number = 1;
|
||||
public supplierMonthChartData: any[] = [
|
||||
{
|
||||
data: [],
|
||||
label: ["3 Month"],
|
||||
fill: false,
|
||||
borderColor: 'red',
|
||||
hoverBorderColor: 'red',
|
||||
hoverBackgroundColor: 'red',
|
||||
},
|
||||
{
|
||||
data: [],
|
||||
label: ["6 Month"],
|
||||
fill: false,
|
||||
borderColor: 'blue',
|
||||
hoverBorderColor: 'blue',
|
||||
hoverBackgroundColor: 'blue',
|
||||
},
|
||||
{
|
||||
data: [],
|
||||
label: ["12 Month"],
|
||||
fill: false,
|
||||
borderColor: 'orange',
|
||||
hoverBorderColor: 'orange',
|
||||
hoverBackgroundColor: 'orange',
|
||||
},
|
||||
];
|
||||
public supplierMonthChartOptions: any = {
|
||||
//maintainAspectRatio: false,
|
||||
responsive: true,
|
||||
scales: {
|
||||
xAxes: [{
|
||||
scaleLabel: {
|
||||
display: true,
|
||||
labelString: 'Spend amount £'
|
||||
}
|
||||
}],
|
||||
yAxes: [{
|
||||
scaleLabel: {
|
||||
display: true,
|
||||
labelString: 'Supplier Names'
|
||||
}
|
||||
}]
|
||||
},
|
||||
};
|
||||
public supplierMonthChartLabels: string[] = [];
|
||||
public supplierMonthChartType: ChartType = 'horizontalBar';
|
||||
}
|
||||
|
|
|
|||
Reference in a new issue