Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Change the operators between tags #1291

Merged
merged 4 commits into from
Mar 11, 2019
Merged

Change the operators between tags #1291

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
51e0064
Change the operators between tags
juankaromo Mar 6, 2019
4b9c00b
Fix search
juankaromo Mar 6, 2019
e83040f
Fixes
juankaromo Mar 6, 2019
ba7a9c3
Fixes remove all
juankaromo Mar 6, 2019
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
18 changes: 12 additions & 6 deletions public/directives/wz-tag-filter/wz-tag-filter.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,18 +9,24 @@
<span class='wz-tag-remove-button fa' ng-class='(tag.type === "filter") ? "fa-filter" : "fa-search"'></span>
<span class=''>{{tag.value.name}} <span ng-show='tag.type === "filter"'>:
{{tag.value.value}}</span></span>
<a class='wz-tag-remove-button' ng-click='removeTag(tag.id, false)'>×</a>
<a class='wz-tag-remove-button' ng-click='removeTag(tag.id, false, $parent.$index, $index)'>×</a>
</div>
<span class='wz-tag-item-connector' ng-show='$index != group.length - 1'>OR</span>
<button ng-click="changeConnector($parent.$index, $index)" class="pointer" ng-show='$index != group.length - 1'><span
class='wz-tag-item-connector'>{{connectors[$parent.$index].subgroup[$index].value ===
';' ? 'AND' : 'OR' }}</span></button>
</div>
<a ng-show='group.length > 1' class='wz-tag-remove-button-group' ng-click='removeTag(group[0].key, true)'>×</a>
<a ng-show='group.length > 1' class='wz-tag-remove-button-group' ng-click='removeTag(group[0].key, true, $index - 1)'>×</a>
</div>
<span class='wz-tag-item-connector' ng-show='$index != groupedTagList.length - 1'> AND </span>
<button ng-click="changeConnector($index)" class="pointer" ng-show='$index != groupedTagList.length - 1'><span
class='wz-tag-item-connector'>
{{connectors[$index].value === ';' ? 'AND' : 'OR'}}
</span></button>
</li>
</ul>
<input id='wz-search-filter-bar-input' class='wz-search-filter-bar-input input' type='text' ng-model='newTag'
ng-focus='showAutocomplete(true)' ng-blur='showAutocomplete(false)'
placeholder='Add filter or search' ng-keyup='!autocompleteEnter && $event.keyCode == 13 ? addTag(true) : addSearchKey($event)' />
ng-focus='showAutocomplete(true)' ng-blur='showAutocomplete(false)' placeholder='Add filter or search'
ng-keyup='!autocompleteEnter && $event.keyCode == 13 ? addTag(true) : addSearchKey($event)' />
<a class='wz-tag-remove-button wz-padding-top-5' ng-click='removeAll()'><i class="fa fa-trash" aria-hidden="true"></i></a>
<div id='wz-search-filter-bar-autocomplete' class='wz-search-filter-bar-autocomplete' ng-show='isAutocomplete && autocompleteContent.list.length > 0'>
<p><b>{{autocompleteContent.title}}</b></p>
<ul id='wz-search-filter-bar-autocomplete-list'>
Expand Down
91 changes: 78 additions & 13 deletions public/directives/wz-tag-filter/wz-tag-filter.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@ import { uiModules } from 'ui/modules';

const app = uiModules.get('app/wazuh', []);

app.directive('wzTagFilter', function() {
app.directive('wzTagFilter', function () {
return {
restrict: 'E',
scope: {
Expand All @@ -34,6 +34,7 @@ app.directive('wzTagFilter', function() {

$scope.tagList = [];
$scope.groupedTagList = [];
$scope.connectors = [];
$scope.newTag = '';
$scope.isAutocomplete = false;
$scope.dataModel = [];
Expand Down Expand Up @@ -70,7 +71,7 @@ app.directive('wzTagFilter', function() {
};
const idxSearch = $scope.tagList.find(x => x.type === 'search');
if (!isFilter && idxSearch) {
$scope.removeTag(idxSearch.id, false);
$scope.removeTag(idxSearch.id, false, $scope.searchIdx, undefined, true);
}
if (
!$scope.tagList.find(x => {
Expand All @@ -83,6 +84,7 @@ app.directive('wzTagFilter', function() {
) {
$scope.tagList.push(tag);
$scope.groupedTagList = groupBy($scope.tagList, 'key');
$scope.connectors = addConnectors($scope.groupedTagList);
buildQuery($scope.groupedTagList);
}
$scope.showAutocomplete(flag);
Expand All @@ -103,15 +105,14 @@ app.directive('wzTagFilter', function() {
query: '',
search: ''
};
let first = true;
for (const group of groups) {
groups.forEach((group, idx) => {
const search = group.find(x => x.type === 'search');
if (search) {
$scope.searchIdx = idx;
queryObj.search = search.value.name;
if (idx === groups.length - 1)
queryObj.query = queryObj.query.substring(0, queryObj.query.length - 1);
} else {
if (!first) {
queryObj.query += ';';
}
const twoOrMoreElements = group.length > 1;
if (twoOrMoreElements) {
queryObj.query += '(';
Expand All @@ -121,15 +122,17 @@ app.directive('wzTagFilter', function() {
.forEach((tag, idx2) => {
queryObj.query += tag.key + '=' + tag.value.value;
if (idx2 != group.length - 1) {
queryObj.query += ',';
queryObj.query += $scope.connectors[idx].subgroup[idx2].value;
}
});
if (twoOrMoreElements) {
queryObj.query += ')';
}
first = false;
if (idx !== groups.length - 1) {
queryObj.query += $scope.connectors[idx].value;
}
}
}
});
$scope.queryFn({ q: queryObj.query, search: queryObj.search });
} catch (error) {
errorHandler.handle(error, 'Error in query request');
Expand All @@ -156,6 +159,42 @@ app.directive('wzTagFilter', function() {
return result;
};

const addConnectors = (groups) => {
const result = [];
groups
.forEach((group, index) => {
result.push({});
const subGroup = [];
group
.forEach((tag, idx) => {
if (idx != group.length - 1) {
subGroup.push({ value: (((($scope.connectors || [])[index] || {}).subgroup || [])[idx] || {}).value || ',' });
}
});
if (subGroup.length > 0)
result[index].subgroup = subGroup;
if (index != groups.length - 1) {
result[index].value = (($scope.connectors || [])[index] || {}).value || ';';
}
});
return result;
};

$scope.changeConnector = (parentIdx, idx) => {
if ((parentIdx === $scope.searchIdx - 1 || parentIdx === $scope.searchIdx) && idx === undefined) {
$scope.connectors[parentIdx].value = ';';
} else {
if (idx !== undefined) {
const value = $scope.connectors[parentIdx].subgroup[idx].value;
$scope.connectors[parentIdx].subgroup[idx].value = value === ';' ? ',' : ';'
} else {
const value = $scope.connectors[parentIdx].value;
$scope.connectors[parentIdx].value = value === ';' ? ',' : ';'
}
buildQuery($scope.groupedTagList);
}
};

/**
* Add key part of filter to search bar
*/
Expand All @@ -179,13 +218,39 @@ app.directive('wzTagFilter', function() {
/**
* This remove tag from search bar
*/
$scope.removeTag = (id, deleteGroup) => {
$scope.removeTag = (id, deleteGroup, parentIdx, idx, overwrite = false) => {
if (deleteGroup) {
$scope.tagList = $scope.tagList.filter(x => x.key !== id);
$scope.connectors.splice(parentIdx, 1);
} else {
$scope.tagList.splice($scope.tagList.findIndex(x => x.id === id), 1);
if (idx < 0) {
idx = 0;
}
if ($scope.connectors[parentIdx] && $scope.connectors[parentIdx].subgroup) {
$scope.connectors[parentIdx].subgroup.splice(idx, 1);
} else
$scope.connectors.splice(parentIdx, 1);
}
if ($scope.tagList.length <= 1) {
$scope.connectors = [{}];
}
$scope.groupedTagList = groupBy($scope.tagList, 'key');
const search = $scope.tagList.find(x => x.type === 'search');
if (!search) {
$scope.searchIdx = false;
}
$scope.connectors = addConnectors($scope.groupedTagList);
if (!overwrite)
buildQuery($scope.groupedTagList);
$scope.showAutocomplete(false);
};

$scope.removeAll = () => {
$scope.tagList = [];
$scope.connectors = [];
$scope.groupedTagList = [];
$scope.searchIdx = false;
buildQuery($scope.groupedTagList);
$scope.showAutocomplete(false);
};
Expand Down Expand Up @@ -299,7 +364,7 @@ app.directive('wzTagFilter', function() {
/**
* This set to bar a keydown listener to show the autocomplete
*/
$('#wz-search-filter-bar-input').bind('keydown', function(e) {
$('#wz-search-filter-bar-input').bind('keydown', function (e) {
let $current = $('#wz-search-filter-bar-autocomplete-list li.selected');
if ($current.length === 0 && (e.keyCode === 38 || e.keyCode === 40)) {
$('#wz-search-filter-bar-autocomplete-list li')
Expand Down Expand Up @@ -348,4 +413,4 @@ app.directive('wzTagFilter', function() {
},
template
};
});
});
6 changes: 5 additions & 1 deletion public/directives/wz-tag-filter/wz-tag-filter.less
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -68,6 +68,10 @@
padding: 0px 5px;
}

.wz-tag-item-connector:hover {
text-decoration: underline;
}

.wz-tag-remove-button{
color: #b2ccd4;
}
Expand Down Expand Up @@ -119,4 +123,4 @@
background: black;
color:#006BB4;
cursor: pointer;
}
}