diff --git a/addons/web/static/src/core/pager/pager.js b/addons/web/static/src/core/pager/pager.js index 108c347332b..014a15ba832 100644 --- a/addons/web/static/src/core/pager/pager.js +++ b/addons/web/static/src/core/pager/pager.js @@ -50,7 +50,7 @@ export class Pager extends Component { return parts.join("-"); } /** - * @returns {boolean} true iff there is only one page + * @returns {boolean} true if there is only one page */ get isSinglePage() { return this.minimum === 1 && this.maximum === this.props.total; @@ -68,15 +68,14 @@ export class Pager extends Component { } else if (minimum < 0 && this.props.limit > 1) { minimum = this.props.total - (this.props.total % this.props.limit || this.props.limit); } - - this.update(minimum, this.props.limit); + this.update(minimum, this.props.limit, true); } /** * @param {string} value * @returns {{ minimum: number, maximum: number }} */ parse(value) { - let [minimum, maximum] = value.trim().split(/\s*[\-\s,;]\s*/); + let [minimum, maximum] = value.trim().split(/\s*[-\s,;]\s*/); const clamp = (value) => Math.min(Math.max(value, 1), this.props.total); return { minimum: clamp(parseInt(minimum, 10)) - 1, @@ -96,10 +95,11 @@ export class Pager extends Component { /** * @param {number} offset * @param {number} limit + * @param {Boolean} hasNavigated */ - async update(offset, limit) { + async update(offset, limit, hasNavigated) { this.state.isDisabled = true; - await this.props.onUpdate({ offset, limit }); + await this.props.onUpdate({ offset, limit }, hasNavigated); this.state.isDisabled = false; this.state.isEditing = false; } diff --git a/addons/web/static/src/search/action_menus/action_menus.js b/addons/web/static/src/search/action_menus/action_menus.js new file mode 100644 index 00000000000..f12d2b8d74e --- /dev/null +++ b/addons/web/static/src/search/action_menus/action_menus.js @@ -0,0 +1,145 @@ +/** @odoo-module **/ + +import { browser } from "@web/core/browser/browser"; +import { makeContext } from "@web/core/context"; +import { session } from "@web/session"; +import { registry } from "@web/core/registry"; +import { Dropdown } from "@web/core/dropdown/dropdown"; +import { DropdownItem } from "@web/core/dropdown/dropdown_item"; +import { useService } from "@web/core/utils/hooks"; + +const { Component, onWillStart, onWillUpdateProps } = owl; +let registryActionId = 0; +/** + * Action menus (or Action/Print bar, previously called 'Sidebar') + * + * The side bar is the group of dropdown menus located on the left side of the + * control panel. Its role is to display a list of items depending on the view + * type and selected records and to execute a set of actions on active records. + * It is made out of 2 dropdown: Print and Action. + * + * @extends Component + */ +export class ActionMenus extends Component { + setup() { + this.orm = useService("orm"); + this.actionService = useService("action"); + onWillStart(async () => { + this.actionItems = await this.setActionItems(this.props); + }); + onWillUpdateProps(async (nextProps) => { + this.actionItems = await this.setActionItems(nextProps); + }); + } + + get printItems() { + const printActions = this.props.items.print || []; + return printActions.map((action) => ({ + action, + description: action.name, + key: action.id, + })); + } + + //--------------------------------------------------------------------- + // Private + //--------------------------------------------------------------------- + + async setActionItems(props) { + // Callback based actions + const callbackActions = (props.items.other || []).map((action) => + Object.assign({ key: `action-${action.description}` }, action) + ); + // Action based actions + const actionActions = props.items.action || []; + const formattedActions = actionActions.map((action) => ({ + action, + description: action.name, + key: action.id, + })); + // ActionMenus action registry components + const registryActions = []; + for (const { Component, getProps } of registry.category("action_menus").getAll()) { + const itemProps = await getProps(props, this.env); + if (itemProps) { + registryActions.push({ + Component, + key: `registry-action-${registryActionId++}`, + props: itemProps, + }); + } + } + + return [...callbackActions, ...formattedActions, ...registryActions]; + } + + //--------------------------------------------------------------------- + // Handlers + //--------------------------------------------------------------------- + + async executeAction(action) { + let activeIds = this.props.activeIds; + if (this.props.isDomainSelected) { + activeIds = await this.orm.search(this.props.resModel, this.props.domain, { + limit: session.active_ids_limit, + context: this.props.context, + }); + } + const activeIdsContext = { + active_id: activeIds[0], + active_ids: activeIds, + active_model: this.props.resModel, + }; + if (this.props.domain) { + // keep active_domain in context for backward compatibility + // reasons, and to allow actions to bypass the active_ids_limit + activeIdsContext.active_domain = this.props.domain; + } + const context = makeContext([this.props.context, activeIdsContext]); + return this.actionService.doAction(action.id, { + additionalContext: context, + on_close: () => this.trigger("reload"), + }); + } + + /** + * Handler used to determine which way must be used to execute a selected + * action: it will be either: + * - a callback (function given by the view controller); + * - an action ID (string); + * - an URL (string). + * @private + * @param {Object} item + */ + onItemSelected(item) { + if (item.callback) { + item.callback([item]); + } else if (item.action) { + this.executeAction(item.action); + } else if (item.url) { + // Event has been prevented at its source: we need to redirect manually. + browser.location = item.url; + } + } +} + +ActionMenus.components = { + Dropdown, + DropdownItem, +}; +ActionMenus.props = { + activeIds: { type: Array, element: [Number, String] }, // virtual IDs are strings. + context: Object, + resModel: String, + domain: { type: Array, optional: true }, + isDomainSelected: { type: Boolean, optional: true }, + items: { + type: Object, + shape: { + action: { type: Array, optional: true }, + print: { type: Array, optional: true }, + other: { type: Array, optional: true }, + }, + }, +}; +ActionMenus.template = "web.ActionMenus"; diff --git a/addons/web/static/src/search/action_menus/action_menus.xml b/addons/web/static/src/search/action_menus/action_menus.xml new file mode 100644 index 00000000000..56ca0a56f9e --- /dev/null +++ b/addons/web/static/src/search/action_menus/action_menus.xml @@ -0,0 +1,33 @@ + + + + +
+ + + + Print + + + + + + + + + + + + Action + + + + + + + + +
+ + + diff --git a/addons/web/static/src/search/control_panel/control_panel.js b/addons/web/static/src/search/control_panel/control_panel.js index 65ea3c45a4c..9db06294bdf 100644 --- a/addons/web/static/src/search/control_panel/control_panel.js +++ b/addons/web/static/src/search/control_panel/control_panel.js @@ -1,5 +1,6 @@ /** @odoo-module **/ +import { getActiveHotkey } from "@web/core/hotkeys/hotkey_service"; import { Pager } from "@web/core/pager/pager"; import { useService } from "@web/core/utils/hooks"; import { ComparisonMenu } from "../comparison_menu/comparison_menu"; @@ -25,6 +26,18 @@ export class ControlPanel extends Component { : undefined; } + /** + * @param {KeyboardEvent} ev + */ + onBottomLeftKeydown(ev) { + const hotkey = getActiveHotkey(ev); + if (hotkey === "arrowdown") { + this.env.searchModel.trigger("focus-view"); + ev.preventDefault(); + ev.stopPropagation(); + } + } + /** * @returns {Object} */ @@ -34,6 +47,7 @@ export class ControlPanel extends Component { "top-left": true, "top-right": true, "bottom-left": true, + "bottom-left-buttons": true, "bottom-right": true, }, this.props.display || this.env.searchModel.display.controlPanel diff --git a/addons/web/static/src/search/control_panel/control_panel.xml b/addons/web/static/src/search/control_panel/control_panel.xml index 90424ed3314..60bff845c65 100644 --- a/addons/web/static/src/search/control_panel/control_panel.xml +++ b/addons/web/static/src/search/control_panel/control_panel.xml @@ -2,46 +2,49 @@ -
+
-
- - +
+ +
-
- +
+
-
- +
+ +
-
- - @@ -52,11 +55,7 @@
    -
  1. +
  2. Unnamed diff --git a/addons/web/static/src/search/filter_menu/custom_filter_item.js b/addons/web/static/src/search/filter_menu/custom_filter_item.js index 90e2b5adbf9..1703cec6937 100644 --- a/addons/web/static/src/search/filter_menu/custom_filter_item.js +++ b/addons/web/static/src/search/filter_menu/custom_filter_item.js @@ -1,8 +1,8 @@ /** @odoo-module **/ -import { Dropdown } from "@web/core/dropdown/dropdown"; import { DatePicker, DateTimePicker } from "@web/core/datepicker/datepicker"; import { Domain } from "@web/core/domain"; +import { Dropdown } from "@web/core/dropdown/dropdown"; import { serializeDate, serializeDateTime } from "@web/core/l10n/dates"; import { _lt } from "@web/core/l10n/translation"; import { registry } from "@web/core/registry"; @@ -86,23 +86,23 @@ const FIELD_OPERATORS = { ], }; -const parseField = (field, value, opts = {}) => { +function parseField(field, value, opts = {}) { if (FIELD_TYPES[field.type] === "char") { return value; } const type = field.type === "id" ? "integer" : field.type; const parse = parsers.contains(type) ? parsers.get(type) : (v) => v; return parse(value, { field, ...opts }); -}; +} -const formatField = (field, value, opts = {}) => { +function formatField(field, value, opts = {}) { if (FIELD_TYPES[field.type] === "char") { return value; } const type = field.type === "id" ? "integer" : field.type; const format = formatters.contains(type) ? formatters.get(type) : (v) => v; - return format(value, { field, ...opts }); -}; + return format(value, { digits: field.digits, ...opts }); +} export class CustomFilterItem extends Component { setup() { @@ -176,7 +176,11 @@ export class CustomFilterItem extends Component { if (genericType === "datetime") { condition.value[0] = condition.value[0].set({ hour: 0, minute: 0, second: 0 }); if (operator.symbol === "between") { - condition.value[1] = condition.value[1].set({ hour: 23, minute: 59, second: 59 }); + condition.value[1] = condition.value[1].set({ + hour: 23, + minute: 59, + second: 59, + }); } } break; diff --git a/addons/web/static/src/search/layout.js b/addons/web/static/src/search/layout.js index a8f6c97feae..81fc11a1d97 100644 --- a/addons/web/static/src/search/layout.js +++ b/addons/web/static/src/search/layout.js @@ -9,22 +9,28 @@ const { Component } = owl; * @param {Object} params * @returns {Object} */ -export const extractLayoutComponents = (params) => { +export function extractLayoutComponents(params) { return { ControlPanel: params.ControlPanel || ControlPanel, SearchPanel: params.SearchPanel || SearchPanel, Banner: params.Banner || false, }; -}; +} export class Layout extends Component { setup() { const { display = {} } = this.env.searchModel || {}; this.components = extractLayoutComponents(this.env.config); + if (display.controlPanel && this.env.inDialog) { + display.controlPanel["top-left"] = false; + display.controlPanel["bottom-left-buttons"] = false; + } this.display = display; } get controlPanelSlots() { const slots = { ...this.props.slots }; + slots["control-panel-bottom-left-buttons"] = slots["layout-buttons"]; + delete slots["layout-buttons"]; delete slots.default; return slots; } diff --git a/addons/web/static/src/search/layout.xml b/addons/web/static/src/search/layout.xml index 23a246b4201..15b16619149 100644 --- a/addons/web/static/src/search/layout.xml +++ b/addons/web/static/src/search/layout.xml @@ -2,6 +2,9 @@ + + +
    diff --git a/addons/web/static/src/search/pager_hook.js b/addons/web/static/src/search/pager_hook.js index b0f25d8ff36..df9c456629b 100644 --- a/addons/web/static/src/search/pager_hook.js +++ b/addons/web/static/src/search/pager_hook.js @@ -23,7 +23,7 @@ const { useEnv, useChildSubEnv, useState, onWillRender } = owl; */ export function usePager(getProps) { const env = useEnv(); - const pagerState = useState(getProps()); + const pagerState = useState({}); useChildSubEnv({ config: { @@ -32,6 +32,6 @@ export function usePager(getProps) { }, }); onWillRender(() => { - Object.assign(pagerState, getProps()); + Object.assign(pagerState, getProps() || { total: 0 }); }); } diff --git a/addons/web/static/src/search/search_arch_parser.js b/addons/web/static/src/search/search_arch_parser.js index 09bdb370079..9883356f40d 100644 --- a/addons/web/static/src/search/search_arch_parser.js +++ b/addons/web/static/src/search/search_arch_parser.js @@ -17,13 +17,13 @@ const DEFAULT_VIEWS_WITH_SEARCH_PANEL = ["kanban", "list"]; * @param {string} context * @returns {string[]} */ -const getContextGroubBy = (context) => { +function getContextGroubBy(context) { try { return makeContext([context]).group_by.split(":"); } catch (_err) { return []; } -}; +} function reduceType(type) { if (type === "dateFilter") { diff --git a/addons/web/static/src/search/search_bar/search_bar.js b/addons/web/static/src/search/search_bar/search_bar.js index 30c81eba892..3437678b45c 100644 --- a/addons/web/static/src/search/search_bar/search_bar.js +++ b/addons/web/static/src/search/search_bar/search_bar.js @@ -37,7 +37,7 @@ export class SearchBar extends Component { this.inputRef = useAutofocus(); - useBus(this.env.bus, "FOCUS-SEARCH-BAR", () => { + useBus(this.env.searchModel, "focus-search", () => { this.inputRef.el.focus(); }); @@ -345,7 +345,7 @@ export class SearchBar extends Component { focusedIndex = this.state.focusedIndex + 1; } } else { - this.env.bus.trigger("FOCUS-VIEW"); + this.env.searchModel.trigger("focus-view"); } break; case "ArrowUp": diff --git a/addons/web/static/src/search/search_model.js b/addons/web/static/src/search/search_model.js index 9ca0506e4c4..72e1704ca0a 100644 --- a/addons/web/static/src/search/search_model.js +++ b/addons/web/static/src/search/search_model.js @@ -266,8 +266,10 @@ export class SearchModel extends EventBus { this.__legacyParseSearchPanelArchAnyway(searchViewDescription, searchViewFields); this.domainParts = {}; this.display = this._getDisplay(config.display); - - return this._reloadSections(); + if (!this.searchPanelInfo.loaded) { + return this._reloadSections(); + } + return; } this.blockNotification = true; @@ -310,7 +312,7 @@ export class SearchModel extends EventBus { ); const { labels, preSearchItems, searchPanelInfo, sections } = parser.parse(); - this.searchPanelInfo = { ...searchPanelInfo, shouldReload: false }; + this.searchPanelInfo = { ...searchPanelInfo, loaded: false, shouldReload: false }; await Promise.all(labels.map((cb) => cb(this.orm))); @@ -1284,6 +1286,7 @@ export class SearchModel extends EventBus { async _fetchSections(categoriesToLoad, filtersToLoad) { await this._fetchCategories(categoriesToLoad); await this._fetchFilters(filtersToLoad); + this.searchPanelInfo.loaded = true; } _getActiveComparison() { @@ -1423,9 +1426,9 @@ export class SearchModel extends EventBus { let domain; try { domain = Domain.and(domains); - return params.raw ? domain : domain.toList( - Object.assign({}, this.globalContext, this.userService.context) - ); + return params.raw + ? domain + : domain.toList(Object.assign({}, this.globalContext, this.userService.context)); } catch (error) { throw new Error( `${this.env._t("Failed to evaluate the domain")} ${domain.toString()}.\n${ @@ -2094,6 +2097,6 @@ export class SearchModel extends EventBus { const parser = new SearchArchParser(searchViewDescription, searchViewFields); const { searchPanelInfo } = parser.parse(); - this.searchPanelInfo = { ...searchPanelInfo, shouldReload: false }; + this.searchPanelInfo = { ...searchPanelInfo, loaded: false, shouldReload: false }; } } diff --git a/addons/web/static/src/search/utils/misc.js b/addons/web/static/src/search/utils/misc.js index 4a537462e19..73441e06e4b 100644 --- a/addons/web/static/src/search/utils/misc.js +++ b/addons/web/static/src/search/utils/misc.js @@ -14,5 +14,6 @@ export const GROUPABLE_TYPES = [ "datetime", "integer", "many2one", + "many2many", "selection", ]; diff --git a/addons/web/static/src/search/with_search/with_search.js b/addons/web/static/src/search/with_search/with_search.js index 1bf1c0732b0..b371ff93a51 100644 --- a/addons/web/static/src/search/with_search/with_search.js +++ b/addons/web/static/src/search/with_search/with_search.js @@ -7,12 +7,9 @@ import { CallbackRecorder, useSetupAction } from "@web/webclient/actions/action_ const { Component, onWillStart, onWillUpdateProps, toRaw, useSubEnv } = owl; export const SEARCH_KEYS = ["comparison", "context", "domain", "groupBy", "orderBy"]; -const OTHER_SEARCH_KEYS = ["irFilters", "searchViewArch", "searchViewFields", "searchViewId"]; export class WithSearch extends Component { setup() { - this.Component = this.props.Component; - if (!this.env.__getContext__) { useSubEnv({ __getContext__: new CallbackRecorder() }); } @@ -54,31 +51,12 @@ export class WithSearch extends Component { await this.searchModel.reload(config); }); } - - //------------------------------------------------------------------------- - // Getters - //------------------------------------------------------------------------- - - get componentProps() { - const componentProps = { ...this.props.componentProps }; - for (const key of SEARCH_KEYS) { - componentProps[key] = this.searchModel[key]; - } - componentProps.info = componentProps.info || {}; - for (const key of OTHER_SEARCH_KEYS) { - componentProps.info[key] = this.searchModel[key]; - } - return componentProps; - } } -WithSearch.defaultProps = { - componentProps: {}, -}; +WithSearch.template = "web.WithSearch"; WithSearch.props = { - Component: Function, + slots: Object, SearchModel: { type: Function, optional: true }, - componentProps: { type: Object, optional: true }, resModel: String, @@ -107,4 +85,3 @@ WithSearch.props = { dynamicFilters: { type: Array, element: Object, optional: true }, searchMenuTypes: { type: Array, element: String, optional: true }, }; -WithSearch.template = "web.WithSearch"; diff --git a/addons/web/static/src/search/with_search/with_search.xml b/addons/web/static/src/search/with_search/with_search.xml index ec650abaf5c..cfae1dfb112 100644 --- a/addons/web/static/src/search/with_search/with_search.xml +++ b/addons/web/static/src/search/with_search/with_search.xml @@ -2,7 +2,12 @@ - + diff --git a/addons/web/static/tests/search/with_search_tests.js b/addons/web/static/tests/search/with_search_tests.js index a881ee97b7e..2cb8f966ce9 100644 --- a/addons/web/static/tests/search/with_search_tests.js +++ b/addons/web/static/tests/search/with_search_tests.js @@ -322,18 +322,23 @@ QUnit.module("Search", (hooks) => { class Parent extends Component { setup() { - this.state = useState({ + this.searchState = useState({ resModel: "animal", - Component: TestComponent, domain: [["type", "=", "carnivorous"]], }); } } - Parent.template = xml``; - Parent.components = { WithSearch }; + Parent.template = xml` + + + + `; + Parent.components = { WithSearch, TestComponent }; const parent = await mount(Parent, target, { env }); - parent.state.domain = [["type", "=", "herbivorous"]]; + parent.searchState.domain = [["type", "=", "herbivorous"]]; await nextTick(); });