You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
114 lines
4.8 KiB
114 lines
4.8 KiB
/** @odoo-module */
|
|
import { NavBar } from "@web/webclient/navbar/navbar";
|
|
import { registry } from "@web/core/registry";
|
|
const { fuzzyLookup } = require('@web/core/utils/search');
|
|
import { computeAppsAndMenuItems } from "@web/webclient/menus/menu_helpers";
|
|
import { useRef ,onMounted} from "@odoo/owl";
|
|
import { patch } from "@web/core/utils/patch";
|
|
|
|
// patch NavaBar for searching apps and contents by extending navbar
|
|
patch(NavBar.prototype, {
|
|
//--------------------------------------------------------------------------
|
|
// Public
|
|
//--------------------------------------------------------------------------
|
|
/**
|
|
* @override
|
|
*/
|
|
setup() {
|
|
super.setup()
|
|
this.side_root = useRef("side_root");
|
|
this._search_def = $.Deferred();
|
|
let {
|
|
apps,
|
|
menuItems
|
|
} = computeAppsAndMenuItems(this.menuService.getMenuAsTree("root"));
|
|
this._apps = apps;
|
|
this._searchableMenus = menuItems;
|
|
onMounted(this.onMounted);
|
|
},
|
|
|
|
onMounted() {
|
|
this.$search_container = $(this.root.el.children.sidebar_panel.querySelector(".search-container"));
|
|
this.$search_input = $(this.root.el.children.sidebar_panel.querySelector(".search-input input"));
|
|
this.$search_results = $(this.root.el.children.sidebar_panel.querySelector(".search-results"));
|
|
this.$app_menu = $(this.root.el.children.sidebar_panel.querySelector(".app-menu"));
|
|
},
|
|
/**
|
|
* Shows the search results and triggers a search.
|
|
*/
|
|
_searchMenusSchedule: function() {
|
|
this.$search_results.removeClass("o_hidden")
|
|
this.$app_menu.addClass("o_hidden");
|
|
this._search_def.reject();
|
|
this._search_def = $.Deferred();
|
|
setTimeout(this._search_def.resolve.bind(this._search_def), 50);
|
|
this._search_def.done(this._searchMenus.bind(this));
|
|
},
|
|
/**
|
|
* Performs a fuzzy search on the available apps and menu items.
|
|
*/
|
|
_searchMenus: function() {
|
|
var query = this.$search_input.val();
|
|
var self = this
|
|
if (query === "") {
|
|
this.$search_container.removeClass("has-results");
|
|
this.$app_menu.removeClass("o_hidden");
|
|
this.$search_results.empty();
|
|
return;
|
|
}
|
|
// Search for all apps.
|
|
var results = [];
|
|
fuzzyLookup(query, this._apps, (menu) => menu.label)
|
|
.forEach((menu) => {
|
|
results.push({
|
|
category: "apps",
|
|
name: menu.label,
|
|
actionID: menu.actionID,
|
|
id: menu.id,
|
|
webIconData: menu.webIconData,
|
|
});
|
|
});
|
|
// Search for all menu items.
|
|
fuzzyLookup(query, this._searchableMenus, (menu) =>
|
|
(menu.parents + " / " + menu.label).split("/").reverse().join("/")
|
|
).forEach((menu) => {
|
|
results.push({
|
|
category: "menu_items",
|
|
name: menu.parents + " / " + menu.label,
|
|
actionID: menu.actionID,
|
|
id: menu.id,
|
|
});
|
|
});
|
|
// Render the search results.
|
|
this.$search_container.toggleClass("has-results", Boolean(results.length));
|
|
this.$search_results.empty()
|
|
var resultsHtml = ""
|
|
results.forEach(function(result) {
|
|
resultsHtml += "<div class='search_icons'><a class='o-menu-search-result dropdown-item col-12 ml-auto mr-auto' style=\"background-image:url('data:image/png;base64," + result["webIconData"] + "')\" href='web#action=" + result["actionID"] + "&menu_id=" + result["id"] + "'>" + result["name"] + "</a></div>"
|
|
})
|
|
this.$search_results.append(resultsHtml);
|
|
// close side bar panel on click
|
|
let elements = this.$search_results[0].querySelectorAll('.search_icons')
|
|
for (var i = 0; i < elements.length; i++) {
|
|
elements[i].addEventListener('click', function(){
|
|
var ev = self.__owl__.bdom.el.querySelectorAll('#openSidebar .fa')[0]
|
|
var $el = $(self.__owl__.bdom.el.querySelectorAll('#sidebar_panel'))
|
|
var action = $(self.__owl__.bdom.parentEl.querySelectorAll('.o_action_manager'))
|
|
$el.find('.form-control')[0].value = ""
|
|
self._searchMenus()
|
|
if (!$(ev).hasClass('opened')){
|
|
$el.show()
|
|
$(ev).toggleClass('opened')
|
|
$el.css({'display':'block'});
|
|
action.css({'margin-left': '320px','transition':'all .1s linear'});
|
|
}
|
|
else{
|
|
$el.hide()
|
|
$(ev).toggleClass('opened')
|
|
$el.css({'display':'none'});
|
|
action.css({'margin-left': '0px'});
|
|
}
|
|
});
|
|
}
|
|
},
|
|
});
|
|
|