MyFavMirrors/owntone-server
1
0
Fork 0
mirror of https://github.com/owntone/owntone-server.git synced 2025-04-13 07:50:41 -04:00
Code Issues Packages Projects Releases Wiki Activity

[web] Streamline title bar of modal dialogs

Browse Source
This commit is contained in:
Alain Nussbaumer 2025-03-15 08:20:21 +01:00
parent 7e8672917e
commit 6481d6f0ee
12 changed files with 18 additions and 84 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
web-src/src/components/ListProperties.vue
View File

@ -1,8 +1,4 @@
<template>
<div class="title is-4">
<a v-if="item.handler" @click="item.handler" v-text="item.name"></a>
<span v-else v-text="item.name" />
</div>
<control-image
v-if="item.image"
:url="item.image"

7
web-src/src/components/ModalDialog.vue
View File

@ -4,8 +4,13 @@
<div class="modal-background" @click="$emit('close')" />
<div class="modal-content">
<div class="card is-shadowless">
<div class="card-header">
<div v-if="title" class="card-header-title" v-text="title" />
<div class="card-header-icon">
<button class="delete" @click="$emit('close')"></button>
</div>
</div>
<div class="card-content">
<p v-if="title" class="title is-4" v-text="title" />
<slot name="content" />
</div>
<footer v-if="actions.length" class="card-footer">

17
web-src/src/components/ModalDialogAlbum.vue
View File

@ -38,7 +38,6 @@ export default {
},
playable() {
return {
handler: this.open,
image: this.item.artwork_url,
name: this.item.name,
properties: [
@ -79,22 +78,6 @@ export default {
this.$emit('close')
})
},
open() {
this.$emit('close')
if (this.media_kind_resolved === 'podcast') {
this.$router.push({ name: 'podcast', params: { id: this.item.id } })
} else if (this.media_kind_resolved === 'audiobook') {
this.$router.push({
name: 'audiobooks-album',
params: { id: this.item.id }
})
} else {
this.$router.push({
name: 'music-album',
params: { id: this.item.id }
})
}
},
openArtist() {
this.$emit('close')
if (this.media_kind_resolved === 'audiobook') {

8
web-src/src/components/ModalDialogAlbumSpotify.vue
View File

@ -17,7 +17,6 @@ export default {
computed: {
playable() {
return {
handler: this.open,
image: this.item?.images?.[0]?.url || '',
name: this.item.name || '',
properties: [
@ -37,13 +36,6 @@ export default {
}
},
methods: {
open() {
this.$emit('close')
this.$router.push({
name: 'music-spotify-album',
params: { id: this.item.id }
})
},
openArtist() {
this.$emit('close')
this.$router.push({

10
web-src/src/components/ModalDialogArtist.vue
View File

@ -17,7 +17,6 @@ export default {
computed: {
playable() {
return {
handler: this.open,
name: this.item.name,
properties: [
{ key: 'property.albums', value: this.item.album_count },
@ -34,15 +33,6 @@ export default {
uri: this.item.uri
}
}
},
methods: {
open() {
this.$emit('close')
this.$router.push({
name: 'music-artist',
params: { id: this.item.id }
})
}
}
}
</script>

10
web-src/src/components/ModalDialogArtistSpotify.vue
View File

@ -17,7 +17,6 @@ export default {
computed: {
playable() {
return {
handler: this.open,
name: this.item.name,
properties: [
{
@ -31,15 +30,6 @@ export default {
uri: this.item.uri
}
}
},
methods: {
open() {
this.$emit('close')
this.$router.push({
name: 'music-spotify-artist',
params: { id: this.item.id }
})
}
}
}
</script>

1
web-src/src/components/ModalDialogComposer.vue
View File

@ -18,7 +18,6 @@ export default {
playable() {
return {
expression: `composer is "${this.item.name}" and media_kind is music`,
handler: this.openAlbums,
name: this.item.name,
properties: [
{

11
web-src/src/components/ModalDialogGenre.vue
View File

@ -22,7 +22,6 @@ export default {
playable() {
return {
expression: `genre is "${this.item.name}" and media_kind is ${this.media_kind}`,
handler: this.open,
name: this.item.name,
properties: [
{ key: 'property.albums', value: this.item.album_count },
@ -34,16 +33,6 @@ export default {
]
}
}
},
methods: {
open() {
this.$emit('close')
this.$router.push({
name: 'genre-albums',
params: { name: this.item.name },
query: { media_kind: this.media_kind }
})
}
}
}
</script>

7
web-src/src/components/ModalDialogPlayable.vue
View File

@ -1,5 +1,10 @@
<template>
<modal-dialog :actions="actions" :show="show" @close="$emit('close')">
<modal-dialog
:actions="actions"
:show="show"
:title="item.name"
@close="$emit('close')"
>
<template #content>
<list-properties :item="item">
<template v-if="buttons.length" #buttons>

10
web-src/src/components/ModalDialogPlaylist.vue
View File

@ -21,7 +21,6 @@ export default {
computed: {
playable() {
return {
handler: this.open,
name: this.item.name,
properties: [
{ key: 'property.tracks', value: this.item.item_count },
@ -35,15 +34,6 @@ export default {
uris: this.uris
}
}
},
methods: {
open() {
this.$emit('close')
this.$router.push({
name: 'playlist',
params: { id: this.item.id }
})
}
}
}
</script>

10
web-src/src/components/ModalDialogPlaylistSpotify.vue
View File

@ -17,7 +17,6 @@ export default {
computed: {
playable() {
return {
handler: this.open,
name: this.item.name,
properties: [
{ key: 'property.owner', value: this.item.owner?.display_name },
@ -27,15 +26,6 @@ export default {
uri: this.item.uri
}
}
},
methods: {
open() {
this.$emit('close')
this.$router.push({
name: 'playlist-spotify',
params: { id: this.item.id }
})
}
}
}
</script>

7
web-src/src/components/ModalDialogQueueItem.vue
View File

@ -1,5 +1,10 @@
<template>
<modal-dialog :actions="actions" :show="show" @close="$emit('close')">
<modal-dialog
:actions="actions"
:show="show"
:title="item.title"
@close="$emit('close')"
>
<template #content>
<list-properties :item="playable" />
</template>