From 0456189f44c87b51ee3a07a0e7af7507ee1eee6b Mon Sep 17 00:00:00 2001
From: thuva4 <tharma.thuva@gmail.com>
Date: Mon, 26 Feb 2018 09:20:56 +0530
Subject: Add sorting in pods page

Show the results in sorted order
Provide options to sort the results by name,
role, mode

Change-Id: I8b514769e9b878a0ff4bafcae8e909af3284f7ca
Signed-off-by: thuva4 <tharma.thuva@gmail.com>
---
 testapi/opnfv_testapi/ui/components/pods/pods.html | 27 +++++++++++++++++---
 .../ui/components/pods/podsController.js           | 29 ++++++++++++++++++++++
 2 files changed, 53 insertions(+), 3 deletions(-)

(limited to 'testapi/opnfv_testapi/ui/components/pods')

diff --git a/testapi/opnfv_testapi/ui/components/pods/pods.html b/testapi/opnfv_testapi/ui/components/pods/pods.html
index 4fa8fb1..7873977 100644
--- a/testapi/opnfv_testapi/ui/components/pods/pods.html
+++ b/testapi/opnfv_testapi/ui/components/pods/pods.html
@@ -42,9 +42,30 @@
         <tr style="
         text-align: center;">
             <th style="width:1%">Bulk Select</th>
-            <th>Name</th>
-            <th>Role</th>
-            <th>Mode</th>
+            <th>Name
+                <a class="text-danger"  ng-click="ctrl.sortBy('name')" ng-class="{ 'hidden': !ctrl.sorting['name'] }" >
+                    <span class="glyphicon glyphicon-sort-by-alphabet pull-right" aria-hidden="true"></span>
+                </a>
+                <a class="text-danger"  ng-click="ctrl.sortBy('name')" ng-class="{ 'hidden': ctrl.sorting['name'] }" >
+                    <span class="glyphicon glyphicon-sort-by-alphabet-alt pull-right" aria-hidden="true"></span>
+                </a>
+            </th>
+            <th>Role
+                <a class="text-danger"  ng-click="ctrl.sortBy('role')" ng-class="{ 'hidden': !ctrl.sorting['role']}" >
+                    <span class="glyphicon glyphicon-sort-by-alphabet pull-right" aria-hidden="true"></span>
+                </a>
+                <a class="text-danger"  ng-click="ctrl.sortBy('role')" ng-class="{ 'hidden': ctrl.sorting['role']}" >
+                    <span class="glyphicon glyphicon-sort-by-alphabet-alt pull-right" aria-hidden="true"></span>
+                </a>
+            </th>
+            <th>Mode
+                <a class="text-danger"  ng-click="ctrl.sortBy('mode')" ng-class="{ 'hidden': !ctrl.sorting['mode'] }" >
+                    <span class="glyphicon glyphicon-sort-by-alphabet pull-right" aria-hidden="true"></span>
+                </a>
+                <a class="text-danger"  ng-click="ctrl.sortBy('mode')" ng-class="{ 'hidden': ctrl.sorting['mode'] }" >
+                    <span class="glyphicon glyphicon-sort-by-alphabet-alt pull-right" aria-hidden="true"></span>
+                </a>
+            </th>
             <th ng-class="{ 'hidden': !auth.isAuthenticated }">Operation</th>
         </tr>
         </thead>
diff --git a/testapi/opnfv_testapi/ui/components/pods/podsController.js b/testapi/opnfv_testapi/ui/components/pods/podsController.js
index 95e3571..180e0ed 100644
--- a/testapi/opnfv_testapi/ui/components/pods/podsController.js
+++ b/testapi/opnfv_testapi/ui/components/pods/podsController.js
@@ -35,6 +35,7 @@
         ctrl.url = testapiApiUrl + '/pods';
         ctrl.checkBox = []
         ctrl.checkBoxList = [];
+        ctrl.sorting = {};
 
         ctrl.create = create;
         ctrl.listPods = listPods;
@@ -47,6 +48,33 @@
         ctrl.batchDelete = batchDelete;
         ctrl.viewPod = viewPod
         ctrl.filterText = ''
+        ctrl.sortBy = sortBy
+
+        function sortBy(field){
+            if(ctrl.sorting[field]){
+                ctrl.data.pods.sort(function(a,b) {
+                    if (a[field].toLowerCase() > b[field].toLowerCase()) {
+                        return -1;
+                    }
+                    if (a[field].toLowerCase() < b[field].toLowerCase()) {
+                        return 1;
+                    }
+                    return 0;
+                });
+                ctrl.sorting[field] = false
+            }else{
+                ctrl.data.pods.sort(function(a,b) {
+                    if (a[field].toLowerCase() < b[field].toLowerCase()) {
+                        return -1;
+                    }
+                    if (a[field].toLowerCase() > b[field].toLowerCase()) {
+                        return 1;
+                    }
+                        return 0;
+                });
+                ctrl.sorting[field] = true
+            }
+        }
 
         /**
          * This is called when the date filter calendar is opened. It
@@ -105,6 +133,7 @@
             ctrl.podsRequest =
                 $http.get(reqURL).success(function (data) {
                     ctrl.data = data;
+                    ctrl.sortBy("name")
                 }).catch(function (data) {
                     ctrl.data = null;
                     ctrl.showError = true;
-- 
cgit 1.2.3-korg