mirror of
https://github.com/owntone/owntone-server.git
synced 2025-03-28 16:31:02 -04:00
[web]S Streamline code of pages
This commit is contained in:
Alain Nussbaumer
parent
0940950083
commit
d0cd0c4bc7
web-src/src/pages
@ -17,7 +17,7 @@
|
||||
</a>
|
||||
<a
|
||||
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" />
|
||||
</a>
|
||||
@ -29,7 +29,7 @@
|
||||
:artist="album.artist"
|
||||
:album="album.name"
|
||||
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 #content>
|
||||
@ -56,17 +56,17 @@
|
||||
</a>
|
||||
</template>
|
||||
</list-item-track-spotify>
|
||||
<modal-dialog-album-spotify
|
||||
:show="show_details_modal"
|
||||
:album="album"
|
||||
@close="show_details_modal = false"
|
||||
/>
|
||||
<modal-dialog-track-spotify
|
||||
:show="show_track_details_modal"
|
||||
:track="selected_track"
|
||||
:album="album"
|
||||
@close="show_track_details_modal = false"
|
||||
/>
|
||||
<modal-dialog-album-spotify
|
||||
:show="show_album_details_modal"
|
||||
:album="album"
|
||||
@close="show_album_details_modal = false"
|
||||
/>
|
||||
</template>
|
||||
</content-with-hero>
|
||||
</div>
|
||||
@ -126,7 +126,7 @@ export default {
|
||||
show_track_details_modal: false,
|
||||
selected_track: {},
|
||||
|
||||
show_album_details_modal: false
|
||||
show_details_modal: false
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
@ -19,7 +19,7 @@
|
||||
<div class="buttons is-centered">
|
||||
<a
|
||||
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" />
|
||||
</a>
|
||||
@ -47,9 +47,9 @@
|
||||
</p>
|
||||
<list-albums :albums="albums" :hide_group_title="true" />
|
||||
<modal-dialog-artist
|
||||
:show="show_artist_details_modal"
|
||||
:show="show_details_modal"
|
||||
:artist="artist"
|
||||
@close="show_artist_details_modal = false"
|
||||
@close="show_details_modal = false"
|
||||
/>
|
||||
</template>
|
||||
</content-with-heading>
|
||||
@ -119,7 +119,7 @@ export default {
|
||||
})
|
||||
}
|
||||
],
|
||||
show_artist_details_modal: false
|
||||
show_details_modal: false
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
@ -8,7 +8,7 @@
|
||||
<div class="buttons is-centered">
|
||||
<a
|
||||
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" />
|
||||
</a>
|
||||
@ -52,15 +52,15 @@
|
||||
<VueEternalLoading v-if="offset < total" :load="load_next">
|
||||
<template #no-more> . </template>
|
||||
</VueEternalLoading>
|
||||
<modal-dialog-album-spotify
|
||||
<modal-dialog-artist-spotify
|
||||
:show="show_details_modal"
|
||||
:album="selected_album"
|
||||
:artist="artist"
|
||||
@close="show_details_modal = false"
|
||||
/>
|
||||
<modal-dialog-artist-spotify
|
||||
:show="show_artist_details_modal"
|
||||
:artist="artist"
|
||||
@close="show_artist_details_modal = false"
|
||||
<modal-dialog-album-spotify
|
||||
:show="show_album_details_modal"
|
||||
:album="selected_album"
|
||||
@close="show_album_details_modal = false"
|
||||
/>
|
||||
</template>
|
||||
</content-with-heading>
|
||||
@ -131,15 +131,14 @@ export default {
|
||||
|
||||
data() {
|
||||
return {
|
||||
artist: {},
|
||||
albums: [],
|
||||
total: 0,
|
||||
artist: {},
|
||||
offset: 0,
|
||||
selected_album: {},
|
||||
show_album_details_modal: false,
|
||||
|
||||
show_details_modal: false,
|
||||
selected_album: {},
|
||||
|
||||
show_artist_details_modal: false
|
||||
total: 0
|
||||
}
|
||||
},
|
||||
|
||||
@ -175,7 +174,7 @@ export default {
|
||||
},
|
||||
|
||||
play() {
|
||||
this.show_details_modal = false
|
||||
this.show_album_details_modal = false
|
||||
webapi.player_play_uri(this.artist.uri, true)
|
||||
},
|
||||
|
||||
@ -188,7 +187,7 @@ export default {
|
||||
|
||||
open_dialog(album) {
|
||||
this.selected_album = album
|
||||
this.show_details_modal = true
|
||||
this.show_album_details_modal = true
|
||||
},
|
||||
|
||||
artwork_url(album) {
|
||||
|
||||
@ -20,7 +20,7 @@
|
||||
<div class="buttons is-centered">
|
||||
<a
|
||||
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" />
|
||||
</a>
|
||||
@ -48,9 +48,9 @@
|
||||
</p>
|
||||
<list-tracks :tracks="tracks" :uris="track_uris" />
|
||||
<modal-dialog-artist
|
||||
:show="show_artist_details_modal"
|
||||
:show="show_details_modal"
|
||||
:artist="artist"
|
||||
@close="show_artist_details_modal = false"
|
||||
@close="show_details_modal = false"
|
||||
/>
|
||||
</template>
|
||||
</content-with-heading>
|
||||
@ -121,7 +121,7 @@ export default {
|
||||
})
|
||||
}
|
||||
],
|
||||
show_artist_details_modal: false,
|
||||
show_details_modal: false,
|
||||
tracks_list: new GroupByList()
|
||||
}
|
||||
},
|
||||
|
||||
@ -13,7 +13,7 @@
|
||||
</a>
|
||||
<a
|
||||
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" />
|
||||
</a>
|
||||
@ -25,7 +25,7 @@
|
||||
:artist="album.artist"
|
||||
:album="album.name"
|
||||
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 #content>
|
||||
@ -39,10 +39,10 @@
|
||||
/>
|
||||
<list-tracks :tracks="tracks" :uris="album.uri" />
|
||||
<modal-dialog-album
|
||||
:show="show_album_details_modal"
|
||||
:show="show_details_modal"
|
||||
:album="album"
|
||||
:media_kind="'audiobook'"
|
||||
@close="show_album_details_modal = false"
|
||||
@close="show_details_modal = false"
|
||||
/>
|
||||
</template>
|
||||
</content-with-hero>
|
||||
@ -91,8 +91,8 @@ export default {
|
||||
data() {
|
||||
return {
|
||||
album: {},
|
||||
tracks: new GroupByList(),
|
||||
show_album_details_modal: false
|
||||
show_details_modal: false,
|
||||
tracks: new GroupByList()
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
@ -8,7 +8,7 @@
|
||||
<div class="buttons is-centered">
|
||||
<a
|
||||
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" />
|
||||
</a>
|
||||
@ -29,9 +29,9 @@
|
||||
/>
|
||||
<list-albums :albums="albums" />
|
||||
<modal-dialog-artist
|
||||
:show="show_artist_details_modal"
|
||||
:show="show_details_modal"
|
||||
:artist="artist"
|
||||
@close="show_artist_details_modal = false"
|
||||
@close="show_details_modal = false"
|
||||
/>
|
||||
</template>
|
||||
</content-with-heading>
|
||||
@ -85,8 +85,7 @@ export default {
|
||||
return {
|
||||
artist: {},
|
||||
albums: new GroupByList(),
|
||||
|
||||
show_artist_details_modal: false
|
||||
show_details_modal: false
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
@ -8,7 +8,7 @@
|
||||
<div class="buttons is-centered">
|
||||
<a
|
||||
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" />
|
||||
</a>
|
||||
@ -36,9 +36,9 @@
|
||||
</p>
|
||||
<list-albums :albums="albums_list" :hide_group_title="true" />
|
||||
<modal-dialog-composer
|
||||
:show="show_composer_details_modal"
|
||||
:show="show_details_modal"
|
||||
:composer="composer"
|
||||
@close="show_composer_details_modal = false"
|
||||
@close="show_details_modal = false"
|
||||
/>
|
||||
</template>
|
||||
</content-with-heading>
|
||||
@ -89,9 +89,9 @@ export default {
|
||||
|
||||
data() {
|
||||
return {
|
||||
composer: {},
|
||||
albums_list: new GroupByList(),
|
||||
show_composer_details_modal: false
|
||||
composer: {},
|
||||
show_details_modal: false
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
@ -20,7 +20,7 @@
|
||||
<div class="buttons is-centered">
|
||||
<a
|
||||
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" />
|
||||
</a>
|
||||
@ -50,9 +50,9 @@
|
||||
</p>
|
||||
<list-tracks :tracks="tracks" :expression="expression" />
|
||||
<modal-dialog-composer
|
||||
:show="show_composer_details_modal"
|
||||
:show="show_details_modal"
|
||||
:composer="composer"
|
||||
@close="show_composer_details_modal = false"
|
||||
@close="show_details_modal = false"
|
||||
/>
|
||||
</template>
|
||||
</content-with-heading>
|
||||
@ -108,6 +108,7 @@ export default {
|
||||
|
||||
data() {
|
||||
return {
|
||||
composer: {},
|
||||
groupby_options: [
|
||||
{
|
||||
id: 1,
|
||||
@ -122,8 +123,7 @@ export default {
|
||||
})
|
||||
}
|
||||
],
|
||||
composer: {},
|
||||
show_composer_details_modal: false,
|
||||
show_details_modal: false,
|
||||
tracks_list: new GroupByList()
|
||||
}
|
||||
},
|
||||
|
||||
@ -11,7 +11,7 @@
|
||||
<div class="buttons is-centered">
|
||||
<a
|
||||
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" />
|
||||
</a>
|
||||
@ -37,8 +37,8 @@
|
||||
<modal-dialog-genre
|
||||
:genre="genre"
|
||||
:media_kind="media_kind"
|
||||
:show="show_genre_details_modal"
|
||||
@close="show_genre_details_modal = false"
|
||||
:show="show_details_modal"
|
||||
@close="show_details_modal = false"
|
||||
/>
|
||||
</template>
|
||||
</content-with-heading>
|
||||
@ -94,10 +94,10 @@ export default {
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
genre: {},
|
||||
albums_list: new GroupByList(),
|
||||
genre: {},
|
||||
media_kind: this.$route.query.media_kind,
|
||||
show_genre_details_modal: false
|
||||
show_details_modal: false
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
||||
@ -20,7 +20,7 @@
|
||||
<div class="buttons is-centered">
|
||||
<a
|
||||
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" />
|
||||
</a>
|
||||
@ -44,10 +44,10 @@
|
||||
</p>
|
||||
<list-tracks :tracks="tracks" :expression="expression" />
|
||||
<modal-dialog-genre
|
||||
:show="show_genre_details_modal"
|
||||
:show="show_details_modal"
|
||||
:genre="genre"
|
||||
:media_kind="media_kind"
|
||||
@close="show_genre_details_modal = false"
|
||||
@close="show_details_modal = false"
|
||||
/>
|
||||
</template>
|
||||
</content-with-heading>
|
||||
@ -123,7 +123,7 @@ export default {
|
||||
}
|
||||
],
|
||||
media_kind: this.$route.query.media_kind,
|
||||
show_genre_details_modal: false,
|
||||
show_details_modal: false,
|
||||
tracks_list: new GroupByList()
|
||||
}
|
||||
},
|
||||
|
||||
@ -25,9 +25,9 @@
|
||||
</template>
|
||||
</list-item-playlist-spotify>
|
||||
<modal-dialog-playlist-spotify
|
||||
:show="show_playlist_details_modal"
|
||||
:show="show_details_modal"
|
||||
:playlist="selected_playlist"
|
||||
@close="show_playlist_details_modal = false"
|
||||
@close="show_details_modal = false"
|
||||
/>
|
||||
</template>
|
||||
</content-with-heading>
|
||||
@ -88,8 +88,8 @@ export default {
|
||||
|
||||
data() {
|
||||
return {
|
||||
show_playlist_details_modal: false,
|
||||
selected_playlist: {}
|
||||
selected_playlist: {},
|
||||
show_details_modal: false
|
||||
}
|
||||
},
|
||||
|
||||
@ -102,7 +102,7 @@ export default {
|
||||
methods: {
|
||||
open_playlist_dialog(playlist) {
|
||||
this.selected_playlist = playlist
|
||||
this.show_playlist_details_modal = true
|
||||
this.show_details_modal = true
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -33,9 +33,9 @@
|
||||
</template>
|
||||
</list-item-album-spotify>
|
||||
<modal-dialog-album-spotify
|
||||
:show="show_album_details_modal"
|
||||
:show="show_details_modal"
|
||||
:album="selected_album"
|
||||
@close="show_album_details_modal = false"
|
||||
@close="show_details_modal = false"
|
||||
/>
|
||||
</template>
|
||||
</content-with-heading>
|
||||
@ -98,7 +98,7 @@ export default {
|
||||
|
||||
data() {
|
||||
return {
|
||||
show_album_details_modal: false,
|
||||
show_details_modal: false,
|
||||
selected_album: {}
|
||||
}
|
||||
},
|
||||
@ -126,7 +126,7 @@ export default {
|
||||
|
||||
open_album_dialog(album) {
|
||||
this.selected_album = album
|
||||
this.show_album_details_modal = true
|
||||
this.show_details_modal = true
|
||||
},
|
||||
|
||||
artwork_url(album) {
|
||||
|
||||
@ -8,7 +8,7 @@
|
||||
<div class="buttons is-centered">
|
||||
<a
|
||||
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" />
|
||||
</a>
|
||||
@ -25,10 +25,10 @@
|
||||
/>
|
||||
<list-tracks :tracks="tracks" :uris="uris" />
|
||||
<modal-dialog-playlist
|
||||
:show="show_playlist_details_modal"
|
||||
:show="show_details_modal"
|
||||
:playlist="playlist"
|
||||
:uris="uris"
|
||||
@close="show_playlist_details_modal = false"
|
||||
@close="show_details_modal = false"
|
||||
/>
|
||||
</template>
|
||||
</content-with-heading>
|
||||
@ -76,8 +76,8 @@ export default {
|
||||
data() {
|
||||
return {
|
||||
playlist: {},
|
||||
tracks: new GroupByList(),
|
||||
show_playlist_details_modal: false
|
||||
show_details_modal: false,
|
||||
tracks: new GroupByList()
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user