diff --git a/CHANGELOG.md b/CHANGELOG.md index 4f5d783..74408eb 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -2,6 +2,9 @@ # Next Release +* Amended category list on transaction submission +* Added budget view for weekly breakdown of spend by category + # v0.1.3 * Made fix to Travis config diff --git a/src/app/dashboard/add-data.component.html b/src/app/dashboard/add-data.component.html index f43870e..dea50d2 100644 --- a/src/app/dashboard/add-data.component.html +++ b/src/app/dashboard/add-data.component.html @@ -25,17 +25,42 @@
- +
- +
- Optional: Choose the relevant Category for the purchase. + Tick if the purchase is deemed an essential purchase for budgeting purposes. +
+
+
+ +
+
+
+
+ +
+
+ +
+
+
+
+ +
+
+
+ Optional: Choose the Budget Type for the majority of the purchase.
diff --git a/src/app/dashboard/add-data.component.ts b/src/app/dashboard/add-data.component.ts index 6d64ca8..94a0274 100644 --- a/src/app/dashboard/add-data.component.ts +++ b/src/app/dashboard/add-data.component.ts @@ -32,6 +32,7 @@ export class AddDataComponent implements OnInit { amount: number; // Assumes Groceries is 1st category categoryId: number = 1; + essentialPurchase = false; transactionAdditionType = 1; storeList = []; showAddStore = false; @@ -39,7 +40,8 @@ export class AddDataComponent implements OnInit { transactionFormInvalid = true; myDate: any; minDate: any; - categoryIdList: number[] = []; + leftCategoryIdList: number[] = []; + rightCategoryIdList: number[] = []; categoryNameList: string[] = []; constructor( @@ -85,8 +87,11 @@ export class AddDataComponent implements OnInit { } private setCategoryList(data: any) { - this.categoryIdList = Object.keys(data.ids).map(key => data.ids[key]); + let categoryIdList = Object.keys(data.ids).map(key => data.ids[key]); this.categoryNameList = Object.keys(data.names).map(key => data.names[key]); + let halfLength = Math.floor(categoryIdList.length / 2); + this.leftCategoryIdList = categoryIdList.splice(0, halfLength); + this.rightCategoryIdList = categoryIdList; } getMinDate() { @@ -189,6 +194,7 @@ export class AddDataComponent implements OnInit { purchase_time : purchaseTime, organisation_id : this.organisationId, category : this.categoryId, + essential : this.essentialPurchase, }; break; case 2: @@ -197,7 +203,7 @@ export class AddDataComponent implements OnInit { transaction_value : this.amount, purchase_time : purchaseTime, organisation_id : this.organisationId, - category : this.categoryId, + essential : this.essentialPurchase, }; break; case 3: @@ -209,7 +215,7 @@ export class AddDataComponent implements OnInit { street_name : this.submitOrg.street_name, town : this.submitOrg.town, postcode : this.submitOrg.postcode, - category : this.categoryId, + essential : this.essentialPurchase, }; break; } diff --git a/src/app/dashboard/category-month.component.html b/src/app/dashboard/category-month.component.html new file mode 100644 index 0000000..42a3d7a --- /dev/null +++ b/src/app/dashboard/category-month.component.html @@ -0,0 +1,172 @@ +
+
+
+
+
+
+
+

Purchases Last Week

+
+
+
+
    +
  • + Essential Purchases + {{ ( weekEssential1.value || 0 ) | currency:'GBP':'symbol':'1.2-2' }} + ({{ (weekEssential1.value || 0 ) / weekListValueSum1 | percent:'1.0-0' }}) +
    +
    +
    +
    +
    +
  • +
  • + {{ categoryNameList[categoryEntry.category - 1] || 'Uncategorised' }} + {{ ( categoryEntry.value || 0 ) | currency:'GBP':'symbol':'1.2-2' }} + ({{ (categoryEntry.value || 0 ) / weekListValueSum1 | percent:'1.0-0' }}) +
    +
    +
    +
    +
    +
  • +
    +
  • + +
  • +
    +
+
+
+
+
+
+
+
+
+
+

Purchases 1 Week Ago

+
+
+
+
    +
  • + Essential Purchases + {{ ( weekEssential2.value || 0 ) | currency:'GBP':'symbol':'1.2-2' }} + ({{ (weekEssential2.value || 0 ) / weekListValueSum2 | percent:'1.0-0' }}) +
    +
    +
    +
    +
    +
  • +
  • + {{ categoryNameList[categoryEntry.category - 1] || 'Uncategorised' }} + {{ ( categoryEntry.value || 0 ) | currency:'GBP':'symbol':'1.2-2' }} + ({{ (categoryEntry.value || 0 ) / weekListValueSum2 | percent:'1.0-0' }}) +
    +
    +
    +
    +
    +
  • +
    +
  • + +
  • +
    +
+
+
+
+
+
+
+
+
+
+

Purchases 2 Weeks Ago

+
+
+
+
    +
  • + Essential Purchases + {{ ( weekEssential1.value || 0 ) | currency:'GBP':'symbol':'1.2-2' }} + ({{ (weekEssential3.value || 0 ) / weekListValueSum3 | percent:'1.0-0' }}) +
    +
    +
    +
    +
    +
  • +
  • + {{ categoryNameList[categoryEntry.category - 1] || 'Uncategorised' }} + {{ ( categoryEntry.value || 0 ) | currency:'GBP':'symbol':'1.2-2' }} + ({{ (categoryEntry.value || 0 ) / weekListValueSum3 | percent:'1.0-0' }}) +
    +
    +
    +
    +
    +
  • +
    +
  • + +
  • +
    +
+
+
+
+
+
+
+
+
+
+

Purchases 3 Weeks Ago

+
+
+
+
    +
  • + Essential Purchases + {{ ( weekEssential4.value || 0 ) | currency:'GBP':'symbol':'1.2-2' }} + ({{ (weekEssential4.value || 0 ) / weekListValueSum4 | percent:'1.0-0' }}) +
    +
    +
    +
    +
    +
  • +
  • + {{ categoryNameList[categoryEntry.category - 1] || 'Uncategorised' }} + {{ ( categoryEntry.value || 0 ) | currency:'GBP':'symbol':'1.2-2' }} + ({{ (categoryEntry.value || 0 ) / weekListValueSum4 | percent:'1.0-0' }}) +
    +
    +
    +
    +
    +
  • +
    +
  • + +
  • +
    +
+
+
+
+
+
+
diff --git a/src/app/dashboard/category-month.component.ts b/src/app/dashboard/category-month.component.ts new file mode 100644 index 0000000..4c9fbc4 --- /dev/null +++ b/src/app/dashboard/category-month.component.ts @@ -0,0 +1,137 @@ +import { Directive, Component, OnInit } from '@angular/core'; +import { ApiService } from '../providers/api-service'; +import { DataType } from '../shared/data-types.enum'; +import * as moment from 'moment'; +import 'rxjs/add/operator/map'; + +@Component({ + templateUrl: 'category-month.component.html' +}) +export class CategoryMonthComponent implements OnInit { + + disableCategoryButton1: boolean = false; + disableCategoryButton2: boolean = false; + disableCategoryButton3: boolean = false; + disableCategoryButton4: boolean = false; + + weekPurchaseList = { + first: 0, + }; + + weekList1 = []; + weekList2 = []; + weekList3 = []; + weekList4 = []; + weekListValueSum1: number = 0; + weekListValueSum2: number = 0; + weekListValueSum3: number = 0; + weekListValueSum4: number = 0; + weekEssential1: number = 0; + weekEssential2: number = 0; + weekEssential3: number = 0; + weekEssential4: number = 0; + + categoryList: number[] = []; + dayList: any[] = []; + valueList: number[] = []; + myWeek1: any; + myWeek2: any; + myWeek3: any; + myWeek4: any; + categoryIdList: number[] = []; + categoryNameList: string[] = []; + categoryLimit1: number = 6; + categoryLimit2: number = 6; + categoryLimit3: number = 6; + categoryLimit4: number = 6; + + constructor( + private api: ApiService, + ) { + this.setDate(); + this.api.categoryList().subscribe( + result => { + this.setCategoryList(result.categories); + }, + error => { + console.log('Retrieval Error'); + console.log( error._body ); + } + ); + this.api.categoryTransactionList().subscribe( + result => { + this.setData(result); + }, + error => { + console.log('Retrieval Error'); + console.log( error._body ); + } + ); + } + + ngOnInit(): void { + } + + private setCategoryList(data: any) { + this.categoryIdList = Object.keys(data.ids).map(key => data.ids[key]); + this.categoryNameList = Object.keys(data.names).map(key => data.names[key]); + } + + private setDate () { + this.myWeek1 = moment().startOf('isoWeek').format('YYYY-MM-DD'); + this.myWeek2 = moment(this.myWeek1).subtract(1, 'weeks').format('YYYY-MM-DD'); + this.myWeek3 = moment(this.myWeek2).subtract(1, 'weeks').format('YYYY-MM-DD'); + this.myWeek4 = moment(this.myWeek3).subtract(1, 'weeks').format('YYYY-MM-DD'); + } + + private setData (data: any) { + function prop(obj: T, key: K) { + return obj[key]; + } + this.weekList1 = prop(data.data.categories, this.myWeek1); + this.weekList2 = prop(data.data.categories, this.myWeek2); + this.weekList3 = prop(data.data.categories, this.myWeek3); + this.weekList4 = prop(data.data.categories, this.myWeek4); + this.getMaxValue(this.weekList1, this.weekList2, this.weekList3, this.weekList4); + this.weekEssential1 = prop(data.data.essentials, this.myWeek1); + console.log(this.weekEssential1); + this.weekEssential2 = prop(data.data.essentials, this.myWeek2); + this.weekEssential3 = prop(data.data.essentials, this.myWeek3); + this.weekEssential4 = prop(data.data.essentials, this.myWeek4); + } + + private getMaxValue (data1: any, + data2: any, + data3: any, + data4: any) { + if (data1) { + this.weekListValueSum1 = data1.reduce(function (s, a) {return s + a.value;}, 0); + } + if (data2) { + this.weekListValueSum2 = data2.reduce(function (s, a) {return s + a.value;}, 0); + } + if (data3) { + this.weekListValueSum3 = data3.reduce(function (s, a) {return s + a.value;}, 0); + } + if (data4) { + this.weekListValueSum4 = data4.reduce(function (s, a) {return s + a.value;}, 0); + } + } + + private loadMore1 () { + this.disableCategoryButton1 = true; + this.categoryLimit1 = 20; + } + private loadMore2 () { + this.disableCategoryButton2 = true; + this.categoryLimit2 = 20; + } + private loadMore3 () { + this.disableCategoryButton3 = true; + this.categoryLimit3 = 20; + } + private loadMore4 () { + this.disableCategoryButton4 = true; + this.categoryLimit4 = 20; + } +} diff --git a/src/app/dashboard/dashboard-customer.component.html b/src/app/dashboard/dashboard-customer.component.html index 46310d0..e8019a4 100644 --- a/src/app/dashboard/dashboard-customer.component.html +++ b/src/app/dashboard/dashboard-customer.component.html @@ -94,7 +94,7 @@ {{ sectorPurchases[i] || 'N/A' }}
-
  • +
  • diff --git a/src/app/dashboard/dashboard-customer.component.ts b/src/app/dashboard/dashboard-customer.component.ts index 54867f2..55f1b6a 100644 --- a/src/app/dashboard/dashboard-customer.component.ts +++ b/src/app/dashboard/dashboard-customer.component.ts @@ -168,7 +168,7 @@ export class DashboardCustomerComponent implements OnInit { this.sectorPurchases = Object.keys(data.purchases).map(key => data.purchases[key]); } - public loadMore () { + private loadMore () { this.disableSectorButton = true; this.sectorLimit = 22; } diff --git a/src/app/dashboard/dashboard.module.ts b/src/app/dashboard/dashboard.module.ts index d6fcfca..2e47f80 100644 --- a/src/app/dashboard/dashboard.module.ts +++ b/src/app/dashboard/dashboard.module.ts @@ -16,6 +16,7 @@ import { AccountEditComponent } from './account-edit.component'; import { AddDataComponent } from './add-data.component'; import { FeedbackComponent } from './feedback.component'; import { TransactionLogComponent } from './transaction-log.component'; +import { CategoryMonthComponent } from './category-month.component'; import { PayrollLogComponent } from './payroll-log.component'; import { LeaderboardComponent } from './leaderboard.component'; import { MapComponent } from './map.component'; @@ -61,6 +62,7 @@ import { environment } from '../../environments/environment'; OrgResultComponent, OrgTableComponent, TransactionLogComponent, + CategoryMonthComponent, TransactionResultComponent, PayrollLogComponent, PayrollResultComponent, diff --git a/src/app/dashboard/dashboard.routing.ts b/src/app/dashboard/dashboard.routing.ts index 46b9df3..6505f9a 100644 --- a/src/app/dashboard/dashboard.routing.ts +++ b/src/app/dashboard/dashboard.routing.ts @@ -12,6 +12,7 @@ import { AccountEditComponent } from './account-edit.component'; import { AddDataComponent } from './add-data.component'; import { FeedbackComponent } from './feedback.component'; import { TransactionLogComponent } from './transaction-log.component'; +import { CategoryMonthComponent } from './category-month.component'; import { PayrollLogComponent } from './payroll-log.component'; import { LeaderboardComponent } from './leaderboard.component'; import { MapComponent } from './map.component'; @@ -58,6 +59,11 @@ const routes: Routes = [ component: TransactionLogComponent, data: { title: 'Transaction Log' }, }, + { + path: 'category-month', + component: CategoryMonthComponent, + data: { title: 'Budget' }, + }, { path: 'map', component: MapComponent, diff --git a/src/app/layouts/full-layout.component.html b/src/app/layouts/full-layout.component.html index 1c7a0fb..6a3708f 100644 --- a/src/app/layouts/full-layout.component.html +++ b/src/app/layouts/full-layout.component.html @@ -82,6 +82,14 @@ +