Skip to content

Commit

Permalink
#1807 #1781 Update case list to include more details, sort and filters
Browse files Browse the repository at this point in the history
  • Loading branch information
@nadouani
nadouani committed Mar 1, 2021
1 parent 7411e64 commit 4907f74
Show file tree
Hide file tree
Showing 5 changed files with 122 additions and 25 deletions.
24 changes: 24 additions & 0 deletions frontend/app/scripts/controllers/case/CaseListCtrl.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -238,12 +238,36 @@
});
};

this.filterByResolutionStatus = function(status) {
this.filtering.clearFilters()
.then(function() {
self.filtering.addFilterValue('resolutionStatus', status);
self.addFilterValue('status', 'Resolved');
});
};

this.sortBy = function(sort) {
this.list.sort = sort;
this.list.update();
this.filtering.setSort(sort);
};

this.sortByField = function(field) {
var context = this.filtering.context;
var currentSort = Array.isArray(context.sort) ? _.without(context.sort, '-flag', '+flag')[0] : context.sort;
var sort = null;

if(currentSort.substr(1) !== field) {
sort = ['-flag', '+' + field];
} else {
sort = ['-flag', (currentSort === '+' + field) ? '-'+field : '+'+field];
}

self.list.sort = sort;
self.list.update();
self.filtering.setSort(sort);
};

this.bulkEdit = function() {
var modal = $uibModal.open({
animation: 'true',
Expand Down
4 changes: 4 additions & 0 deletions frontend/app/styles/case.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -95,3 +95,7 @@ pre.error-trace {
white-space: pre-wrap;
background-color: #f9f1f1;
}

td.case-status {
text-align: center;
}
2 changes: 1 addition & 1 deletion frontend/app/views/directives/task-progress.html
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
<div class="progress task-progress progress-bar-sm">
<div class="progress task-progress progress-bar-sm mt-0">
<div class="progress-bar progress-bar-danger" style="{{waiting}}" uib-tooltip="{{tasks.Waiting}} Waiting"></div>
<div class="progress-bar progress-bar-success" style="{{completed}}" uib-tooltip="{{tasks.Completed}} Completed"></div>
<div class="progress-bar progress-bar-warning" style="{{progress}}" uib-tooltip="{{tasks.InProgress}} In Progress"></div>
Expand Down
6 changes: 0 additions & 6 deletions frontend/app/views/partials/alert/list.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -100,12 +100,6 @@ <h3 class="box-title">List of alerts ({{$vm.list.total || 0}} of {{$vm.alertList
<i ng-show="$vm.filtering.context.sort.indexOf('+_updatedAt') !== -1" class="fa fa-caret-up"></i>
<i ng-show="$vm.filtering.context.sort.indexOf('-_updatedAt') !== -1" class="fa fa-caret-down"></i>
</a>
<!-- <a href class="text-default" ng-click="$vm.sortByField('date')">
Date
<i ng-show="$vm.filtering.context.sort.indexOf('+date') === -1 && $vm.filtering.context.sort.indexOf('-date') === -1" class="fa fa-sort"></i>
<i ng-show="$vm.filtering.context.sort.indexOf('+date') !== -1" class="fa fa-caret-up"></i>
<i ng-show="$vm.filtering.context.sort.indexOf('-date') !== -1" class="fa fa-caret-down"></i>
</a> -->
</th>
<th style="width: 160px"></th>
</tr>
Expand Down
111 changes: 93 additions & 18 deletions frontend/app/views/partials/case/case.list.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -42,14 +42,70 @@ <h3 class="box-title">List of cases ({{$vm.list.total || 0}} of {{$vm.caseCount}
<th width="20px">
<input if-permission="manageCase" type="checkbox" ng-model="$vm.menu.selectAll" ng-change="$vm.selectAll()">
</th>
<th>Title</th>
<th width="100px">
<a href class="text-default ml-xxxs" ng-click="$vm.sortByField('status')" uib-tooltip="Sort by status">
Status
<i ng-show="$vm.filtering.context.sort.indexOf('+status') === -1 && $vm.filtering.context.sort.indexOf('-status') === -1" class="fa fa-sort"></i>
<i ng-show="$vm.filtering.context.sort.indexOf('+status') !== -1" class="fa fa-caret-up"></i>
<i ng-show="$vm.filtering.context.sort.indexOf('-status') !== -1" class="fa fa-caret-down"></i>
</a>
</th>
<th>
<a href class="text-default ml-xxxs" ng-click="$vm.sortByField('number')" uib-tooltip="Sort by number">
# Number
<i ng-show="$vm.filtering.context.sort.indexOf('+number') === -1 && $vm.filtering.context.sort.indexOf('-number') === -1" class="fa fa-sort"></i>
<i ng-show="$vm.filtering.context.sort.indexOf('+number') !== -1" class="fa fa-caret-up"></i>
<i ng-show="$vm.filtering.context.sort.indexOf('-number') !== -1" class="fa fa-caret-down"></i>
</a>
<a href class="text-default ml-xxxs" ng-click="$vm.sortByField('title')" uib-tooltip="Sort by title">
Title
<i ng-show="$vm.filtering.context.sort.indexOf('+title') === -1 && $vm.filtering.context.sort.indexOf('-title') === -1" class="fa fa-sort"></i>
<i ng-show="$vm.filtering.context.sort.indexOf('+title') !== -1" class="fa fa-caret-up"></i>
<i ng-show="$vm.filtering.context.sort.indexOf('-title') !== -1" class="fa fa-caret-down"></i>
</a>
</th>
<th style="width: 70px;"></th>
<th style="width: 80px;text-align:center;">Severity</th>
<th style="width: 100px;">Tasks</th>
<th style="width: 100px;">Observables</th>
<th style="width: 60px;">Assignee</th>
<th style="width: 120px;">Date</th>
<th style="width: 40px;" ng-if="appConfig.connectors.cortex.enabled">Actions</th>
<th style="width: 90px;text-align:center;">
<a href class="text-default ml-xxxs" ng-click="$vm.sortByField('severity')" uib-tooltip="Sort by severity">
Severity
<i ng-show="$vm.filtering.context.sort.indexOf('+severity') === -1 && $vm.filtering.context.sort.indexOf('-severity') === -1" class="fa fa-sort"></i>
<i ng-show="$vm.filtering.context.sort.indexOf('+severity') !== -1" class="fa fa-caret-up"></i>
<i ng-show="$vm.filtering.context.sort.indexOf('-severity') !== -1" class="fa fa-caret-down"></i>
</a>
</th>
<th style="width: 150px;">Details</th>
<!-- <th style="width: 100px;">Observables</th> -->
<th style="width: 90px;">
<a href class="text-default ml-xxxs" ng-click="$vm.sortByField('assignee')" uib-tooltip="Sort by occur start date">
Assignee
<i ng-show="$vm.filtering.context.sort.indexOf('+assignee') === -1 && $vm.filtering.context.sort.indexOf('-assignee') === -1" class="fa fa-sort"></i>
<i ng-show="$vm.filtering.context.sort.indexOf('+assignee') !== -1" class="fa fa-caret-up"></i>
<i ng-show="$vm.filtering.context.sort.indexOf('-assignee') !== -1" class="fa fa-caret-down"></i>
</a>
</th>
<th style="width: 150px">
Dates

<a href class="text-default ml-xxxs" ng-click="$vm.sortByField('startDate')" uib-tooltip="Sort by occur start date">
S.
<i ng-show="$vm.filtering.context.sort.indexOf('+startDate') === -1 && $vm.filtering.context.sort.indexOf('-startDate') === -1" class="fa fa-sort"></i>
<i ng-show="$vm.filtering.context.sort.indexOf('+startDate') !== -1" class="fa fa-caret-up"></i>
<i ng-show="$vm.filtering.context.sort.indexOf('-startDate') !== -1" class="fa fa-caret-down"></i>
</a>
<a href class="text-default ml-xxxs" ng-click="$vm.sortByField('_createdAt')" uib-tooltip="Sort by creation date">
C.
<i ng-show="$vm.filtering.context.sort.indexOf('+_createdAt') === -1 && $vm.filtering.context.sort.indexOf('-_createdAt') === -1" class="fa fa-sort"></i>
<i ng-show="$vm.filtering.context.sort.indexOf('+_createdAt') !== -1" class="fa fa-caret-up"></i>
<i ng-show="$vm.filtering.context.sort.indexOf('-_createdAt') !== -1" class="fa fa-caret-down"></i>
</a>
<a href class="text-default ml-xxxs" ng-click="$vm.sortByField('_updatedAt')" uib-tooltip="Sort by last update date">
U.
<i ng-show="$vm.filtering.context.sort.indexOf('+_updatedAt') === -1 && $vm.filtering.context.sort.indexOf('-_updatedAt') === -1" class="fa fa-sort"></i>
<i ng-show="$vm.filtering.context.sort.indexOf('+_updatedAt') !== -1" class="fa fa-caret-up"></i>
<i ng-show="$vm.filtering.context.sort.indexOf('-_updatedAt') !== -1" class="fa fa-caret-down"></i>
</a>
</th>
<th style="width: 20px;" ng-if="appConfig.connectors.cortex.enabled"></th>
</tr>
</thead>

Expand All @@ -60,6 +116,18 @@ <h3 class="box-title">List of cases ({{$vm.list.total || 0}} of {{$vm.caseCount}
<input if-permission="manageCase" allowed="{{currentCase.extraData.permissions.join(',')}}"
type="checkbox" ng-model="currentCase.selected" ng-change="$vm.select(currentCase)">
</td>
<td class="case-status">
<div class="mb-xxxs">
<span class="label label-default clickable" ng-class="{
'Resolved': 'label-success',
'Open': 'label-danger'
}[currentCase.status]" ng-click="$vm.addFilterValue('status', currentCase.status)">{{currentCase.status === 'Resolved' ? 'Closed' : currentCase.status}}</span>
</div>
<div ng-switch="currentCase.status">
<case-duration ng-switch-when="Resolved" start="currentCase.startDate" end="currentCase.endDate" icon="fa-clock-o"></case-duration>
<case-duration ng-switch-when="Open" start="currentCase.startDate" icon="fa-clock-o"></case-duration>
</div>
</td>
<td>
<div class="case-title wrap">
<span class="mr-xxs text-primary" ng-if="!!!currentCase.extraData.isOwner"><i class="fa fa-share-square"
Expand All @@ -79,7 +147,7 @@ <h3 class="box-title">List of cases ({{$vm.list.total || 0}} of {{$vm.caseCount}

<div class="text-success" ng-show="currentCase.status !== 'Open'">
<small>
(Closed at {{currentCase.endDate | shortDate}} as <strong>{{$vm.CaseResolutionStatus[currentCase.resolutionStatus]}}</strong>)
(Closed at {{currentCase.endDate | shortDate}} as <strong><a href ng-click="$vm.filterByResolutionStatus(currentCase.resolutionStatus)">{{$vm.CaseResolutionStatus[currentCase.resolutionStatus]}}</a></strong>)
</small>
</div>
<div class="text-danger" ng-if="currentCase.mergeFrom">
Expand Down Expand Up @@ -121,23 +189,30 @@ <h3 class="box-title">List of cases ({{$vm.list.total || 0}} of {{$vm.caseCount}
<ng-pluralize count="currentCase.extraData.taskStats.total" when="{'0': 'No Tasks', '1': '1 Task', 'other': '{} Tasks'}"></ng-pluralize>
</a>
</div>
<task-progress ng-show="currentCase.extraData.taskStats.total > 0" tasks="currentCase.extraData.taskStats"/>
<task-progress class="mt-0" ng-show="currentCase.extraData.taskStats.total > 0" tasks="currentCase.extraData.taskStats"></task-progress>

<div>
<a ui-sref="app.case.observables({caseId: currentCase._id})">
<ng-pluralize count="currentCase.extraData.observableStats.total" when="{'0': 'No Observables', '1': '1 Observable', 'other': '{} Observables'}"></ng-pluralize>
</a>
</div>

</td>
<td>
<!-- <td>
<a ui-sref="app.case.observables({caseId: currentCase._id})">{{currentCase.extraData.observableStats.total}}</a>
</td>
</td> -->
<td class="nowrap">
<user user-id="currentCase.assignee" icon-only="true" icon-size="m"></user>
</td>
<td>
<div>
<a href ng-click="$vm.addFilterValue('startDate', currentCase.startDate)">
<span uib-tooltip="{{currentCase.startDate | shortDate}}" tooltip-popup-delay="500" tooltip-placement="bottom">{{currentCase.startDate | shortDate}}</span>
</a>
<div ng-class="{'text-bold': $vm.filtering.context.sort.indexOf('+startDate') !== -1 || $vm.filtering.context.sort.indexOf('-startDate') !== -1}">
S. <a href ng-click="$vm.addFilterValue('startDate', currentCase.startDate)">{{currentCase.startDate | shortDate}}</a>
</div>
<div ng-switch="currentCase.status">
<case-duration ng-switch-when="Resolved" start="currentCase.startDate" end="currentCase.endDate" icon="fa-clock-o"></case-duration>
<case-duration ng-switch-when="Open" start="currentCase.startDate" icon="fa-clock-o"></case-duration>
<div ng-class="{'text-bold': $vm.filtering.context.sort.indexOf('+_createdAt') !== -1 || $vm.filtering.context.sort.indexOf('-_createdAt') !== -1}">
C. <a href ng-click="$vm.addFilterValue('_createdAt', currentCase._createdAt)">{{currentCase._createdAt | shortDate}}</a>
</div>
<div ng-if="currentCase._updatedAt > 0" ng-class="{'text-bold': $vm.filtering.context.sort.indexOf('+_updatedAt') !== -1 || $vm.filtering.context.sort.indexOf('-_updatedAt') !== -1}">
U. <a href ng-click="$vm.addFilterValue('_updatedAt', currentCase._updatedAt)">{{currentCase._updatedAt | shortDate}}</a>
</div>
</td>
<td class="text-center">
Expand Down

0 comments on commit 4907f74

Please sign in to comment.