#229 Add filters on case links page

TheHive-Project · Jun 6, 2017 · 93da4f1 · 93da4f1
1 parent 33b598c
commit 93da4f1
Show file tree

Hide file tree

Showing 2 changed files with 79 additions and 6 deletions.
diff --git a/ui/app/scripts/controllers/case/CaseLinksCtrl.js b/ui/app/scripts/controllers/case/CaseLinksCtrl.js
@@ -1,11 +1,13 @@
 (function() {
     'use strict';
     angular.module('theHiveControllers').controller('CaseLinksCtrl',
-        function($scope, $state, $stateParams, $uibModal, $timeout, CaseTabsSrv) {
+        function($scope, $state, $stateParams, $uibModal, $timeout, CaseTabsSrv, CaseResolutionStatus) {
             $scope.caseId = $stateParams.caseId;
+            $scope.linkStats = [];
+            $scope.currentFilter = '';
+            $scope.filtering = {}
             var tabName = 'links-' + $scope.caseId;
 
-
             // Add tab
             CaseTabsSrv.addTab(tabName, {
                 name: tabName,
@@ -19,6 +21,54 @@
             $timeout(function() {
                 CaseTabsSrv.activateTab(tabName);
             }, 0);
+
+            $scope.initStats = function(data) {
+                var stats = {
+                    'Open': 0
+                };
+
+                // Init the stats object
+                _.each(_.without(_.keys(CaseResolutionStatus), 'Duplicated'), function(key) {
+                    stats[key] = 0
+                });
+
+                _.each(data, function(item) {
+                    if(item.status === 'Open') {
+                        stats[item.status] = stats[item.status] + 1;
+                    } else {
+                        stats[item.resolutionStatus] = stats[item.resolutionStatus] + 1;
+                    }
+                });
+
+                var result = [];
+                _.each(_.keys(stats), function(key) {
+                    result.push({
+                        key: key,
+                        value: stats[key]
+                    })
+                });
+
+                return result;
+            };
+
+            $scope.filterLinks = function(filter) {
+                $scope.currentFilter = filter;
+                if(filter === '') {
+                    $scope.filtering = {};
+                } else if(filter === 'Open') {
+                    $scope.filtering = {
+                        status: filter
+                    };
+                } else {
+                    $scope.filtering = {
+                        resolutionStatus: filter
+                    };
+                }
+            };
+
+            $scope.$watch('links', function(data){
+                $scope.linkStats = $scope.initStats(data);
+            });
         }
     );
 })();
diff --git a/ui/app/views/partials/case/case.links.html b/ui/app/views/partials/case/case.links.html
@@ -1,11 +1,34 @@
-<div class="case-links" ng-show="links.length > 0">
-    <h4 class="vpad10 text-primary">Related cases ({{links.length}})</h4>
-    <div class="case-item">
+<div class="row" ng-show="links.length === 0">
+    <div class="col-md-12">
+        <div class=" empty-message">No records</div>
+    </div>
+</div>
+
+<div class="case-links" ng-show="links.length > 0" ng-init="filteredLinks = (links | filter:filtering)">
+    <div class="mv-s" ng-if="linkStats">
+        <span class="label label-lg label-default mr-xxs clickable"
+            ng-click="filterLinks('');"
+            ng-class="{'label-primary': currentFilter===''}">All ({{links.length || 0}})</span>
+
+        <span class="label label-lg label-default mr-xxs clickable"
+            ng-repeat="statsItem in linkStats"
+            ng-click="filterLinks(statsItem.key)"
+            ng-class="{'label-primary': currentFilter===statsItem.key}">{{statsItem.key}} ({{statsItem.value}})</span>
+    </div>
+
+    <div class="row" ng-show="filteredLinks.length === 0">
+        <div class="col-md-12">
+            <div class=" empty-message">No records</div>
+        </div>
+    </div>
+
+    <div class="case-item" ng-show="filteredLinks.length !== 0">
         <div class="case-details text-bold">Title</div>
         <div class="case-date text-bold">Date</div>
         <div class="case-observables-list text-bold">Linked observables</div>
     </div>
-    <div class="case-collection" ng-repeat="item in links">
+
+    <div class="case-collection" ng-repeat="item in filteredLinks = (links | filter:filtering)">
         <div class="case-item" >
             <!-- case severity -->
             <div class="case-tlp bg-tlp-{{item.tlp}}"></div>