diff --git a/src/app/dashboard/category-month.component.html b/src/app/dashboard/category-month.component.html index e8c9dbc..a6ccc84 100644 --- a/src/app/dashboard/category-month.component.html +++ b/src/app/dashboard/category-month.component.html @@ -1,6 +1,6 @@
-
+
@@ -10,10 +10,10 @@
    -
  • - Placeholder Category - {{ (weekPurchaseList.first || 0 ) }} - ({{ (weekPurchaseList.first || 0 ) / weekPurchaseList.max | percent:'1.0-0' }}) +
  • + {{ categoryNameList[categoryEntry.category] || 'Uncategorised' }} + {{ ( categoryEntry.value || 0 ) }} + 0
  • -
  • - -
  • +
    +
  • + +
  • +
-
+
@@ -39,9 +41,9 @@
    -
  • - Placeholder Category - {{ (weekPurchaseList.first || 0 ) }} +
  • + {{ categoryNameList[categoryEntry.category] || 'Uncategorised' }} + {{ ( categoryEntry.value || 0 ) }} ({{ (weekPurchaseList.first || 0 ) / weekPurchaseList.max | percent:'1.0-0' }})
    @@ -50,15 +52,17 @@
  • -
  • - -
  • +
    +
  • + +
  • +
-
+
@@ -68,9 +72,9 @@
    -
  • - Placeholder Category - {{ (weekPurchaseList.first || 0 ) }} +
  • + {{ categoryNameList[categoryEntry.category] || 'Uncategorised' }} + {{ ( categoryEntry.value || 0 ) }} ({{ (weekPurchaseList.first || 0 ) / weekPurchaseList.max | percent:'1.0-0' }})
    @@ -79,15 +83,17 @@
  • -
  • - -
  • +
    +
  • + +
  • +
-
+
@@ -97,9 +103,9 @@
    -
  • - Placeholder Category - {{ (weekPurchaseList.first || 0 ) }} +
  • + {{ categoryNameList[categoryEntry.category] || 'Uncategorised' }} + {{ ( categoryEntry.value || 0 ) }} ({{ (weekPurchaseList.first || 0 ) / weekPurchaseList.max | percent:'1.0-0' }})
    @@ -108,9 +114,11 @@
  • -
  • - -
  • +
    +
  • + +
  • +
diff --git a/src/app/dashboard/category-month.component.ts b/src/app/dashboard/category-month.component.ts index 74f267f..40fbbdb 100644 --- a/src/app/dashboard/category-month.component.ts +++ b/src/app/dashboard/category-month.component.ts @@ -9,25 +9,47 @@ import 'rxjs/add/operator/map'; }) export class CategoryMonthComponent implements OnInit { - disableCategoryButtonFirst: boolean = false; + disableCategoryButton1: boolean = false; + disableCategoryButton2: boolean = false; + disableCategoryButton3: boolean = false; + disableCategoryButton4: boolean = false; weekPurchaseList = { first: 0, }; + weekList1 = {}; + weekList2 = {}; + weekList3 = {}; + weekList4 = {}; + categoryList: number[] = []; dayList: any[] = []; valueList: number[] = []; - categoryLimitFirst: number = 10; 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 => { console.log(result); @@ -40,13 +62,16 @@ export class CategoryMonthComponent implements OnInit { ); } - private loadMore () { - this.disableCategoryButtonFirst = true; - this.categoryLimitFirst = 100; + 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().format('YYYY-MM-DD'); + 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'); @@ -57,11 +82,33 @@ export class CategoryMonthComponent implements OnInit { } private setData (data: any) { - // this.categoryList = Object.keys(data.data.category).map(key => data.data.category[key]); - // this.dayList = Object.keys(data.data.days).map(key => data.data.days[key]); - // this.valueList = Object.keys(data.data.value).map(key => data.data.value[key]); + function prop(obj: T, key: K) { + return obj[key]; + } + this.weekList1 = prop(data.data, this.myWeek1); + this.weekList2 = prop(data.data, this.myWeek2); + this.weekList3 = prop(data.data, this.myWeek3); + this.weekList4 = prop(data.data, this.myWeek4); + console.log(this.weekList1); + console.log(this.weekList2); + console.log(this.weekList3); + console.log(this.weekList4); } - ngOnInit(): void { + 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; } }