From 682cebef538c57f7a241898a815ab6616029985c Mon Sep 17 00:00:00 2001
From: Finn <toyou1995@gmail.com>
Date: Fri, 12 Jul 2019 20:05:06 +0100
Subject: [PATCH] Amended supplier list

---
 src/app/dashboard/suppliers.component.html | 15 ++++++++++++---
 src/app/dashboard/suppliers.component.ts   | 15 ++++++++++++++-
 src/app/providers/api-service.ts           |  6 ++++--
 3 files changed, 30 insertions(+), 6 deletions(-)

diff --git a/src/app/dashboard/suppliers.component.html b/src/app/dashboard/suppliers.component.html
index ab8b3f6..9c442b7 100644
--- a/src/app/dashboard/suppliers.component.html
+++ b/src/app/dashboard/suppliers.component.html
@@ -4,9 +4,18 @@
     <table class="table table-striped table-hover">
       <thead>
         <tr>
-          <th>Name</th>
-          <th>Postcode</th>
-          <th>Spend</th>
+          <th (click)="sortName()">Name <span class="fa-stack">
+            <i *ngIf="sortBy !== 'name' || sortDir == 'asc'" class="fa fa-sort-up fa-stack-1x"></i>
+            <i *ngIf="sortBy !== 'name' || sortDir == 'desc'" class="fa fa-sort-down fa-stack-1x"></i>
+          </span></th>
+          <th (click)="sortPostcode()">Postcode <span class="fa-stack">
+            <i *ngIf="sortBy !== 'postcode' || sortDir == 'asc'" class="fa fa-sort-up fa-stack-1x"></i>
+            <i *ngIf="sortBy !== 'postcode' || sortDir == 'desc'" class="fa fa-sort-down fa-stack-1x"></i>
+          </span></th>
+          <th (click)="sortSpend()">Spend <span class="fa-stack">
+            <i *ngIf="sortBy !== 'spend' || sortDir == 'asc'" class="fa fa-sort-up fa-stack-1x"></i>
+            <i *ngIf="sortBy !== 'spend' || sortDir == 'desc'" class="fa fa-sort-down fa-stack-1x"></i>
+          </span></th>
         </tr>
       </thead>
       <tbody>
diff --git a/src/app/dashboard/suppliers.component.ts b/src/app/dashboard/suppliers.component.ts
index 4885cb5..170f674 100644
--- a/src/app/dashboard/suppliers.component.ts
+++ b/src/app/dashboard/suppliers.component.ts
@@ -18,6 +18,8 @@ export class SuppliersComponent implements OnInit, AfterViewInit {
 
   supplierList: any;
   supplierListAvailable = false;
+  sortBy = 'name';
+  sortDir = 'asc';
 
   public paginateConfig: PaginationInstance = {
     id: 'transpaginate',
@@ -39,7 +41,7 @@ export class SuppliersComponent implements OnInit, AfterViewInit {
   }
 
   loadSuppliers(logPage: number) {
-    this.api.externalSuppliers(logPage).subscribe(
+    this.api.externalSuppliers(logPage, this.sortBy, this.sortDir).subscribe(
       result => {
         this.supplierList = result.suppliers;
         this.paginateConfig.totalItems = result.page_no;
@@ -53,6 +55,17 @@ export class SuppliersComponent implements OnInit, AfterViewInit {
     );
   }
 
+
+  sortName() { this.sortByColumn('name'); }
+  sortPostcode() { this.sortByColumn('postcode'); }
+  sortSpend() { this.sortByColumn('spend'); }
+  
+  sortByColumn(name) {
+      this.sortBy = name;
+      this.sortDir = this.sortDir === 'asc' ? 'desc' : 'asc';
+      this.loadSuppliers(1);
+  }
+
   ngAfterViewInit() {
   }
 
diff --git a/src/app/providers/api-service.ts b/src/app/providers/api-service.ts
index 7d3f00e..b09bcfd 100644
--- a/src/app/providers/api-service.ts
+++ b/src/app/providers/api-service.ts
@@ -144,13 +144,15 @@ export class ApiService {
     );
   }
 
-  public externalSuppliers(data) {
+  public externalSuppliers(data, sortBy, sortDir) {
     const key = this.sessionKey;
     return this.http.post<any>(
       this.apiUrl + '/v1/organisation/external/suppliers',
       {
         session_key : key,
-        page : data
+        page : data,
+        sort_by : sortBy,
+        sort_dir : sortDir
       }
     );
   }