mirror of
https://github.com/advplyr/audiobookshelf.git
synced 2025-08-04 02:05:06 +02:00
Lazy bookshelf finalized
This commit is contained in:
advplyr
parent
5c92aef048
commit
1ef9a689bc
53 changed files with 914 additions and 795 deletions
|
|
@ -3,9 +3,8 @@
|
|||
<div class="flex h-full">
|
||||
<app-side-rail class="hidden md:block" />
|
||||
<div class="flex-grow">
|
||||
<app-book-shelf-toolbar :page="id || ''" :search-results="searchResults" :search-query="searchQuery" :selected-series.sync="selectedSeries" :view-mode.sync="viewMode" />
|
||||
<app-lazy-bookshelf :page="id || ''" />
|
||||
<!-- <app-book-shelf :page="id || ''" :search-results="searchResults" :search-query="searchQuery" :selected-series.sync="selectedSeries" :view-mode="viewMode" /> -->
|
||||
<app-book-shelf-toolbar :page="id || ''" :view-mode.sync="viewMode" />
|
||||
<app-lazy-bookshelf :page="id || ''" :view-mode="viewMode" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -25,39 +24,13 @@ export default {
|
|||
store.dispatch('user/updateUserSettings', { filterBy: query.filter })
|
||||
}
|
||||
|
||||
// Search page
|
||||
var searchResults = {}
|
||||
var audiobookSearchResults = []
|
||||
var searchQuery = null
|
||||
if (params.id === 'search' && query.query) {
|
||||
searchQuery = query.query
|
||||
|
||||
searchResults = await app.$axios.$get(`/api/libraries/${libraryId}/search?q=${searchQuery}`).catch((error) => {
|
||||
console.error('Search error', error)
|
||||
return {}
|
||||
})
|
||||
audiobookSearchResults = searchResults.audiobooks || []
|
||||
store.commit('audiobooks/setSearchResults', searchResults)
|
||||
if (audiobookSearchResults.length) audiobookSearchResults.forEach((ab) => store.commit('audiobooks/addUpdate', ab.audiobook))
|
||||
}
|
||||
|
||||
// Series page
|
||||
var selectedSeries = query.series ? app.$decode(query.series) : null
|
||||
store.commit('audiobooks/setSelectedSeries', selectedSeries)
|
||||
|
||||
var libraryPage = params.id || ''
|
||||
store.commit('audiobooks/setLibraryPage', libraryPage)
|
||||
|
||||
if (libraryPage === 'collections') {
|
||||
store.dispatch('user/loadUserCollections')
|
||||
}
|
||||
// if (libraryPage === 'collections') {
|
||||
// store.dispatch('user/loadUserCollections')
|
||||
// }
|
||||
|
||||
return {
|
||||
id: libraryPage,
|
||||
libraryId,
|
||||
searchQuery,
|
||||
searchResults,
|
||||
selectedSeries
|
||||
id: params.id || '',
|
||||
libraryId
|
||||
}
|
||||
},
|
||||
data() {
|
||||
|
|
@ -65,40 +38,11 @@ export default {
|
|||
viewMode: 'grid'
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
'$route.query'(newVal) {
|
||||
if (this.id === 'search' && this.$route.query.query) {
|
||||
if (this.$route.query.query !== this.searchQuery) {
|
||||
this.newQuery()
|
||||
}
|
||||
} else if (this.id === 'series') {
|
||||
if (this.selectedSeries && this.$route.query.series && this.$route.query.series !== this.$encode(this.selectedSeries)) {
|
||||
// Series changed
|
||||
this.selectedSeries = this.$decode(this.$route.query.series)
|
||||
} else if (!this.selectedSeries && this.$route.query.series) {
|
||||
// Series selected
|
||||
this.selectedSeries = this.$decode(this.$route.query.series)
|
||||
} else if (this.selectedSeries && !this.$route.query.series) {
|
||||
// Series unselected
|
||||
this.selectedSeries = null
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
streamAudiobook() {
|
||||
return this.$store.state.streamAudiobook
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
async newQuery() {
|
||||
var query = this.$route.query.query
|
||||
this.searchResults = await this.$axios.$get(`/api/libraries/${this.libraryId}/search?q=${query}`).catch((error) => {
|
||||
console.error('Search error', error)
|
||||
return {}
|
||||
})
|
||||
this.searchQuery = query
|
||||
}
|
||||
}
|
||||
methods: {}
|
||||
}
|
||||
</script>
|
||||
|
|
@ -3,8 +3,8 @@
|
|||
<div class="flex h-full">
|
||||
<app-side-rail class="hidden md:block" />
|
||||
<div class="flex-grow">
|
||||
<app-book-shelf-toolbar is-home />
|
||||
<app-book-shelf-categorized v-if="hasResults" search :results="results" />
|
||||
<app-book-shelf-toolbar is-home page="search" :search-query="query" />
|
||||
<app-book-shelf-categorized v-if="hasResults" ref="bookshelf" search :results="results" />
|
||||
<div v-else class="w-full py-16">
|
||||
<p class="text-xl text-center">No Search results for "{{ query }}"</p>
|
||||
<div class="flex justify-center">
|
||||
|
|
@ -20,6 +20,10 @@
|
|||
export default {
|
||||
async asyncData({ store, params, redirect, query, app }) {
|
||||
var libraryId = params.library
|
||||
var library = await store.dispatch('libraries/fetch', libraryId)
|
||||
if (!library) {
|
||||
return redirect('/oops?message=Library not found')
|
||||
}
|
||||
var query = query.q
|
||||
var results = await app.$axios.$get(`/api/libraries/${libraryId}/search?q=${query}`).catch((error) => {
|
||||
console.error('Failed to search library', error)
|
||||
|
|
@ -31,8 +35,8 @@ export default {
|
|||
series: results && results.series.length ? results.series : null,
|
||||
tags: results && results.tags.length ? results.tags : null
|
||||
}
|
||||
console.log('SEARCH RESULTS', results)
|
||||
return {
|
||||
libraryId,
|
||||
results,
|
||||
query
|
||||
}
|
||||
|
|
@ -40,6 +44,14 @@ export default {
|
|||
data() {
|
||||
return {}
|
||||
},
|
||||
watch: {
|
||||
'$route.query'(newVal, oldVal) {
|
||||
if (newVal && newVal.q && newVal.q !== this.query) {
|
||||
this.query = newVal.q
|
||||
this.search()
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
streamAudiobook() {
|
||||
return this.$store.state.streamAudiobook
|
||||
|
|
@ -49,6 +61,23 @@ export default {
|
|||
}
|
||||
},
|
||||
methods: {
|
||||
async search() {
|
||||
var results = await this.$axios.$get(`/api/libraries/${this.libraryId}/search?q=${this.query}`).catch((error) => {
|
||||
console.error('Failed to search library', error)
|
||||
return null
|
||||
})
|
||||
this.results = {
|
||||
audiobooks: results && results.audiobooks.length ? results.audiobooks : null,
|
||||
authors: results && results.authors.length ? results.authors : null,
|
||||
series: results && results.series.length ? results.series : null,
|
||||
tags: results && results.tags.length ? results.tags : null
|
||||
}
|
||||
this.$nextTick(() => {
|
||||
if (this.$refs.bookshelf) {
|
||||
this.$refs.bookshelf.setShelvesFromSearch()
|
||||
}
|
||||
})
|
||||
},
|
||||
async back() {
|
||||
var popped = await this.$store.dispatch('popRoute')
|
||||
if (popped) this.$store.commit('setIsRoutingBack', true)
|
||||
|
|
|
|||
38
client/pages/library/_library/series/_id.vue
Normal file
38
client/pages/library/_library/series/_id.vue
Normal file
|
|
@ -0,0 +1,38 @@
|
|||
<template>
|
||||
<div class="page" :class="streamAudiobook ? 'streaming' : ''">
|
||||
<div class="flex h-full">
|
||||
<app-side-rail class="hidden md:block" />
|
||||
<div class="flex-grow">
|
||||
<app-book-shelf-toolbar :selected-series="series" />
|
||||
<app-lazy-bookshelf page="series-books" :series-id="seriesId" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
async asyncData({ store, params, redirect, query, app }) {
|
||||
var libraryId = params.library
|
||||
var library = await store.dispatch('libraries/fetch', libraryId)
|
||||
if (!library) {
|
||||
return redirect('/oops?message=Library not found')
|
||||
}
|
||||
|
||||
return {
|
||||
series: app.$decode(params.id),
|
||||
seriesId: params.id
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {}
|
||||
},
|
||||
computed: {
|
||||
streamAudiobook() {
|
||||
return this.$store.state.streamAudiobook
|
||||
}
|
||||
},
|
||||
mounted() {},
|
||||
beforeDestroy() {}
|
||||
}
|
||||
</script>
|
||||
Loading…
Add table
Add a link
Reference in a new issue