Перейти к содержимому
Odoo Меню
  • Войти
  • Попробовать бесплатно
  • Модули
    Финансы
    • Бухгалтерия
    • Выставление счетов
    • Расходы
    • Таблицы
    • Документооборот
    • Подпись
    Продажи
    • CRM
    • Продажи
    • POS Магазин
    • POS Ресторан
    • Подписки
    • Аренда
    Вебсайты
    • Конструктор вебсайтов
    • eCommerce
    • Блог
    • Форум
    • Онлайн-чат
    • Электронное обучение
    Логистика
    • Склад
    • Производство
    • PLM
    • Закупки
    • Обслуживание
    • Качество
    Отдел кадров
    • Сотрудники
    • Подбор персонала
    • Отпуска
    • Оценка персонала
    • Реферальная программа
    • Автопарк
    Маркетинг
    • SMM
    • E-mail рассылки
    • СМС рассылки
    • Мероприятия
    • Автоматизация маркетинга
    • Опросы
    Услуги
    • Проекты
    • Табели
    • Выездной сервис
    • Поддержка
    • Планирование
    • Встречи
    Продуктивность
    • Обсуждения
    • Согласование
    • IoT
    • VoIP-телефония
    • Knowledge
    • WhatsApp
    Сторонние приложения Модуль Студия Odoo Платформа Odoo Cloud
  • Индустрии
    Розничная торговля
    • Книжный магазин
    • Магазин одежды
    • Мебельный магазин
    • Продуктовый магазин
    • Строительный магазин
    • Магазин игрушек
    Гостинично-ресторанный бизнес
    • Бар и паб
    • Ресторан
    • Фастфуд
    • Гостевой дом
    • Дистрибьютор напитков
    • Отель
    Недвижимость
    • Агентство недвижимости
    • Архитектурное бюро
    • Строительство
    • Управление недвижимостью
    • Ландшафтный дизайн
    • Товарищество собственников жилья
    Консалтинг
    • Бухгалтерская фирма
    • Партнер Odoo
    • Маркетинговое агентство
    • Юридическая фирма
    • Подбор персонала
    • Аудиторское бюро
    Производство
    • Текстиль
    • Металл
    • Мебель
    • Продукты питания
    • Пивоварня
    • Корпоративные сувениры
    Здоровье и фитнес
    • Спортивный комплекс
    • Магазин оптики
    • Фитнес-клуб
    • Велнес-центр
    • Аптека
    • Салон красоты
    Услуги
    • Специалист по бытовым услугам
    • Продажа и обслуживание IT-оборудования
    • Солнечные энергосистемы
    • Производство обуви
    • Клининг
    • Системы ОВКВ
    Прочее
    • Некоммерческая организация
    • Консалтинг в сфере устойчивого развития
    • Аренда рекламных щитов
    • Бизнес по фотосъемке
    • Прокат велосипедов
    • Реселлер программного обеспечения
    Все индустрии
  • Community
    Обучение
    • Видео уроки
    • Документация
    • Сертификация
    • Тренинг
    • Блог
    • Подкаст
    Образование и развитие
    • Образовательная программа
    • Деловая игра Scale Up!
    • Экскурсия в офис Odoo
    ПО
    • Скачать
    • Сравнить версии
    • Релизы
    Сотрудничество
    • Github
    • Форум
    • Мероприятия
    • Перевод
    • Стать партнером
    • Услуги для партнеров
    • Зарегистрировать бухгалтерскую фирму
    Услуги
    • Найти партнера
    • Найти бухгалтера
    • Встреча с экспертом
    • Услуги по внедрению
    • Отзывы клиентов
    • Поддержка
    • Обновления
    Github Youtube Twitter Linkedin Instagram Facebook Spotify
    +1 (650) 691-3277
    Заказать демонстрацию
  • Цены
  • Поддержка

Odoo is the world's easiest all-in-one management software.
It includes hundreds of business apps:

  • CRM
  • e-Commerce
  • Бухгалтерия
  • Склад
  • PoS
  • Проекты
  • MRP
All apps
Чтобы взаимодействовать с сообществом, необходимо зарегистрироваться.
Все посты Люди Значки
Теги (Смотреть все)
odoo accounting v14 pos v15
Об этом форуме
Чтобы взаимодействовать с сообществом, необходимо зарегистрироваться.
Все посты Люди Значки
Теги (Смотреть все)
odoo accounting v14 pos v15
Об этом форуме
Помощь

How to hide the title or the close (X) button from a dialogService dialog?

Подписаться

Получайте уведомления о появлении активности в этом посте

Этот вопрос был отмечен
javascriptdevelopmentdebug
2 Ответы
1026 Представления
Аватар
Ruben Armando Acosta Trevizo

I’m currently working on customizing dialogs in Odoo and I would like to either hide the title of the dialog or remove the close (X) button that appears in the header of the dialogService.

So far, I’ve been able to open dialogs with custom buttons and content, but I haven’t found a clean way to control the header area. Ideally, I’d like to keep the dialog body and footer buttons, but without showing the default title or the close icon.

Has anyone achieved this before? Any suggestions on whether it should be done through CSS overrides, patching the Dialog component, or some configuration I might have missed?

0
Аватар
Отменить
Аватар
Cybrosys Techno Solutions Pvt.Ltd
Лучший ответ

Hi,

In Odoo 17/18 (OWL-based frontend), the dialogs you open with dialogService.add() are instances of the Dialog component. By default, they render with a header section that contains the title and the close (X) button. Unfortunately, there isn’t a built-in option in the service API to suppress just the header, so you need to tweak the component behavior yourself.


1. Use a patch on the Dialog component

You can patch the Dialog component in JavaScript to make the header optional:

/** @odoo-module **/


import { patch } from "@web/core/utils/patch";

import { Dialog } from "@web/core/dialog/dialog";


patch(Dialog.prototype, {

    setup() {

        this._super();

        // You could add a prop (e.g. hideHeader) to control this

    },

    get showHeader() {

        // if the props specify hideHeader, do not render the header

        return !this.props.hideHeader;

    },

});


Then, when calling dialogService.add(), you’d pass:


this.dialogService.add(Dialog, {

    hideHeader: true,

    body: "Custom body content here",

    buttons: [{ text: "OK", primary: true, close: true }],

});


This way you keep the footer buttons but no title/X.


2. Custom wrapper dialog component

Another approach is to create a new component that wraps Dialog but overrides the template so it doesn’t include the header. Then you can open this custom component via dialogService.add().


/** @odoo-module **/

import { Dialog } from "@web/core/dialog/dialog";


export class HeaderlessDialog extends Dialog {

    static template = "your_module.HeaderlessDialog"; // custom template without header

}


In your XML template, remove the header entirely but keep the body/footer slots.


If it’s for a single use case, CSS with a custom class is the quickest. If you want reusable control, patching Dialog to support a hideHeader prop is the cleanest solution.


Hope it helps

0
Аватар
Отменить
Ruben Armando Acosta Trevizo
Автор

Hi, thanks for your reply. I tried what you said, but it didn't work. I'll share my original code so you can review it; I probably missed something.

This is my code:
quantity_dialog.xml

<?xml version="1.0" encoding="UTF-8"?>

<t t-name="alx_barcode_psv.QuantityDialog">

<Dialog size="'md'" title="props.title || _('Ingrese cantidad')" footer="false" withCloseButton="false">

<t t-set="DialogHeader" t-value="''"/>

<div class="o_form_label mb-2">

<t t-esc="props.subtitle || ''"/>

</div>

<div class="mb-3">

<label class="form-label">

<t t-esc="props.label || _('Cantidad a agregar')"/>

</label>

<input type="number"

class="form-control"

t-model="state.qty"

min="0"

step="any"

t-att-autofocus="true"/>

<div class="d-flex justify-content-end mt-4">

<button style="margin-right: 8px;" type="button" class="btn btn-secondary" t-on-click="onCancel">

Cancelar

</button>

<button type="button" class="btn btn-primary" t-on-click="onConfirm">

Aceptar

</button>

</div>

</div>

</Dialog>

</t>

/** @odoo-module **/

import { _t } from "@web/core/l10n/translation";

import { patch } from "@web/core/utils/patch";

import BarcodePickingModel from "@stock_barcode/models/barcode_picking_model";

import { Component, useState } from "@odoo/owl";

import { Dialog } from "@web/core/dialog/dialog";

// COMPONENTE QuantityDialog embebido

class QuantityDialog extends Component {

static template = "alx_barcode_psv.QuantityDialog";

static components = { Dialog };

setup() {

const { defaultQty = 1 } = this.props;

this.state = useState({ qty: String(defaultQty) });

}

onConfirm() {

const value = parseFloat(this.state.qty);

if (isNaN(value) || value <= 0) return;

this.props.resolve(value);

this.props.close();

this._reactivateScanner();

}

onCancel() {

this.props.resolve(false);

this.props.close();

this._reactivateScanner();

}

_reactivateScanner() {

const model = this.props.model;

if (model && typeof model.startBarcodeScanner === "function") {

model.startBarcodeScanner();

model.trigger("playSound");

}

}

}

// Función de diálogo

function askQuantity(dialogService, product, model) {

return new Promise((resolve) => {

const title = _t("Cantidad para %s", product?.display_name || _t("Producto"));

const subtitle = product?.code ? `[${product.code}] ${product.display_name}` : (product?.display_name || "");

dialogService.add(QuantityDialog, {

title,

subtitle,

label: _t("Cantidad a agregar"),

defaultQty: 1,

resolve,

model,

closeOnOutsideClick: false,

closeOnEsc: false,

});

});

}

// Validación de producto no reservado

function denyNewLine(product) {

const name =

(product?.code ? `[${product.code}] ` : "") +

(product?.display_name || _t("Producto"));

this.trigger("playSound");

this.notification(

_t("No puedes escanear el producto %s porque no está reservado en esta operación.", name),

{ type: "danger" }

);

}

// Guardamos funciones originales

const ORIG = {

updateLine: BarcodePickingModel.prototype.updateLine,

setQtyDone: BarcodePickingModel.prototype.setQtyDone,

};

// Parcheo al modelo

patch(BarcodePickingModel.prototype, {

createNewLine(params) {

denyNewLine.call(this, params?.fieldsParams?.product_id);

return false;

},

async _createNewLine(params) {

denyNewLine.call(this, params?.fieldsParams?.product_id);

return false;

},

askBeforeNewLinesCreation(/* product */) {

return false;

},

async updateLine(line, fieldsParams = {}) {

if (fieldsParams.__skipQtyPopup || fieldsParams.package || fieldsParams.resultPackage) {

return await ORIG.updateLine.call(this, line, fieldsParams);

}

const product = fieldsParams.product || line?.product_id;

if (!product) {

return await ORIG.updateLine.call(this, line, fieldsParams);

}

this.trigger("playSound");

const qty = await askQuantity(this.dialogService, product, this);

if (!qty) {

this.notification(_t("Operación cancelada"), { type: "warning" });

return false;

}

const current = this.getQtyDone(line) || 0;

const newQty = current + qty;

fieldsParams.qty_done = newQty;

fieldsParams.__skipQtyPopup = true;

const res = await ORIG.updateLine.call(this, line, fieldsParams);

this.trigger("update");

return res;

},

});

{

"name": "Barcode Validations and entries",

"author": "ARCA Labs",

"depends": ["base","stock_barcode","barcodes"],

"data": [],

"assets": {

"web.assets_backend": [

"alx_barcode_psv/static/src/js/barcode_model_override.js",

"alx_barcode_psv/static/src/components/quantity_dialog/quantity_dialog.xml",

],

},

}

Не оставайтесь в стороне – присоединяйтесь к обсуждению!

Создайте аккаунт сегодня, чтобы получить доступ к эксклюзивным функциям и стать частью нашего замечательного сообщества!

Регистрация
Похожие посты Ответы Просмотры Активность
Error with rpc call
javascript development function debug
Аватар
Аватар
Аватар
2
июл. 25
1958
OWL Component Not Rendering in Custom Layout (Odoo 18) — Likely XML Template Issue
javascript development project debug
Аватар
Аватар
1
июл. 25
3715
Testing of computed field in Odoo 18 extension dev
development debug
Аватар
1
нояб. 25
529
How do I correctly create a calculated field to sum two other field values in Odoo Studio (Odoo Online)? Решено
development debug
Аватар
Аватар
2
нояб. 25
604
How can I use my only web url domain using odoo?
javascript development
Аватар
Аватар
1
сент. 25
1440
Сообщество
  • Видео уроки
  • Документация
  • Форум
Открытый исходный код
  • Скачать
  • Github
  • Runbot
  • Перевод
Услуги
  • Хостинг Odoo.sh
  • Поддержка
  • Обновление
  • Индивидуальные решения по доработке
  • Образование
  • Найти бухгалтера
  • Найти партнера
  • Стать партнером
О нас
  • Наша компания
  • Активы бренда
  • Cвяжитесь с нами
  • Вакансии
  • Мероприятия
  • Подкаст
  • Блог
  • Клиенты
  • Правовые документы • Конфиденциальность
  • Безопасность
الْعَرَبيّة Català 简体中文 繁體中文 (台灣) Čeština Dansk Nederlands English Suomi Français Deutsch हिंदी Bahasa Indonesia Italiano 日本語 한국어 (KR) Lietuvių kalba Język polski Português (BR) română русский язык Slovenský jazyk slovenščina Español (América Latina) Español ภาษาไทย Türkçe українська Tiếng Việt

Odoo – это набор бизнес-модулей с открытым исходным кодом, который закроет все потребности вашей компании: CRM, E-commerce, Бухгалтерия, Склад, POS, управление проектами и др.

Odoo сочетает в себе простоту использования и полную интеграцию всех бизнес-процессов в одной системе.

Website made with

Odoo Experience on YouTube

1. Use the live chat to ask your questions.
2. The operator answers within a few minutes.

Live support on Youtube
Watch now