Настройка отображения мини-виджета счетчика для дашборда

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

Установка признака, что виджет является счетчиком

Для того, чтобы виджет стал мини-виджета счетчика, нужно в поле meta указать в поле type значение counter.

// TypeScript
{
   ...
   "meta": {
      "type": "counter"
   },
   ...
}

Настройка заголовка

Заголовок виджета располагается в верхней части виджета, отображается средствами платформы. Текст заголовка - значение, указанное в поле info.title.

// TypeScript
{
   ...
   "info": {
      "title": "Заголовок"
   },
   ...
}

Для настройки заголовка, в поле meta можно задать getTitleCallback.

• getTitleCallback: string - путь до функции, которая вернет заголовок виджета. Принимает на вход загруженные данные виджета. Возвращает заголовок виджета типа string. Применяется в случае, когда заголовок виджета зависит от настроек виджета.

// TypeScript
{
   ...
   "meta": {
      "getTitleCallback": "HowEasy/callbacks/getTitleCallback"
   },
   ...
}

Настройка обработки клика по виджету

Для настройки обработчика клика по виджету счетчика в поле meta необходимо задать clickCallback.

• clickCallback: string - путь до функции, которая будет вызвана при клике на виджет счетчика.

// TypeScript
{
    ...
    "meta": {
      "clickCallback": "CounterWidget/callbacks/clickCallback"
    },
    ...
}

Принимает на вход:

1. options - опции виджета счетчика,
2. opener - открывающий контрол.

Настройка иконки

Иконка виджета располагается в верхней части виджета, отображается средствами платформы. Иконка указывается в поле info.icon.

Базовые свойства виджета

Виджет счетчика имеет одно базовое свойство color. Подробнее про свойство читайте в статье.

От значения свойства зависит фон виджета и цвет иконки. По умолчанию для виджета счетчика устанавливается значение success. Как изменить значение по умолчанию, смотрите в статье "Изменение значений по умолчанию для базовых свойств виджета".

Загрузка данных для счетчика

Подробнее о загрузке данных для виджета читайте в статье "Загрузка данных для виджета дашборда"

Для того, чтобы загруженные вами данные использовались в качестве счетчика, вам необходимо настроить загрузчик с идентификатором counter и типом custom. Значение должно соответствовать интерфейсу ICounterConfig из библиотеки Dashboard/interface.

interface ICounterConfig {
    value: string;
    subValue?: string;
    percent?: number;
}

// TypeScript
import {SbisService} from 'Types/source';
import {ICounterConfig} from 'Dashboard/interface';

function sourceConfigGetter(): object {
    const config = {
        type: 'custom',
        loadDataMethod(): Promise<ICounterConfig> {
            return Promise.resolve({
                value: '1 999',
                subValue: '.00',
                percent: 120
            });
        }
    };
    return {
        counter: config
    };
}
export default sourceConfigGetter;