Commit b3c9d965 authored by Phil Hughes's avatar Phil Hughes

Converted filterable_list to axios

parent 3bb08565
import _ from 'underscore';
import axios from './lib/utils/axios_utils';
/**
* Makes search request for content when user types a value in the search input.
......@@ -54,32 +55,26 @@ export default class FilterableList {
this.listFilterElement.removeEventListener('input', this.debounceFilter);
}
filterResults(queryData) {
filterResults(params) {
if (this.isBusy) {
return false;
}
$(this.listHolderElement).fadeTo(250, 0.5);
return $.ajax({
url: this.getFilterEndpoint(),
data: queryData,
type: 'GET',
dataType: 'json',
context: this,
complete: this.onFilterComplete,
beforeSend: () => {
this.isBusy = true;
},
success: (response, textStatus, xhr) => {
this.onFilterSuccess(response, xhr, queryData);
},
});
this.isBusy = true;
return axios.get(this.getFilterEndpoint(), {
params,
}).then((res) => {
this.onFilterSuccess(res, params);
this.onFilterComplete();
}).catch(() => this.onFilterComplete());
}
onFilterSuccess(response, xhr, queryData) {
onFilterSuccess(response, queryData) {
if (response.html) {
this.listHolderElement.innerHTML = response.html;
this.listHolderElement.innerHTML = response.data.html;
}
// Change url so if user reload a page - search results are saved
......
......@@ -94,23 +94,23 @@ export default class GroupFilterableList extends FilterableList {
this.form.querySelector(`[name="${this.filterInputField}"]`).value = '';
}
onFilterSuccess(data, xhr, queryData) {
onFilterSuccess(res, queryData) {
const currentPath = this.getPagePath(queryData);
const paginationData = {
'X-Per-Page': xhr.getResponseHeader('X-Per-Page'),
'X-Page': xhr.getResponseHeader('X-Page'),
'X-Total': xhr.getResponseHeader('X-Total'),
'X-Total-Pages': xhr.getResponseHeader('X-Total-Pages'),
'X-Next-Page': xhr.getResponseHeader('X-Next-Page'),
'X-Prev-Page': xhr.getResponseHeader('X-Prev-Page'),
'X-Per-Page': res.headers['x-per-page'],
'X-Page': res.headers['x-page'],
'X-Total': res.headers['x-total'],
'X-Total-Pages': res.headers['x-total-pages'],
'X-Next-Page': res.headers['x-next-page'],
'X-Prev-Page': res.headers['x-prev-page'],
};
window.history.replaceState({
page: currentPath,
}, document.title, currentPath);
eventHub.$emit('updateGroups', data, Object.prototype.hasOwnProperty.call(queryData, this.filterInputField));
eventHub.$emit('updateGroups', res.data, Object.prototype.hasOwnProperty.call(queryData, this.filterInputField));
eventHub.$emit('updatePagination', paginationData);
}
}
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment