[FIX] website: show icons in autocomplete results when no image defined

Since [1] when the search bar was refactored, images can be displayed in
the autocomplete results, and fallback icons are displayed instead of
images for records that have no images.
However, if no module that participates in the results provides actual
images, then the fallback icons are not displayed at all.

This commit makes the fallback icons displayed only based on the "Image"
toggle option of the search bar.
It also disables the hidden display options and enables the visible
ones.

Steps to reproduce:
- Do NOT install website_sale (which is currently the only module that
provides autocomplete results with images).
- Drop a "Search" block.
- Save.
- Type a single letter in the search box. (e.g. "a")
=> Autocomplete results were displayed without their icons.

[1]: https://github.com/odoo/odoo/commit/7559626c54e34b41e1549e28276a650accec6986

task-2951026

closes odoo/odoo#106953

X-original-commit: 4eecba4c8f5327fd1a137a8d88574c2b6a5eda05
Signed-off-by: Romain Derie (rde) <rde@odoo.com>
This commit is contained in:
Benoit Socias
2022-12-01 14:34:15 +01:00
committed by Romain Derie
parent 8ec2bf6b29
commit 4c2ed5a5f7
2 changed files with 13 additions and 1 deletions
@@ -17,7 +17,7 @@
<a t-foreach="results" t-as="result"
t-att-href="result['website_url']" class="dropdown-item p-2 text-wrap">
<div class="d-flex align-items-center o_search_result_item">
<t t-if="parts['image_url'] and widget.displayImage">
<t t-if="widget.displayImage">
<img t-if="result['image_url']" t-att-src="result['image_url']" class="flex-shrink-0 o_image_64_contain"/>
<i t-else="" t-attf-class="o_image_64_contain text-center pt16 fa #{result['_fa']}" style="font-size: 34px;"/>
</t>
@@ -22,6 +22,18 @@ options.registry.SearchBar = options.Class.extend({
defaultOrder.click(); // close
}
}});
// Reset display options.
const displayOptions = new Set();
for (const optionEl of this.$el[0].querySelectorAll('[data-dependencies="limit_opt"] [data-attribute-name^="display"]')) {
displayOptions.add(optionEl.dataset.attributeName);
}
const scopeName = this.$el[0].querySelector(`[data-set-search-type="${widgetValue}"]`).dataset.name;
for (const displayOption of displayOptions) {
this.$target[0].dataset[displayOption] = this.$el[0].querySelector(
`[data-attribute-name="${displayOption}"][data-dependencies="${scopeName}"]`
) ? 'true' : '';
}
}
},