mirror of
https://github.com/nextcloud/server.git
synced 2026-05-28 04:32:30 -04:00
Focus global search input on open
For better accesibility, the search input in the global search modal should be focused when the search modal is opened. Resolves: https://github.com/nextcloud/server/issues/41651 Signed-off-by: fenn-cs <fenn25.fn@gmail.com> Signed-off-by: nextcloud-command <nextcloud-command@users.noreply.github.com>
This commit is contained in:
parent
953382e937
commit
8c6c0d1c85
3 changed files with 17 additions and 4 deletions
|
|
@ -13,7 +13,8 @@
|
|||
<!-- Global search form -->
|
||||
<div ref="globalSearch" class="global-search-modal">
|
||||
<h1>{{ t('core', 'Global search') }}</h1>
|
||||
<NcInputField :value.sync="searchQuery"
|
||||
<NcInputField ref="searchInput"
|
||||
:value.sync="searchQuery"
|
||||
type="text"
|
||||
:label="t('core', 'Search apps, files, tags, messages') + '...'"
|
||||
@update:value="debouncedFind" />
|
||||
|
|
@ -222,6 +223,15 @@ export default {
|
|||
},
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
isVisible(value) {
|
||||
this.$nextTick(() => {
|
||||
if (value) {
|
||||
this.focusInput()
|
||||
}
|
||||
})
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
getProviders().then((providers) => {
|
||||
this.providers = providers
|
||||
|
|
@ -503,6 +513,9 @@ export default {
|
|||
this.dateFilter.text = t('core', `Between ${this.dateFilter.startFrom.toLocaleDateString()} and ${this.dateFilter.endAt.toLocaleDateString()}`)
|
||||
this.updateDateFilter()
|
||||
},
|
||||
focusInput() {
|
||||
this.$refs.searchInput.$el.children[0].children[0].focus()
|
||||
},
|
||||
closeModal() {
|
||||
this.$refs.globalSearchModal.close()
|
||||
this.searchQuery = ''
|
||||
|
|
|
|||
4
dist/core-global-search.js
vendored
4
dist/core-global-search.js
vendored
File diff suppressed because one or more lines are too long
2
dist/core-global-search.js.map
vendored
2
dist/core-global-search.js.map
vendored
File diff suppressed because one or more lines are too long
Loading…
Reference in a new issue