diff --git a/bundles/org.openhab.ui/web/src/pages/settings/things/inbox/inbox-list.vue b/bundles/org.openhab.ui/web/src/pages/settings/things/inbox/inbox-list.vue index 6041c789c..19ed61ad7 100644 --- a/bundles/org.openhab.ui/web/src/pages/settings/things/inbox/inbox-list.vue +++ b/bundles/org.openhab.ui/web/src/pages/settings/things/inbox/inbox-list.vue @@ -11,8 +11,9 @@ ref="searchbar" class="searchbar-inbox" :init="initSearchbar" - search-container=".contacts-list" - search-in=".item-inner" + custom-search + @searchbar:search="search" + @searchbar:clear="clearSearch" :disable-button="!$theme.aurora" /> @@ -79,7 +80,14 @@ - {{ inboxCount }} entries + + + {{ inboxCount }} entries + +
@@ -113,7 +121,7 @@ - + - +
@@ -178,8 +186,8 @@ export default { initSearchbar: false, things: [], // for validating thingUIDs against existing things inbox: [], - // indexedInbox: {}, selectedItems: [], + searchQuery: null, showIgnored: false, groupBy: 'alphabetical', showCheckboxes: false, @@ -191,8 +199,16 @@ export default { if (!this.inbox) return 0 return (this.showIgnored) ? this.inbox.length : this.inbox.filter((e) => e.flag !== 'IGNORED').length }, - indexedInbox () { - const filteredInbox = (this.showIgnored) ? this.inbox : this.inbox.filter((e) => e.flag !== 'IGNORED') + filteredIndexedInbox () { + let filteredInbox = (this.showIgnored) ? this.inbox : this.inbox.filter((e) => e.flag !== 'IGNORED') + if (this.searchQuery) { + const searchQuery = this.searchQuery.toLowerCase() + filteredInbox = filteredInbox.filter((e) => + e.label.toLowerCase().includes(searchQuery) || + e.thingUID.toLowerCase().includes(searchQuery) || + e.properties[e.representationProperty]?.toLowerCase()?.includes(searchQuery) + ) + } if (this.groupBy === 'alphabetical') { return filteredInbox.reduce((prev, entry, i, inbox) => { const initial = entry.label.substring(0, 1).toUpperCase() @@ -218,6 +234,12 @@ export default { return objEntries }, {}) } + }, + filteredItems () { + return Object.values(this.filteredIndexedInbox).flat().map(e => e.thingUID) + }, + areAllSelected () { + return this.selectedItems.length >= this.filteredItems.length } }, methods: { @@ -493,6 +515,25 @@ export default { }, filterSelectedItems () { return this.inbox.filter((e) => this.selectedItems.indexOf(e.thingUID) >= 0) + }, + search (searchbar, query, previousQuery) { + if (query) { + this.searchQuery = query + this.selectedItems = this.selectedItems.filter((selected) => this.filteredItems.includes(selected)) + } else { + this.clearSearch() + } + }, + clearSearch () { + this.searchQuery = null + }, + selectDeselectAll () { + if (this.areAllSelected) { + this.selectedItems = [] + } else { + // copy the array, so when we remove some selectedItems (unchecking them), it won't affect filteredItems + this.selectedItems = this.filteredItems.slice() + } } } }