#128 Add Sort and Page size components to task logs losts

TheHive-Project · Apr 4, 2017 · d6b345a · d6b345a
1 parent 5b0e5ec
commit d6b345a
Show file tree

Hide file tree

Showing 8 changed files with 64 additions and 31 deletions.
diff --git a/ui/app/scripts/controllers/case/CaseTasksItemCtrl.js b/ui/app/scripts/controllers/case/CaseTasksItemCtrl.js
@@ -13,12 +13,17 @@
             $scope.newLog = {
                 message: ''
             };
+            $scope.sortOptions = {
+                '+startDate': 'Oldest first',
+                '-startDate': 'Newest first'
+            };
             $scope.state = {
                 editing: false,
                 isCollapsed: false,
                 dropdownOpen: false,
                 attachmentCollapsed: true,
-                logMissing: ''
+                logMissing: '',
+                sort: '-startDate'
             };
 
             $scope.markdownEditorOptions = {
@@ -45,7 +50,8 @@
                             }
                         }]
                     },
-                    'sort': '-startDate'
+                    'sort': $scope.state.sort,
+                    'pageSize': 10
                 });
             };
 
@@ -118,6 +124,12 @@
                 return true;
             };
 
+            $scope.sortBy = function(sort) {
+                $scope.state.sort = sort;
+                $scope.logs.sort = sort;
+                $scope.logs.update();
+            };
+
             // Add tabs
             CaseTabsSrv.addTab($scope.tabName, {
                 name: $scope.tabName,

diff --git a/ui/app/views/directives/log-entry.html b/ui/app/views/directives/log-entry.html
@@ -1,19 +1,17 @@
 <hr/>
 
 <div class="log-entry">
-    <div class="row">
-        <div class="col-md-12">
-            <h5>
-                <i class="text-primary glyphicon glyphicon-comment" style="font-size: 16px;"></i>
-                <span ng-bind="getUserInfo.get(log.user) | getField: 'name'"></span>
-                &nbsp;
-                <small ng-bind="log.startDate | showDate"></small>
-                <span class="pull-right">
-                    <a href ng-click="dropLog()" uib-tooltip="Delete log">
-                        <i class="text-danger glyphicon glyphicon-remove-circle"></i>
-                    </a>
-                </span>
-            </h5>
+    <div class="row mb-xxs">
+        <div class="col-md-6">
+            <user user-id="log.user" icon-size="xs"></user>
+        </div>
+        <div class="col-md-6">
+            <span class="pull-right">
+                <a href ng-click="dropLog()" uib-tooltip="Delete log">
+                    <i class="text-danger glyphicon glyphicon-remove-circle"></i>
+                </a>
+            </span>
+            <span class="text-muted mr-xs pull-right" ng-bind="log.startDate | showDate"></span>
         </div>
     </div>
 

diff --git a/ui/app/views/partials/case/case.details.html b/ui/app/views/partials/case/case.details.html
@@ -1,4 +1,3 @@
-<br>
 <div class="row">
     <div class="col-md-7">
         <h4 class="vpad10 text-primary">Basic information</h4>

diff --git a/ui/app/views/partials/case/case.observables.html b/ui/app/views/partials/case/case.observables.html
@@ -1,5 +1,3 @@
-<br/>
-
 <div class="row">
     <div class="col-md-12">
         <div class="btn-toolbar" role="toolbar">

diff --git a/ui/app/views/partials/case/case.observables.item.html b/ui/app/views/partials/case/case.observables.item.html
@@ -1,4 +1,3 @@
-<br/>
 <div class="row">
     <!-- Observable details header-->
     <div class="col-md-11 col-md-offset-1" ng-show="artifact.data != undefined">

diff --git a/ui/app/views/partials/case/case.tasks.html b/ui/app/views/partials/case/case.tasks.html
@@ -1,5 +1,3 @@
-<br>
-
 <div class="row">
     <div class="col-md-12">
         <div class="btn-toolbar" role="toolbar">

diff --git a/ui/app/views/partials/case/case.tasks.item.html b/ui/app/views/partials/case/case.tasks.item.html
@@ -1,5 +1,3 @@
-<br/>
-<!-- <task-details case-id="{{caze.id}}" task="task"></task-details> -->
 <div class="row">
     <div class="col-md-5">
         <h4 align="left">
@@ -75,9 +73,29 @@ <h4 align="left">
     <div class="col-md-7">
         <div class="row clearfix" ng-show="!adding">
             <div class="col-md-12">
-                <button class="btn btn-primary pull-right" ng-click="showLogEditor()">
-                    <i class="fa fa-plus"></i>
-                    Add new task log</button>
+                <div class="btn-toolbar" role="toolbar">
+                    <div class="btn-group" uib-dropdown>
+                        <button class="btn btn-sm btn-primary" ng-click="showLogEditor()">
+                            <i class="fa fa-plus"></i>
+                            Add new task log</button>
+                    </div>
+                    <div class="btn-group" uib-dropdown>
+                        <button class="btn btn-default btn-sm dropdown-toggle" uib-dropdown-toggle type="button">
+                            <i class="fa fa-sort"></i>
+                            Sort by: {{sortOptions[state.sort]}}
+                            <span class="caret"></span>
+                        </button>
+                        <ul class="dropdown-menu" uib-dropdown-menu>
+                            <li ng-repeat="(key, value) in sortOptions">
+                                <a ng-click="sortBy(key)">{{value}}</a>
+                            </li>
+                        </ul>
+                    </div>
+                    <div class="btn-group pull-right" role="group">
+                        <page-sizer collection="logs" sizes="[10, 15, 30, 100]"></page-sizer>
+                    </div>
+                </div>
+
             </div>
         </div>
         <div class="row" ng-show="adding">
@@ -88,12 +106,12 @@ <h4 align="left">
                 <textarea name="newLog" autofocus="beforeNewLogShow" class="content-box" markdown-editor="markdownEditorOptions" rows="10" ng-model="newLog.message"></textarea>
                 <div control="state" file-chooser="" filemodel="newLog.attachment" ng-show="!state.attachmentCollapsed" preview="false"></div>
                 <div class="btn-toolbar mt-xxs">
-                    <button class="btn btn-default" ng-click="cancelAddLog();" ng-disabled="loading">Cancel</button>
-                    <button class="pull-right btn btn-primary" ng-click="addLog();" ng-disabled="loading || newLog.message.length === 0">
+                    <button class="btn btn-sm btn-default" ng-click="cancelAddLog();" ng-disabled="loading">Cancel</button>
+                    <button class="btn btn-sm btn-primary pull-right" ng-click="addLog();" ng-disabled="loading || newLog.message.length === 0">
                         <i class="glyphicon glyphicon-comment"></i>
                         Add log
                     </button>
-                    <button uib-btn-checkbox btn-checkbox-false="true" btn-checkbox-true="false" class="pull-right btn btn-default" ng-model="state.attachmentCollapsed" ng-disabled="loading">
+                    <button uib-btn-checkbox btn-checkbox-false="true" btn-checkbox-true="false" class="btn btn-sm btn-default pull-right" ng-model="state.attachmentCollapsed" ng-disabled="loading">
                         <i class="text-default glyphicon glyphicon-paperclip"></i>
                         {{state.attachmentCollapsed ? 'Add' : 'Discard'}}
                         attachment
@@ -103,6 +121,12 @@ <h4 align="left">
         </div>
 
         <!-- Log list -->
+        <div class="row mv-s" ng-show="logs.total === 0">
+            <div class="col-md-12">
+                <div class="empty-message">No records</div>
+            </div>
+        </div>
+
         <psearch control="logs"></psearch>
         <div ng-repeat="log in logs.values">
             <log-entry log="log"></log-entry>

diff --git a/ui/app/views/partials/observables/list/artifacts-list-main.html b/ui/app/views/partials/observables/list/artifacts-list-main.html
@@ -23,10 +23,15 @@ <h4>List of observables ({{artifacts.total || 0}} of {{artifactStats.count}})</h
     </div>
 </div>
 
+
+<div class="col-md-12 mv-s" ng-show="artifacts.total === 0">
+    <div class="empty-message">No records.</div>
+</div>
+
 <!-- list of artifacts-->
-<div class="col-md-12">
+<div class="col-md-12" ng-show="artifacts.total > 0">
     <psearch ng-if="!switchTEList" control="artifacts"></psearch>
-    
+
     <table class="table table-striped table-hover valigned">
         <thead>
             <tr>