MyFavMirrors/owntone-server
1
0
Fork 0
mirror of https://github.com/owntone/owntone-server.git synced 2025-03-31 01:33:44 -04:00
Code Issues Packages Projects Releases Wiki Activity

[web]S Streamline code of pages

Browse Source
This commit is contained in:
Alain Nussbaumer 2023-12-07 21:31:10 +01:00
parent 0940950083
commit d0cd0c4bc7
13 changed files with 72 additions and 74 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
web-src/src/pages/PageAlbumSpotify.vue
View File

@ -17,7 +17,7 @@
</a> </a>
<a <a
class="button is-small is-light is-rounded" class="button is-small is-light is-rounded"
@click="show_album_details_modal = true" @click="show_details_modal = true"
> >
<mdicon class="icon" name="dots-horizontal" size="16" /> <mdicon class="icon" name="dots-horizontal" size="16" />
</a> </a>
@ -29,7 +29,7 @@
:artist="album.artist" :artist="album.artist"
:album="album.name" :album="album.name"
class="is-clickable fd-has-shadow fd-cover fd-cover-medium-image" class="is-clickable fd-has-shadow fd-cover fd-cover-medium-image"
@click="show_album_details_modal = true" @click="show_details_modal = true"
/> />
</template> </template>
<template #content> <template #content>
@ -56,17 +56,17 @@
</a> </a>
</template> </template>
</list-item-track-spotify> </list-item-track-spotify>
<modal-dialog-album-spotify
:show="show_details_modal"
:album="album"
@close="show_details_modal = false"
/>
<modal-dialog-track-spotify <modal-dialog-track-spotify
:show="show_track_details_modal" :show="show_track_details_modal"
:track="selected_track" :track="selected_track"
:album="album" :album="album"
@close="show_track_details_modal = false" @close="show_track_details_modal = false"
/> />
<modal-dialog-album-spotify
:show="show_album_details_modal"
:album="album"
@close="show_album_details_modal = false"
/>
</template> </template>
</content-with-hero> </content-with-hero>
</div> </div>
@ -126,7 +126,7 @@ export default {
show_track_details_modal: false, show_track_details_modal: false,
selected_track: {}, selected_track: {},
show_album_details_modal: false show_details_modal: false
} }
}, },

8
web-src/src/pages/PageArtist.vue
View File

@ -19,7 +19,7 @@
<div class="buttons is-centered"> <div class="buttons is-centered">
<a <a
class="button is-small is-light is-rounded" class="button is-small is-light is-rounded"
@click="show_artist_details_modal = true" @click="show_details_modal = true"
> >
<mdicon class="icon" name="dots-horizontal" size="16" /> <mdicon class="icon" name="dots-horizontal" size="16" />
</a> </a>
@ -47,9 +47,9 @@
</p> </p>
<list-albums :albums="albums" :hide_group_title="true" /> <list-albums :albums="albums" :hide_group_title="true" />
<modal-dialog-artist <modal-dialog-artist
:show="show_artist_details_modal" :show="show_details_modal"
:artist="artist" :artist="artist"
@close="show_artist_details_modal = false" @close="show_details_modal = false"
/> />
</template> </template>
</content-with-heading> </content-with-heading>
@ -119,7 +119,7 @@ export default {
}) })
} }
], ],
show_artist_details_modal: false show_details_modal: false
} }
}, },

27
web-src/src/pages/PageArtistSpotify.vue
View File

@ -8,7 +8,7 @@
<div class="buttons is-centered"> <div class="buttons is-centered">
<a <a
class="button is-small is-light is-rounded" class="button is-small is-light is-rounded"
@click="show_artist_details_modal = true" @click="show_details_modal = true"
> >
<mdicon class="icon" name="dots-horizontal" size="16" /> <mdicon class="icon" name="dots-horizontal" size="16" />
</a> </a>
@ -52,15 +52,15 @@
<VueEternalLoading v-if="offset < total" :load="load_next"> <VueEternalLoading v-if="offset < total" :load="load_next">
<template #no-more> . </template> <template #no-more> . </template>
</VueEternalLoading> </VueEternalLoading>
<modal-dialog-album-spotify <modal-dialog-artist-spotify
:show="show_details_modal" :show="show_details_modal"
:album="selected_album" :artist="artist"
@close="show_details_modal = false" @close="show_details_modal = false"
/> />
<modal-dialog-artist-spotify <modal-dialog-album-spotify
:show="show_artist_details_modal" :show="show_album_details_modal"
:artist="artist" :album="selected_album"
@close="show_artist_details_modal = false" @close="show_album_details_modal = false"
/> />
</template> </template>
</content-with-heading> </content-with-heading>
@ -131,15 +131,14 @@ export default {
data() { data() {
return { return {
artist: {},
albums: [], albums: [],
total: 0, artist: {},
offset: 0, offset: 0,
selected_album: {},
show_album_details_modal: false,
show_details_modal: false, show_details_modal: false,
selected_album: {}, total: 0
show_artist_details_modal: false
} }
}, },
@ -175,7 +174,7 @@ export default {
}, },
play() { play() {
this.show_details_modal = false this.show_album_details_modal = false
webapi.player_play_uri(this.artist.uri, true) webapi.player_play_uri(this.artist.uri, true)
}, },
@ -188,7 +187,7 @@ export default {
open_dialog(album) { open_dialog(album) {
this.selected_album = album this.selected_album = album
this.show_details_modal = true this.show_album_details_modal = true
}, },
artwork_url(album) { artwork_url(album) {

8
web-src/src/pages/PageArtistTracks.vue
View File

@ -20,7 +20,7 @@
<div class="buttons is-centered"> <div class="buttons is-centered">
<a <a
class="button is-small is-light is-rounded" class="button is-small is-light is-rounded"
@click="show_artist_details_modal = true" @click="show_details_modal = true"
> >
<mdicon class="icon" name="dots-horizontal" size="16" /> <mdicon class="icon" name="dots-horizontal" size="16" />
</a> </a>
@ -48,9 +48,9 @@
</p> </p>
<list-tracks :tracks="tracks" :uris="track_uris" /> <list-tracks :tracks="tracks" :uris="track_uris" />
<modal-dialog-artist <modal-dialog-artist
:show="show_artist_details_modal" :show="show_details_modal"
:artist="artist" :artist="artist"
@close="show_artist_details_modal = false" @close="show_details_modal = false"
/> />
</template> </template>
</content-with-heading> </content-with-heading>
@ -121,7 +121,7 @@ export default {
}) })
} }
], ],
show_artist_details_modal: false, show_details_modal: false,
tracks_list: new GroupByList() tracks_list: new GroupByList()
} }
}, },

12
web-src/src/pages/PageAudiobooksAlbum.vue
View File

@ -13,7 +13,7 @@
</a> </a>
<a <a
class="button is-small is-light is-rounded" class="button is-small is-light is-rounded"
@click="show_album_details_modal = true" @click="show_details_modal = true"
> >
<mdicon class="icon" name="dots-horizontal" size="16" /> <mdicon class="icon" name="dots-horizontal" size="16" />
</a> </a>
@ -25,7 +25,7 @@
:artist="album.artist" :artist="album.artist"
:album="album.name" :album="album.name"
class="is-clickable fd-has-shadow fd-cover fd-cover-medium-image" class="is-clickable fd-has-shadow fd-cover fd-cover-medium-image"
@click="show_album_details_modal = true" @click="show_details_modal = true"
/> />
</template> </template>
<template #content> <template #content>
@ -39,10 +39,10 @@
/> />
<list-tracks :tracks="tracks" :uris="album.uri" /> <list-tracks :tracks="tracks" :uris="album.uri" />
<modal-dialog-album <modal-dialog-album
:show="show_album_details_modal" :show="show_details_modal"
:album="album" :album="album"
:media_kind="'audiobook'" :media_kind="'audiobook'"
@close="show_album_details_modal = false" @close="show_details_modal = false"
/> />
</template> </template>
</content-with-hero> </content-with-hero>
@ -91,8 +91,8 @@ export default {
data() { data() {
return { return {
album: {}, album: {},
tracks: new GroupByList(), show_details_modal: false,
show_album_details_modal: false tracks: new GroupByList()
} }
}, },

9
web-src/src/pages/PageAudiobooksArtist.vue
View File

@ -8,7 +8,7 @@
<div class="buttons is-centered"> <div class="buttons is-centered">
<a <a
class="button is-small is-light is-rounded" class="button is-small is-light is-rounded"
@click="show_artist_details_modal = true" @click="show_details_modal = true"
> >
<mdicon class="icon" name="dots-horizontal" size="16" /> <mdicon class="icon" name="dots-horizontal" size="16" />
</a> </a>
@ -29,9 +29,9 @@
/> />
<list-albums :albums="albums" /> <list-albums :albums="albums" />
<modal-dialog-artist <modal-dialog-artist
:show="show_artist_details_modal" :show="show_details_modal"
:artist="artist" :artist="artist"
@close="show_artist_details_modal = false" @close="show_details_modal = false"
/> />
</template> </template>
</content-with-heading> </content-with-heading>
@ -85,8 +85,7 @@ export default {
return { return {
artist: {}, artist: {},
albums: new GroupByList(), albums: new GroupByList(),
show_details_modal: false
show_artist_details_modal: false
} }
}, },

10
web-src/src/pages/PageComposerAlbums.vue
View File

@ -8,7 +8,7 @@
<div class="buttons is-centered"> <div class="buttons is-centered">
<a <a
class="button is-small is-light is-rounded" class="button is-small is-light is-rounded"
@click="show_composer_details_modal = true" @click="show_details_modal = true"
> >
<mdicon class="icon" name="dots-horizontal" size="16" /> <mdicon class="icon" name="dots-horizontal" size="16" />
</a> </a>
@ -36,9 +36,9 @@
</p> </p>
<list-albums :albums="albums_list" :hide_group_title="true" /> <list-albums :albums="albums_list" :hide_group_title="true" />
<modal-dialog-composer <modal-dialog-composer
:show="show_composer_details_modal" :show="show_details_modal"
:composer="composer" :composer="composer"
@close="show_composer_details_modal = false" @close="show_details_modal = false"
/> />
</template> </template>
</content-with-heading> </content-with-heading>
@ -89,9 +89,9 @@ export default {
data() { data() {
return { return {
composer: {},
albums_list: new GroupByList(), albums_list: new GroupByList(),
show_composer_details_modal: false composer: {},
show_details_modal: false
} }
}, },

10
web-src/src/pages/PageComposerTracks.vue
View File

@ -20,7 +20,7 @@
<div class="buttons is-centered"> <div class="buttons is-centered">
<a <a
class="button is-small is-light is-rounded" class="button is-small is-light is-rounded"
@click="show_composer_details_modal = true" @click="show_details_modal = true"
> >
<mdicon class="icon" name="dots-horizontal" size="16" /> <mdicon class="icon" name="dots-horizontal" size="16" />
</a> </a>
@ -50,9 +50,9 @@
</p> </p>
<list-tracks :tracks="tracks" :expression="expression" /> <list-tracks :tracks="tracks" :expression="expression" />
<modal-dialog-composer <modal-dialog-composer
:show="show_composer_details_modal" :show="show_details_modal"
:composer="composer" :composer="composer"
@close="show_composer_details_modal = false" @close="show_details_modal = false"
/> />
</template> </template>
</content-with-heading> </content-with-heading>
@ -108,6 +108,7 @@ export default {
data() { data() {
return { return {
composer: {},
groupby_options: [ groupby_options: [
{ {
id: 1, id: 1,
@ -122,8 +123,7 @@ export default {
}) })
} }
], ],
composer: {}, show_details_modal: false,
show_composer_details_modal: false,
tracks_list: new GroupByList() tracks_list: new GroupByList()
} }
}, },

10
web-src/src/pages/PageGenreAlbums.vue
View File

@ -11,7 +11,7 @@
<div class="buttons is-centered"> <div class="buttons is-centered">
<a <a
class="button is-small is-light is-rounded" class="button is-small is-light is-rounded"
@click="show_genre_details_modal = true" @click="show_details_modal = true"
> >
<mdicon class="icon" name="dots-horizontal" size="16" /> <mdicon class="icon" name="dots-horizontal" size="16" />
</a> </a>
@ -37,8 +37,8 @@
<modal-dialog-genre <modal-dialog-genre
:genre="genre" :genre="genre"
:media_kind="media_kind" :media_kind="media_kind"
:show="show_genre_details_modal" :show="show_details_modal"
@close="show_genre_details_modal = false" @close="show_details_modal = false"
/> />
</template> </template>
</content-with-heading> </content-with-heading>
@ -94,10 +94,10 @@ export default {
}, },
data() { data() {
return { return {
genre: {},
albums_list: new GroupByList(), albums_list: new GroupByList(),
genre: {},
media_kind: this.$route.query.media_kind, media_kind: this.$route.query.media_kind,
show_genre_details_modal: false show_details_modal: false
} }
}, },
methods: { methods: {

8
web-src/src/pages/PageGenreTracks.vue
View File

@ -20,7 +20,7 @@
<div class="buttons is-centered"> <div class="buttons is-centered">
<a <a
class="button is-small is-light is-rounded" class="button is-small is-light is-rounded"
@click="show_genre_details_modal = true" @click="show_details_modal = true"
> >
<mdicon class="icon" name="dots-horizontal" size="16" /> <mdicon class="icon" name="dots-horizontal" size="16" />
</a> </a>
@ -44,10 +44,10 @@
</p> </p>
<list-tracks :tracks="tracks" :expression="expression" /> <list-tracks :tracks="tracks" :expression="expression" />
<modal-dialog-genre <modal-dialog-genre
:show="show_genre_details_modal" :show="show_details_modal"
:genre="genre" :genre="genre"
:media_kind="media_kind" :media_kind="media_kind"
@close="show_genre_details_modal = false" @close="show_details_modal = false"
/> />
</template> </template>
</content-with-heading> </content-with-heading>
@ -123,7 +123,7 @@ export default {
} }
], ],
media_kind: this.$route.query.media_kind, media_kind: this.$route.query.media_kind,
show_genre_details_modal: false, show_details_modal: false,
tracks_list: new GroupByList() tracks_list: new GroupByList()
} }
}, },

10
web-src/src/pages/PageMusicSpotifyFeaturedPlaylists.vue
View File

@ -25,9 +25,9 @@
</template> </template>
</list-item-playlist-spotify> </list-item-playlist-spotify>
<modal-dialog-playlist-spotify <modal-dialog-playlist-spotify
:show="show_playlist_details_modal" :show="show_details_modal"
:playlist="selected_playlist" :playlist="selected_playlist"
@close="show_playlist_details_modal = false" @close="show_details_modal = false"
/> />
</template> </template>
</content-with-heading> </content-with-heading>
@ -88,8 +88,8 @@ export default {
data() { data() {
return { return {
show_playlist_details_modal: false, selected_playlist: {},
selected_playlist: {} show_details_modal: false
} }
}, },
@ -102,7 +102,7 @@ export default {
methods: { methods: {
open_playlist_dialog(playlist) { open_playlist_dialog(playlist) {
this.selected_playlist = playlist this.selected_playlist = playlist
this.show_playlist_details_modal = true this.show_details_modal = true
} }
} }
} }

8
web-src/src/pages/PageMusicSpotifyNewReleases.vue
View File

@ -33,9 +33,9 @@
</template> </template>
</list-item-album-spotify> </list-item-album-spotify>
<modal-dialog-album-spotify <modal-dialog-album-spotify
:show="show_album_details_modal" :show="show_details_modal"
:album="selected_album" :album="selected_album"
@close="show_album_details_modal = false" @close="show_details_modal = false"
/> />
</template> </template>
</content-with-heading> </content-with-heading>
@ -98,7 +98,7 @@ export default {
data() { data() {
return { return {
show_album_details_modal: false, show_details_modal: false,
selected_album: {} selected_album: {}
} }
}, },
@ -126,7 +126,7 @@ export default {
open_album_dialog(album) { open_album_dialog(album) {
this.selected_album = album this.selected_album = album
this.show_album_details_modal = true this.show_details_modal = true
}, },
artwork_url(album) { artwork_url(album) {

10
web-src/src/pages/PagePlaylistTracks.vue
View File

@ -8,7 +8,7 @@
<div class="buttons is-centered"> <div class="buttons is-centered">
<a <a
class="button is-small is-light is-rounded" class="button is-small is-light is-rounded"
@click="show_playlist_details_modal = true" @click="show_details_modal = true"
> >
<mdicon class="icon" name="dots-horizontal" size="16" /> <mdicon class="icon" name="dots-horizontal" size="16" />
</a> </a>
@ -25,10 +25,10 @@
/> />
<list-tracks :tracks="tracks" :uris="uris" /> <list-tracks :tracks="tracks" :uris="uris" />
<modal-dialog-playlist <modal-dialog-playlist
:show="show_playlist_details_modal" :show="show_details_modal"
:playlist="playlist" :playlist="playlist"
:uris="uris" :uris="uris"
@close="show_playlist_details_modal = false" @close="show_details_modal = false"
/> />
</template> </template>
</content-with-heading> </content-with-heading>
@ -76,8 +76,8 @@ export default {
data() { data() {
return { return {
playlist: {}, playlist: {},
tracks: new GroupByList(), show_details_modal: false,
show_playlist_details_modal: false tracks: new GroupByList()
} }
}, },