Functionality fully added

src/app/shared/payroll-result.component.html

@@ -0,0 +1,3 @@
+<td>{{payrollDate}}</td>
+<td>{{payroll.gross_payroll | currency:'GBP':true:'1.2-2' }}</td>
+<td>{{payroll.employee_amount}}</td>

src/app/shared/payroll-result.component.ts

@@ -0,0 +1,22 @@
+import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core';
+import * as moment from 'moment';
+
+interface PayrollData {
+  entry_period: string;
+  gross_payroll: number;
+  employee_amount: number;
+}
+
+@Component({
+  // tslint:disable-next-line
+  selector: '[payroll-result]',
+  templateUrl: 'payroll-result.component.html',
+})
+export class PayrollResultComponent implements OnInit {
+  @Input() public payroll: PayrollData;
+  public payrollDate: string;
+
+  ngOnInit(): void {
+    this.payrollDate = moment(this.payroll.entry_period).format('MMMM YYYY');
+  }
+}

src/app/shared/transaction-result.component.ts

@@ -3,7 +3,7 @@ import * as moment from 'moment';
 
 interface TransactionData {
   seller: number;
-  value: string;
+  value: number;
   purchase_time: string;
 }