diff --git a/public/directives/wz-tag-filter/wz-tag-filter.html b/public/directives/wz-tag-filter/wz-tag-filter.html
index 75e440ea64..cb85fbabda 100644
--- a/public/directives/wz-tag-filter/wz-tag-filter.html
+++ b/public/directives/wz-tag-filter/wz-tag-filter.html
@@ -9,18 +9,24 @@
{{tag.value.name}} :
{{tag.value.value}}
- ×
+ ×
- OR
+
- ×
+ ×
- AND
+
+ ng-focus='showAutocomplete(true)' ng-blur='showAutocomplete(false)' placeholder='Add filter or search'
+ ng-keyup='!autocompleteEnter && $event.keyCode == 13 ? addTag(true) : addSearchKey($event)' />
+
{{autocompleteContent.title}}
diff --git a/public/directives/wz-tag-filter/wz-tag-filter.js b/public/directives/wz-tag-filter/wz-tag-filter.js
index dd170a2cab..0138d756bd 100644
--- a/public/directives/wz-tag-filter/wz-tag-filter.js
+++ b/public/directives/wz-tag-filter/wz-tag-filter.js
@@ -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: {
@@ -34,6 +34,7 @@ app.directive('wzTagFilter', function() {
$scope.tagList = [];
$scope.groupedTagList = [];
+ $scope.connectors = [];
$scope.newTag = '';
$scope.isAutocomplete = false;
$scope.dataModel = [];
@@ -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 => {
@@ -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);
@@ -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 += '(';
@@ -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');
@@ -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
*/
@@ -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);
};
@@ -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')
@@ -348,4 +413,4 @@ app.directive('wzTagFilter', function() {
},
template
};
-});
+});
\ No newline at end of file
diff --git a/public/directives/wz-tag-filter/wz-tag-filter.less b/public/directives/wz-tag-filter/wz-tag-filter.less
index 4ebb55d455..88421e7fcd 100644
--- a/public/directives/wz-tag-filter/wz-tag-filter.less
+++ b/public/directives/wz-tag-filter/wz-tag-filter.less
@@ -68,6 +68,10 @@
padding: 0px 5px;
}
+.wz-tag-item-connector:hover {
+ text-decoration: underline;
+}
+
.wz-tag-remove-button{
color: #b2ccd4;
}
@@ -119,4 +123,4 @@
background: black;
color:#006BB4;
cursor: pointer;
-}
+}
\ No newline at end of file