Some changes
This commit is contained in:
parent
99d2507248
commit
a35c8899ac
27 changed files with 200 additions and 48 deletions
|
@ -1,12 +1,6 @@
|
|||
<div class="container">
|
||||
<div class="columns is-mobile">
|
||||
<div class="
|
||||
column
|
||||
is-10-mobile is-offset-1-mobile
|
||||
is-8-tablet is-offset-2-tablet
|
||||
is-6-desktop is-offset-3-desktop
|
||||
is-4-widescreen is-offset-4-widescreen
|
||||
">
|
||||
<div class="column is-10-mobile is-offset-1-mobile is-8-tablet is-offset-2-tablet is-6-desktop is-offset-3-desktop is-4-widescreen is-offset-4-widescreen">
|
||||
<form class="box" method="POST">
|
||||
<div class="has-text-centered">
|
||||
<img class="mb-4" src="/img/logo.png" alt="DarKou">
|
||||
|
|
16
views/pages/home.ejs
Normal file
16
views/pages/home.ejs
Normal file
|
@ -0,0 +1,16 @@
|
|||
<section class="section">
|
||||
<div class="container">
|
||||
<div class="header"></div>
|
||||
<h1 class="title">
|
||||
Ma CDThèque
|
||||
</h1>
|
||||
<p class="subtitle">
|
||||
Retrouvez votre CDThèque partout depuis votre PC ou votre smartphone.
|
||||
</p>
|
||||
<p>
|
||||
Ma CDThèque est un site web permettant de sauvegarder votre liste des CDs ou Vinyles et de la retrouver facilement et n'importe ou !
|
||||
<br />
|
||||
Le code source est publiée sous licence <a href="https://www.gnu.org/licenses/gpl-3.0-standalone.html">GNU GPL-3.0-or-later</a>. Le code source est librement accessible sur <a href="https://git.darkou.fr/dbroqua/nodecdtheque">git.darkou.fr</a>.
|
||||
</p>
|
||||
</div>
|
||||
</section>
|
|
@ -1,12 +1,6 @@
|
|||
<div class="container">
|
||||
<div class="columns is-mobile">
|
||||
<div class="
|
||||
column
|
||||
is-10-mobile is-offset-1-mobile
|
||||
is-8-tablet is-offset-2-tablet
|
||||
is-6-desktop is-offset-3-desktop
|
||||
is-4-widescreen is-offset-4-widescreen
|
||||
">
|
||||
<div class="column is-10-mobile is-offset-1-mobile is-8-tablet is-offset-2-tablet is-6-desktop is-offset-3-desktop is-4-widescreen is-offset-4-widescreen">
|
||||
<form class="box" method="POST">
|
||||
<div class="has-text-centered">
|
||||
<img class="mb-4" src="/img/logo.png" alt="DarKou">
|
||||
|
@ -38,7 +32,7 @@
|
|||
</div>
|
||||
|
||||
<button class="button is-link">Inscription</button>
|
||||
</form>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
|
@ -17,7 +17,7 @@
|
|||
</label>
|
||||
<div class="control">
|
||||
<div class="select is-small">
|
||||
<select v-model="artist" @change="fetch">
|
||||
<select v-model="artist" @change="changeFilter">
|
||||
<option value="">Tous</option>
|
||||
<%
|
||||
for (let i = 0; i < page.artists.length; i += 1 ) {
|
||||
|
@ -50,7 +50,32 @@
|
|||
<span>Pays</span>
|
||||
</span>
|
||||
</th>
|
||||
<th>Format</th>
|
||||
<th>
|
||||
<div class="field">
|
||||
<label class="label">
|
||||
<span class="icon-text">
|
||||
<span class="icon has-text-info">
|
||||
<i v-if="sort !== 'formats.name'" class="fa-solid fa-sort" @click="changeSort('formats.name', 'asc')"></i>
|
||||
<i v-if="sort === 'formats.name' && order === 'desc'" class="fa-solid fa-sort-down" @click="changeSort('formats.name', 'asc')"></i>
|
||||
<i v-if="sort === 'formats.name' && order === 'asc'" class="fa-solid fa-sort-up" @click="changeSort('formats.name', 'desc')"></i>
|
||||
</span>
|
||||
<span>Format</span>
|
||||
</span>
|
||||
</label>
|
||||
<div class="control">
|
||||
<div class="select is-small">
|
||||
<select v-model="format" @change="changeFilter">
|
||||
<option value="">Tous</option>
|
||||
<%
|
||||
for (let i = 0; i < page.formats.length; i += 1 ) {
|
||||
__append(`<option value="${page.formats[i]}">${page.formats[i]}</option>`);
|
||||
}
|
||||
%>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</th>
|
||||
<th>Genres</th>
|
||||
<th>Styles</th>
|
||||
</tr>
|
||||
|
@ -129,6 +154,7 @@
|
|||
totalPages: 1,
|
||||
limit: 5,
|
||||
artist: '',
|
||||
format: '',
|
||||
sort: 'artists_sort',
|
||||
order: 'asc',
|
||||
}
|
||||
|
@ -140,7 +166,15 @@
|
|||
fetch() {
|
||||
this.loading = true;
|
||||
|
||||
axios.get(`/api/v1/albums?page=${this.page}&limit=${this.limit}&artists_sort=${this.artist}&sort=${this.sort}&order=${this.order}`)
|
||||
let url = `/api/v1/albums?page=${this.page}&limit=${this.limit}&sort=${this.sort}&order=${this.order}`;
|
||||
if ( this.artist ) {
|
||||
url += `&artists_sort=${this.artist}`;
|
||||
}
|
||||
if ( this.format ) {
|
||||
url += `&format=${this.format}`;
|
||||
}
|
||||
|
||||
axios.get(url)
|
||||
.then( response => {
|
||||
this.items = response.data.rows;
|
||||
this.total = response.data.count;
|
||||
|
@ -180,6 +214,11 @@
|
|||
|
||||
this.fetch();
|
||||
},
|
||||
changeFilter() {
|
||||
this.page = 1;
|
||||
|
||||
this.fetch();
|
||||
}
|
||||
}
|
||||
}).mount('#app')
|
||||
</script>
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue