Webix 8.0: Scheduler и Gantt, Новые Контролы в Webix Core

Вот и половина осени прошла. Сегодня мы рады представить вам самый главный релиз года, Webix 8.0. В этой версии вы найдете новые комплексные виджеты для планирования, а именно Scheduler и Gantt. Кроме этого, релиз включает в себя обновления для Spreadsheet, горизонтальный Timeline, новые контролы для выбора времени и цвета, динамические тултипы, а также улучшенную производительность хедера Datatable.

Webix 8.0: Scheduler и Gantt, Новые Контролы в Webix Core

Читаем дальше, чтобы разузнать все детали.

Scheduler

Мы особенно рады представить виджет Scheduler, который призван заменить существующий мобильный Scheduler. Новый виджет работает в обоих режимах, полноэкранном и компактном, и представляет собой полноценный инструмент для планирования. С ним вы сможете:

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

Live demo >>

К виджету прилагается готовый бэкенд на NodeJS и GoLang. Он работает с теми же данными, что и старый Scheduler, что поможет несколько облегчить миграцию.

Однако важно знать, что новый Scheduler обладает совсем иной структурой и API. Поэтому, если вы являетесь активным пользователем старого Scheduler, не спешите обновляться сразу же, а ознакомьтесь с документацией и триальной версией продукта.

Gantt

Вместе с Scheduler мы выпустили новый виджет Gantt. Он поможет вам в управлении проектами благодаря следующим своим фичам:

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

Live demo >>

Виджет также работает в двух режимах: полноэкранном и компактном. Более того, Scheduler и Gantt работают с одними и теми же данными, так что инструменты можно использовать для визуализации общего рабочего процесса.

Обновления для Spreadsheet

С версией 8.0 пришли несколько небольших, но важных обновлений для Spreadsheet.

Теперь вы можете экспортировать данные Spreadsheet со всеми листами и стилями ячеек в PDF документ.

webix.toPDF("spreadsheet1",{styles:true, sheets:true, autowidth:true});

Live demo >>

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

Теперь давайте посмотрим на обновления в Webix Core.

Горизонтальный Timeline

По многочисленным просьбам мы расширили Timeline и добавили ему горизонтальный режим. Элементы виджета можно размещать сверху или снизу от главной оси, а также чередовать их расположение.

Live demo >>

Обновлённая палитра Color Board

Палитра Color Board засияла современными Material цветами. Кроме этого, теперь у вас есть возможность спрятать линию с оттенками серого.

Live demo >>

Также палитра обновилась у ColorPicker и у редакторов цвета дата компонент. Однако, если вам привычнее старая палитра, вы можете вернуть её с помощью одной строчки кода.

Виджеты для точного выбора цвета и времени

Color Selector

Несмотря на приятное обновление ColorBoard, у него остался фиксированный набор цветов. С новым инструментом Color Selector вы можете выбирать любой цвет, меняя его тон и оттенок.

Виджет можно использовать самостоятельно или в качестве выпадающего окна у ColorPicker:

{ view:"colorpicker", value:"#751FE0", suggest:{
   type:"colorselect", body: { button:true }
}


Live demo >>

Timeboard

Новый виджет TimeBoard может похвастаться удобным интерфейсом для выбора времени. С помощью слайдеров можно выбрать часы, минуты и секунды.

Виджет можно использовать самостоятельно или в качестве выпадающего окна у DatePicker:

{ view:"datepicker", type:"time", suggest:{
   type:"timeboard", body: { button:true }
}


Live demo >>

Тултипы при переполнении

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

Live demo >>

Улучшенная производительность хедера Datatable

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

Обратите внимание, что в связи с этими изменениями вам скорее всего придётся наладить процесс стилизации и работы с кастомными элементами хедера.

Что дальше

Более подробную информацию о новых возможностях и обновлениях Webix 8.0 читайте на
этой странице
. Если вы хотите заценить обновление в живую,
скачайте библиотеку через npm, личный кабинет или нажмите на большую пурпурную кнопку.

Скачать Webix 8.0

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

Не болейте, следите за нашими обновлениями, а также оставляйте свои идеи и пожелания в комментариях ниже.