Bug fixes and enhancement

Tendrl-bug-id: Tendrl#663 Tendrl#728 Tendrl#733
a2batic · Nov 9, 2017 · 245ee41 · 245ee41
1 parent 0b39426
commit 245ee41
Show file tree

Hide file tree

Showing 20 changed files with 279 additions and 69 deletions.
diff --git a/src/api/notification.json → src/api/events.json b/src/api/notification.json → src/api/events.json
diff --git a/src/commons/js/index.js b/src/commons/js/index.js
@@ -72,6 +72,10 @@
                         url: "/cluster-detail/:clusterId/volume-detail/:volumeId",
                         template: "<volume-detail></volume-detail>"
                     })
+                    .state("events", {
+                        url: "/events",
+                        template: "<event-list></event-list>"
+                    })
                     .state("tasks", {
                         url: "/tasks",
                         template: "<tasks></tasks>"

diff --git a/src/commons/scss/main.scss b/src/commons/scss/main.scss
@@ -5,6 +5,7 @@
 @import "../../modules/clusters/cluster-list/cluster-list.scss";
 @import "../../modules/hosts/host-list/host-list.scss";
 @import "../../modules/login/login.scss";
+@import "../../modules/events/event-list/event-list.scss";
 @import "../../modules/tasks/task-list/tasks.scss";
 @import "../../modules/tasks/task-detail/task-detail.scss";
 @import "../../modules/users/user-list/users.scss";

diff --git a/src/commons/services/utils.js b/src/commons/services/utils.js
@@ -230,25 +230,25 @@
             return filteredList;
         };
 
-        vm.getNotificationList = function() {
+        vm.getEventList = function() {
             var url,
-                getNotificationListRequest,
+                getEventListRequest,
                 request;
 
-            //url = "/api/notification.json";
+            //url = "/api/events.json";
             url = config.baseUrl + "notifications";
 
-            getNotificationListRequest = {
+            getEventListRequest = {
                 method: "GET",
                 url: url
             };
 
-            request = angular.copy(getNotificationListRequest);
+            request = angular.copy(getEventListRequest);
             return $http(request).then(function(response) {
                 return response.data;
             }, function(e) {
                 vm.checkErrorCode(e);
-                console.log("Error Occurred: while fetching getNotificationList");
+                console.log("Error Occurred: while fetching getEventList");
                 return null;
             });
         };

diff --git a/src/commons/stores/events-store.js b/src/commons/stores/events-store.js
@@ -50,20 +50,20 @@
             }
         };
 
-        store.getNotificationList = function() {
+        store.getEventList = function() {
             var list,
                 deferred;
 
             deferred = $q.defer();
-            utils.getNotificationList()
+            utils.getEventList()
                 .then(function(data) {
-                    list = data ? _formatNotificationData(data) : [];
+                    list = data ? _formatEventData(data) : [];
                     deferred.resolve(list);
                 });
 
             return deferred.promise;
 
-            function _formatNotificationData(data) {
+            function _formatEventData(data) {
                 var len = data.length,
                     res = [],
                     temp = {},

diff --git a/src/commons/stores/node-store.js b/src/commons/stores/node-store.js
@@ -71,8 +71,11 @@
                         store.nodeList = list;
                     }
                     deferred.resolve(list);
+                }).catch(function(e) {
+                    deferred.reject(e);
                 });
 
+
             return deferred.promise;
 
             function _formatHostData(list) {

diff --git a/src/modules/base/navigation/menu-svc.js b/src/modules/base/navigation/menu-svc.js
@@ -14,6 +14,7 @@
 
         vm.setMenus = function() {
             vm.menus = [{
+
                     label: "Clusters",
                     id: "clusters",
                     href: "clusters",
@@ -40,6 +41,14 @@
                 //     show: true
                 // }, 
                 {
+                    label: "Events",
+                    id: "events",
+                    href: "events",
+                    icon: "fa fa-cog",
+                    active: false,
+                    hasSubMenus: false,
+                    show: true
+                }, {
                     label: "Tasks",
                     id: "tasks",
                     href: "tasks",

diff --git a/src/modules/clusters/cluster-detail/cluster-detail.js b/src/modules/clusters/cluster-detail/cluster-detail.js
@@ -109,17 +109,19 @@
             vm.clusterObj = clusterStore.getClusterDetails(vm.clusterId);
             vm.clusterName = vm.clusterObj.cluster_id || "NA";
             vm.clusterStatus = clusterStore.checkStatus(vm.clusterObj);
+            _selectCluster();
         }
 
         $scope.$on("GotClusterData", function(event, data) {
-            var clusterData,
-                len,
+            _selectCluster();
+        });
+
+        function _selectCluster() {
+            var clusterData = $rootScope.clusterData,
+                len = clusterData.length,
                 i;
 
             if ($rootScope.clusterData !== null && typeof vm.clusterId !== "undefined") {
-                clusterData = $rootScope.clusterData;
-                len = clusterData.length;
-
                 for (i = 0; i < len; i++) {
 
                     if (clusterData[i].cluster_id === vm.clusterId) {
@@ -128,7 +130,7 @@
                     }
                 }
             }
-        });
+        }
 
     }
 

diff --git a/src/modules/clusters/cluster-list/cluster-list.js b/src/modules/clusters/cluster-list/cluster-list.js
@@ -36,8 +36,8 @@
         vm.filterByValue = "Name";
         vm.filterPlaceholder = "Name";
 
-        vm.changingOrderBy = changingOrderBy;
         vm.changingFilterBy = changingFilterBy;
+        vm.changingOrderBy = changingOrderBy;
         vm.expandCluster = expandCluster;
         vm.closeExpandedView = closeExpandedView;
         vm.goToImportFlow = goToImportFlow;

diff --git a/src/modules/clusters/import-cluster/import-cluster.html b/src/modules/clusters/import-cluster/import-cluster.html
@@ -12,7 +12,8 @@ <h3 class="col-sm-12">Import <span class="bold-text">{{vm.cluster.name}}</span>
             </div>
             <div class="row">
                 <div class="col-sm-12 volume-profile">
-                    <input type="checkbox" name="volumeProfile" ng-model="vm.enableProfiling"/><label for="volumeProfile"> Enable Volume profiling  </label><i class="pficon pficon-info" uib-tooltip-template="'../modules/clusters/import-cluster/import-cluster-tooltip.html'" tooltip-placement="bottom-left"></i>
+                    <input type="checkbox" name="volumeProfile" ng-model="vm.enableProfiling" />
+                    <label for="volumeProfile"> Enable Volume profiling </label><i class="pficon pficon-info" uib-tooltip-template="'../modules/clusters/import-cluster/import-cluster-tooltip.html'" tooltip-placement="bottom-left"></i>
                 </div>
             </div>
             <h2>Discovered Host(s)</h2>
@@ -23,87 +24,88 @@ <h2>Discovered Host(s)</h2>
                             <label class="sr-only" for="filter">Name</label>
                             <div class="input-group">
                                 <div class="input-group-btn">
-                                    <select ng-disabled="!vm.hostList.length" ng-model="vm.filterBy" class="btn btn-default dropdown-toggle filterSelect" ng-change="vm.searchBy = {}">
-                                        <option value="fqdn">Name</option>
-                                        <option value="role">Role</option>
-                                    </select>
+                                    <button ng-disabled="!vm.hostList.length" type="button" class="btn btn-default dropdown-toggle filterSelect" ng-model="vm.filterBy" " ng-change="vm.searchBy={ } " data-toggle="dropdown " aria-haspopup="true " aria-expanded="false ">{{vm.filterByValue}} <span class="caret "></span></button>
+                                <ul class="dropdown-menu ">
+                                    <li ng-class="{ 'selected':(vm.filterBy==='fqdn' )} "><a href=" " ng-click="vm.changingFilterBy( 'fqdn') ">Name</a></li>
+                                    <li ng-class="{ 'selected':(vm.filterBy==='role' )} "><a href=" " ng-click="vm.changingFilterBy( 'role') ">Role</a></li>
+                                </ul>
                                 </div>
                                 <!-- /btn-group -->
-                                <input type="text" class="form-control" id="filter" ng-model="vm.searchBy[vm.filterBy]" placeholder="Filter by {{vm.filterBy | capitalize}}">
+                                <input type="text " class="form-control " id="filter " ng-model="vm.searchBy[vm.filterBy] " placeholder="Filter by {{vm.filterPlaceholder}} ">
                             </div>
                             <!-- /input-group -->
                         </div>
-                        <div class="form-group">
-                            <div class="dropdown btn-group">
-                                <select ng-disabled="vm.hostList.length === 0" ng-model="vm.orderBy" class="btn btn-default dropdown-toggle filterSelect">
-                                    <option value="fqdn">Name</option>
-                                    <option value="role">Role</option>
-                                </select>
+                        <div class="form-group ">
+                            <div class="dropdown btn-group ">
+                            <button type="button " ng-disabled="vm.hostList.length===0 " class="btn btn-default dropdown-toggle filterSelect " ng-model="vm.orderBy " data-toggle="dropdown " aria-haspopup="true " aria-expanded="false ">{{vm.orderByValue}} <span class="caret "></span></button>
+                            <ul class="dropdown-menu ">
+                                <li ng-class="{ 'selected':(vm.orderBy==='fqdn' )} "><a href=" " ng-click="vm.changingOrderBy( 'fqdn') ">Name</a></li>
+                                <li ng-class="{ 'selected':(vm.orderBy==='role' )} "><a href=" " ng-click="vm.changingOrderBy( 'role') ">Role</a></li>
+                            </ul>
                             </div>
-                            <button ng-init="vm.ascOrder = ''" ng-disabled="vm.hostList.length === 0" class="btn btn-link" type="button">
-                                <span ng-if="vm.ascOrder !== ''" class="fa fa-sort-alpha-desc" ng-click="vm.ascOrder = ''"></span>
-                                <span ng-if="vm.ascOrder !== '-'" class="fa fa-sort-alpha-asc" ng-click="vm.ascOrder = '-'"></span>
+                            <button ng-init="vm.ascOrder='' " ng-disabled="vm.hostList.length===0 " class="btn btn-link " type="button ">
+                                <span ng-if="vm.ascOrder !=='' " class="fa fa-sort-alpha-desc " ng-click="vm.ascOrder='' "></span>
+                                <span ng-if="vm.ascOrder !=='-' " class="fa fa-sort-alpha-asc " ng-click="vm.ascOrder='-' "></span>
                         </div>
                     </form>
                     <!-- /row -->
                 </div>
                 <!-- /col -->
             </div>
-            <div class="row" ng-show="vm.hostList.length">
-                <h3 class="col-sm-12">{{vm.hostList.length}} 
-                    <ng-pluralize count="vm.hostList.length" when="{'one': 'Host',
-                       'other': 'Hosts'}"></ng-pluralize> 
+            <div class="row " ng-show="vm.hostList.length ">
+                <h3 class="col-sm-12 ">{{vm.hostList.length}} 
+                    <ng-pluralize count="vm.hostList.length " when="{ 'one': 'Host', 'other': 'Hosts'} "></ng-pluralize> 
                 Discovered</h3>
             </div>
-            <center ng-show="vm.hostList.length === 0">
-                <div class="blank-slate-pf">
-                    <div class="blank-slate-pf-icon">
-                        <i class="pficon pficon-cluster"></i>
+            <center ng-show="vm.hostList.length===0 ">
+                <div class="blank-slate-pf ">
+                    <div class="blank-slate-pf-icon ">
+                        <i class="pficon pficon-cluster "></i>
                     </div>
                     <h1>No Hosts Detected.</h1>
                 </div>
             </center>
-            <div class="flex-table list-group list-view-pf list-view-pf-view">
-                <div class="ft-row list-group-item ft-header">
-                    <div class="ft-column">Host</div>
-                    <div class="ft-column">Cluster Version</div>
-                    <div class="ft-column">Role</div>
+            <div class="flex-table list-group list-view-pf list-view-pf-view ">
+                <div class="ft-row list-group-item ft-header ">
+                    <div class="ft-column ">Host</div>
+                    <div class="ft-column ">Cluster Version</div>
+                    <div class="ft-column ">Role</div>
                 </div>
-                <div class="ft-row list-group-item" ng-repeat="host in vm.filteredHostList = (vm.hostList | filter: vm.searchBy | orderBy: vm.ascOrder + vm.orderBy) track by $index">
-                    <div class="ft-column host-name bold-text" uib-tooltip-html="'{{host.fqdn}}'" tooltip-placement="auto bottom-left">
+                <div class="ft-row list-group-item " ng-repeat="host in vm.filteredHostList=( vm.hostList | filter: vm.searchBy | orderBy: vm.ascOrder + vm.orderBy) track by $index ">
+                    <div class="ft-column host-name bold-text " uib-tooltip-html=" '{{host.fqdn}}' " tooltip-placement="auto bottom-left ">
                         {{host.fqdn}}
                     </div>
-                    <div class="ft-column">
+                    <div class="ft-column ">
                         {{host.release}}
                     </div>
-                    <div class="ft-column">
+                    <div class="ft-column ">
                         {{host.role}}
                     </div>
                 </div>
             </div>
-            <div class="row action-button">
-                <div class="col-sm-8 col-md-6">
-                    <button class="btn btn-primary btn-lg" ng-click="vm.importCluster()" ng-disabled="vm.importIcon">
-                        <i class="glyphicon glyphicon-refresh glyphicon-refresh-animate" data-ng-class="{'hidden': vm.importIcon !== true }">
+            <div class="row action-button ">
+                <div class="col-sm-8 col-md-6 ">
+                    <button class="btn btn-primary btn-lg " ng-click="vm.importCluster() " ng-disabled="vm.importIcon ">
+                        <i class="glyphicon glyphicon-refresh glyphicon-refresh-animate " data-ng-class="{ 'hidden': vm.importIcon !==true } ">
                         </i>
                         <span>Import</span>
                     </button>
-                    <button class="btn btn-default btn-lg cancel-button" ng-click="vm.importCancel()">Cancel</button>
+                    <button class="btn btn-default btn-lg cancel-button " ng-click="vm.importCancel() ">Cancel</button>
                 </div>
             </div>
         </div>
     </div>
-    <div ng-show="vm.taskInitiated" class="blank-slate-pf centered">
-        <div class="blank-slate-pf-icon">
-            <i class="pficon pficon-ok"></i>
+    <div ng-show="vm.taskInitiated " class="blank-slate-pf centered ">
+        <div class="blank-slate-pf-icon ">
+            <i class="pficon pficon-ok "></i>
         </div>
         <div>
             <h1><label>Import Cluster Task Submitted</label></h1>
             <small> An import cluster task has been submitted. You will be notified when processing is complete and the cluster is ready for use. </small>
         </div>
-        <div class="blank-slate-pf-main-action">
-            <button class="btn btn-default btn-lg" ng-click="vm.importCancel()">Close</button>
-            <button class="btn btn-primary btn-lg cancel-button" ng-click="vm.viewTaskProgress()">View Task Progress</button>
+        <div class="blank-slate-pf-main-action ">
+            <button class="btn btn-default btn-lg " ng-click="vm.importCancel() ">Close</button>
+            <button class="btn btn-primary btn-lg cancel-button " ng-click="vm.viewTaskProgress() ">View Task Progress</button>
         </div>
     </div>
 </div>
diff --git a/src/modules/clusters/import-cluster/import-cluster.js b/src/modules/clusters/import-cluster/import-cluster.js
@@ -22,12 +22,17 @@
 
         vm.filterBy = "fqdn";
         vm.orderBy = "fqdn";
+        vm.orderByValue = "Name";
+        vm.filterByValue = "Name";
+        vm.filterPlaceholder = "Name";
         vm.enableProfiling = true;
         vm.taskInitiated = false;
         vm.importIcon = false;
         vm.importCluster = importCluster;
         vm.importCancel = importCancel;
         vm.viewTaskProgress = viewTaskProgress;
+        vm.changingFilterBy = changingFilterBy;
+        vm.changingOrderBy = changingOrderBy;
 
         init();
 
@@ -76,6 +81,34 @@
             $state.go("task-detail", { taskId: vm.jobId });
         }
 
+        function changingFilterBy(filterValue) {
+            vm.filterBy = filterValue;
+            switch (filterValue) {
+                case "fqdn":
+                    vm.filterByValue = "Name";
+                    vm.filterPlaceholder = "Name";
+                    break;
+
+                case "role":
+                    vm.filterByValue = "Role";
+                    vm.filterPlaceholder = "Role";
+                    break;
+
+            };
+        }
+
+        function changingOrderBy(orderValue) {
+            vm.orderBy = orderValue;
+            switch (orderValue) {
+                case "fqdn":
+                    vm.orderByValue = "Name";
+                    break;
+                case "role":
+                    vm.orderByValue = "Role";
+                    break;
+            };
+        }
+
     }
 
 })();
diff --git a/src/modules/events/event-list/event-list.html b/src/modules/events/event-list/event-list.html
@@ -0,0 +1,41 @@
+<div ng-if="clusterData === null && !isAPINotFoundError" class="spinner spinner-lg"></div>
+<div ng-if="clusterData !== null" class="tendrl-event-list-view-container container-fluid">
+    <h1 class="bold-text">Events</h1>
+    <div class="row toolbar-pf">
+        <div class="col-sm-12">
+            <div class="row">
+                <div class="col-md-12 horizontal-line"></div>
+            </div>
+            <div class="row toolbar-pf-results">
+                <div class="col-sm-12">
+                    <h5>{{eventListCntrl.filteredEventList.length}} 
+                        <ng-pluralize count="eventListCntrl.filteredEventList.length" when="{'one': 'Event',
+                       'other': 'Events'}"></ng-pluralize>
+                    </h5>
+                </div>
+            </div>
+        </div>
+    </div>
+    <center ng-if="eventListCntrl.eventList.length === 0">
+        <div class="blank-slate-pf">
+            <div class="blank-slate-pf-icon">
+                <i class="pficon pficon-cluster"></i>
+            </div>
+            <h1>No Events Detected.</h1>
+        </div>
+    </center>
+    <div ng-if="eventListCntrl.isDataLoading" class="spinner spinner-lg"></div>
+    <div class="flex-table list-group list-view-pf list-view-pf-view event-list-table" ng-show="!eventListCntrl.isDataLoading && eventListCntrl.eventList.length !== 0">
+        <div class="ft-row list-group-item " ng-repeat="event in eventListCntrl.filteredEventList = (eventListCntrl.eventList | orderBy: ['-timeStamp'])">
+            <div class="ft-column">
+                <div class="event-desc" uib-tooltip="{{ event.message }}" tooltip-placement="auto">{{event.message || "NA"}}</div>
+            </div>
+            <div class="ft-column">
+                <p>{{event.timeStamp| date: 'dd MMM yyyy HH:mm:ss'}}</p>
+            </div>
+        </div>
+    </div>
+    <div class="row" ng-show="eventListCntrl.eventList.length !== 0">
+        <div class="col-md-12 horizontal-line"></div>
+    </div>
+</div>