Настройка Report Manager

Так как Report Manager - это приложение на базе Webix Jet, оно состоит из отдельных Webix компонентов. Эти компоненты можно переопределить или же работать с отдельными настройками чата.

Базовая конфигурация

Чтобы настроить общую конфигурацию виджета, используйте следующие свойства:

id (string, number) - необязательный параметр; ID виджета;
url (string) - URL для загрузки и сохранения данных;
moduleId (string) - ID просматриваемого отчёта;
mode (string) - режим просмотра. Возможные значения:
- "list" - список отчётов;
- "view" - отчёт открыт, список "list" закрыт;
- "edit" - открыта форма для редактирования отчёта;
toolbar (boolean) - если false прячет тулбар. По умолчанию true;
readonly (boolean) - переключает Report Manager в режим только для чтения. По умолчанию false;
locale (string, object) - название текущего языка или объект с языковыми настройками;
width (number) - ширина виджета;
height (number) - высота виджета.

webix.ui({
  view:"reports",
  url: "https://docs.webix.com/reports-backend/",
  mode: "edit",
  toolbar: false
});

Реактивные свойства

Свойства moduleId, mode, readonly и toolbar являются реактивными. Они хранят состояние приложения и позволяют разработчикам отслеживать его изменения. Объект состояния также содержит несколько свойств для чтения:

module (object) - JSON с настройками отчёта (источники данных, столбцы, ...);
saved (boolean) - если true выбранный модуль сохранён. В случае false настройки отчёта изменены, но не сохранены.

Получить текущее состояние компонента можно с помощью метода getState():

webix.ui({
    view:"reports", 
    id:"myReports",
    url: "https://docs.webix.com/reports-backend/"
});
 
const state = $$("myReports").getState();
/*
{
  mode: "edit",
  module: {...конфиг отчёта},
  moduleId: 20,
  readonly:false,
  saved: true,
  toolbar: false 
}
*/

Отслеживание изменений реактивных свойств

Следить за изменениями реактивных свойств можно с помощью обработчика $observe:

webix.ui({
  view: "reports",
  url: "https://docs.webix.com/reports-backend/",
  on: {
    onInit: app => {
      const state = app.getState();
      state.$observe("moduleId", id => {
        if(id) webix.message(`ID of this report is ${id}`);
      });
    }
  }
});

В примере выше, текущий state доступен через экземпляр JetApp, который, в свою очередь, доступен в обработчике onInit.

Наверх