Tarea #164 Filtros con superpoderes
This commit is contained in:
parent
6b1ad875cb
commit
176ce860ca
|
@ -5,7 +5,7 @@
|
|||
"validations" : true,
|
||||
"routes": [
|
||||
{
|
||||
"url": "/clients",
|
||||
"url": "/clients?q",
|
||||
"state": "clients",
|
||||
"component": "vn-client-index",
|
||||
"acl": ["employee"]
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
<mg-ajax path="/client/api/Clients/filter" options="mgIndex"></mg-ajax>
|
||||
<mg-ajax path="/client/api/Clients/filter" options="vnIndexNonAuto"></mg-ajax>
|
||||
<div margin-medium>
|
||||
<div class="vn-list">
|
||||
<vn-card>
|
||||
|
|
|
@ -11,7 +11,7 @@
|
|||
"component": "ui-view"
|
||||
},
|
||||
{
|
||||
"url": "/list",
|
||||
"url": "/list?q",
|
||||
"state": "item.index",
|
||||
"component": "vn-item-list"
|
||||
},
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
<mg-ajax path="/item/api/Items/filter" options="mgIndex"></mg-ajax>
|
||||
<mg-ajax path="/item/api/Items/filter" options="vnIndexNonAuto"></mg-ajax>
|
||||
<div margin-medium>
|
||||
<div class="vn-list">
|
||||
<vn-card>
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
import ngModule from '../../module';
|
||||
|
||||
export default class Controller {
|
||||
constructor($element, $scope, $document, $compile, vnPopover, $timeout) {
|
||||
constructor($element, $scope, $document, $compile, vnPopover, $timeout, $state, $transitions) {
|
||||
this.element = $element[0];
|
||||
this.$scope = $scope;
|
||||
this.$document = $document;
|
||||
|
@ -9,46 +9,52 @@ export default class Controller {
|
|||
this.vnPopover = vnPopover;
|
||||
this.$timeout = $timeout;
|
||||
this.stringSearch = '';
|
||||
this.$state = $state;
|
||||
this.deregisterCallback = $transitions.onStart({},
|
||||
transition => this.changeState(transition));
|
||||
}
|
||||
|
||||
clearFilter() {
|
||||
this.index.filter = {
|
||||
page: 1,
|
||||
size: 20
|
||||
};
|
||||
}
|
||||
/**
|
||||
* String search to JSON filter
|
||||
*/
|
||||
getFiltersFromSearch() {
|
||||
let toFind = this.stringSearch;
|
||||
let find;
|
||||
if (this.stringSearch) {
|
||||
|
||||
setFilter(filterObject) {
|
||||
this.clearFilter();
|
||||
Object.assign(this.index.filter, filterObject);
|
||||
}
|
||||
|
||||
getFiltersFromString(stringSearch) {
|
||||
let result = {};
|
||||
if (stringSearch) {
|
||||
// find pattern key:value or key:(extra value) and returns array
|
||||
find = toFind.match(/((([\w_]+):([\w_]+))|([\w_]+):\(([\w_ ]+)\))/gi);
|
||||
// remove pattern key:value or key:(extra value) from string and returns string
|
||||
this.index.filter.search = (toFind.replace(/((([\w_]+):([\w_]+))|([\w_]+):\(([\w_ ]+)\))/gi, '')).trim();
|
||||
if (find)
|
||||
for (let i = 0; i < find.length; i++) {
|
||||
let aux = find[i].split(':');
|
||||
let findPattern = stringSearch.match(/((([\w_]+):([\w_]+))|([\w_]+):\(([\w_ ]+)\))/gi);
|
||||
let remnantString = (stringSearch.replace(/((([\w_]+):([\w_]+))|([\w_]+):\(([\w_ ]+)\))/gi, '')).trim();
|
||||
if (findPattern) {
|
||||
for (let i = 0; i < findPattern.length; i++) {
|
||||
let aux = findPattern[i].split(':');
|
||||
let property = aux[0];
|
||||
let value = aux[1].replace(/\(|\)/g, '');
|
||||
this.index.filter[property] = value.trim();
|
||||
result[property] = value.trim();
|
||||
}
|
||||
}
|
||||
if (remnantString) {
|
||||
result.search = remnantString;
|
||||
}
|
||||
/**
|
||||
* JSON filter to string search
|
||||
*
|
||||
* @param {Object} filter The filter
|
||||
*/
|
||||
createFilterSearch(filter) {
|
||||
}
|
||||
return result;
|
||||
}
|
||||
|
||||
createStringFromObject(filterObject) {
|
||||
let search = [];
|
||||
let keys = Object.keys(filter);
|
||||
let keys = Object.keys(filterObject);
|
||||
if (keys.length) {
|
||||
keys.forEach(k => {
|
||||
let ignore = (this.ignoreKeys && this.ignoreKeys instanceof Array && this.ignoreKeys.indexOf(k) !== -1);
|
||||
if (!ignore) {
|
||||
let value = filter[k];
|
||||
let value = filterObject[k];
|
||||
|
||||
if (typeof value === 'string' && value.indexOf(' ') !== -1) {
|
||||
search.push(`${k}:(${value})`);
|
||||
|
@ -57,42 +63,59 @@ export default class Controller {
|
|||
}
|
||||
}
|
||||
});
|
||||
|
||||
if (filterObject.search)
|
||||
search.unshift(filterObject.search);
|
||||
}
|
||||
if (this.index.filter.search) {
|
||||
search.push(this.index.filter.search);
|
||||
return (search.length) ? search.join(' ') : '';
|
||||
}
|
||||
delete this.index.filter.search;
|
||||
this.stringSearch = (search.length) ? search.join(' ') : '';
|
||||
|
||||
changeState(transition) {
|
||||
return !(transition._targetState._identifier.name === this.$state.current.name);
|
||||
}
|
||||
|
||||
pushFiltersToState(filters) {
|
||||
let history = window.history || {pushState: () => {
|
||||
console.error('Error in history.pushState(): Browser incompatibility error');
|
||||
}};
|
||||
let aux = window.location.hash.split('?q=');
|
||||
if (Object.keys(filters).length)
|
||||
history.pushState({}, null, `${aux[0]}?q=${encodeURIComponent(JSON.stringify(filters))}`);
|
||||
else
|
||||
history.pushState({}, null, aux[0]);
|
||||
}
|
||||
|
||||
onpenFilters(event) {
|
||||
let filter = {};
|
||||
if (this.stringSearch) {
|
||||
this.getFiltersFromSearch();
|
||||
filter = this.getFiltersFromString(this.stringSearch);
|
||||
}
|
||||
|
||||
this.child = this.vnPopover.showComponent(this.popover, this.$scope, this.element);
|
||||
|
||||
// XXX: ¿Existe una forma más adecuada de acceder al controlador de un componente?
|
||||
var childCtrl = angular.element(this.child).isolateScope().$ctrl;
|
||||
childCtrl.filter = Object.assign({}, this.index.filter);
|
||||
childCtrl.filter = Object.assign({}, filter);
|
||||
childCtrl.onSubmit = filter => this.onChildSubmit(filter);
|
||||
if (this.data)
|
||||
childCtrl.data = Object.assign({}, this.data);
|
||||
event.preventDefault();
|
||||
}
|
||||
|
||||
onChildSubmit(filter) {
|
||||
this.createFilterSearch(filter);
|
||||
this.index.filter = {
|
||||
page: 1,
|
||||
size: 20
|
||||
};
|
||||
this.stringSearch = this.createStringFromObject(filter);
|
||||
this.clearFilter();
|
||||
this.$timeout(() => {
|
||||
this.onSubmit();
|
||||
});
|
||||
}
|
||||
|
||||
onSubmit() {
|
||||
let filter = {};
|
||||
if (this.stringSearch) {
|
||||
this.getFiltersFromSearch();
|
||||
filter = this.getFiltersFromString(this.stringSearch);
|
||||
}
|
||||
this.setFilter(filter);
|
||||
|
||||
if (this.onSearch)
|
||||
this.onSearch();
|
||||
|
@ -103,12 +126,25 @@ export default class Controller {
|
|||
angular.element(this.child).remove();
|
||||
}
|
||||
delete this.child;
|
||||
this.pushFiltersToState(filter);
|
||||
}
|
||||
|
||||
$onDestroy() {
|
||||
this.clearFilter();
|
||||
this.deregisterCallback();
|
||||
}
|
||||
|
||||
$onInit() {
|
||||
if (this.$state.params.q) {
|
||||
let filter = JSON.parse(decodeURIComponent(this.$state.params.q));
|
||||
this.stringSearch = this.createStringFromObject(filter);
|
||||
}
|
||||
this.$timeout(() => {
|
||||
this.onSubmit();
|
||||
});
|
||||
}
|
||||
}
|
||||
Controller.$inject = ['$element', '$scope', '$document', '$compile', 'vnPopover', '$timeout'];
|
||||
Controller.$inject = ['$element', '$scope', '$document', '$compile', 'vnPopover', '$timeout', '$state', '$transitions'];
|
||||
|
||||
ngModule.component('vnSearchbar', {
|
||||
template: require('./searchbar.html'),
|
||||
|
|
|
@ -2,7 +2,7 @@ module.exports = Self => {
|
|||
Self.installMethod('filter', filterParams);
|
||||
|
||||
function filterParams(params) {
|
||||
let filter = {
|
||||
let filters = {
|
||||
where: {},
|
||||
skip: (params.page - 1) * params.size,
|
||||
limit: params.size,
|
||||
|
@ -20,7 +20,7 @@ module.exports = Self => {
|
|||
delete params.order;
|
||||
|
||||
if (params.search) {
|
||||
filter.where.and = [
|
||||
filters.where.and = [
|
||||
{
|
||||
or: [
|
||||
{id: params.search},
|
||||
|
@ -36,21 +36,18 @@ module.exports = Self => {
|
|||
delete params.itemSize;
|
||||
}
|
||||
|
||||
let keys = Object.keys(params);
|
||||
if (keys.length) {
|
||||
keys.forEach(
|
||||
Object.keys(params).forEach(
|
||||
key => {
|
||||
if (filter.where.and) {
|
||||
if (filters.where.and) {
|
||||
let filter = {};
|
||||
filter[key] = (key === 'description') ? {regexp: params[key]} : params[key];
|
||||
filter.where.and.push(filter);
|
||||
filter[key] = (key === 'description' || key === 'name') ? {regexp: params[key]} : params[key];
|
||||
filters.where.and.push(filter);
|
||||
} else {
|
||||
filter.where[key] = (key === 'description') ? {regexp: params[key]} : params[key];
|
||||
filters.where[key] = (key === 'description' || key === 'name') ? {regexp: params[key]} : params[key];
|
||||
}
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
return filter;
|
||||
return filters;
|
||||
}
|
||||
};
|
||||
|
|
Loading…
Reference in New Issue