Многие пользователи Odoo заметили множество удобных опций, которые предоставляет Odoo для сбора данных с помощью пользовательских форм. Эти виджеты могут включать в себя всё, от выбора даты и цвета до загрузки изображений и выпадающих списков, и всё это помогает улучшить общее взаимодействие с пользователем в Odoo.

В релизе Odoo 19 представлено множество встроенных виджетов, обеспечивающих широкий спектр функциональности, от простых текстовых полей до расширенных и интерактивных возможностей. Умение правильно использовать эти виджеты позволит вам улучшить пользовательский опыт при создании пользовательских форм в Odoo.

Почему виджеты важны

Виджеты выступают в роли посредника между исходными полями в базе данных (например, PostgreSQL) и пользователями, которые будут с ними работать. Например, если пользователь просматривает поле даты, сохраненное в PostgreSQL как строка, оно вряд ли будет для него полезным, пока эта строка не будет преобразована в удобный формат, например, в формат выбора даты. Тот же принцип применим к полям выбора, загрузке файлов или связанным записям, где виджет помогает пользователю легко или сложно выполнять поставленную задачу.

Система виджетов значительно эволюционировала со времен Odoo версии 19. Эта платформа позволяет разработчику определять, как отображать и управлять данными записей через формы, списки и даже в точке продаж (POS) . Независимо от того, разрабатываете ли вы простую контактную форму или более сложную панель управления для отслеживания нескольких проектов, система виджетов будет оптимально выполнять работу по отображению и реагированию на действия пользователя в этих системах.

Типы виджетов, которые вы действительно будете использовать.

Виджеты Char

Ввод текста кажется простым, пока вам не понадобится проверять правильность ввода, добавлять подсказки автозаполнения или форматировать данные определенным образом. Виджеты Char в Odoo 19 решают все эти задачи — независимо от того, работаете ли вы с обычным текстом, URL-адресами, адресами электронной почты или номерами телефонов. Они будут проверять соответствие необходимым шаблонам, предлагать полезные подсказки по мере ввода пользователем и даже запускать действия при изменении значения.

Подробное пошаговое руководство по внедрению виджетов Char вы найдете в нашем руководстве по виджетам Char .

Виджеты даты

Виджеты даты и времени присутствуют практически в каждом бизнес-приложении, которое вы будете создавать. Виджеты даты в Odoo 19 уже включают в себя средства выбора календаря, автоматически обрабатывают преобразования часовых поясов и адаптируются к языковому формату ваших пользователей. Они одинаково хорошо работают как в настольном браузере, так и на мобильных устройствах.

Подробнее о настройке виджетов дат вы можете узнать в нашем руководстве по виджетам дат .

Бинарные и графические виджеты

Раньше загрузка файлов и предварительный просмотр изображений означали написание собственного JavaScript-кода с нуля. Сегодня же виджеты для работы с бинарными файлами и изображениями в Odoo 19 берут на себя весь процесс — выбор файлов, генерацию миниатюр, создание ссылок для скачивания и многое другое. Они особенно удобны для каталогов товаров, профилей сотрудников и любых других систем управления документами.

Подробнее о реализации читайте в нашей статье о бинарных/графических виджетах .

Выпадающие виджеты Many2one

Реляционные данные могут быстро стать запутанными. Как помочь пользователям выбирать из тысяч записей, не перегружая их множеством вариантов? Виджеты выпадающих списков Many2one решают эту проблему благодаря функции поиска по мере ввода, интеллектуальной фильтрации и настраиваемым параметрам отображения. Они практически необходимы при связывании клиентов, товаров, проектов или любых других записей, которые ссылаются друг на друга.

Практические примеры смотрите в нашем руководстве по выпадающим виджетам Many2one .

Виджеты Канбан

Представления Kanban заслуживают отдельного подхода. Виджеты Kanban предоставляют вам карточки с настраиваемым макетом, элементами управления, которые можно перетаскивать, и интерактивными элементами, реагирующими на щелчки и действия. Именно благодаря им модули управления проектами и CRM в Odoo кажутся такими наглядными и отзывчивыми при перемещении сделок по этапам или задач по столбцам.

Изучите возможности настройки Kanban в нашем руководстве по виджетам Kanban .

Пользовательские виджеты JavaScript

Иногда стандартные функции просто не подходят. Возможно, вам нужна панель для подписи, интерфейс для сканирования штрих-кодов или какой-либо пользовательский инструмент визуализации данных, которого нет в Odoo. Создание собственных виджетов JavaScript в Odoo 19 довольно просто благодаря фреймворку Owl.

Узнайте, как создавать пользовательские элементы управления, в нашем подробном обзоре пользовательских виджетов JavaScript .

Как работают виджеты изнутри

По своей сути, виджеты — это просто компоненты, которые отображают значения полей и обрабатывают все, что вводят или нажимают пользователи. Когда вы добавляете `widget="date"` в поле в вашем XML-представлении, вы, по сути, указываете Odoo запустить компонент виджета даты, передать ему текущее значение и подключить все обработчики событий.

Odoo 19 работает на фреймворке Owl для всего фронтенда, включая виджеты. Это означает, что они реактивны — при изменении данных за ними они автоматически обновляются, а при взаимодействии пользователей с ними генерируются события. Фреймворк берет на себя всю утомительную работу с DOM и отслеживанием состояния, так что вам не нужно этим заниматься.

Выбор подходящего виджета

Обычно стандартный виджет для определенного типа поля вполне справляется со своей задачей, но иногда требуется что-то более индивидуальное:

• Используйте widget="email" вместо обычного символа для полей электронной почты — это обеспечит проверку данных и кликабельные ссылки mailto.
• Если вам нужны миниатюрные изображения вместо кнопок загрузки, используйте widget=" binary" вместо widget="image".
• Попробуйте использовать widget="many2many_tags" для более аккуратного отображения полей "многие ко многим" по сравнению со стандартным списковым представлением.
• Рассмотрите возможность использования `widget="monetary"` для полей валюты, чтобы обеспечить правильное форматирование и размещение символа валюты в нужном месте.

В документации представлен полный список доступных виджетов. Но, честно говоря, лучший способ обучения — это изучение существующих модулей Odoo и наблюдение за тем, что действительно хорошо работает на практике.

Вопросы производительности

Виджеты работают полностью в браузере, а это значит, что они должны быть компактными. Если вы создаёте ресурсоёмкие виджеты, которые обрабатывают большие объёмы данных или пытаются отображать огромные массивы информации, ваши формы будут тормозить во время загрузки. Odoo 19 помогает — он использует отложенную загрузку виджетов и отображает только то, что действительно видно на экране, — но всё равно нужно быть осторожным при создании пользовательских виджетов.

При работе с большими наборами данных используйте виджеты поиска, а не пытайтесь загрузить все сразу. Если вам нужно выполнить сложные вычисления, перенесите эту работу на бэкэнд и используйте вычисляемые поля. Задача вашего виджета — отображение и взаимодействие с пользователем, а не выполнение бизнес-логики.

Виджеты в разных режимах просмотра

Виджеты ведут себя по-разному в зависимости от контекста:

• Отображение форм: Полная интерактивность, доступны все функции виджета.
• Списковые представления: упрощенное отображение, ограниченное взаимодействие.
• Представления Kanban: настраиваемые макеты, поддержка перетаскивания.
• POS-интерфейс: оптимизирован для сенсорного управления, критически важен для производительности.

Понимание этих контекстов поможет вам выбрать виджеты, которые будут работать во всех местах, где отображаются ваши поля.

С чего начать

Если вы только начинаете работать с виджетами Odoo, не пытайтесь изучить всё сразу. Начните с самых необходимых: виджеты символов для ввода текста, виджеты дат для выбора элементов календаря и виджеты выбора для выпадающих списков. Потратьте время на работу с ними в ваших XML-представлениях, пока не почувствуете себя уверенно, сопоставляя виджеты с соответствующими типами полей.

После того, как вы освоите эти основы, переходите к бинарным виджетам — они необходимы, когда пользователи хотят загружать документы или изображения. Далее идут виджеты Many2one, и они стоят затраченных усилий, поскольку управляют тем, как пользователи выбирают связанные записи из других моделей.

Как только вы освоите возможности Odoo, доступные по умолчанию, вы, вероятно, столкнетесь с ситуациями, когда стандартные виджеты не совсем подходят для того, что вы пытаетесь создать. Именно тогда пользовательские виджеты на JavaScript станут вашими лучшими друзьями.

Создание форм, которые нравятся пользователям.

Хороший дизайн форм выходит за рамки просто корректной работы — он направлен на облегчение умственных усилий и создание плавного и естественного процесса ввода данных. При правильном выборе виджетов пользователи мгновенно понимают, что им нужно сделать, ошибки выявляются до отправки, а исправление становится простым.

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

Odoo 19 предоставляет все необходимое для создания интерфейсов, которые люди не просто терпят, а активно используют с удовольствием. Независимо от того, изменяете ли вы стандартные элементы или создаете что-то свое с нуля, освоение виджетов окупается каждый раз, когда вы открываете форму.