meutel/bouquins-bchs
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Refactoring vue.js

Browse Source
This commit is contained in:
Meutel 2016-12-31 12:16:42 +01:00
parent 7ed350445f
commit e2e6ba7075
2 changed files with 44 additions and 56 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
index.html
View File

@ -15,7 +15,7 @@
<div class="jumbotron"> <div class="jumbotron">
<h1>Bouquins</h1> <h1>Bouquins</h1>
<p>Cette bibliothèque contient actuellement <strong>{{ booksCount }}</strong> livres et BD en format papier ou électronique.</p> <p>Cette bibliothèque contient actuellement <strong>{{ booksCount }}</strong> livres et BD en format papier ou électronique.</p>
<button class="btn btn-primary" type="button" v-on:click="loadBooks">Livres</button> <button class="btn btn-primary" type="button" @click="loadBooks">Livres</button>
</div> </div>
<div class="table-responsive" v-if="books.length > 0"> <div class="table-responsive" v-if="books.length > 0">
<table class="table table-striped"> <table class="table table-striped">

58
index.js
View File

@ -1,8 +1,11 @@
(function(root) { var app = new Vue({
'use strict'; el: '#app',
data: {
function sendQuery(url, error, success) books: [],
{ booksCount: 0
},
methods: {
sendQuery: function(url, error, success) {
var xmh = new XMLHttpRequest(); var xmh = new XMLHttpRequest();
var v; var v;
@ -26,39 +29,24 @@
xmh.open('GET', url, true); xmh.open('GET', url, true);
xmh.send(null); xmh.send(null);
} },
stdError: function(code, resp) {
function stdError(code, resp) {
console.log('ERROR ' + 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);
},
booksSuccess: function(resp) {
this.books = resp;
},
loadBooks: function() {
this.sendQuery('cgi-bin/bouquins/books', this.stdError, this.booksSuccess);
} }
function booksSuccess(resp) {
app.books = resp;
}
function indexSuccess(resp) {
app.booksCount = resp.count;
}
function loadIndex() {
sendQuery('cgi-bin/bouquins/index', stdError, indexSuccess);
}
function loadBooks() {
sendQuery('cgi-bin/bouquins/books', stdError, booksSuccess);
}
root.loadIndex = loadIndex;
root.loadBooks = loadBooks;
})(this);
var app = new Vue({
el: '#app',
data: {
books: [],
booksCount: 0
}, },
mounted: function() { mounted: function() {
loadIndex(); this.loadIndex();
} }
}) })