Webix 6.3: Полноэкранный режим, улучшенная стилизация кнопок, промисы для сохранения

Встречайте новый Webix 6.3! В новой версии вас ждет полноэкранный режим для всех UI-элементов, новые правила стилизации и выбора типов для кнопок, промисы для сохранения данных и упоминание пользователей в виджете Comments.

Полный список обновлений доступен на странице What’s new. Читайте дальше, чтобы узнать обо всех главных новостях этого релиза.

Webix 6.3: Полноэкранный режим, улучшенная стилизация кнопок, промисы для сохранения

Все виджеты в полноэкранный режим

Вы сможете открывать любой виджет или HTML-элемент в полноэкранном режиме благодаря новому fullscreen модулю.

// open in the fullscreen mode
webix.fullscreeen.set("chart1");
// exit the fullscreen mode
webix.fullscreen.exit();

Демо >>

Легко закрывайте окна

Теперь намного легче добавить кнопку для того, чтобы пользователи могли скрывать окна. Добавьте всего одну настройку:

{ view:"window, head:"My window", close:true }

Код >>

Улучшенные настройки стилей для кнопок

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

Теперь для кнопок можно задавать следующие типы:

  • types: default, «icon», «iconTop», «image», «imageTop»
  • css: «webix_secondary» (default), «webix_primary», «webix_danger», «webix_transparent»

Например:

{ view:"button", type:"icon", css:"webix_primary" /* a blue button with an icon */ }

Код >>

Мы сократили количество типов кнопок, в частности. мы удалили кнопки-стрелки. Пожалуйста, не забудьте почитать документацию по миграции.

Упоминание пользователей в виджете Comments

Виджет Comments теперь позволяет использовать функциональность для упоминания пользователей по имени. Теперь комментарии можно адресовать людям, если вы @упомянете их.

Код >>

Промисы для сохранения данных

Теперь промисы можно использовать не только чтобы дожидаться результат загрузки, но и для сохранения данных.

view.waitSave(() =>
view.add({ name:"New User", email:", roles:" })
).then(
obj => view.select(obj.id)
);

Это значит, что вы с большей легкостью сможете реазизовать сохранение на сервер согласно своим требования:

  • настроить пессимистичное сохранение данных: сначала дождаться ответа с сервера, затем обновить данные на клиенте
  • дожидаться результата сохранения нескольких операций
  • создавать не связанный с конкретным виджетом или коллекцией DataProcessor, который после можно использовать как сверверное АПИ для нескольких виджетов, включая формы

Демо >>

Обновленная группировка данных

АПИ для группировки данных стало гибче. Теперь вы сможете решать, что делать с данными, не попадающими под категории группировки: либо оставлять несгруппированными, либо скрывать, либо создавать для них отдельную группу.

Код >>

Группировка по нескольким критериям стала более удобной. Вы сможете задавать дополнительные критерии для корневой ветки или для любой другой.

view.group({
by:"year"
},"0$1957");

Код >>

Унифицированное АПИ для опций колонок таблиц

Мы унифицировали способы для определения опций для колонок таблиц, редакторов и фильтров. Теперь вы можете задавать опции как:

  • JS массив или объект
  • Data Collection
  • путь к серверному скрипту
  • функцию или прокси

Что бы вы ни выбрали, опции будут храниться в коллекции и вы сможете получить к ним доступ и изменить их.

Демо >>

Drag-n-drop события для Dashboard

У виджета Dashboard появились события для DnD. Вы можете отследить нужный момент и кастомизировать DnD для этого компонента с большим удобством.

Код >>

Scheduler: серверные примеры на NodeJS

Серверные примеры Scheduler перешли на NodeJS, поэтому теперь стало легче запускать их локально. Просто запустите npm install и npm run server, и вы получите рабочие примеры с базой данных.

Серверные примеры Scheduler

У комплексного виджета Scheduler будет большое обновление, бета-версия которого будет доступна в виде технического превью в середине мая. Вы сможете попробовать оценить новый Scheduler, построенный как виджет на Webix Jet. Звучит интгригующе?

Будущее

Другие обновления и полный список багфиксов есть на странице What’s new. Также не забывайте снова вернуться к списку АПИ, которое мы удалим в Webix 7.0.

Вы сможете обновиться до Webix 6.3 через npm и Кабинет клиента, если вы пользователь PRO-версии, или же скачав триальную версию.

Скачать Webix 6.3