Skip to content

Commit bb27715

Browse files
AllenBWAllenBW
committed
fix(pfFilter): Ensures complete alias support for select/complex-select
1 parent 6f366e4 commit bb27715

File tree

5 files changed

+37
-28
lines changed

5 files changed

+37
-28
lines changed

‎src/filters/examples/filter.js

Lines changed: 14 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@
1414
* <li>.id - (String) Optional unique Id for the filter field, useful for comparisons
1515
* <li>.title - (String) The title to display for the filter field
1616
* <li>.placeholder - (String) Text to display when no filter value has been entered
17-
* <li>.filterMultiselect - (Boolean) In `complex-select`, allow selection of multiple values per category. Optional, default is `false`
17+
* <li>.filterMultiselect - (Boolean) In `complex-select`, allow selection of multiple categories and values. Optional, default is `false`
1818
* <li>.filterType - (String) The filter input field type (any html input type, or 'select' for a single select box or 'complex-select' for a category select box)
1919
* <li>.filterValues - (Array) List of valid select values used when filterType is 'select' or 'complex-select' (in where these values serve as case insensitve keys for .filterCategories objects)
2020
* <li>.filterCategories - (Array of (Objects)) For 'complex-select' only, array of objects whoes keys (case insensitive) match the .filterValues, these objects include each of the filter fields above (sans .placeholder)
@@ -114,9 +114,10 @@
114114
} else if (filter.id === 'address') {
115115
match = item.address.match(re) !== null;
116116
} else if (filter.id === 'birthMonth') {
117-
match = item.birthMonth === filter.value;
117+
match = item.birthMonth === filter.value.id || item.birthMonth === filter.value;
118118
} else if (filter.id === 'car') {
119-
match = item.car === filter.value;
119+
match = item.car === ((filter.value.filterCategory.id || filter.value.filterCategory)
120+
+ filter.value.filterDelimiter + (filter.value.filterValue.id || filter.value.filterValue));
120121
}
121122
return match;
122123
};
@@ -150,7 +151,16 @@
150151
var filterChange = function (filters) {
151152
$scope.filtersText = "";
152153
filters.forEach(function (filter) {
153-
$scope.filtersText += filter.title + " : " + filter.value + "\n";
154+
$scope.filtersText += filter.title + " : ";
155+
if (filter.value.filterCategory) {
156+
$scope.filtersText += ((filter.value.filterCategory.title || filter.value.filterCategory)
157+
+ filter.value.filterDelimiter + (filter.value.filterValue.title || filter.value.filterValue));
158+
} else if (filter.value.title){
159+
$scope.filtersText += filter.value.title;
160+
} else {
161+
$scope.filtersText += filter.value;
162+
}
163+
$scope.filtersText += "\n";
154164
});
155165
applyFilters(filters);
156166
};

‎src/filters/simple-filter/filter-component.js

Lines changed: 4 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -21,14 +21,8 @@ angular.module('patternfly.filters').component('pfFilter', {
2121
return angular.isDefined(_.find(ctrl.config.appliedFilters, {title: filter.title, value: filter.value}));
2222
}
2323

24-
function findDuplicateCategory (field, value) {
25-
var duplicateValue;
26-
27-
function searchAppliedFilters (item) {
28-
return _.includes(item.value, _.split(value, field.filterDelimiter, 1)) ? duplicateValue = item : null;
29-
}
30-
31-
return _.some(ctrl.config.appliedFilters, searchAppliedFilters) ? duplicateValue : null;
24+
function findDuplicateComplexSelect (item) {
25+
return item.value.filterCategory;
3226
}
3327

3428
function enforceSingleSelect (filter) {
@@ -49,8 +43,8 @@ angular.module('patternfly.filters').component('pfFilter', {
4943
enforceSingleSelect(newFilter);
5044
}
5145

52-
if (field.filterType === 'complex-select' && !field.filterMultiselect && findDuplicateCategory(field, value)) {
53-
_.remove(ctrl.config.appliedFilters, findDuplicateCategory(field, value));
46+
if (field.filterType === 'complex-select' && !field.filterMultiselect) {
47+
_.remove(ctrl.config.appliedFilters, findDuplicateComplexSelect);
5448
}
5549

5650
ctrl.config.appliedFilters.push(newFilter);

‎src/filters/simple-filter/filter-fields-component.js

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@
1414
* <li>.id - (String) Optional unique Id for the filter field, useful for comparisons
1515
* <li>.title - (String) The title to display for the filter field
1616
* <li>.placeholder - (String) Text to display when no filter value has been entered
17-
* <li>.filterMultiselect - (Boolean) In `complex-select`, allow selection of multiple values per category. Optional, default is `false`
17+
* <li>.filterMultiselect - (Boolean) In `complex-select`, allow selection of multiple categories and values. Optional, default is `false`
1818
* <li>.filterType - (String) The filter input field type (any html input type, or 'select' for a single select box or 'complex-select' for a category select box)
1919
* <li>.filterValues - (Array) List of valid select values used when filterType is 'select' or 'complex-select' (in where these values serve as case insensitve keys for .filterCategories objects)
2020
* <li>.filterCategories - (Array of (Objects)) For 'complex-select' only, array of objects whoes keys (case insensitive) match the .filterValues, these objects include each of the filter fields above (sans .placeholder)
@@ -75,7 +75,11 @@ angular.module('patternfly.filters').component('pfFilterFields', {
7575
break;
7676
}
7777
if (ctrl.filterCategory && ctrl.filterValue) {
78-
ctrl.addFilterFn(ctrl.currentField, ctrl.filterCategory + ctrl.currentField.filterDelimiter + ctrl.filterValue);
78+
ctrl.addFilterFn(ctrl.currentField, {
79+
filterCategory: ctrl.filterCategory,
80+
filterDelimiter: ctrl.currentField.filterDelimiter,
81+
filterValue: ctrl.filterValue
82+
});
7983
}
8084
} else {
8185
ctrl.addFilterFn(ctrl.currentField, filterValue);

‎src/filters/simple-filter/filter-fields.html

Lines changed: 12 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,8 @@
77
<span class="caret"></span>
88
</button>
99
<ul uib-dropdown-menu>
10-
<li ng-repeat="item in $ctrl.config.fields">
10+
<li ng-repeat="item in $ctrl.config.fields"
11+
ng-class="{'selected': item === $ctrl.currentField}">
1112
<a class="filter-field" role="menuitem" tabindex="-1" ng-click="$ctrl.selectField(item)">
1213
{{item.title}}
1314
</a>
@@ -22,7 +23,7 @@
2223
<div ng-if="$ctrl.currentField.filterType === 'select'">
2324
<div class="btn-group bootstrap-select form-control filter-select" uib-dropdown >
2425
<button type="button" uib-dropdown-toggle class="btn btn-default dropdown-toggle">
25-
<span class="filter-option pull-left">{{$ctrl.currentValue || $ctrl.currentField.placeholder}}</span>
26+
<span class="filter-option pull-left">{{$ctrl.currentValue.title || $ctrl.currentValue || $ctrl.currentField.placeholder}}</span>
2627
<span class="caret"></span>
2728
</button>
2829
<ul uib-dropdown-menu class="dropdown-menu-right" role="menu">
@@ -32,8 +33,8 @@
3233
</a>
3334
</li>
3435
<li ng-repeat="filterValue in $ctrl.currentField.filterValues"
35-
ng-class="{'selected': (filterValue === $ctrl.currentValue || filterValue.id === $ctrl.currentValue)}">
36-
<a role="menuitem" tabindex="-1" ng-click="$ctrl.selectValue(filterValue.id || filterValue)">
36+
ng-class="{'selected': (filterValue === $ctrl.currentValue)}">
37+
<a role="menuitem" tabindex="-1" ng-click="$ctrl.selectValue(filterValue)">
3738
{{filterValue.title || filterValue}}
3839
</a>
3940
</li>
@@ -44,7 +45,7 @@
4445

4546
<div class="btn-group bootstrap-select form-control filter-select" uib-dropdown >
4647
<button type="button" uib-dropdown-toggle class="btn btn-default dropdown-toggle">
47-
<span class="filter-option pull-left">{{$ctrl.filterCategory || $ctrl.currentField.placeholder}}</span>
48+
<span class="filter-option pull-left">{{$ctrl.filterCategory.title || $ctrl.filterCategory || $ctrl.currentField.placeholder}}</span>
4849
<span class="caret"></span>
4950
</button>
5051
<ul uib-dropdown-menu class="dropdown-menu-right" role="menu">
@@ -54,8 +55,8 @@
5455
</a>
5556
</li>
5657
<li ng-repeat="filterCategory in $ctrl.currentField.filterValues"
57-
ng-class="{'selected': (filterCategory === $ctrl.filterCategory || filterCategory.id === $ctrl.filterCategory)}">
58-
<a role="menuitem" tabindex="-1" ng-click="$ctrl.selectValue(filterCategory.id ||filterCategory, 'filter-category')">
58+
ng-class="{'selected': (filterCategory == $ctrl.filterCategory)}">
59+
<a role="menuitem" tabindex="-1" ng-click="$ctrl.selectValue(filterCategory, 'filter-category')">
5960
{{filterCategory.title ||filterCategory}}
6061
</a>
6162
</li>
@@ -64,7 +65,7 @@
6465

6566
<div class="btn-group bootstrap-select form-control filter-select " uib-dropdown >
6667
<button type="button" uib-dropdown-toggle class="btn btn-default dropdown-toggle category-select-value">
67-
<span class="filter-option pull-left">{{$ctrl.filterValue || $ctrl.currentField.filterCategoriesPlaceholder}}</span>
68+
<span class="filter-option pull-left">{{$ctrl.filterValue.title || $ctrl.filterValue || $ctrl.currentField.filterCategoriesPlaceholder}}</span>
6869
<span class="caret"></span>
6970
</button>
7071
<ul uib-dropdown-menu class="dropdown-menu-right" role="menu">
@@ -73,9 +74,9 @@
7374
{{$ctrl.currentField.filterCategoriesPlaceholder}}
7475
</a>
7576
</li>
76-
<li ng-repeat="filterValue in $ctrl.currentField.filterCategories[$ctrl.filterCategory.toLowerCase()].filterValues"
77-
ng-class="{'selected': (filterValue === $ctrl.filterValue || filterValue.id === $ctrl.filterValue)}">
78-
<a role="menuitem" tabindex="-1" ng-click="$ctrl.selectValue(filterValue.id || filterValue, 'filter-value')">
77+
<li ng-repeat="filterValue in $ctrl.currentField.filterCategories[$ctrl.filterCategory.id.toLowerCase() || $ctrl.filterCategory.toLowerCase() ].filterValues"
78+
ng-class="{'selected': filterValue === $ctrl.filterValue}">
79+
<a role="menuitem" tabindex="-1" ng-click="$ctrl.selectValue(filterValue, 'filter-value')">
7980
{{filterValue.title || filterValue}}
8081
</a>
8182
</li>

‎src/filters/simple-filter/filter-results.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ <h5>{{$ctrl.config.resultsCount}} Results</h5>
66
<ul class="list-inline">
77
<li ng-repeat="filter in $ctrl.config.appliedFilters">
88
<span class="active-filter label label-info">
9-
{{filter.title}}: {{filter.value}}
9+
{{filter.title}}: {{((filter.value.filterCategory.title || filter.value.filterCategory) + filter.value.filterDelimiter + (filter.value.filterValue.title || filter.value.filterValue)) || filter.value.title || filter.value}}
1010
<a><span class="pficon pficon-close" ng-click="$ctrl.clearFilter(filter)"></span></a>
1111
</span>
1212
</li>

0 commit comments

Comments
 (0)