mirror/advplyr.audiobookshelf-app
1
0
Fork 0
mirror of https://github.com/advplyr/audiobookshelf-app.git synced 2025-07-10 05:54:47 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

Update create bookmark to auto focus and select input

Browse source
This commit is contained in:
advplyr 2025-01-13 16:48:51 -06:00
parent 69d198117e
commit 6cacf6b2c5
2 changed files with 12 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

12
components/modals/BookmarksModal.vue
View file

@ -17,7 +17,7 @@
<p class="text-xl font-mono">{{ this.$secondsToTimestamp(currentTime) }}</p>
</div>
<ui-text-input-with-label v-model="newBookmarkTitle" label="Note" />
<ui-text-input-with-label v-model="newBookmarkTitle" ref="noteInput" label="Note" />
<div class="flex justify-end mt-6">
<ui-btn color="success" class="w-full" @click.stop="submitBookmark">{{ selectedBookmark ? 'Update' : 'Create' }}</ui-btn>
</div>
@ -151,6 +151,16 @@ export default {
this.selectedBookmark = null
this.newBookmarkTitle = this.$formatDate(Date.now(), 'MMM dd, yyyy HH:mm')
this.showBookmarkTitleInput = true
// Auto focus the input and select the text
this.$nextTick(() => {
if (this.$refs.noteInput?.$refs.input?.$refs.input) {
this.$refs.noteInput.$refs.input.$refs.input.focus()
setTimeout(() => {
this.$refs.noteInput?.$refs.input?.$refs.input?.select()
}, 10)
}
})
},
async submitBookmark() {
await this.$hapticsImpact()