MyFavMirrors
/
owntone-server
mirror of https://github.com/owntone/owntone-server.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

[web] Present a numeric keypad for integer input fields

This commit is contained in:
Alain Nussbaumer 2024-04-15 22:50:11 +02:00
parent a2dd2251c9
commit 1ccc97d824
5 changed files with 10 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
web-src/src/components/ModalDialogAddRss.vue
View File

@ -78,7 +78,7 @@ export default {
show() {
if (this.show) {
this.loading = false
// We need to delay setting the focus to the input field until the field is part of the dom and visible
// Delay setting the focus on the input field until it is part of the DOM and visible
setTimeout(() => {
this.$refs.url_field.focus()
}, 10)

2
web-src/src/components/ModalDialogAddUrlStream.vue
View File

@ -85,7 +85,7 @@ export default {
show() {
if (this.show) {
this.loading = false
// We need to delay setting the focus to the input field until the field is part of the dom and visible
// Delay setting the focus on the input field until it is part of the DOM and visible
setTimeout(() => {
this.$refs.url_field.focus()
}, 10)

3
web-src/src/components/ModalDialogPlaylistSave.vue
View File

@ -80,8 +80,7 @@ export default {
show() {
if (this.show) {
this.loading = false
// We need to delay setting the focus to the input field until the field is part of the dom and visible
// Delay setting the focus on the input field until it is part of the DOM and visible
setTimeout(() => {
this.$refs.playlist_name_field.focus()
}, 10)

5
web-src/src/components/ModalDialogRemotePairing.vue
View File

@ -14,7 +14,7 @@
ref="pin_field"
v-model="pairing_req.pin"
class="input"
type="text"
inputmode="numeric"
pattern="[\d]{4}"
:placeholder="$t('dialog.remote-pairing.pairing-code')"
/>
@ -76,8 +76,7 @@ export default {
show() {
if (this.show) {
this.loading = false
// We need to delay setting the focus to the input field until the field is part of the dom and visible
// Delay setting the focus on the input field until it is part of the DOM and visible
setTimeout(() => {
this.$refs.pin_field.focus()
}, 10)

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

@ -6,10 +6,9 @@
<p class="title is-4" v-text="$t('page.settings.devices.pairing')" />
</template>
<template #content>
<!-- Paring request active -->
<div v-if="pairing.active" class="notification">
<div v-if="pairing.active">
<form @submit.prevent="kickoff_pairing">
<label class="label has-text-weight-normal">
<label class="label has-text-weight-normal content">
<span v-text="$t('page.settings.devices.pairing-request')" />
<b v-text="pairing.remote" />
</label>
@ -18,7 +17,7 @@
<input
v-model="pairing_req.pin"
class="input"
type="text"
inputmode="numeric"
pattern="[\d]{4}"
:placeholder="$t('page.settings.devices.pairing-code')"
/>
@ -33,8 +32,7 @@
</div>
</form>
</div>
<!-- No pairing requests -->
<div v-if="!pairing.active" class="content">
<div v-else>
<p v-text="$t('page.settings.devices.no-active-pairing')" />
</div>
</template>
@ -74,7 +72,7 @@
<input
v-model="verification_req.pin"
class="input"
type="text"
inputmode="numeric"
pattern="[\d]{4}"
:placeholder="$t('page.settings.devices.verification-code')"
/>