New graph types added (not all working unfortunately), new section added for table views and probably a lot of messy code too!

This commit is contained in:
Felix 2019-07-04 15:34:42 +01:00
parent 6376d570af
commit 471b56f2a8
15 changed files with 368 additions and 26 deletions

View file

@ -12,28 +12,33 @@
</div><!--/.row-->
<div class=row>
<div class="col-xl-6">
<panel-pie></panel-pie>
</div><!--/.col-->
<div *ngIf="showCategoryDoughnutChart" class="col-xl-6">
<div class="card">
<div class="card-block">
<div class="row">
<div class="col-12">
<h4 class="card-title mb-0">Weekly Spending by Category</h4>
<!--<panel-pie></panel-pie> --><!--All Purchases-->
<div class="demo-container" ng-app="stacked-bar" ng-controller="stacked-bar">
<div id="stacked-bar" dx-chart="chartOptions"></div>
</div> </div><!--/.col-->
<div *ngIf="showCategoryDoughnutChart" class="col-xl-6">
<div class="card">
<!-- <body style="background-color:rgb(0,0,0);"> -->
<div class="card-block">
<div class="row">
<div class="col-12">
<h4 class="card-title mb-0">Weekly Spending by Category</h4>
</div>
</div>
<div class="chart-wrapper">
<canvas baseChart class="chart"
[datasets]="doughnutChartDataCategory"
[labels]="doughnutChartLabelsCategory"
[options]="doughnutChartOptionsCategory"
[legend]="chartLegend"
[chartType]="chartType"
(chartHover)="chartHovered($event)"
(chartClick)="chartClicked($event)">
</canvas>
</div>
</div>
</div>
<div class="chart-wrapper">
<canvas baseChart class="chart"
[datasets]="doughnutChartDataCategory"
[labels]="doughnutChartLabelsCategory"
[options]="doughnutChartOptionsCategory"
[legend]="chartLegend"
[chartType]="chartType"
(chartHover)="chartHovered($event)"
(chartClick)="chartClicked($event)"></canvas>
</div>
<!-- </body> -->
</div>
</div>
</div><!--/.col-->
<div *ngIf="showEssentialBarChart" class="col-xl-6">
<div class="card">

View file

@ -7,6 +7,8 @@ import { CustBarSnippetComponent } from '../snippets/cust-snippet-bar.component'
import { PiePanel } from '../panels/pie-panel.component';
import { DataType } from '../shared/data-types.enum';
import * as moment from 'moment';
import { NewSectionComponent } from '../dashboard/new-section.component';
import { StackedBarChartComponent } from '../panels/stacked-bar.component';
@Component({
@ -28,7 +30,7 @@ export class DashboardCustomerComponent implements OnInit {
public bootstrapColours: string[] = ['bg-primary', 'bg-secondary', 'bg-success',
'bg-danger', 'bg-warning', 'bg-info'];
public chartType = 'doughnut';
public chartType = 'polarArea';
public chartLegend = true;
public doughnutChartDataCategory: any[] = [];
public doughnutChartLabelsCategory: string[] = [];
@ -148,9 +150,7 @@ export class DashboardCustomerComponent implements OnInit {
this.setWeekData(result);
this.setChartData(result.data.cat_total);
this.totalCategoryList = result.data.cat_list;
if (this.totalCategoryList) {
this.showTotalCategoryList = true;
}
this.showTotalCategoryList = true;
this.purchaseEssential = result.data.essentials.purchase_no_essential_total;
this.purchaseNotEssential = result.data.essentials.purchase_no_total - this.purchaseEssential;
this.barChartDataEssential = [

View file

@ -17,6 +17,7 @@ import { PayrollLogComponent } from './payroll-log.component';
import { LeaderboardComponent } from './leaderboard.component';
import { MapComponent } from './map.component';
import { TrailMapComponent } from './trail-map.component';
import { NewSectionComponent } from './new-section.component';
// Using child path to allow for FullLayout theming
const routes: Routes = [
@ -84,6 +85,11 @@ const routes: Routes = [
path: 'feedback',
component: FeedbackComponent,
data: { title: 'Give Feedback' },
},
{
path: 'new-section',
component: NewSectionComponent,
data: { title: 'New Section' }
}
],
}

View file

@ -0,0 +1,6 @@
<div class="animated fadeIn">
<div class="row">
<h1>Hello World!</h1>
</div><!--/.row-->
</div>

View file

@ -0,0 +1,27 @@
import { Component, OnInit, AfterViewInit, Input, Output, EventEmitter, ViewChild, TemplateRef } from '@angular/core';
import { ApiService } from '../providers/api-service';
import { AgmCoreModule } from '@agm/core';
import { BsModalService, ModalDirective } from 'ngx-bootstrap/modal';
import { BsModalRef } from 'ngx-bootstrap/modal/bs-modal-ref.service';
@Component({
templateUrl: 'new-section.component.html',
})
export class NewSectionComponent implements OnInit, AfterViewInit {
constructor(
private api: ApiService,
) { }
ngOnInit(): void {
}
ngAfterViewInit() {
}
}