OpenHAB
/
openhab-webui
mirror of https://github.com/openhab/openhab-webui.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

Search bars: Remember search query & Automatically focus on desktop (#2827) 

Signed-off-by: Florian Hotze <dev@florianhotze.com>
pull/2830/head
Florian Hotze 2024-10-24 16:12:57 +02:00 committed by GitHub
parent 30e4d48b16
commit 785d8f6bcd
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
4 changed files with 64 additions and 37 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
bundles/org.openhab.ui/web/src/pages/settings/model/model.vue
View File

@ -7,7 +7,7 @@
<f7-subnavbar :inner="false" v-show="initSearchbar">
<f7-searchbar
v-if="initSearchbar"
:init="initSearchbar"
ref="searchbar"
search-container=".semantic-tree"
search-item=".treeview-item"
search-in=".treeview-item-label"
@ -268,9 +268,6 @@ export default {
eventSource: null,
itemDetailsKey: this.$f7.utils.id()
}
},
created () {
},
computed: {
empty () {
@ -287,7 +284,7 @@ export default {
}
},
methods: {
onPageAfterIn (ev) {
onPageAfterIn () {
this.$store.dispatch('startTrackingStates')
if (this.selectedItem) {
this.update()
@ -299,6 +296,7 @@ export default {
this.detailsOpened = false
this.$store.dispatch('stopTrackingStates')
this.stopEventSource()
this.$f7.data.lastModelSearchQuery = this.$refs.searchbar?.f7Searchbar.query
},
modelItem (item) {
const modelItem = {
@ -326,9 +324,16 @@ export default {
return modelItem
},
load () {
if (this.initSearchbar) this.$f7.data.lastModelSearchQuery = this.$refs.searchbar?.f7Searchbar.query
this.initSearchbar = false
this.loadModel().then(() => {
this.initSearchbar = true
this.$nextTick(() => {
this.initSearchbar = true
if (this.$device.desktop && this.$refs.searchbar) {
this.$refs.searchbar.f7Searchbar.$inputEl[0].focus()
}
this.$refs.searchbar?.f7Searchbar.search(this.$f7.data.lastModelSearchQuery || '')
this.applyExpandedOption()
})
if (!this.eventSource) this.startEventSource()

31
bundles/org.openhab.ui/web/src/pages/settings/pages/pages-list.vue
View File

@ -1,17 +1,16 @@
<template>
<f7-page @page:afterin="onPageAfterIn" @page:afterout="onPageAfterOut">
<f7-page @page:afterin="onPageAfterIn" @page:beforeout="onPageBeforeOut">
<f7-navbar title="Pages" back-link="Settings" back-link-url="/settings/" back-link-force>
<f7-nav-right>
<developer-dock-icon />
<f7-link icon-md="material:done_all" @click="toggleCheck()"
:text="(!$theme.md) ? ((showCheckboxes) ? 'Done' : 'Select') : ''" />
</f7-nav-right>
<f7-subnavbar :inner="false" v-show="initSearchbar">
<f7-subnavbar :inner="false" v-show="ready">
<f7-searchbar
v-if="initSearchbar"
v-if="ready"
ref="searchbar"
class="searchbar-pages"
:init="initSearchbar"
search-container=".pages-list"
search-item=".pagelist-item"
search-in=".item-title, .item-subtitle, .item-header, .item-footer"
@ -161,7 +160,6 @@ export default {
ready: false,
loading: false,
pages: [],
initSearchbar: false,
selectedItems: [],
groupBy: 'alphabetical',
showCheckboxes: false,
@ -213,12 +211,16 @@ export default {
onPageAfterIn () {
this.load()
},
onPageAfterOut () {
onPageBeforeOut () {
this.$f7.data.lastPagesSearchQuery = this.$refs.searchbar?.f7Searchbar.query
},
load () {
if (this.loading) return
this.loading = true
if (this.ready) this.$f7.data.lastPagesSearchQuery = this.$refs.searchbar?.f7Searchbar.query
this.ready = false
this.$set(this, 'selectedItems', [])
this.showCheckboxes = false
let promises = [
@ -233,14 +235,13 @@ export default {
this.loading = false
this.ready = true
setTimeout(() => {
this.initSearchbar = true
this.$refs.listIndex.update()
this.$nextTick(() => {
if (this.$device.desktop && this.$refs.searchbar) {
this.$refs.searchbar.f7Searchbar.$inputEl[0].focus()
}
})
this.$nextTick(() => {
if (this.$refs.listIndex) this.$refs.listIndex.update()
if (this.$device.desktop && this.$refs.searchbar) {
this.$refs.searchbar.f7Searchbar.$inputEl[0].focus()
}
this.$refs.searchbar?.f7Searchbar.search(this.$f7.data.lastPagesSearchQuery || '')
})
})
},

26
bundles/org.openhab.ui/web/src/pages/settings/schedule/schedule.vue
View File

@ -1,16 +1,16 @@
<template>
<f7-page @page:afterin="onPageAfterIn" @page:afterout="stopEventSource">
<f7-page @page:afterin="onPageAfterIn" @page:beforeout="onPageBeforeOut">
<f7-navbar title="Schedule" back-link="Settings" back-link-url="/settings/" back-link-force>
<f7-nav-right>
<developer-dock-icon />
<f7-link icon-md="material:done_all" @click="toggleCheck()"
:text="(!$theme.md) ? ((showCheckboxes) ? 'Done' : 'Select') : ''" />
</f7-nav-right>
<f7-subnavbar :inner="false" v-show="initSearchbar">
<f7-subnavbar :inner="false" v-show="ready">
<f7-searchbar
v-if="initSearchbar"
v-if="ready"
ref="searchbar"
class="searchbar-schedule"
:init="initSearchbar"
search-container=".timeline"
search-item=".timeline-item-inner"
search-in=".timeline-item-title"
@ -92,7 +92,6 @@ export default {
rules: [],
noRuleEngine: false,
calendar: {},
initSearchbar: false,
selectedItems: [],
showCheckboxes: false,
eventSource: null
@ -105,9 +104,17 @@ export default {
onPageAfterIn () {
this.load()
},
onPageBeforeOut () {
this.stopEventSource()
this.$f7.data.lastScheduleSearchQuery = this.$refs.searchbar?.f7Searchbar.query
},
load () {
if (this.loading) return
this.loading = true
if (this.ready) this.$f7.data.lastScheduleSearchQuery = this.$refs.searchbar?.f7Searchbar.query
this.ready = false
let occurrences = []
let start = new Date(), limit = new Date()
@ -115,7 +122,6 @@ export default {
this.$oh.api.get('/rest/rules/schedule/simulations?from=' + start.toISOString() + '&until=' + limit.toISOString()).then(data => {
this.rules = data
this.initSearchbar = true
this.loading = false
// map RulesExecutions per time
@ -139,7 +145,6 @@ export default {
const dayISODate = day.toISOString().split('T')[0]
const dayOccurrences = occurrences.filter((o) => {
const occurrenceISODate = o[0].split('T')[0]
const rule = o[1]
return occurrenceISODate === dayISODate
})
cal[year][month][dayofmonth] = dayOccurrences
@ -148,6 +153,13 @@ export default {
this.ready = true
if (!this.eventSource) this.startEventSource()
this.$nextTick(() => {
if (this.$device.desktop && this.$refs.searchbar) {
this.$refs.searchbar.f7Searchbar.$inputEl[0].focus()
}
this.$refs.searchbar?.f7Searchbar.search(this.$f7.data.lastScheduleSearchQuery || '')
})
}).catch((err, status) => {
if (err === 'Not Found' || status === 404) {
this.noRuleEngine = true

27
bundles/org.openhab.ui/web/src/pages/settings/things/things-list.vue
View File

@ -1,17 +1,16 @@
<template>
<f7-page @page:afterin="onPageAfterIn" @page:afterout="stopEventSource">
<f7-page @page:afterin="onPageAfterIn" @page:beforeout="onPageBeforeOut">
<f7-navbar title="Things" back-link="Settings" back-link-url="/settings/" back-link-force>
<f7-nav-right>
<developer-dock-icon />
<f7-link icon-md="material:done_all" @click="toggleCheck()"
:text="(!$theme.md) ? ((showCheckboxes) ? 'Done' : 'Select') : ''" />
</f7-nav-right>
<f7-subnavbar :inner="false" v-show="initSearchbar">
<f7-subnavbar :inner="false" v-show="ready">
<f7-searchbar
v-if="initSearchbar"
v-if="ready"
ref="searchbar"
class="searchbar-things"
:init="initSearchbar"
search-container=".contacts-list"
search-in=".item-inner"
:placeholder="searchPlaceholder"
@ -172,7 +171,6 @@ export default {
return {
ready: false,
loading: false,
initSearchbar: false,
things: [],
inbox: [],
selectedItems: [],
@ -246,16 +244,27 @@ export default {
onPageAfterIn () {
this.load()
},
onPageBeforeOut () {
this.stopEventSource()
this.$f7.data.lastThingsSearchQuery = this.$refs.searchbar?.$el.f7Searchbar.query
},
load () {
if (this.loading) return
this.loading = true
if (this.ready) this.$f7.data.lastThingsSearchQuery = this.$refs.searchbar?.f7Searchbar.query
this.ready = false
this.$oh.api.get('/rest/things?summary=true').then((data) => {
this.things = data.sort((a, b) => (a.label || a.UID).localeCompare(b.label || a.UID))
this.initSearchbar = true
this.loading = false
this.ready = true
setTimeout(() => {
this.$refs.listIndex.update()
if (this.$device.desktop && this.$refs.searchbar) this.$refs.searchbar.f7Searchbar.$inputEl[0].focus()
this.$nextTick(() => {
if (this.$refs.listIndex) this.$refs.listIndex.update()
if (this.$device.desktop && this.$refs.searchbar) {
this.$refs.searchbar.f7Searchbar.$inputEl[0].focus()
}
this.$refs.searchbar?.f7Searchbar.search(this.$f7.data.lastThingsSearchQuery || '')
})
if (!this.eventSource) this.startEventSource()
})