Описание

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

Для удобства все доступные настройки сгруппированы в три категории, которые отображаются в виде вкладок в редакторе свойств виджета:

• Поля виджета

• Пользовательские свойства

• Расширенные свойства JSON

Каждая из этих категорий предназначена для определенного типа настроек и предоставляет для этого соответствующий интерфейс:

Open

После настройки свойств виджета вы сможете воспользоваться ими на вкладке Оформление в разделе Пользовательские свойства.

Пример возможных настроек:

Open

На панели справа выделены свойства, которые были добавлены на вкладках Пользовательские свойства и Расширенные свойства JSON при создании виджета.

Категории настроек

Поля виджета

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

Чтобы добавить поле виджета, необходимо выполнить следующие шаги:

1. Откройте окно редактирования пользовательского виджета. Для этого сделайте одно из следующего:

   • нажмите на вкладке Виджеты и выберите пункт меню Создать виджет;

   • щелкните правой кнопкой мыши по иконке пользовательского виджета и выберите пункт меню Редактировать:

     Open

     

2. Откроется окно редактирования виджета. Находясь на вкладке Поля виджета нажмите кнопку Поле в левом нижнем углу окна, если поля ещё не добавлены:
   
   

   Open

   

    

3. Укажите название и описание для полей и нажмите Готово:
   
   

   Open

   

   Поля будут доступны для добавленного виджета на вкладке Виджеты:

   Open

   

Пользовательские свойства

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

Каждое свойство имеет:

• Название

• Тип данных

• Значение по умолчанию

Добавление отдельного свойства

Чтобы добавить отдельное свойство, необходимо выполнить следующие шаги (данные действия выполняются для каждого добавляемого свойства):

1. На вкладке Пользовательские свойства окна редактирования виджета нажмите кнопку Свойство:
   
   

   Open

   

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

   Open

   

   Доступны следующие типы данных:

   • Строка – любой текст (в консоли браузера значение выводится в формате строки).

   • Число – числовое значение (в консоли браузера значение выводится в формате числа).

   • Чекбокс – логический тип данных (в консоли браузера выводится true или false).

   • Цвет – позволяет выбрать цвет по умолчанию с помощью стандартной палитры (в консоли браузера значение выводится в формате строки).

   • Шрифт – позволяет выбрать шрифт по умолчанию из стандартного набора шрифтов (в консоли браузера значение выводится в формате строки).

   • Выравнивание – позволяет задать выравнивание текста по умолчанию (в консоли браузера значение выводится в формате строки).
     Для нашего виджета мы добавили следующие свойства:

     Open

     

3. Теперь необходимо “привязать” указанные свойства к коду виджета. Для этого необходимо прописать имена свойств в соответствующих местах кода. Например:

   Open

   

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

   Open

   

Добавление группы свойств

Чтобы добавить группу свойств, необходимо выполнить следующие шаги:

1. На вкладке Пользовательские свойства окна редактирования виджета нажмите кнопку Группа:

   Open

   

    

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

   Open

   

    

3. Далее вы можете добавить в эту группу требуемые свойства, нажав на кнопку Свойство (см. выше описание процедуры добавления отдельного свойства), а также добавить подгруппу, нажав на кнопку Подгруппа, и добавить в нее дополнительные свойства. Например:
   
   

   Open

   

Важно

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

  Open

  

• Если группа свойств содержит переключатель, для неё резервируется свойство enabled с типом bool. Это свойство управляет состоянием группы. Когда группа выключена (enabled: false), все её свойства становятся неактивными, а когда включена (enabled: true) – снова доступны для изменения:

  Open

  

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

Расширенные свойства

В дополнение к вышеописанным свойствам вы также можете указать расширенные свойства JSON. Для этого необходимо сделать следующее:

1. Перейдите на вкладку Расширенные свойства JSON и укажите какое-либо свойство. В нашем примере мы добавим к значениям, отображаемых в подсказках, слово руб.:

   Open

   

2. В коде виджета необходимо теперь “привязаться“ к этому свойству:

   Open

   

   Слово руб. теперь будет добавляться к значениям в подсказке:

   Open

   

Ограничения

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

Смотрите также

Создание пользовательского виджета

На этой странице

Время чтения: 2 мин.

Нужна дополнительная помощь?

Свяжитесь с технической поддержкой.