Показать оглавление

Общее описание

Начиная с версии 3.14.21 в Modus Bi добавлен новый стандартный визуальный компонент — «Групповая панель показателей».

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

Режим конструктора

В режиме конструктора при переходе в настройки компонента отображается:

Структура данных.
Полки:
- «Значения»;
- «Категории»;
- «Фильтры».
Раздел настроек.
Предпросмотр.

Полка «Значения»

Полка «Значения» предназначена для размещения полей (пилюль), значения которых отображаются в выбранном «Месте» групповой панели. Например, для «Места 1» это основное поле компонента, для «Мест 2–5» — дополнительные метрики, подробнее см. раздел «Настройка полей».

Для каждой пилюли доступны настройки: агрегация, суффикс, формат отображения нуля и др. Настройка полей на полке «Значения» выполняется аналогично визуальному компоненту «Таблица».

Переключатель «ПЕРВОЕ»:

«ВЫКЛ» — только первое поле с полки «Значения», значение по умолчанию.
«ВКЛ» — доступны все поля с полки «Значения».

Полка «Категории»

Обратите внимание! Полка «Категории» присутствует в компоненте для совместимости с логикой работы «Панели показателей», но в текущей реализации «Групповой панели показателей» не используется.

Полка «Фильтры»

Полка «Фильтры» работает аналогично, как в визуальном компоненте «Таблица».

Раздел настроек

Переключатель «Автообновление» — при включении переключателя производится автообновление компонента, по умолчанию «ВЫКЛ».

Раздел «Общие настройки»

Настройки в данном разделе работают аналогично визуальному компоненту «Таблица»:

«Заголовки» — включение/отключение отображения заголовка. При включении доступно поле для заполнения названия;
«Отступы контейнера» — настройка внутренних отступов компонента относительно границ контейнера. Для каждой стороны задаётся отдельное значение;
«Цвет фона» — выбор цвета фона компонента. По умолчанию — белый.

Раздел «Данные»

Настройки в данном разделе работают аналогично визуальному компоненту «Таблица»:

Раздел «Настройка полей»

Раздел представлен настройками:

«Место» — в компоненте «Групповая панель показателей» есть несколько полей-счётчиков для отображения различных связанных метрик в рамках одной панели. Для каждого такого счётчика возможно назначить поле с данными откуда брать значения и зафиксировать другие настройки отображения. Поле «Место» представлено выпадающим списком с возможностью выбора вида панели групповых показателей:
- «Место 1» — основное поле компонента, подробнее см. раздел «Особенности настройки «Место» со значением «Место 1»»;
- «Место 2» — вспомогательные поля за пределом основного прогресс-бара;
- «Место 3» — вспомогательные поля за пределом основного прогресс-бара;
- «Место 4» — вспомогательные поля за пределом основного прогресс-бара;
- «Место 5» — вспомогательные поля за пределом основного прогресс-бара.
  
  ↓
Флаг «Показать место» — положение «ВКЛ» включает отображение позиции (места) показателя на панели, по умолчанию «ВЫКЛ»;
«Заголовок» — поле ввода, по умолчанию не заполнено;
«Значение» — поле позволяет задать отображаемые значения для данного поля (места) в рамках «Групповой панели показателей», представлено выпадающим списком полей с полки «Значения». Выбор полей зависит от положения переключателя «Первое», подробнее см. раздел «Полка «Значения»;
«Суффикс» — выпадающий список для выбора знака измерения числовых единиц:
- «%»;
- «руб.»;
- «ед.»;
- «шт.».
«Когда Значение равно 0» — настройка отображения значения, если оно равно нулю. Представлено выпадающим списком:
- «Число»;
- «=»;
- «-».
«Размер шрифта заголовка» — числовое поле, регулирует размер шрифта заголовка, по умолчанию «16 px»;
«Тип вычисления порога» — настройка, определяющая, когда показатель считается ниже порогового уровня (неудовлетворительно) и требует применения мер реагирования. Представлено выпадающим списком:
1. «Статический»:
  - «Пороговое значение» — настройка, определяющая числовую границу для сравнения показателей. Значения по умолчанию: «Статический», пороговое значение — «50»;
2. «Динамический»:
  - «Пороговое значение» — настройка предоставляет возможность выбора числовой границы, представлено выпадающим списком полей с полки «Значения». Выбор полей зависит от положения переключателя «Первое», подробнее см. раздел «Полка «Значения».
«Вид» — настройка, определяющая ориентацию отображения показателей, представлено выпадающим списком:
- «Колонка» — вертикальное расположение;
- «Строка» — горизонтальное расположение.
«Вид индикатора» — настройка, определяющая, как отмечается изменение значения показателя, представлено выпадающим списком:
- «Нет» — без индикатора;
- «↑ (стрелка)» — маленькая стрелка;
- «↑ (стрелка большая)» — большая стрелка;
- «•» (точка) — маленькая точка;
- «•» (точка большая) — большая точка.
«Позиция индикатора» — настройка, определяющая расположение индикатора относительно значения показателя, представлено выпадающим списком:
- «Слева» — индикатор отображается перед значением;
- «Справа» — индикатор отображается после значения.

Особенности настройки «Место» со значением «Место 1»

В разделе «Настройка полей» при выборе в настройке «Место» — значения «Место 1» отображаются дополнительные поля настройки:

Флаг «Цвет Значения зависит от порога» — настройка, определяющая, будет ли цвет числового показателя автоматически меняться в зависимости от его отношения к заданному пороговому значению. Подробнее см. раздел «Стилизация»;
«Вид прогресс-бара» — представлено выпадающим списком:
- «Линейная» — при выборе дополнительно отображается поле:
  - «Высота прогресс-бара» — числовое поле, регулирует высоту прогресс-бара, по умолчанию «16 px».
- «Индикатор» — при выборе дополнительно отображается поле:
  - «Вид индикатора» — настройка, определяющая, как отмечается изменение значения показателя, представлено выпадающим списком:
    - «Нет» — без индикатора;
    - «↑ (стрелка)» — маленькая стрелка;
    - «↑ (стрелка большая)» — большая стрелка;
    - «•» (точка) — маленькая точка;
    - «•» (точка большая) — большая точка.
- «Кольцо» — при выборе дополнительно отображаются поля:
  - «Ширина прогресс-бара» — выпадающий список:
    - «Процент» — при выборе дополнительно отображается поле:
      - «% от ширины контейнера» — настройка ширины отображения в «%».
    - «Фиксированная» — при выборе дополнительно отображается поле:
      - «Фиксированная, px» — настройка ширины отображения в «px».
  - «Цвет фона кольца» — выбор цвета фона компонента;
  - «Цвет рамки кольца» — выбор цвета рамки компонента;
  - «Ширина рамки кольца (%)» — настройка ширины отображения рамки в «%»;
  - Флаг «Показать меры реагирования» — по умолчанию «ВЫКЛ», при включении для настройки становятся доступны поля функциональной возможности «Меры реагирования».

Особенности работы функциональной возможности «Меры реагирования»

Раздел содержит описание:

Настроек:
- Флага «Показать меры реагирования»;
- «Поле-счетчик мер реагирования»;
- «Поле-контент мер реагирования»;
- «Заголовок модального окна»;
- «Подпись кнопки»;
- «Цвет кнопки».
Внешнего вида и логики работы кнопки «Как улучшить значение»;
Внешнего вида и логики работы модального окна;
Парсинга данных.

Условия отображения флага «Показать меры реагирования»

Настройки доступны при одновременном выполнении двух условий в разделе «Настройка полей»:

«Место» — выбрано значение «Место 1»;
«Вид прогресс‑бара» — выбран тип «Кольцо».

При изменении значений полей «Место» или «Вид прогресс-бара» на неподходящие — тумблер, все связанные с ним поля и кнопка скрываются. Ранее настроенные значения при этом сохраняются и восстанавливаются при возвращении к корректным условиям отображения флага «Показать меры реагирования».

Конфигурирование

Флаг «Показать меры реагирования» — по умолчанию «ВЫКЛ», при включении для настройки становятся доступны поля функциональной возможности «Меры реагирования».
«Поле-счетчик мер реагирования» — выпадающий список полей с полки «Значения». Выбор полей зависит от положения переключателя «Первое», подробнее см. раздел «Полка «Значение». Необходимо заранее выбрать подготовленное поле из данных Заказчика, которое содержит количество мер реагирования;
«Поле-контент мер реагирования» — выпадающий список полей с полки «Значения». Выбор полей зависит от положения переключателя «Первое», подробнее см. раздел «Полка «Значение». Cодержит текст для отображения в модальном окне;
«Заголовок модального окна» — поле ввода текста заголовка модального окна, по умолчанию «Меры реагирования»;
«Подпись кнопки» — поле ввода текста на кнопке вызова модального окна, по умолчанию «Как улучшить значение»;
«Цвет кнопки» — выбор цвета кнопки.

Кнопка «Как улучшить значение»

Кнопка отображается только при одновременном выполнении двух условий:

Флаг «Показать меры реагирования» включен;
Значение в «Поле-счетчик мер реагирования» для данного фактора больше 0 (есть хотя бы одна мера).

Стилизация кнопки:

текст кнопки — настраивается в «Подпись кнопки»;
цвет фона — настраивается в «Цвет кнопки»;
ширина кнопки — адаптивная, минимальная ширина по содержимому, максимальная ширина ~140px, перенос текста.

Модальное окно

При клике на кнопку открывается модальное окно. Параметры окна:

«Заголовок» — отображение настраивается в «Заголовок модального окна»;
«Список мер» — формируется из «Поле-контент мер реагирования». Каждый пункт отображается в отдельном блоке с иконкой «!»;
«Стиль» — CSS модального окна строго изолирован (scoped styles), может создаваться по макету Заказчика.

Логика работы модального окна

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

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

Раздел «Стилизация»

Раздел представлен параметрами:

«Цвет фона прогресс-бара» — выбор цвета фона прогресс-бара, по умолчанию — белый;
«Цвет значения выше порога» — выбор цвета значения выше порога, по умолчанию — зеленый;
«Цвет значения ниже порога» — выбор цвета значения нижнего порога, по умолчанию — красный;
«Верхний разделитель» — Верхняя разделительная линия, по умолчанию «ВЫКЛ»;
«Нижний разделитель» — Нижняя разделительная линия, по умолчанию «ВЫКЛ».

Раздел «Настройка клика»

Настройки в данном разделе работают аналогично визуальному компоненту «Подзаголовок отчета».

Раздел «Инфо»

Настройки в данном разделе работают аналогично визуальному компоненту «Общие принципы настройки визуализаций».

Раздел «Рамка компонента»

Настройки в данном разделе работают аналогично визуальному компоненту «Диаграмма Ганта (BETA)».

Связи контента

Групповая панель показателей - Публичная база знаний Modus