Search form

This commit is contained in:
Meutel 2017-01-14 18:48:08 +01:00
parent 1213d7a62d
commit 0b9e09b600
2 changed files with 50 additions and 6 deletions

View File

@ -26,17 +26,50 @@
</div>
</nav>
<div class="container" id="app">
<div class="jumbotron">
<h1>Recherche</h1>
<div class="panel panel-primary">
<div class="panel-heading">
<h3>Recherche</h3>
</div>
<div class="panel-body">
<form>
<div class="form-group">
<input id="q" type="text" class="form-control" placeholder="Recherche">
</div>
<div class="form-group">
<label>Parmi</label><br/>
<label class="radio-inline">
<input type="radio" name="which" value="books" checked> livres
</label>
<label class="radio-inline">
<input type="radio" name="which" value="authors" disabled> auteurs
</label>
<label class="radio-inline">
<input type="radio" name="which" value="series" disabled> series
</label>
<label class="radio-inline">
<input type="radio" name="which" value="all" disabled> tous
</label>
</div>
<div class="form-group">
<div class="checkbox">
<label>
<input type="checkbox" id="all" disabled> Tous les mots
</label>
<p class="help-block">Cocher pour rechercher les élements contenant tous les mots saisis</p>
</div>
</div>
<button type="button" class="btn btn-primary" @click="searchFull">Rechercher</button>
</form>
</div>
</div>
<div v-if="books.length > 0">
<h2>{{ booksCount }} <template v-if="booksCount>1">livres</template><template v-else>livre</template></h2>
<ul>
<li v-for="book in books">
<li v-for="book in books" class="list-unstyled">
<span class="glyphicon glyphicon-book"></span>
<a :href="'book.html?id='+book.id">{{ book.title }}</a>
</li>
<li v-if="books.length < booksCount">...</li>
<li v-if="books.length < booksCount" class="list-unstyled">...</li>
</ul>
</div>
</div>

View File

@ -69,17 +69,28 @@ var app = new Vue({
this.sendQuery(this.searchParams('cgi-bin/bouquins/books'), this.stdError, this.searchBooksSuccess);
},
searchAll: function() {
this.clear();
this.searchBooks();
},
clear: function() {
this.authors = [];
this.books = [];
this.series = [];
this.booksCount = 0;
this.searchBooks();
},
searchFull: function() {
if (document.getElementById("q").value) {
this.clear();
this.terms = document.getElementById("q").value.split(' ');
// TODO criteria
this.searchBooks();
}
},
searchUrl: function() {
if (this.urlParams.q) {
this.terms = this.urlParams.q.split(' ');
this.searchAll();
// TODO copy in form
document.getElementById("q").value = this.urlParams.q;
}
}
},