146 lines
3.6 KiB
JavaScript
146 lines
3.6 KiB
JavaScript
|
var app = new Vue({
|
||
|
|
el: '#app',
|
||
|
|
data: {
|
||
|
|
books: [],
|
||
|
|
authors: [],
|
||
|
|
series: [],
|
||
|
|
booksCount: 0,
|
||
|
|
page: 1,
|
||
|
|
perpage: 20,
|
||
|
|
sort_by: null,
|
||
|
|
order_desc: false
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
sendQuery: function(url, error, success) {
|
||
|
|
var xmh = new XMLHttpRequest();
|
||
|
|
var v;
|
||
|
|
|
||
|
|
xmh.onreadystatechange = function() {
|
||
|
|
v = xmh.responseText;
|
||
|
|
if (xmh.readyState === 4 && xmh.status === 200) {
|
||
|
|
var res;
|
||
|
|
try {
|
||
|
|
res = JSON.parse(v);
|
||
|
|
} catch (err) {
|
||
|
|
if (null !== error)
|
||
|
|
error(err.name, err.message);
|
||
|
|
}
|
||
|
|
if (null !== success)
|
||
|
|
success(res);
|
||
|
|
} else if (xmh.readyState === 4) {
|
||
|
|
if (null !== error)
|
||
|
|
error(xmh.status, v);
|
||
|
|
}
|
||
|
|
};
|
||
|
|
|
||
|
|
xmh.open('GET', url, true);
|
||
|
|
xmh.send(null);
|
||
|
|
},
|
||
|
|
stdError: function(code, resp) {
|
||
|
|
console.log('ERROR ' + code + ': ' + resp);
|
||
|
|
},
|
||
|
|
indexSuccess: function(resp) {
|
||
|
|
this.booksCount = resp.count;
|
||
|
|
},
|
||
|
|
loadIndex: function() {
|
||
|
|
this.sendQuery('cgi-bin/bouquins/index', this.stdError, this.indexSuccess);
|
||
|
|
},
|
||
|
|
authorsSuccess: function(resp) {
|
||
|
|
this.authors = resp;
|
||
|
|
},
|
||
|
|
booksSuccess: function(resp) {
|
||
|
|
this.books = resp;
|
||
|
|
},
|
||
|
|
seriesSuccess: function(resp) {
|
||
|
|
this.series = resp;
|
||
|
|
},
|
||
|
|
sortBy: function(col) {
|
||
|
|
if (this.sort_by == col) {
|
||
|
|
if (this.order_desc) {
|
||
|
|
this.order_desc = false;
|
||
|
|
this.sort_by = null;
|
||
|
|
} else {
|
||
|
|
this.order_desc = true;
|
||
|
|
}
|
||
|
|
} else {
|
||
|
|
this.order_desc = false;
|
||
|
|
this.sort_by = col;
|
||
|
|
}
|
||
|
|
this.reload();
|
||
|
|
},
|
||
|
|
reload: function() {
|
||
|
|
if (this.books.length > 0)
|
||
|
|
this.loadBooks();
|
||
|
|
if (this.authors.length > 0)
|
||
|
|
this.loadAuthors();
|
||
|
|
if (this.series.length > 0)
|
||
|
|
this.loadSeries();
|
||
|
|
},
|
||
|
|
prevPage: function() {
|
||
|
|
if (this.page > 1) {
|
||
|
|
this.page--;
|
||
|
|
this.reload();
|
||
|
|
}
|
||
|
|
},
|
||
|
|
nextPage: function() {
|
||
|
|
this.page++;
|
||
|
|
this.reload();
|
||
|
|
},
|
||
|
|
order: function(query) {
|
||
|
|
if (this.order_desc)
|
||
|
|
return query + '&order=desc';
|
||
|
|
return query;
|
||
|
|
},
|
||
|
|
sort: function(query) {
|
||
|
|
if (this.sort_by)
|
||
|
|
return query + '&sort=' + this.sort_by;
|
||
|
|
return query;
|
||
|
|
},
|
||
|
|
paginate: function(query) {
|
||
|
|
return query + '?page=' + this.page + '&perpage=' + this.perpage;
|
||
|
|
},
|
||
|
|
params: function(url) {
|
||
|
|
return this.order(this.sort(this.paginate(url)));
|
||
|
|
},
|
||
|
|
loadAuthors: function() {
|
||
|
|
this.sendQuery(this.params('cgi-bin/bouquins/authors'), this.stdError, this.authorsSuccess);
|
||
|
|
},
|
||
|
|
loadBooks: function() {
|
||
|
|
this.sendQuery(this.params('cgi-bin/bouquins/books'), this.stdError, this.booksSuccess);
|
||
|
|
},
|
||
|
|
loadSeries: function() {
|
||
|
|
this.sendQuery(this.params('cgi-bin/bouquins/series'), this.stdError, this.seriesSuccess);
|
||
|
|
},
|
||
|
|
showSeries: function() {
|
||
|
|
this.books = [];
|
||
|
|
this.authors = [];
|
||
|
|
this.page = 1;
|
||
|
|
this.perpage = 20;
|
||
|
|
this.order_desc = false;
|
||
|
|
this.sort_by = null;
|
||
|
|
this.loadSeries();
|
||
|
|
},
|
||
|
|
showAuthors: function() {
|
||
|
|
this.books = [];
|
||
|
|
this.series = [];
|
||
|
|
this.page = 1;
|
||
|
|
this.perpage = 20;
|
||
|
|
this.order_desc = false;
|
||
|
|
this.sort_by = null;
|
||
|
|
this.loadAuthors();
|
||
|
|
},
|
||
|
|
showBooks: function() {
|
||
|
|
this.authors = [];
|
||
|
|
this.series = [];
|
||
|
|
this.page = 1;
|
||
|
|
this.perpage = 20;
|
||
|
|
this.order_desc = false;
|
||
|
|
this.sort_by = null;
|
||
|
|
this.loadBooks();
|
||
|
|
}
|
||
|
|
},
|
||
|
|
mounted: function() {
|
||
|
|
this.loadIndex();
|
||
|
|
}
|
||
|
|
})
|