2021-08-18 13:50:24 +02:00
< template >
2021-11-04 23:35:59 +01:00
< div class = "w-full h-20 md:h-10 relative" >
< div class = "flex md:hidden h-10 items-center" >
2022-10-29 01:10:19 +02:00
< nuxt -link :to ="`/library/${currentLibraryId}`" class = "flex-grow h-full flex justify-center items-center" : class = "isHomePage ? 'bg-primary bg-opacity-80' : 'bg-primary bg-opacity-40'" >
2022-11-17 00:23:18 +01:00
< p v-if ="isHomePage || isPodcastLibrary" class="text-sm" > {{ $ strings.ButtonHome }} < / p >
< svg v -else xmlns = "http://www.w3.org/2000/svg" class = "h-5 w-5" fill = "none" viewBox = "0 0 24 24" stroke = "currentColor" >
< path stroke -linecap = " round " stroke -linejoin = " round " stroke -width = " 2 " d = "M3 12l2-2m0 0l7-7 7 7M5 10v10a1 1 0 001 1h3m10-11l2 2m-2-2v10a1 1 0 01-1 1h-3m-6 0a1 1 0 001-1v-4a1 1 0 011-1h2a1 1 0 011 1v4a1 1 0 001 1m-6 0h6" / >
< / svg >
2021-11-04 23:35:59 +01:00
< / n u x t - l i n k >
2022-10-29 01:10:19 +02:00
< nuxt -link :to ="`/library/${currentLibraryId}/bookshelf`" class = "flex-grow h-full flex justify-center items-center" : class = "isLibraryPage ? 'bg-primary bg-opacity-80' : 'bg-primary bg-opacity-40'" >
2022-11-17 00:23:18 +01:00
< p v-if ="isLibraryPage || isPodcastLibrary" class="text-sm" > {{ $ strings.ButtonLibrary }} < / p >
< svg v -else xmlns = "http://www.w3.org/2000/svg" class = "h-5 w-5" fill = "none" viewBox = "0 0 24 24" stroke = "currentColor" >
< path stroke -linecap = " round " stroke -linejoin = " round " stroke -width = " 2 " d = "M12 6.253v13m0-13C10.832 5.477 9.246 5 7.5 5S4.168 5.477 3 6.253v13C4.168 18.477 5.754 18 7.5 18s3.332.477 4.5 1.253m0-13C13.168 5.477 14.754 5 16.5 5c1.747 0 3.332.477 4.5 1.253v13C19.832 18.477 18.247 18 16.5 18c-1.746 0-3.332.477-4.5 1.253" / >
< / svg >
< / n u x t - l i n k >
< nuxt -link v-if ="isPodcastLibrary" :to="`/library/${currentLibraryId}/podcast/latest`" class="flex-grow h-full flex justify-center items-center" :class="isPodcastLatestPage ? 'bg-primary bg-opacity-80' : 'bg-primary bg-opacity-40'" >
< p class = "text-sm" > { { $strings . ButtonLatest } } < / p >
2021-11-04 23:35:59 +01:00
< / n u x t - l i n k >
2022-12-22 23:38:55 +01:00
< nuxt -link v-if ="isBookLibrary" :to="`/library/${currentLibraryId}/bookshelf/series`" class="flex-grow h-full flex justify-center items-center" :class="isSeriesPage ? 'bg-primary bg-opacity-80' : 'bg-primary bg-opacity-40'" >
2022-11-17 00:23:18 +01:00
< p v-if ="isSeriesPage" class="text-sm" > {{ $ strings.ButtonSeries }} < / p >
< svg v -else xmlns = "http://www.w3.org/2000/svg" class = "h-5 w-5" fill = "none" viewBox = "0 0 24 24" stroke = "currentColor" >
< path stroke -linecap = " round " stroke -linejoin = " round " stroke -width = " 2 " d = "M9 17V7m0 10a2 2 0 01-2 2H5a2 2 0 01-2-2V7a2 2 0 012-2h2a2 2 0 012 2m0 10a2 2 0 002 2h2a2 2 0 002-2M9 7a2 2 0 012-2h2a2 2 0 012 2m0 10V7m0 10a2 2 0 002 2h2a2 2 0 002-2V7a2 2 0 00-2-2h-2a2 2 0 00-2 2" / >
< / svg >
2022-06-26 18:34:58 +02:00
< / n u x t - l i n k >
2022-12-22 23:38:55 +01:00
< nuxt -link v-if ="isBookLibrary" :to="`/library/${currentLibraryId}/bookshelf/collections`" class="flex-grow h-full flex justify-center items-center" :class="isCollectionsPage ? 'bg-primary bg-opacity-80' : 'bg-primary bg-opacity-40'" >
2022-11-17 00:23:18 +01:00
< p v-if ="isCollectionsPage" class="text-sm" > {{ $ strings.ButtonCollections }} < / p >
< span v -else class = "material-icons-outlined text-lg" > collections _bookmark < / span >
< / n u x t - l i n k >
2022-12-22 23:38:55 +01:00
< nuxt -link v-if ="isBookLibrary" :to="`/library/${currentLibraryId}/authors`" class="flex-grow h-full flex justify-center items-center" :class="isAuthorsPage ? 'bg-primary bg-opacity-80' : 'bg-primary bg-opacity-40'" >
2022-11-17 00:23:18 +01:00
< p v-if ="isAuthorsPage" class="text-sm" > {{ $ strings.ButtonAuthors }} < / p >
< svg v -else class = "w-5 h-5" viewBox = "0 0 24 24" >
< path
fill = "currentColor"
d = "M12,5.5A3.5,3.5 0 0,1 15.5,9A3.5,3.5 0 0,1 12,12.5A3.5,3.5 0 0,1 8.5,9A3.5,3.5 0 0,1 12,5.5M5,8C5.56,8 6.08,8.15 6.53,8.42C6.38,9.85 6.8,11.27 7.66,12.38C7.16,13.34 6.16,14 5,14A3,3 0 0,1 2,11A3,3 0 0,1 5,8M19,8A3,3 0 0,1 22,11A3,3 0 0,1 19,14C17.84,14 16.84,13.34 16.34,12.38C17.2,11.27 17.62,9.85 17.47,8.42C17.92,8.15 18.44,8 19,8M5.5,18.25C5.5,16.18 8.41,14.5 12,14.5C15.59,14.5 18.5,16.18 18.5,18.25V20H5.5V18.25M0,20V18.5C0,17.11 1.89,15.94 4.45,15.6C3.86,16.28 3.5,17.22 3.5,18.25V20H0M24,20H20.5V18.25C20.5,17.22 20.14,16.28 19.55,15.6C22.11,15.94 24,17.11 24,18.5V20Z"
/ >
< / svg >
2022-06-26 18:34:58 +02:00
< / n u x t - l i n k >
< nuxt -link v-if ="isPodcastLibrary && userIsAdminOrUp" :to="`/library/${currentLibraryId}/podcast/search`" class="flex-grow h-full flex justify-center items-center" :class="isPodcastSearchPage ? 'bg-primary bg-opacity-80' : 'bg-primary bg-opacity-40'" >
2022-11-08 01:27:17 +01:00
< p class = "text-sm" > { { $strings . ButtonSearch } } < / p >
2021-11-04 23:35:59 +01:00
< / n u x t - l i n k >
< / div >
2022-12-17 23:36:41 +01:00
< div id = "toolbar" class = "absolute top-10 md:top-0 left-0 w-full h-10 md:h-full z-40 flex items-center justify-end md:justify-start px-2 md:px-8" >
2022-11-16 00:05:03 +01:00
<!-- Series books page -- >
< template v-if ="selectedSeries" >
< p class = "pl-2 font-book text-base md:text-lg" >
{ { seriesName } }
< / p >
< div class = "w-6 h-6 rounded-full bg-black bg-opacity-30 flex items-center justify-center ml-3" >
< span class = "font-mono" > { { numShowing } } < / span >
2021-09-24 14:32:38 +02:00
< / div >
2022-11-16 00:05:03 +01:00
< div class = "flex-grow" / >
2022-11-19 18:24:21 +01:00
< ui -checkbox v -if = " ! isBatchSelecting " v -model = " settings.collapseBookSeries " :label ="$strings.LabelCollapseSeries" checkbox -bg = " bg " check -color = " white " small class = "mr-2" @input ="updateCollapseBookSeries" / >
2022-12-31 21:56:18 +01:00
< ui -context -menu -dropdown v -if = " ! isBatchSelecting & & seriesContextMenuItems.length " :items ="seriesContextMenuItems" class = "mx-px" @action ="seriesContextMenuAction" / >
2022-11-16 00:05:03 +01:00
< / template >
<!-- library & collections page -- >
< template v -else -if = " page ! = = ' search ' & & page ! = = ' podcast -search ' & & page ! = = ' recent -episodes ' & & ! isHome " >
< p class = "font-book hidden md:block" > { { numShowing } } { { entityName } } < / p >
2022-02-09 18:19:02 +01:00
< div class = "flex-grow hidden sm:inline-block" / >
2021-09-05 20:21:02 +02:00
2022-12-22 23:38:55 +01:00
< ui -checkbox v -if = " isLibraryPage & & isBookLibrary & & ! isBatchSelecting " v -model = " settings.collapseSeries " :label ="$strings.LabelCollapseSeries" checkbox -bg = " bg " check -color = " white " small class = "mr-2" @input ="updateCollapseSeries" / >
2022-11-19 18:24:21 +01:00
< controls -library -filter -select v -if = " isLibraryPage & & ! isBatchSelecting " v -model = " settings.filterBy " class = "w-36 sm:w-44 md:w-48 h-7.5 ml-1 sm:ml-4" @change ="updateFilter" / >
< controls -library -sort -select v -if = " isLibraryPage & & ! isBatchSelecting " v -model = " settings.orderBy " :descending.sync ="settings.orderDesc" class = "w-36 sm:w-44 md:w-48 h-7.5 ml-1 sm:ml-4" @change ="updateOrder" / >
2022-12-17 22:10:25 +01:00
< controls -library -filter -select v -if = " isSeriesPage & & ! isBatchSelecting " v -model = " settings.seriesFilterBy " is -series class = "w-36 sm:w-44 md:w-48 h-7.5 ml-1 sm:ml-4" @change ="updateSeriesFilter" / >
< controls -sort -select v -if = " isSeriesPage & & ! isBatchSelecting " v -model = " settings.seriesSortBy " :descending.sync ="settings.seriesSortDesc" :items ="seriesSortItems" class = "w-36 sm:w-44 md:w-48 h-7.5 ml-1 sm:ml-4" @change ="updateSeriesSort" / >
2022-04-25 01:25:33 +02:00
2022-11-19 18:24:21 +01:00
< ui -btn v-if ="isIssuesFilter && userCanDelete && !isBatchSelecting" :loading="processingIssues" color="error" small class="ml-4" @click="removeAllIssues" > {{ $ strings.ButtonRemoveAll }} {{ numShowing }} {{ entityName }} < / ui -btn >
2021-09-24 23:14:33 +02:00
< / template >
2022-11-16 00:05:03 +01:00
<!-- search page -- >
2021-12-02 02:07:03 +01:00
< template v -else -if = " page = = = ' search ' " >
2021-09-24 23:14:33 +02:00
< div class = "flex-grow" / >
2022-11-08 01:27:17 +01:00
< p > { { $strings . MessageSearchResultsFor } } "{{ searchQuery }}" < / p >
2021-09-24 23:14:33 +02:00
< div class = "flex-grow" / >
< / template >
2022-11-16 00:05:03 +01:00
<!-- authors page -- >
2022-05-29 19:15:39 +02:00
< template v -else -if = " page = = = ' authors ' " >
< div class = "flex-grow" / >
2022-11-19 18:24:21 +01:00
< ui -btn v-if ="userCanUpdate && authors && authors.length && !isBatchSelecting" :loading="processingAuthors" color="primary" small @click="matchAllAuthors" > {{ $ strings.ButtonMatchAllAuthors }} < / ui -btn >
2022-05-29 19:15:39 +02:00
< / template >
2021-08-18 13:50:24 +02:00
< / div >
< / div >
< / template >
< script >
export default {
2021-09-24 14:32:38 +02:00
props : {
page : String ,
2021-09-28 13:44:40 +02:00
isHome : Boolean ,
2022-04-25 00:46:21 +02:00
selectedSeries : {
type : Object ,
default : ( ) => null
} ,
2021-10-30 03:42:28 +02:00
searchQuery : String ,
2022-05-29 19:15:39 +02:00
authors : {
type : Array ,
default : ( ) => [ ]
2022-09-28 00:48:45 +02:00
}
2021-09-24 14:32:38 +02:00
} ,
2021-08-18 13:50:24 +02:00
data ( ) {
2021-08-19 03:18:44 +02:00
return {
2021-08-24 01:31:04 +02:00
settings : { } ,
2021-12-01 03:02:40 +01:00
hasInit : false ,
totalEntities : 0 ,
2022-04-25 01:25:33 +02:00
processingSeries : false ,
2022-05-29 19:15:39 +02:00
processingIssues : false ,
2022-12-31 21:56:18 +01:00
processingAuthors : false ,
contextMenuItems : [
{
text : 'cat' ,
action : 'dog'
}
]
2022-11-21 00:11:51 +01:00
}
} ,
computed : {
2022-12-31 21:56:18 +01:00
seriesContextMenuItems ( ) {
if ( ! this . selectedSeries ) return [ ]
const items = [
{
text : this . isSeriesFinished ? 'Mark series as not finished' : 'Mark series as finished' ,
action : 'mark-series-finished'
}
]
if ( this . userIsAdminOrUp || this . selectedSeries . rssFeed ) {
items . push ( {
text : this . $strings . LabelOpenRSSFeed ,
action : 'open-rss-feed'
} )
}
if ( this . isSeriesRemovedFromContinueListening ) {
items . push ( {
text : 'Re-Add Series to Continue Listening' ,
action : 're-add-to-continue-listening'
} )
}
return items
} ,
2022-11-21 00:11:51 +01:00
seriesSortItems ( ) {
return [
2022-10-29 01:10:19 +02:00
{
2022-11-21 00:11:51 +01:00
text : this . $strings . LabelName ,
2022-10-29 01:10:19 +02:00
value : 'name'
} ,
{
2022-11-21 00:11:51 +01:00
text : this . $strings . LabelNumberOfBooks ,
2022-10-29 01:10:19 +02:00
value : 'numBooks'
} ,
{
2022-11-21 00:11:51 +01:00
text : this . $strings . LabelAddedAt ,
2022-10-29 01:10:19 +02:00
value : 'addedAt'
} ,
{
2022-11-21 00:11:51 +01:00
text : this . $strings . LabelTotalDuration ,
2022-10-29 01:10:19 +02:00
value : 'totalDuration'
}
]
2022-11-21 00:11:51 +01:00
} ,
2022-06-26 18:34:58 +02:00
userIsAdminOrUp ( ) {
return this . $store . getters [ 'user/getIsAdminOrUp' ]
} ,
2022-04-25 01:25:33 +02:00
userCanDelete ( ) {
return this . $store . getters [ 'user/getUserCanDelete' ]
} ,
2022-05-29 19:15:39 +02:00
userCanUpdate ( ) {
return this . $store . getters [ 'user/getUserCanUpdate' ]
} ,
2021-10-06 04:10:49 +02:00
currentLibraryId ( ) {
return this . $store . state . libraries . currentLibraryId
2021-11-04 23:35:59 +01:00
} ,
2022-06-26 18:34:58 +02:00
currentLibraryMediaType ( ) {
return this . $store . getters [ 'libraries/getCurrentLibraryMediaType' ]
} ,
2022-12-22 23:38:55 +01:00
isBookLibrary ( ) {
return this . currentLibraryMediaType === 'book'
} ,
2022-06-26 18:34:58 +02:00
isPodcastLibrary ( ) {
return this . currentLibraryMediaType === 'podcast'
} ,
2022-12-22 23:38:55 +01:00
isMusicLibrary ( ) {
return this . currentLibraryMediaType === 'music'
} ,
2022-10-29 01:10:19 +02:00
isLibraryPage ( ) {
return this . page === ''
} ,
isSeriesPage ( ) {
return this . page === 'series'
} ,
isCollectionsPage ( ) {
return this . page === 'collections'
} ,
2022-11-27 00:24:46 +01:00
isPlaylistsPage ( ) {
return this . page === 'playlists'
} ,
2022-10-29 01:10:19 +02:00
isHomePage ( ) {
2021-11-04 23:35:59 +01:00
return this . $route . name === 'library-library'
} ,
2022-10-29 01:10:19 +02:00
isPodcastSearchPage ( ) {
return this . $route . name === 'library-library-podcast-search'
2021-11-04 23:35:59 +01:00
} ,
2022-11-17 00:23:18 +01:00
isPodcastLatestPage ( ) {
return this . $route . name === 'library-library-podcast-latest'
} ,
isAuthorsPage ( ) {
return this . $route . name === 'library-library-authors'
} ,
2022-10-29 01:10:19 +02:00
numShowing ( ) {
return this . totalEntities
} ,
entityName ( ) {
2022-12-22 23:38:55 +01:00
if ( this . isMusicLibrary ) return 'Tracks'
2022-11-08 01:27:17 +01:00
if ( this . isPodcastLibrary ) return this . $strings . LabelPodcasts
if ( ! this . page ) return this . $strings . LabelBooks
if ( this . isSeriesPage ) return this . $strings . LabelSeries
if ( this . isCollectionsPage ) return this . $strings . LabelCollections
2022-11-27 00:24:46 +01:00
if ( this . isPlaylistsPage ) return this . $strings . LabelPlaylists
2022-10-29 01:10:19 +02:00
return ''
2022-04-25 00:46:21 +02:00
} ,
2022-11-16 00:20:57 +01:00
seriesId ( ) {
return this . selectedSeries ? this . selectedSeries . id : null
} ,
2022-04-25 00:46:21 +02:00
seriesName ( ) {
return this . selectedSeries ? this . selectedSeries . name : null
} ,
seriesProgress ( ) {
return this . selectedSeries ? this . selectedSeries . progress : null
} ,
seriesLibraryItemIds ( ) {
if ( ! this . seriesProgress ) return [ ]
return this . seriesProgress . libraryItemIds || [ ]
} ,
2022-11-19 18:24:21 +01:00
isBatchSelecting ( ) {
2022-12-01 00:09:00 +01:00
return this . $store . getters [ 'globals/getIsBatchSelectingMediaItems' ]
2022-11-19 18:24:21 +01:00
} ,
2022-04-25 00:46:21 +02:00
isSeriesFinished ( ) {
return this . seriesProgress && ! ! this . seriesProgress . isFinished
2022-04-25 01:25:33 +02:00
} ,
2022-11-16 00:20:57 +01:00
isSeriesRemovedFromContinueListening ( ) {
if ( ! this . seriesId ) return false
return this . $store . getters [ 'user/getIsSeriesRemovedFromContinueListening' ] ( this . seriesId )
} ,
2022-04-25 01:25:33 +02:00
filterBy ( ) {
return this . $store . getters [ 'user/getUserSetting' ] ( 'filterBy' )
} ,
isIssuesFilter ( ) {
2022-05-12 00:39:15 +02:00
return this . filterBy === 'issues' && this . $route . query . filter === 'issues'
2021-08-19 03:18:44 +02:00
}
} ,
methods : {
2022-12-31 21:56:18 +01:00
seriesContextMenuAction ( action ) {
if ( action === 'open-rss-feed' ) {
// TODO: Open RSS Feed
} else if ( action === 're-add-to-continue-listening' ) {
if ( this . processingSeries ) {
console . warn ( 'Already processing series' )
return
}
this . reAddSeriesToContinueListening ( )
} else if ( action === 'mark-series-finished' ) {
if ( this . processingSeries ) {
console . warn ( 'Already processing series' )
return
}
this . markSeriesFinished ( )
}
} ,
2022-11-16 00:20:57 +01:00
reAddSeriesToContinueListening ( ) {
this . processingSeries = true
this . $axios
. $get ( ` /api/me/series/ ${ this . seriesId } /readd-to-continue-listening ` )
. then ( ( ) => {
this . $toast . success ( 'Series re-added to continue listening' )
} )
. catch ( ( error ) => {
console . error ( 'Failed to re-add series to continue listening' , error )
this . $toast . error ( 'Failed to re-add series to continue listening' )
} )
. finally ( ( ) => {
this . processingSeries = false
} )
} ,
2022-05-29 19:15:39 +02:00
async matchAllAuthors ( ) {
this . processingAuthors = true
for ( const author of this . authors ) {
const payload = { }
if ( author . asin ) payload . asin = author . asin
else payload . q = author . name
console . log ( 'Payload' , payload , 'author' , author )
this . $eventBus . $emit ( ` searching-author- ${ author . id } ` , true )
var response = await this . $axios . $post ( ` /api/authors/ ${ author . id } /match ` , payload ) . catch ( ( error ) => {
console . error ( 'Failed' , error )
return null
} )
if ( ! response ) {
console . error ( ` Author ${ author . name } not found ` )
this . $toast . error ( ` Author ${ author . name } not found ` )
} else if ( response . updated ) {
if ( response . author . imagePath ) console . log ( ` Author ${ response . author . name } was updated ` )
else console . log ( ` Author ${ response . author . name } was updated (no image found) ` )
} else {
console . log ( ` No updates were made for Author ${ response . author . name } ` )
}
this . $eventBus . $emit ( ` searching-author- ${ author . id } ` , false )
}
this . processingAuthors = false
} ,
2022-04-25 01:25:33 +02:00
removeAllIssues ( ) {
if ( confirm ( ` Are you sure you want to remove all library items with issues? \ n \ nNote: This will not delete any files ` ) ) {
this . processingIssues = true
this . $axios
. $delete ( ` /api/libraries/ ${ this . currentLibraryId } /issues ` )
. then ( ( ) => {
this . $toast . success ( 'Removed library items with issues' )
this . $router . push ( ` /library/ ${ this . currentLibraryId } /bookshelf ` )
2022-09-03 00:20:38 +02:00
this . $store . dispatch ( 'libraries/fetch' , this . currentLibraryId )
2022-04-25 01:25:33 +02:00
} )
. catch ( ( error ) => {
console . error ( 'Failed to remove library items with issues' , error )
this . $toast . error ( 'Failed to remove library items with issues' )
2022-11-16 00:20:57 +01:00
} )
. finally ( ( ) => {
2022-04-25 01:25:33 +02:00
this . processingIssues = false
} )
}
} ,
2022-04-25 00:46:21 +02:00
markSeriesFinished ( ) {
2022-12-31 21:56:18 +01:00
const newIsFinished = ! this . isSeriesFinished
const message = newIsFinished ? 'Are you sure you want to mark all books in this series as finished?' : 'Are you sure you want to reset your progress on all books in this series?'
const payload = {
message ,
callback : ( confirmed ) => {
if ( confirmed ) {
this . processingSeries = true
const updateProgressPayloads = this . seriesLibraryItemIds . map ( ( lid ) => {
return {
libraryItemId : lid ,
isFinished : newIsFinished
}
} )
console . log ( 'Progress payloads' , updateProgressPayloads )
this . $axios
. patch ( ` /api/me/progress/batch/update ` , updateProgressPayloads )
. then ( ( ) => {
this . $toast . success ( 'Series update success' )
this . selectedSeries . progress . isFinished = newIsFinished
this . processingSeries = false
} )
. catch ( ( error ) => {
this . $toast . error ( 'Series update failed' )
console . error ( 'Failed to batch update read/not read' , error )
this . processingSeries = false
} )
}
} ,
type : 'yesNo'
}
this . $store . commit ( 'globals/setConfirmPrompt' , payload )
2022-04-25 00:46:21 +02:00
} ,
2021-08-19 03:18:44 +02:00
updateOrder ( ) {
this . saveSettings ( )
} ,
updateFilter ( ) {
this . saveSettings ( )
} ,
2022-10-29 01:10:19 +02:00
updateSeriesSort ( ) {
2022-12-17 22:10:25 +01:00
this . saveSettings ( )
2022-10-29 01:10:19 +02:00
} ,
2022-10-29 22:33:38 +02:00
updateSeriesFilter ( ) {
2022-12-17 22:10:25 +01:00
this . saveSettings ( )
2022-10-29 22:33:38 +02:00
} ,
2022-01-25 01:03:54 +01:00
updateCollapseSeries ( ) {
this . saveSettings ( )
} ,
2022-11-03 14:11:33 +01:00
updateCollapseBookSeries ( ) {
this . saveSettings ( )
} ,
2021-08-19 03:18:44 +02:00
saveSettings ( ) {
2021-08-24 01:31:04 +02:00
this . $store . dispatch ( 'user/updateUserSettings' , this . settings )
2021-08-18 13:50:24 +02:00
} ,
2021-08-19 03:18:44 +02:00
init ( ) {
2021-08-24 01:31:04 +02:00
this . settings = { ... this . $store . state . user . settings }
} ,
settingsUpdated ( settings ) {
for ( const key in settings ) {
this . settings [ key ] = settings [ key ]
}
2021-12-01 03:02:40 +01:00
} ,
setBookshelfTotalEntities ( totalEntities ) {
this . totalEntities = totalEntities
2021-08-18 13:50:24 +02:00
}
} ,
2021-08-19 03:18:44 +02:00
mounted ( ) {
this . init ( )
2022-12-17 21:50:01 +01:00
this . $eventBus . $on ( 'user-settings' , this . settingsUpdated )
2021-12-01 03:02:40 +01:00
this . $eventBus . $on ( 'bookshelf-total-entities' , this . setBookshelfTotalEntities )
2021-08-24 01:31:04 +02:00
} ,
beforeDestroy ( ) {
2022-12-17 21:50:01 +01:00
this . $eventBus . $off ( 'user-settings' , this . settingsUpdated )
2021-12-01 03:02:40 +01:00
this . $eventBus . $off ( 'bookshelf-total-entities' , this . setBookshelfTotalEntities )
2021-08-19 03:18:44 +02:00
}
2021-08-18 13:50:24 +02:00
}
< / script >
< style >
# toolbar {
2021-09-26 22:34:08 +02:00
box - shadow : 0 px 8 px 6 px # 111111 aa ;
2021-08-18 13:50:24 +02:00
}
2022-09-02 03:03:41 +02:00
< / style >