Skip to content

Commit

Permalink
#1831 Add bulk actions and update list view in task list
Browse files Browse the repository at this point in the history
  • Loading branch information
@nadouani
nadouani committed Mar 12, 2021
1 parent 3332ea9 commit 7de1f61
Show file tree
Hide file tree
Showing 7 changed files with 132 additions and 65 deletions.
1 change: 1 addition & 0 deletions frontend/app/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -142,6 +142,7 @@
<script src="scripts/components/common/custom-field-labels.component.js"></script>
<script src="scripts/components/common/observable-flags.component.js"></script>
<script src="scripts/components/common/tag.component.js"></script>
<script src="scripts/components/common/task-flags.component.js"></script>
<script src="scripts/components/control-sidebar.component.js"></script>
<script src="scripts/components/header.component.js"></script>
<script src="scripts/components/list/stats-item.component.js"></script>
Expand Down
22 changes: 22 additions & 0 deletions frontend/app/scripts/components/common/task-flags.component.js
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,22 @@
(function() {
'use strict';

angular.module('theHiveComponents')
.component('taskFlags', {
controller: function() {
this.filterBy = function(fieldName, newValue) {
this.onFilter({
fieldName: fieldName,
value: newValue
});
};
},
controllerAs: '$ctrl',
templateUrl: 'views/components/common/task-flags.component.html',
bindings: {
task: '<',
inline: '<',
onFilter: '&'
}
});
})();
32 changes: 27 additions & 5 deletions frontend/app/scripts/controllers/case/CaseTasksCtrl.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -98,6 +98,18 @@
$scope.menu.unflag = temp.length === 1 && temp[0] === true;
$scope.menu.flag = temp.length === 1 && temp[0] === false;

// Handle start menu item
temp = _.uniq(_.pluck($scope.selection, 'status'));
$scope.menu.start = temp.length === 1 && temp[0] === 'Waiting';

// Handle close menu item
temp = _.uniq(_.pluck($scope.selection, 'status'));
$scope.menu.close = temp.indexOf('Completed') === -1;

// Handle reopen menu item
temp = _.uniq(_.pluck($scope.selection, 'status'));
$scope.menu.reopen = temp.length === 1 && temp[0] === 'Completed';

// Handle close menu item
// temp = _.uniq(_.pluck($scope.selection, 'status'));
// $scope.menu.close = temp.length === 1 && temp[0] === 'Open';
Expand Down Expand Up @@ -278,18 +290,28 @@
});
};

$scope.bulkFlag = function(flag) {
var ids = _.pluck($scope.selection, '_id');

return CaseTaskSrv.bulkUpdate(ids, {flag: flag})
$scope.bulkUpdate = function(ids, patch) {
return CaseTaskSrv.bulkUpdate(ids, patch)
.then(function(/*responses*/) {
NotificationSrv.log('Selected tasks have been updated successfully', 'success');
})
.catch(function(err) {
NotificationSrv.error('Bulk flag tasks', err.data, err.status);
NotificationSrv.error('Bulk update tasks', err.data, err.status);
});
}

$scope.bulkFlag = function(flag) {
var ids = _.pluck($scope.selection, '_id');

return $scope.bulkUpdate(ids, {flag: flag});
}

$scope.bulkStatus = function(status) {
var ids = _.pluck($scope.selection, '_id');

return $scope.bulkUpdate(ids, {status: status});
}

// open task tab with its details
$scope.startTask = function(task) {
var taskId = task._id;
Expand Down
1 change: 1 addition & 0 deletions frontend/app/styles/main.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -737,6 +737,7 @@ table tr td.task-actions span.action-button {
/*background: rgba(0,0,0,0.2) !important;*/
}

.task-flags.inline div,
.observable-flags.inline div {
display: inline;
}
Expand Down
30 changes: 30 additions & 0 deletions frontend/app/views/components/common/task-flags.component.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,30 @@
<div class="task-flags" ng-class="{'inline': $ctrl.inline}">
<!-- TLP -->
<div class="task-status clickable" uib-tooltip="{{$ctrl.task.status}}" tooltip-popup-delay="500" tooltip-placement="bottom"
ng-click="$ctrl.filterBy('status', $ctrl.task.status)">
<i ng-class="{
'Waiting': 'glyphicon glyphicon-pause text-primary',
'InProgress': 'glyphicon glyphicon-hourglass text-yellow',
'Completed': 'glyphicon glyphicon-ok text-success',
}[$ctrl.task.status]"></i>
</div>

<!-- Flag -->
<div ng-if="!!$ctrl.task.flag" class="task-flag clickable" uib-tooltip="Is flagged" tooltip-popup-delay="500" tooltip-placement="bottom"
ng-click="$ctrl.filterBy('flag', true)">
<i class="glyphicon glyphicon-flag text-yellow"></i>
</div>
<div ng-if="!!!$ctrl.task.flag" class="task-flag clickable"
ng-click="$ctrl.filterBy('flag', false)">
<i class="glyphicon glyphicon-flag text-disabled"></i>
</div>

<!-- Assignee -->
<div ng-if="!!$ctrl.task.assignee" class="task-assignee" uib-tooltip="Is Assigned" tooltip-popup-delay="500" tooltip-placement="bottom">
<i class="glyphicon glyphicon-user text-muted"></i>
</div>
<div ng-if="!!!$ctrl.task.assignee" class="task-flag clickable" uib-tooltip="Not assigned" tooltip-popup-delay="500" tooltip-placement="bottom">
<i class="glyphicon glyphicon-user text-disabled"></i>
</div>

</div>
96 changes: 42 additions & 54 deletions frontend/app/views/partials/case/case.tasks.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -57,40 +57,29 @@ <h4>

<psearch control="list"></psearch>

<table class="table table-hover valigned tasks-table">
<table class="table table-hover valigned tasks-table data-list">
<thead>
<tr>
<th width="20px">
<input if-permission="manageTask" allowed="{{userPermissions}}" type="checkbox" ng-model="menu.selectAll" ng-change="selectAll()">
</th>
<th style="width: 20px"></th>
<th style="width: 40px"></th>
<th style="width: 70px"></th>
<th style="width: 150px">Group</th>
<th>Task</th>
<th style="width: 70px;"></th>
<th style="width: 150px">Date</th>
<th style="width: 150px">Assignee</th>
<th style="width: 250px" class="text-right" if-permission="manageTask" allowed="{{userPermissions}}">Actions</th>
<th style="width: 100px" class="text-right" if-permission="manageTask" allowed="{{userPermissions}}">Actions</th>
</tr>
</thead>
<tbody ng-repeat="task in list.values">
<tr class="task-row" ng-class="{'warning': (task.status=== 'Waiting' || task.status=== 'InProgress') && task.flag == true}">
<tr class="task-row" ng-class="{'warning': task.flag == true}">
<td>
<input if-permission="manageTask" allowed="{{userPermissions}}"
type="checkbox" ng-model="task.selected" ng-change="select(task)">
</td>
<td>
<a href ng-click="collapseOptions[task._id] = !collapseOptions[task._id]" ng-show="task.description" uib-tooltip="Show/Hide description" tooltip-placement="right">
<i class="fa" ng-class="{
true: 'fa-chevron-up',
false: 'fa-chevron-down'
}[!!collapseOptions[task._id]]"></i>
</a>
</td>
<td class="task-status" align="center" ng-switch="task.status">
<i ng-switch-when="Completed" class="text-success glyphicon glyphicon-ok" uib-tooltip="Completed"></i>
<i ng-switch-when="InProgress" class="glyphicon" ng-class="{true:'text-yellow glyphicon-flag', false:'text-primary glyphicon-play'}[task.flag]" uib-tooltip="In Progress"></i>
<i ng-switch-when="Waiting" class="glyphicon" ng-class="{true:'text-yellow glyphicon-flag'}[task.flag]"></i>
<task-flags task="task" on-filter="addFilterValue(fieldName, value)" inline="true"></task-flags>
</td>
<td ng-if="canEdit">
<updatable-select options="groups" on-update="updateField('group', newValue, task)" value="task.group"></updatable-select>
Expand All @@ -99,12 +88,18 @@ <h4>
{{task.group}}
</td>
<td>
<div>
<div>
<!-- FIXME -->
<!-- <span class="mr-xxs text-primary clickable" ng-if="!!!task.extraData.isOwner"><i class="fa fa-share-square"
uib-tooltip="Shared from another organisation" tooltip-placement="right"></i></span>
<span class="mr-xxs text-primary clickable" ng-if="!!task.extraData.isOwner"><i class="fa fa-building-o"
uib-tooltip="Created by my organisation" tooltip-placement="right"></i></span> -->
<a href ng-click="collapseOptions[task._id] = !collapseOptions[task._id]" ng-show="task.description" uib-tooltip="Show/Hide description" tooltip-placement="right">
<i class="fa" ng-class="{
true: 'fa-chevron-up',
false: 'fa-chevron-down'
}[!!collapseOptions[task._id]]"></i>
</a>
<a href ui-sref="app.case.tasks-item({caseId: caseId, itemId:task._id})" ng-class="{'text-danger': !!task.extraData.actionRequired}">
<span ng-if="!!task.extraData.actionRequired" class="text-danger noline mr-xxxs" uib-tooltip="Action Required" tooltip-placement="left-middle">
<i class="fa fa-exclamation-triangle"></i>
Expand Down Expand Up @@ -149,28 +144,22 @@ <h4>
</td>
<!-- class="task-delete" -->
<td align="right" class="task-actions" if-permission="manageTask" allowed="{{userPermissions}}">
<span class="ml-xs clickable text-danger task-delete" ng-click="removeTask(task)">
<i class="fa fa-times"></i>
Delete
</span>
<span class="ml-xs clickable text-success action-button" ng-show="task.status == 'Completed'" ng-click="openTask(task)">
<i class="fa fa-check-circle"></i>
Reopen
</span>
<span class="ml-xs clickable text-muted action-button" ng-show="task.status == 'InProgress'" ng-click="closeTask(task)">
<i class="fa fa-check-circle-o"></i>
Close
</span>
<span class="ml-xs clickable text-primary action-button" ng-show="task.status == 'Waiting'" ng-click="startTask(task)">
<i class="fa fa-play"></i>
Start
</span>

<span class="ml-xs" uib-dropdown ng-if="appConfig.connectors.cortex.enabled" if-permission="manageAction" allowed="{{userPermissions}}">
<a href class="text-primary noline nowrap" ng-click="getTaskResponders(task, true)">
<i class="text-primary fa fa-cog"></i>
</a>
</span>
<a class="btn btn-icon btn-clear" ng-click="removeTask(task)" uib-tooltip="Delete">
<i class="fa fa-trash text-danger"></i>
</a>
<a class="btn btn-icon btn-clear" ng-show="task.status == 'Completed'" ng-click="openTask(task)" uib-tooltip="Reopen">
<i class="fa fa-play text-success"></i>
</a>
<a class="btn btn-icon btn-clear" ng-show="task.status == 'InProgress'" ng-click="closeTask(task)" uib-tooltip="Close">
<i class="fa fa-check-circle-o text-muted"></i>
</a>
<a class="btn btn-icon btn-clear" ng-show="task.status == 'Waiting'" ng-click="startTask(task)" uib-tooltip="Start">
<i class="fa fa-play text-primary"></i>
</a>
<a href class="btn btn-icon btn-clear" ng-click="getTaskResponders(task, true)" ng-if="appConfig.connectors.cortex.enabled" if-permission="manageAction" allowed="{{userPermissions}}">
<i class="text-primary fa fa-cog"></i>
</a>
</td>
</tr>

Expand Down Expand Up @@ -202,33 +191,26 @@ <h4>
<th width="20px">
<input if-permission="manageTask" allowed="{{userPermissions}}" type="checkbox" ng-model="menu.selectAll" ng-change="selectAll()">
</th>
<th style="width: 20px"></th>
<th style="width: 40px"></th>
<th style="width: 70px"></th>
<th style="width: 150px">Group</th>
<th>Task</th>
<th style="width: 70px;"></th>
<th style="width: 150px">Date</th>
<th style="width: 150px">Assignee</th>
<th style="width: 250px" class="text-right" if-permission="manageTask" allowed="{{userPermissions}}">Actions</th>
<th style="width: 100px" class="text-right" if-permission="manageTask" allowed="{{userPermissions}}">Actions</th>
</tr>
</thead>
<tbody ng-repeat="task in group.tasks">
<tr class="task-row" ng-class="{'warning': (task.status=== 'Waiting' || task.status=== 'InProgress') && task.flag == true}">
<tr class="task-row" ng-class="{'warning': task.flag == true}">
<td>
<input if-permission="manageTask" allowed="{{userPermissions}}" type="checkbox" ng-model="task.selected" ng-change="select(task)">
</td>
<td>
<a href ng-click="collapseOptions[task._id] = !collapseOptions[task._id]" ng-show="task.description" uib-tooltip="Show/Hide description" tooltip-placement="right">
<i class="fa" ng-class="{
true: 'fa-chevron-up',
false: 'fa-chevron-down'
}[!!collapseOptions[task._id]]"></i>
</a>
</td>

<td class="task-status" align="center" ng-switch="task.status">
<i ng-switch-when="Completed" class="text-success glyphicon glyphicon-ok" uib-tooltip="Completed"></i>
<task-flags task="task" on-filter="addFilterValue(fieldName, value)" inline="true"></task-flags>
<!-- <i ng-switch-when="Completed" class="text-success glyphicon glyphicon-ok" uib-tooltip="Completed"></i>
<i ng-switch-when="InProgress" class="glyphicon" ng-class="{true:'text-yellow glyphicon-flag', false:'text-primary glyphicon-play'}[task.flag]" uib-tooltip="In Porgress"></i>
<i ng-switch-when="Waiting" class="glyphicon" ng-class="{true:'text-yellow glyphicon-flag'}[task.flag]"></i>
<i ng-switch-when="Waiting" class="glyphicon" ng-class="{true:'text-yellow glyphicon-flag'}[task.flag]"></i> -->
</td>
<td ng-if="canEdit">
<updatable-select options="groups" on-update="updateField('group', newValue, task)" value="task.group"></updatable-select>
Expand All @@ -238,6 +220,12 @@ <h4>
</td>
<td>
<div>
<a href ng-click="collapseOptions[task._id] = !collapseOptions[task._id]" ng-show="task.description" uib-tooltip="Show/Hide description" tooltip-placement="right">
<i class="fa" ng-class="{
true: 'fa-chevron-up',
false: 'fa-chevron-down'
}[!!collapseOptions[task._id]]"></i>
</a>
<a href ng-class="{'text-danger': !!task.extraData.actionRequired}" ng-click="addFilterValue('actionRequired', true)">
<span ng-if="!!task.extraData.actionRequired" class="text-danger noline mr-xxxs" uib-tooltip="Action Required" tooltip-placement="left-middle">
<i class="fa fa-exclamation-triangle"></i>
Expand Down Expand Up @@ -288,12 +276,12 @@ <h4>
<i class="fa fa-trash text-danger"></i>
</a>
<a class="btn btn-icon btn-clear" ng-show="task.status == 'Completed'" ng-click="openTask(task)" uib-tooltip="Reopen">
<i class="fa fa-check-circle text-success"></i>
<i class="fa fa-play text-success"></i>
</a>
<a class="btn btn-icon btn-clear" ng-show="task.status == 'InProgress'" ng-click="closeTask(task)" uib-tooltip="Close">
<i class="fa fa-check-circle-o text-muted"></i>
</a>
<a class="btn btn-icon btn-clear" ng-show="task.status == 'Waiting'" ng-click="startTask(task)" uib-toolip="Start">
<a class="btn btn-icon btn-clear" ng-show="task.status == 'Waiting'" ng-click="startTask(task)" uib-tooltip="Start">
<i class="fa fa-play text-primary"></i>
</a>
<a href class="btn btn-icon btn-clear" ng-click="getTaskResponders(task, true)" ng-if="appConfig.connectors.cortex.enabled" if-permission="manageAction" allowed="{{userPermissions}}">
Expand Down
15 changes: 9 additions & 6 deletions frontend/app/views/partials/case/tasks/toolbar.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,15 +14,18 @@
<li ng-if="menu.unflag">
<a href ng-click="bulkFlag(false)"><i class="fa fa-flag-o"></i> Remove flag</a>
</li>
<!-- <li ng-if="$vm.menu.reopen">
<a href ng-click="$vm.bulkReopen()"><i class="fa fa-folder-open"></i> Reopen</a>
<li ng-if="menu.start">
<a href ng-click="bulkStatus('InProgress')"><i class="fa fa-play"></i> Start</a>
</li>
<li ng-if="$vm.menu.close">
<a href ng-click="$vm.bulkClose()"><i class="fa fa-folder"></i> Close</a>
<li ng-if="menu.reopen">
<a href ng-click="bulkStatus('InProgress')"><i class="fa fa-folder-open"></i> Reopen</a>
</li>
<li ng-if="$vm.menu.delete" class="divider"></li>
<li ng-if="menu.close">
<a href ng-click="bulkStatus('Completed')"><i class="fa fa-folder"></i> Close</a>
</li>
<!-- <li ng-if="menu.delete" class="divider"></li>
<li>
<a href ng-click="$vm.bulkRemove()"><i class="fa fa-trash"></i> Delete</a>
<a href ng-click="bulkRemove()"><i class="fa fa-trash"></i> Delete</a>
</li> -->
</ul>
</div>
Expand Down

0 comments on commit 7de1f61

Please sign in to comment.