From a3522bd9025ef96f7e64cb4a8a4990c556806b70 Mon Sep 17 00:00:00 2001
From: Finn <toyou1995@gmail.com>
Date: Fri, 12 Jul 2019 20:47:01 +0100
Subject: [PATCH] Added meta data to transaction list

---
 src/app/dashboard/transaction-log.component.html | 10 ++++++++--
 src/app/dashboard/transaction-log.component.ts   |  4 ++++
 src/app/shared/transaction-result.component.html |  5 ++++-
 src/app/shared/transaction-result.component.ts   |  1 +
 4 files changed, 17 insertions(+), 3 deletions(-)

diff --git a/src/app/dashboard/transaction-log.component.html b/src/app/dashboard/transaction-log.component.html
index 9b07ec1..d7f8aa7 100644
--- a/src/app/dashboard/transaction-log.component.html
+++ b/src/app/dashboard/transaction-log.component.html
@@ -101,18 +101,24 @@
         <div class="card-header">
           <strong>Log of Outgoing Transactions</strong>
           <small>This lists all purchases that have been submitted.</small>
+            <button class="btn pull-right btn-sm" (click)="toggleShowMeta()">
+              <span *ngIf="!showMeta">Show</span><span *ngIf="showMeta">Hide</span> Details
+            </button>
         </div>
         <div *ngIf="!noTransactionList" class="card-block">
           <table class="table table-striped table-hover">
             <thead>
               <tr>
                 <th>Seller</th>
-                <th>Value</th>
+                <th *ngIf="!showMeta">Value</th>
+                <th *ngIf="showMeta">Net Value</th>
+                <th *ngIf="showMeta">Sales Tax Value</th>
+                <th *ngIf="showMeta">Gross Value</th>
                 <th>Purchase Time</th>
               </tr>
             </thead>
             <tbody>
-              <tr transaction-result *ngFor="let transaction of transactionList | paginate: paginateConfig" [transaction]="transaction"></tr>
+              <tr transaction-result *ngFor="let transaction of transactionList | paginate: paginateConfig" [transaction]="transaction" [showMeta]="showMeta"></tr>
             </tbody>
           </table>
           <pagination-template #p="paginationApi"
diff --git a/src/app/dashboard/transaction-log.component.ts b/src/app/dashboard/transaction-log.component.ts
index 0e04ad5..17ae75a 100644
--- a/src/app/dashboard/transaction-log.component.ts
+++ b/src/app/dashboard/transaction-log.component.ts
@@ -29,6 +29,7 @@ export class TransactionLogComponent implements OnInit {
   transactionFormStatusSuccess: string;
   transactionFormStatusError = 'Error received, please try again.';
   updatedTime: string;
+  showMeta = false;
 
   public paginateConfig: PaginationInstance = {
     id: 'transpaginate',
@@ -162,4 +163,7 @@ export class TransactionLogComponent implements OnInit {
     );
   }
 
+  toggleShowMeta() {
+    this.showMeta = !this.showMeta;
+  }
 }
diff --git a/src/app/shared/transaction-result.component.html b/src/app/shared/transaction-result.component.html
index 8218cb7..279ca90 100644
--- a/src/app/shared/transaction-result.component.html
+++ b/src/app/shared/transaction-result.component.html
@@ -1,3 +1,6 @@
 <td>{{transaction.seller}}</td>
-<td>{{transaction.value | currency:'GBP':'symbol':'1.2-2' }}</td>
+<td *ngIf="!showMeta">{{transaction.value | currency:'GBP':'symbol':'1.2-2' }}</td>
+<td *ngIf="showMeta">{{transaction.net_value | currency:'GBP':'symbol':'1.2-2' }}</td>
+<td *ngIf="showMeta">{{transaction.sales_tax_value | currency:'GBP':'symbol':'1.2-2' }}</td>
+<td *ngIf="showMeta">{{transaction.gross_value | currency:'GBP':'symbol':'1.2-2' }}</td>
 <td>{{transactionDate}}</td>
diff --git a/src/app/shared/transaction-result.component.ts b/src/app/shared/transaction-result.component.ts
index a293b72..97b8bd9 100644
--- a/src/app/shared/transaction-result.component.ts
+++ b/src/app/shared/transaction-result.component.ts
@@ -14,6 +14,7 @@ interface TransactionData {
 })
 export class TransactionResultComponent implements OnInit {
   @Input() public transaction: TransactionData;
+  @Input() public showMeta: boolean;
   public transactionDate: string;
 
   ngOnInit(): void {