mirror of
https://github.com/owntone/owntone-server.git
synced 2024-12-25 22:55:56 -05:00
[web] Disable Save button when no playlist name is provided
This commit is contained in:
parent
ae973f312a
commit
58fbcd7e7a
@ -3,10 +3,10 @@
|
||||
<div v-if="show" class="modal is-active">
|
||||
<div class="modal-background" @click="$emit('close')" />
|
||||
<div class="modal-content">
|
||||
<div class="card">
|
||||
<form class="card" @submit.prevent="save">
|
||||
<div class="card-content">
|
||||
<p class="title is-4" v-text="$t('dialog.playlist.save.title')" />
|
||||
<form class="mb-5" @submit.prevent="save">
|
||||
|
||||
<div class="field">
|
||||
<p class="control has-icons-left">
|
||||
<input
|
||||
@ -14,13 +14,15 @@
|
||||
v-model="playlist_name"
|
||||
class="input is-shadowless"
|
||||
type="text"
|
||||
pattern=".+"
|
||||
required
|
||||
:placeholder="$t('dialog.playlist.save.playlist-name')"
|
||||
:disabled="loading"
|
||||
@input="check_name"
|
||||
/>
|
||||
<mdicon class="icon is-left" name="file-music" size="16" />
|
||||
</p>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<footer v-if="loading" class="card-footer">
|
||||
<a class="card-footer-item has-text-dark">
|
||||
@ -40,6 +42,7 @@
|
||||
/>
|
||||
</a>
|
||||
<a
|
||||
:class="{ 'is-disabled': disabled }"
|
||||
class="card-footer-item has-background-info has-text-white has-text-weight-bold"
|
||||
@click="save"
|
||||
>
|
||||
@ -50,7 +53,7 @@
|
||||
/>
|
||||
</a>
|
||||
</footer>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<button
|
||||
class="modal-close is-large"
|
||||
@ -71,6 +74,7 @@ export default {
|
||||
|
||||
data() {
|
||||
return {
|
||||
disabled: true,
|
||||
playlist_name: '',
|
||||
loading: false
|
||||
}
|
||||
@ -89,11 +93,11 @@ export default {
|
||||
},
|
||||
|
||||
methods: {
|
||||
check_name(event) {
|
||||
const { validity } = event.target
|
||||
this.disabled = validity.patternMismatch || validity.valueMissing
|
||||
},
|
||||
save() {
|
||||
if (this.playlist_name.length < 1) {
|
||||
return
|
||||
}
|
||||
|
||||
this.loading = true
|
||||
webapi
|
||||
.queue_save_playlist(this.playlist_name)
|
||||
|
Loading…
Reference in New Issue
Block a user