Перейти к содержанию

Порталы — виджеты

Виджеты — это блоки, из которых собирается портал: списки и поиск задач, графики и таблицы, календари, новости, счётчики, кнопки, лента соцсети и другие. Здесь — как создать виджет, какие настройки общие у всех виджетов и что показывает и как настраивается каждый тип. Про сами портальные страницы (их создание, конструкторы, разделы, права доступа) — в разделе Порталы.

Создание и общие настройки виджета

Новый виджет создаётся кнопкой «Добавить виджет» в панели инструментов конструктора. В форме создания доступна вкладка «Основные настройки»; после сохранения добавляется вкладка «Дополнительные настройки» с набором параметров под выбранный тип.

Форма создания нового виджета: вкладка «Основные настройки»

Окно настроек существующего виджета открывается из его блока на портале. Состав параметров зависит от типа виджета; общие для всех:

Параметр Назначение
Доступен для групп Виджет видят только участники указанных групп
Название виджета Заголовок (рядом — кнопка локализации)
Название по смарт-выражению Смарт-выражение для заголовка; при пустом — используется «Название виджета»
Модуль Модуль, к которому относится виджет (по умолчанию — глобальный)
Тип виджета Тип отображаемой информации
Контекст Портал / Задача (в смартах доступен контекст задачи) / Профиль (контекст пользователя)
Разделы Тематические разделы для организации и поиска виджетов
Скрыть шапку Полностью отключает шапку: фильтр, кнопку «Назад» в детализации и т.п.
Можно разворачивать В пользовательском режиме виджет можно развернуть на весь экран
Режим цвета По умолчанию / Прозрачный / Цвет (открывает выбор «Цвет виджета»)
Скрыть фильтр Выбранные значения фильтра не показываются в блоке, иконка фильтра остаётся доступной
Скрываемо пользователем Пользователь может скрывать и снова показывать виджет на портале по своему усмотрению

Окно настроек виджета (состав зависит от типа виджета)

Общие свойства контейнера виджета

У всех типов виджетов есть три общие настройки:

  • Заголовок — название виджета в шапке. Можно локализовать или задать смарт-выражением.
  • Легенда — текст в нижней части виджета. Поддерживает Markdown-форматирование (иконки, картинки, оформление), содержимое можно задать смарт-выражением. Если легенда не заполнена — блок не показывается.
  • Подсказка — иконка контекстной справки в шапке: по клику открывается указанная задача 1Ф (как карточка или как пространство). Если задачи нет или к ней нет доступа, иконка не появляется.

Типы портальных блоков (виджетов)

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

Блок поиска задач

Источник данных: смарт-фильтр или хранимая процедура.

Пример блока поиска задач на портальной странице

Параметр Описание
Показывать счетчик Счетчик числа задач
Открывать по клику Задачи как ссылки
Фильтр задач Смарт-фильтр или хранимая процедура
Сортировка Поле + смарт-выражение + порядок + вывод пустых
Группировка Поле + выводимое значение (только для шаблона «Список»)
Шаблон Список (по умолчанию) или Карточки
Тип содержимого Задача (по умолчанию) или Новость
Категория для создания задачи Кнопка создания задачи в указанной категории
Кнопки управления Контекстные кнопки для действий над задачами

Дополнительные настройки блока поиска задач

Параметры шаблона «Карточки»: ширина карточки (px), ID ДП картинки/видео/ссылки на видео, ID ДП для доп. текста/анонса, текст задачи для доп. текста, ID ДП ссылка, отображать теги, ID задачи, дата создания, срок, приоритет, заказчик, исполнитель, индикатор «Я ответственный», картинки, показывать только мои задачи, показывать все задачи.

⚠️ Если настроены кнопки управления с условиями видимости — источник данных должен быть хранимая процедура (не смарт-фильтр).

Хранимая процедура: должна возвращать TaskID + любые колонки для кнопок управления. Параметры задач не нужны — подтягиваются по TaskID. Принимает @UserID int, @XmlParam xml (необязательные).

Фильтрация данных не поддерживается.

Список задач (v2.262+)

Отображает список задач текущего пользователя из одного из 8 источников. Название блока формируется автоматически по выбранному источнику; стрелка в правом верхнем углу раскрывает полный список, клик по задаче открывает её в модальном окне.

Список задач на портальной странице

Источники:

Источник Описание
Задачи на сегодня Исполнитель = текущий пользователь, срок = сегодня (включая просроченные)
Активные задачи Исполнитель = текущий пользователь
Недавние задачи Последние задачи, с которыми взаимодействовал пользователь
Новые задачи из категории Задачи из выбранной категории, сортировка по дате создания
Отбор в категории Общий отбор или конкретная категория + смарт-отбор
Просроченные задачи Истекший срок, исполнитель = текущий пользователь
Задачи на подписи Запрошена подпись у текущего пользователя
Избранные задачи Добавленные в избранное

Что можно показать в карточке задачи: аватар задачи, текст задачи, номер задачи, название категории, статус, системные теги, приоритет, исполнители, заказчик, срок выполнения, количество подзадач.

Дополнительные настройки:

Параметр Описание
Отображать задач Количество от 1 до 6. По умолчанию — зависит от размера блока
Показывать количество задач Синий тикер (общее число) + красный тикер (просроченные). Показываются только если задач больше, чем «Отображать задач». Для «Недавние задачи» недоступна
Сортировка Тип + поле (список формируется автоматически при выборе источника)

Окно настройки виджета «Список задач»

Фильтрация данных не поддерживается.

Таблица

Источник данных — хранимая процедура (MSSQL) или SQL-функция (PostgreSQL). Поддержка смарт-кнопок для действий над строками.

Пример блока «Таблица» на портальной странице

По колонкам можно включить счётчики значений, а строки таблицы — выделять цветом по условию (стиль строки берётся из заданной колонки: например, просроченные — красным).

Цвет и счётчики значений в колонках таблицы

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

Основные параметры виджета «Таблица»:

Окно дополнительных настроек таблицы

Параметр Описание
Хранимая процедура Название без схемы и квадратных скобок (рядом — кнопка перехода к редактированию SQL-запроса)
Автовысота строк Высота строк по содержимому
Автовысота таблицы Высота виджета по количеству строк
Автовысота дриллдауна Высота всплывающего окна детализации
Количество строк итогов ⚠️ Временно не работает с v2.256
Брать стиль строки из Колонка с описанием стиля форматирования (см. ниже «Стилизация»)
Брать ссылку для строки из Колонка со ссылкой (открыть в текущей вкладке)
Открывать в модальном окне Если включено — ссылка из «Брать ссылку из» открывается в модалке
Счетчик значений Выключено / Количество строк / Smart (смарт-выражение, возвращающее число)
Цвет счётчика (только если Счётчик = Smart) info (синий), warning (оранжевый), default (серый), error (красный)
Отображать кнопку обновления По умолчанию выключено. Обновление учитывает текущие фильтры

Параметры хранимой процедуры

Процедура-источник (и процедура детализации, если задана) получает такие параметры:

Параметр Тип Назначение
@XmlParam xml = null Значения фильтра, привязанного к виджету
@DrillDownField varchar(max) = null Название столбца SQL, по которому кликнул пользователь (когда одна процедура обслуживает разные drilldown'ы)
@DrillDownParams varchar(max) = null История значений по уровням вложенной детализации (поддержка кнопки «Назад»)
@UserID int = null Пользователь, для которого формируются данные
@TaskID int = null Задача, в контексте которой открыт портал (виджет на карточке задачи)
@SubcatID int = null Категория контекста

Регистр в именах параметров значения не имеет: платформа подставляет их по имени без учёта регистра, а MS SQL и сам не различает регистр идентификаторов — процедуру можно объявлять как @TaskID, @taskID или @TaskId. Регистр важен только для имён фильтров внутри @XmlParam: их разбирает сама процедура (crm_repGetParams) обычным строковым сравнением, поэтому имя фильтра должно точно совпадать с заданным в настройке виджета.

⚠️ PostgreSQL: хранимые процедуры как источник табличных данных не поддерживаются — используются SQL-функции (CREATE FUNCTION ... RETURNS TABLE). Имя без []; имя функции и параметры — в нижнем регистре, параметры с префиксом p_: p_userid, p_taskid, p_subcatid, p_xmlparam, p_drilldownfield, p_drilldownparams (платформа сама приводит имя функции к нижнему регистру и отбрасывает p_ при сопоставлении). Параметр xml объявляется типом xml, не text; значения фильтров разбираются через dbo.ssl_get_filter_param_by_name(p_xmlparam::xml, 'имя') (вместо crm_repGetParams в MSSQL). Детализация работает так же, как в MSSQL — через p_drilldownfield/p_drilldownparams в той же функции.

⚠️ PostgreSQL — схема в имени функции. Если SQL-функция источника данных находится в схеме, отличной от dbo (например custom), укажите имя со схемой явно — custom.имя_функции. Имя без схемы платформа дополняет технической схемой dbo; для объекта в другой схеме это приводит к ошибке 0A000: cross-database references are not implemented. Схема dbo на PostgreSQL техническая (совместимость с MSSQL) — собственные объекты в ней хранить не следует.

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

Каждая строка в таблице настроек — одна колонка. Первая (левая) колонка — кнопки (если настроены). Порядок меняется перетаскиванием.

Базовые поля строки колонки:

Поле Назначение
Отображать Если выключено — колонка не показывается
Столбец SQL Имя колонки в результате процедуры
Имя Заголовок в интерфейсе
Ширина колонки В % от общей ширины таблицы
Брать ссылку из Колонка, значение которой используется как адрес ссылки для этой ячейки (требования к значению — ниже). Независимо от «Колонка для функции DrillDown»: можно заполнить оба поля
Колонка для функции DrillDown По какой колонке строится детализация. Независимо от «Брать ссылку из» — можно заполнить оба поля; при валидном URL ячейка становится ссылкой, а детализация работает по своей колонке

⚠️ Требования к значению «Брать ссылку из». Колонка-источник должна возвращать строку-адрес: абсолютный http://… / https://… либо относительный путь, начинающийся с /. Пустое, число, идентификатор задачи или произвольный текст ссылкой не становятся — платформа не достраивает адрес из идентификатора. В таком случае ячейка выводит своё значение обычным текстом (значение видно всегда). Для перехода в карточку задачи колонка-источник должна возвращать готовый относительный адрес задачи, а не её номер.

Общие настройки колонки (по кнопке «шестерёнка»):

Поле Эффект
Тип колонки Обычная / Десятичное число
Выравнивание текста По левому краю / по центру / по правому. Заголовок — по той же стороне
Название группы колонок Объединяет соседние колонки в общий заголовок верхнего уровня
Брать стилизацию из колонки Колонка с CSS-атрибутами для значения в данной колонке
Брать класс из колонки Колонка с CSS-классом
Режим фильтрации Отсутствует (default) / Обычный / Excel
Показывать нули Если выключено — 0 отображается как пустая ячейка
Вырезать теги Текст без html-тегов
Переносить текст на другую строку При заданной ширине: либо перенос по словам, либо обрезка
Длина дробной части Количество знаков после запятой для колонки типа «Десятичное число». Значение от 0 до 10

Локализация названия группы колонок. Значение поля «Название группы колонок» можно локализовать — рядом с полем доступна кнопка локализации (так же, как для заголовков самих колонок). Локализованные названия групп переносятся при экспорте/импорте портального блока между средами. Применимо к виджетам «Таблица» и «Гант».

Форматы вывода даты:

Формат Пример (для 20.04.2024)
DD.MM.YYYY 20.04.2024
DD.MM.YYYY, HH:mm:ss.sss 20.04.2024, 12:30:00
YYYY 2024
MMMM апрель
MMMM YYYY апрель 2024
DD 04
dddd суббота

Форматы числа:

Формат 1.71 1234.56
0 2 1235
0,0 2 1 235
0.0 1,7 1234,6
0,0.0 2 1 234,6
0.00 1,71 1234,56

Тип вывода в ячейке — переключатель «Вывод информации»: Текст, Изображение, Индикатор, График. Можно комбинировать.

Изображение: колонка значения, ширина/высота в px/%, стиль (рамка, радиус), выравнивание.

Индикатор:

Поле Назначение
Тип индикатора Текст (по умолчанию) или Иконка (только набор Material; имя иконки — в колонке значения, со строчной буквы)
Колонка цвета Колонка с цветом фона в HEX (#XXXXXX)
Колонка значения Колонка со значением (текст или имя иконки)
Стиль Рамка, радиус закругления
Выравнивание Слева / справа от значения колонки

График: колонка возвращает JSON с типом (polyline / bar / pie), точками и стилизацией. Пример:

{ "type": "bar",
  "points": [
    {"x":1, "y":2, "color":"#FF0000"},
    {"x":2, "y":4, "color":"#00FF00"}
  ]
}

В SQL обычно формируется через FOR JSON PATH, WITHOUT_ARRAY_WRAPPER.

Стилизация строк и колонок

Поле в источнике данных, заданное в «Брать стиль строки из» / «Брать стилизацию из колонки», возвращает текстовое значение. Поддерживаемые типовые значения:

Значение Эффект
Default Без стиля
Success background-color: #dff0d8 (зелёный)
Info background-color: #d9edf7 (голубой)
Warning background-color: #fcf8e3 (жёлтый)
Danger background-color: #f2dede (розовый)
TotalsRow font-weight: bold
BackRed / BackGreen / BackBlue / BackYellow Фон pink / lightgreen / lightblue / gold
TextRed / TextGreen Цвет текста red / green

Произвольные значения: Color#XXXXXX (цвет текста), Background#XXXXXX (фон), HeightXXpx (высота строки). Несколько атрибутов перечисляются через запятую: Color#ff0000,Background#00ff00,Height40px.

Кнопки управления (smart-кнопки)

Настраиваются в блоке «Кнопки управления». Все кнопки выводятся в самой левой колонке.

Окно создания кнопки в настройках таблицы

Поле Назначение
Имя Текст на кнопке
Описание Подсказка при наведении
Иконка Путь к иконке (опционально)
JavaScript выражение (одно из двух) JS-скрипт по нажатию
Пакеты действий (одно из двух) Смарт-пакет по нажатию
URL Смарт-выражение → URL открываемой в модалке страницы (после выполнения пакета)
Колонка идентификатора (int) Имя колонки с ID объекта (например, TaskID). Доступно в смарте через «Идентификатор объекта»
Колонка видимости (bool) Колонка с признаком «показывать кнопку этому пользователю»
Колонка активности (bool) Колонка с признаком «кнопка активна»

⚠️ Для каждой кнопки задаётся либо JS, либо смарт-пакет — не оба одновременно.

⚠️ В абсолютном URL допустим только https://.

Объект event в JS-выражении:

{
  originalEvent: MouseEvent,           // стандартный объект
  data: any,                            // строка данных, к которой относится кнопка
  block: {
    reload:   () => void,               // перезагрузить блок
    freeze:   () => void,               // отключить все кнопки блока
    unfreeze: () => void                // снова включить
  }
}

При нажатии на любую кнопку все кнопки блока автоматически блокируются. Чтобы разблокировать, в скрипте нужно вызвать event.block.unfreeze() (например, через setTimeout).

К полям возвращаемой строки можно обращаться через event.data.<имя_колонки>, например event.data.isActive.

Параметры события «Нажатие на кнопку» (для смарт-пакета):

  • идентификатор объекта (из колонки идентификатора или ID строки),
  • строка с JSON-объектом всей строки,
  • ID кнопки,
  • параметры текущего пользователя.

Детализация (drill-down)

Настраивается per-column через «Колонка для функции DrillDown» + «Хранимая процедура» детализации. По клику на значение в ячейке открывается новый виджет, построенный процедурой детализации:

Детализация колонки (drill-down) в таблице

  • @DrillDownField — название колонки, по которой кликнули.
  • @DrillDownParams — полная история значений (поддержка вложенной детализации с кнопкой «Назад»).
  • Если процедура для детализации не указана, используется основная процедура виджета.
  • Уровни вложенности — неограниченны.

Фильтры (v2.265+)

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

Фильтры на портальной странице

Представление:

Режим Описание
Горизонтальный Ряд чипов. Активация сразу при изменении. Кнопка «Очистить» при активных фильтрах
Вертикальный Список полей в 1–4 колонках
Параметр Описание
Количество колонок 1–4 (только для вертикального режима)
Количество колонок в модальном окне Разметка окна «Все фильтры»
Закрепить сверху Фиксация в верхней зоне портала (только горизонтальный режим)

Окно настройки виджета «Фильтр»

Список параметров формируется из фильтра, созданного на вкладке «Настройки фильтрации».

Настройки фильтрации виджета «Фильтр»

Параметры фильтра соответствуют тем, что будут доступны в виджете.

Параметры фильтра

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

Окно настроек параметра фильтра

Параметры отдельных фильтров:

Параметр Описание
Видимость Всегда видимые / Только если выбрано значение / Всегда свернуто
Подсказка Подсказка по фильтру
Скрыть имя В горизонтальном режиме — при выбранном значении показывать только значение без подписи
Колонка доступности Для смарт-набора: столбец с признаком доступности элемента
Ключ родителя Для статического набора: привязка к родительскому значению
Колонка родителя Для смарт-набора: столбец с ключом привязки к родительскому значению

Типы параметров фильтра:

Тип параметра Описание
Текст Строковое значение
Число Числовое значение. Можно задать длину дробной части — количество знаков после запятой, от 0 до 10

Значения фильтров синхронизируются между связанными блоками (Фильтры, График, Таблица) в обе стороны.

Диаграмма Ганта

В пользовательском интерфейсе отображается как список задач в представлении диаграммы Ганта.

Диаграмма Ганта на портальной странице

Временная шкала задач. Параметры виджета:

Настройки блока «Диаграмма Ганта»

Параметр Описание
Хранимая процедура Обязательные колонки: Name (текст), Start (дата начала, not null), End (дата завершения, not null), ParentId (ID родителя), ID (номер задачи)
Масштаб Масштаб отображения в %
Открывать в модальном окне Клик на полоску → задача в модальном окне

Фильтрация данных не поддерживается.

Smart HTML

Самый гибкий портальный блок. Данные отбираются смарт-выражениями или источниками данных трёх типов, представление настраивается через шаблон Mustache.

Настройки открываются по ссылке «Открыть дополнительные настройки» в общих настройках блока: слева — шаблон (Mustache + HTML/CSS), справа — данные (смарт-выражения и источники) с окном JSON-структуры и предпросмотром результата (без учёта CSS-вставок).

Настройка портального блока Smart HTML: слева шаблон, справа данные, JSON и предпросмотр

Источники данных (3 типа):

Тип Описание
Произвольный Хранимая процедура, представление, функция или таблица БД. Параметры @UserID и @TaskID передаются автоматически.
Смарт-фильтр На основе смарт-фильтра + полей задач/ДП. Без программирования.
Скрипт (SmartScript) SmartScript (Lua/JS/Python). Должен вернуть RESULT — массив объектов. Параметры: таймаут (сек), TTL (сек).

Источники добавляются на вкладке «Источники данных» кнопками «+ Произвольный», «+ Смарт-фильтр», «+ Скрипт»; каждому задаётся уникальный алиас (латиницей) для доступа к данным в JavaScript.

Вкладка «Источники данных» виджета Smart HTML: кнопки добавления и строки Алиас/Тип/Источник

JS API: данные всех источников доступны через window.__smartHtmlData[blockId]. Доступ по алиасу. Объект __meta[alias] содержит type, durationMs, error (поля cached нет).

⚠️ Если источники данных не настроены — блок работает в прежнем режиме (смарт-выражения + mustache).

Сохранение состояния вкладки источников. Несохранённые правки на вкладке «Источники данных» сохраняются при переключении на соседние вкладки настроек («Фильтрация», «Основные», «Дополнительные»): форма скрывается, но не сбрасывается.

Mustache-шаблонизатор:

Конструкция Пример
Единичное значение {{smartXXX}} где XXX = ID смарт-выражения
Цикл (список) {{#smartXXX}}...{{/smartXXX}}
Условие {{#isComplainted}}Рекламация{{/isComplainted}}
Инвертированное условие {{^isComplainted}}Заявка{{/isComplainted}}

⚠️ Шаблонизатор не имеет средств форматирования данных (чисел, дат). Форматировать нужно в источнике данных (смарт-выражении, TSQL).

ve-link — компонент для открытия контента в SPA без JS-вставок:

Что открывает Синтаксис
Зарегистрированную страницу <ve-link url="/dev/context-menu">{{url_to_open}}</ve-link>
Задачу <ve-link taskId="{{taskId}}">{{taskText}}</ve-link>
Портал <ve-link portalId="333">{{portal_name}}</ve-link>
Новость <ve-link newsId="{{taskId}}">{{news_title}}</ve-link>

Фильтрация данных не поддерживается.

Новости

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

Виджет «Новости» на портальной странице

Тип данных: задачи новостной категории (определяется в настройках категории). Остальные настройки виджета становятся доступны только после выбора категории.

Стиль отображения:

Стиль Описание
Большой блок (по умолчанию) Одна главная новость с крупным изображением и карточки дополнительных
Список Компактный список новостей
Карусель Горизонтальная прокрутка новостей

Количество новостей: зависит от стиля — большой блок: 1 / 2 / 3 / 5 / 6 (вариант 4 не предусмотрен); карусель: 3 / 6 / 12 / 24.

Дополнительные настройки:

Параметр Описание Default
Отображать автора Показывать имя автора новости Выключено
Отображать рубрику Показывать рубрику новости Включено
Отображать аннотацию Показывать краткое описание Включено
Отображать дату публикации Показывать дату Выключено
Отображать счётчик лайков Показывать количество лайков (недоступно, если в новостной категории отключены «Реакции на объекты») Включено
Отображать счётчик просмотров Показывать количество просмотров (недоступно, если в категории отключено «Количество просмотров») Включено
Переход в ленту всех новостей Кнопка перехода к полной ленте Включено

Переход к полной ленте новостей открывает галерею с возможностью фильтрации по рубрикам и тегам.

Галерея новостей с фильтрами по рубрикам и тегам

Клик по новости в виджете или галерее открывает её карточку в модальном окне; состав полей (обложка, автор, аннотация и т.д.) зависит от настроек новостной категории.

Карточка новости в модальном окне

Отбор и сортировка новостей:

Параметр Описание
Сортировка Сначала самые новые / Сначала закреплённые, потом новые
Отображать в виджете Все опубликованные / Только закреплённые и опубликованные / Настройка категории
Отображать в галерее виджета Те же варианты — отдельно для галереи
Тип статуса Все / Активные / Закрытые / Отклонённые (если выбрана «Настройка категории»)
Отбор Смарт-отбор категории (если выбрана «Настройка категории»)
Пользователь Не выбрано / Исполнитель / Заказчик / Акцептант / В параметрах (если выбрана «Настройка категории»)

Дополнительные настройки блока «Новости»

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

Обходной путь: в настройках виджета — кнопка «Настроить вставки (JS и CSS)» — добавить CSS-правило, скрывающее блок комментариев. Это косметическое решение: поле для ввода комментария скрыто в интерфейсе, но функция на стороне сервера остаётся активной (комментарии можно создать через другие точки входа).

Задачи категории отображаются как публикации ленты.

⚠️ Задачи в статусах с типом «Начальный» не отображаются (например, статус «Новая»). Сначала подготовить новость → перевести в следующий статус → публикация.

Дополнительные настройки блока «Лента новостей»

Параметр Описание
Категория Категория с шаблоном «Новости» (статический шаблон в шаблонизации)
Шаблон (SPA) Карточки / 3 новости и главная / Объявления
Сортировать по доп.параметру ДП типа «Дата и время». Пустая дата = конец списка. Дата > текущей = не отображается
Направление сортировки По возрастанию / По убыванию
Не обрезать текст ⚠️ Только для устаревших порталов
Показывать заказчика ⚠️ Только для устаревших порталов
Показать счетчики Нравится / Комментарии / Просмотры

Поля шаблона новостей: Title, Annotation, FullText, Date, ImageAttachId, IsMain, Rubric, AuthorUser.

⚠️ Для категорий новостей рекомендуется включать «Не отображать системные комментарии» в основных настройках категории.

Фильтрация данных не поддерживается.

Группа виджетов (v2.265+)

Блок с вкладками. Каждая вкладка — отдельный ранее созданный виджет. Сохраняются все первоначальные настройки вкладок, включая фильтры.

Группа виджетов в пользовательском интерфейсе: вкладки

Если вкладки не помещаются в одну строку — появляется кнопка «Еще» с выпадающим списком.

Вкладки настраиваются в дополнительных настройках блока.

Окно настройки виджета «Группа виджетов»

Кнопка «Добавить виджет» открывает выбор портального блока — в одной вкладке группы только один виджет; новая вкладка добавляется кнопкой «Добавить», лишняя удаляется.

Окно выбора виджета для вкладки группы

Название вкладки меняется кнопкой «Редактировать», находясь в этой вкладке.

Изменение названия вкладки группы виджетов

Фильтрация данных не поддерживается.

Ориентация табов. В дополнительных настройках виджета доступна опция «Ориентация табов»: «Горизонтально» (по умолчанию) или «Вертикально». При вертикальной ориентации вкладки располагаются колонкой слева: ширина колонки подстраивается под самый широкий таб, но не более 300 px; название таба занимает до трёх строк, далее обрезается многоточием (полное название — во всплывающей подсказке). Если вкладки не помещаются по высоте, в конце списка появляется кнопка «Ещё» с выпадающим списком остальных. На узких экранах (ширина контейнера менее 600 px) вертикальная ориентация автоматически переключается на горизонтальную.

Навигация (v2.266+)

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

Панель навигации на портальной странице

Параметр Описание
Тип навигации Табы / Чипы / Хлебные крошки
Закреплять в шапке при скролле Фиксация в верхней части экрана при вертикальной прокрутке

Параметры задаются в дополнительных настройках блока.

Дополнительные настройки блока «Навигация»

Элемент структуры:

Элементы добавляются кнопкой «+» в блоке «Структура».

Добавление элемента навигации

Параметр Описание
Заголовок ссылки Название элемента
Портал Id ID портала для перехода
Порядок Порядок элемента
Доступно группам Видимость пункта для конкретных групп (независимо от доступности всего виджета)

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

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

Пример настроенной навигации

Фильтрация данных не поддерживается.

Избранное (v2.263+)

Отображает список избранных объектов текущего пользователя.

Блок «Избранное» в пользовательском интерфейсе

Параметр Описание
Выбор содержимого Задачи / Пользователи / Пространства / Категории / Чаты / Отчеты / Ссылки
Порядок элементов По порядку в избранном / По дате добавления / По алфавиту

Окно настройки виджета «Избранное»

Фильтрация данных не поддерживается.

Кнопка-тикер (v2.261+)

Блок со счётчиком (может быть кликабельным), иконкой или кнопкой создания задачи.

Кнопки-тикеры в пользовательском интерфейсе

Параметр Описание
Источник счётчика Смарт-выражение, возвращающее число
Название иконки Из набора /spa/content-icons
Цвет иконки Основной / По умолчанию / Пользовательский
Цвет фона Brand / Global / Red / Yellow / Orange / Green / Cyan / Blue / Purple / Pink / Brown / Grey
Тон карточки Нет / Белый / Светлый / Нормальный / Темный
Стиль бейджа Текст / С фоном
Ссылка на блок Фиксированная или смарт-выражение. Отчеты/статьи пространства — в модальном окне, URL — в новом окне
Ссылка на создание задачи Формат: ewtask/{SubcatId}?ExtParamString=$Ext${ExtParamID}${Value}. Карточка создания — в модальном окне
Без цвета, если счётчик ≤ При достижении значения фон меняет цвет

Окно настройки виджета «Кнопка-тикер»

⚠️ Если задана ссылка на создание задачи — вместо иконки отображается кнопка «+».

Фильтрация данных не поддерживается.

Счётчики (v2.262+)

«Счётчики» — блок из карточек-индикаторов (до 6 в одном блоке). Каждая карточка показывает крупное число-метрику (сумму, количество, процент) с надписью и, при необходимости, бейджем изменения — небольшим цветным значком с дельтой (насколько метрика выросла или упала). Значения метрик и дельт вычисляются смарт-выражениями, поэтому цифры «живые». В отличие от «Кнопки-тикер» (один счётчик), здесь их несколько в одной сетке.

Счётчики на портальной странице

Настройки блока

Параметр Описание
Размер Размер карточек. Малый / Средний — все счётчики одинакового размера в ровной сетке. Смешанный — счётчики разного размера, блок раскладывает их сам в зависимости от количества (например, одна крупная и несколько мелких). Малый/Средний удобны для однородного ряда, Смешанный — когда одну метрику нужно выделить.
Количество счётчиков Сколько карточек в блоке, от 1 до 6. Каждая настраивается отдельно.
Текст ссылки блока Текст заголовка над карточками.
Ссылка блока Куда ведёт клик по заголовку. Тип назначения: Url — произвольный адрес; Smart — адрес вычисляет смарт-выражение (динамические ссылки); Пространство / Отчёт / Виджет — переход к объекту по его ID.

Настройки счётчика. Каждая карточка настраивается независимо; параметры делятся на основное число, бейдж изменения и подпись.

Основное число:

Параметр Описание
Надпись Заголовок над числом. Фиксированный текст или значение смарт-выражения (например, подставить название периода).
Значение Само число метрики — возвращает смарт-выражение.
Тип числа Формат числа: Числовой / Денежный / Процентный (см. таблицу форматов ниже) — влияет на знаки после запятой и разделители.
Единица измерения Текст рядом с числом: , шт., % и т.п.

Бейдж изменения (необязательный) — цветной значок рядом с числом с дельтой и знаком +/. Появляется, только если задано «Значение бейджа».

Параметр Описание
Значение бейджа Число дельты (насколько метрика изменилась) — из смарт-выражения (например, разница с прошлым периодом). В форме настроек — поле «Значения» в группе «Разница».
Тип значения Как показать дельту: Проценты — со знаком и % (+5%); Штуки — со знаком, абсолютным числом (+5).
Стиль бейджа Цвет по знаку дельты: Прямая метрика — рост хорошо (+ зелёный, красный); Обратная метрика — рост плохо, например по просрочке (+ красный, зелёный); Смарт — цвет возвращает смарт-выражение (success / warning / danger / default).

Подпись:

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

Форматы отображения по типу числа:

Тип числа Формат отображения
Числовой (по умолчанию) Значение показывается без принудительного округления; незначащие нули скрываются (100,00 → 100). Разряды разделяются пробелами
Денежный Всегда два знака после запятой, включая 0,00. Разряды разделяются пробелами
Процентный До двух знаков после запятой; незначащие нули скрываются. Разряды разделяются пробелами

Окно настройки виджета «Счётчики»

Фильтрация данных не поддерживается.

Баннер-кнопка (v2.261+)

Баннер на главном экране с настраиваемым оформлением.

Баннер-кнопка на портальной странице

Параметр Описание
Заголовок Фиксированный или смарт-выражение
Подзаголовок Фиксированный или смарт-выражение
Положение текста Верхний левый / Нижний левый / Нижний правый / Верхний правый
Положение иконки Не отображать / Противоположный угол / После текста / Угол, выравнивание по тексту. При любом значении кроме «Не отображать» появляется поле «Имя иконки» (название из набора spa/content-icons); цвет иконки = цвет текста, размер — по размеру баннера
Цвет текста Чёрный / Белый / Всегда чёрный / Всегда белый
Пропорция 1:1 / 1:2 / 2:3
Ориентация Горизонталь / Вертикаль
Цвет фона Brand / Global / Red / Yellow / Orange / Green / Cyan / Blue / Purple / Pink / Brown / Grey
Тон фона White / Light / Color / Dark / Black
Url изображения Относительная ссылка (jpg, png)
Url видео Ссылка на видео (mp4)
Размер xs / sm / md / lg (управляет шрифтом и внутренними отступами: xs и sm — 12 px, md — 16 px, lg — 20 px)
Затемнение под текст None / White / Black / BackgroundColor
Ссылка на клик Фиксированная или смарт-выражение. Без префикса /spa/

⚠️ Относительные ссылки без /spa/. Правильно: /tasks/12345. С /spa/ → 404.

⚠️ Цвет текста динамически подстраивается под цвет фона и тон: на светлых фонах — тёмный, на тёмных — светлый.

Все параметры задаются на вкладке «Дополнительные настройки» виджета.

Окно настройки виджета «Баннер-кнопка»

Фильтрация данных не поддерживается.

Контакты (v2.262+)

Список контактов текущего пользователя. Быстрые действия: видеовызов, чат.

Контакты на портальной странице

Кнопка-стрелка в шапке блока открывает полный список контактов в модальном окне.

Полный список контактов в модальном окне

Параметр Описание
Вариант отображения Список / Карусель / Круги
Размер блока Малый / Средний / Большой
Размер контакта Малый / Средний / Большой / Очень большой
Содержание списка Недавние контакты / Звонки / Коллеги / Избранные контакты / Отдел орг. структуры / Отдел и все подчиненные / Смарт (UserID) / Смарт (пользователи с доп. инфо.)
ИД орг. структуры Для типов «Отдел»
Вторая строка Основная должность / Отдел / Тип недавнего / Статус / Дни рождения / Ближайшие отсутствия
Отображать занятость у аватара Календарная занятость + онлайн/офлайн

Окно настройки виджета «Контакты»

⚠️ Вторая строка не отображается при размере контакта «Малый» или «Большой».

Фильтрация данных не поддерживается.

Лента социальной сети

Отображает последние публикации из сообществ. Несколько лент = вкладки (одна лента = без вкладок).

Лента социальной сети на портальной странице

Внизу виджета — кнопка «Перейти ко всем постам»: ведёт к выбранному источнику (странице группы или главной ленте соцсети).

Кнопка «Перейти ко всем постам»

В виджете доступны просмотр, комментирование, создание/редактирование/удаление публикаций по правам; клик по аватару поста ведёт в сообщество.

Действия с постом из виджета

Параметры задаются в дополнительных настройках блока.

Дополнительные настройки блока «Лента социальной сети»

Параметр Описание
Переход в раздел социальной сети Название виджета как ссылка на главную страницу соц. сетей
Название ленты Заголовок вкладки
Отображать количество непрочитанных Счётчик новых записей
Создание сообщения Поле для публикации новых постов (при наличии прав)
Источник ленты Главная лента / Раздел / Группы

Несколько лент добавляются кнопкой «Добавить ленту» (каждая — отдельная вкладка со своими параметрами); лишняя удаляется соответствующей кнопкой.

Настройка нескольких лент

⚠️ Количество постов зависит от высоты виджета. При слишком малой высоте ни один пост не будет показан.

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

Фильтрация данных не поддерживается.

Календарь

Отображает данные в привязке к дате: при выборе даты меняется список под календарём (при выборе месяца — данные за весь месяц; показываются первые 20 записей). Принцип настройки — как Smart HTML: смарт-выражение + Mustache-шаблон.

Блок «Календарь» в пользовательском интерфейсе

Параметр Описание
Дата начала / окончания Период календаря (для тестирования)
Поле с датой Название поля типа «Дата» или «ДатаВремя» из смарт-выражения; по нему задачи привязываются к дате
Стили отображаемых дат Смарт-выражение → 2 колонки: дата + класс (success/warning/danger/default)
Колонка даты Алиас колонки даты из смарт-выражения «Стили отображаемых дат»
Колонка класса Алиас колонки класса из смарт-выражения «Стили отображаемых дат»
Шаблон Mustache-шаблон

Смарт-параметры: @dateFrom и @dateTo — при первой загрузке = начало/конец текущего месяца, далее зависят от выбора пользователя.

Окно настроек блока «Календарь»

Фильтрация данных не поддерживается.

Календарь New (v2.262+)

Соответствует календарю в профиле пользователя. Не используется для преднастроенного набора данных.

Виджет «Календарь New» на портальной странице

Параметр Описание
Размер Малый (2 ближайших события) / Средний (2 + 4 события в 2 колонки) / Большой (5 временных слотов, 2 колонки)
Набор данных Встречи / Срок задач (Ответственный исполнитель / Исполнитель / Заказчик) / Дата начала задач (Заказчик) / Дата завершения задач (Заказчик) / Напоминания / Подписи
Тип календаря Список / Хронологический две колонки (только для большого размера)

Окно настройки виджета «Календарь New»

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

Фильтрация данных не поддерживается.

График (диаграмма)

Сводные данные в табличном или графическом виде. По умолчанию — Apex Charts (ключ highCharts в custom-app-settings для HighCharts).

В пользовательском интерфейсе отображается как диаграмма (линейная, столбчатая, секторная, спидометр, воронка) или таблица.

Виды графиков на портальной странице

Тип диаграммы, серии и оформление задаются в дополнительных настройках блока.

Дополнительные настройки блока «График»

Источник данных: SQL-объект (хранимая процедура, view, таблица).

Поле Описание
SQL Объект Название процедуры/view/таблицы
Заголовок Текстовая колонка → ось X
Значения Числовая колонка → ось Y
Цвета HEX-коды или HTML-цвета
Колонка для Drilldown Колонка детализации
Группировать по Колонка группировки
Кол-во строк для игнорирования Итоговые строки, не отображаемые на графике

Параметры, передаваемые в хранимую процедуру. Если источник данных — хранимая процедура (не представление и не таблица), платформа сама подставляет в неё значения по совпадению имён: процедура объявляет нужные ей параметры, а платформа заполняет те, что знает; остальные не передаются, поэтому лишние объявлять не нужно. Доступны:

Параметр Тип Что приходит
@UserID int Текущий пользователь — заполняется автоматически
@TaskID int Задача, в контексте которой открыт портал (когда виджет на карточке задачи)
@SubcatID int Категория контекста
@XmlParam xml Значения фильтров, привязанных к виджету
@DrillDownField varchar(max) Колонка, по которой запросили детализацию (drilldown)
@DrillDownParams varchar(max) История значений детализации — для кнопки «Назад»

@DrillDownField и @DrillDownParams приходят только при запросе детализации (drilldown); её результат график показывает таблицей. При обычной отрисовке передаются @UserID, @TaskID, @SubcatID и @XmlParam.

Объявляйте в процедуре только нужные параметры, с точными именем и типом:

CREATE PROCEDURE dbo.rep_MyChart
    @UserID   int = null,
    @XmlParam xml = null
AS
    -- значения фильтров из @XmlParam разбирает процедура crm_repGetParams
    ...

Регистр в именах параметров значения не имеет: платформа подставляет их по имени без учёта регистра, а MS SQL и сам не различает регистр идентификаторов (@UserID, @userid, @TaskId — эквивалентны). Регистр важен только для имён фильтров внутри @XmlParam: их разбирает сама процедура (crm_repGetParams) строковым сравнением, поэтому имя фильтра должно совпадать с заданным в настройке виджета.

⚠️ PostgreSQL: источником служит SQL-функция (CREATE FUNCTION ... RETURNS TABLE), а не процедура. Имя функции и параметры — в нижнем регистре, параметры с префиксом p_: p_userid, p_taskid, p_subcatid, p_xmlparam (для детализации — p_drilldownfield, p_drilldownparams). Xml-параметр объявляется типом xml, фильтры разбираются через dbo.crm_repgetparams(p_xmlparam) / dbo.ssl_get_filter_param_by_name(p_xmlparam::xml, 'имя').

Типы диаграмм:

Тип Особенности
Линейная / Линейная (область) Отображать значения рядом с точками
Столбчатая / Столбчатая (горизонтальная) Сгруппировать столбцы, подписи столбцов
Секторная / Секторная без центра Значения вместо процентов, легенда рабочей области
Таблица Итого по таблице, текст итога
Воронка продаж ⚠️ Без агрегирования в источнике. Подписи, смещение справа
Линейная с накоплением / горизонтальная Обязательно заполнить «Группировать по»

При выборе типа открывается дополнительный блок параметров под этот тип.

Линейная — параметр «Отображать значения рядом с точками».

Настройки линейных диаграмм

Столбчатая — «Сгруппировать столбцы» (наложение друг на друга) и «Включить подписи столбцов».

Настройки столбчатых диаграмм

Секторная — «Выводить значения вместо процентов» и «Показывать легенду рабочей области».

Настройка круговых (секторных) диаграмм

Таблица — «Включить Итого по таблице» и текст итоговой строки.

Настройка таблицы

Воронка продаж — «Включить подписи для воронки» и «смещение справа» (px от правого края; пусто = авто).

Настройки воронки продаж

Настройки блока:

Параметр Описание
Шаблон подсказки Формат highcharts: {series.name}, {point.name}, {point.x}, {point.y}, {point.percentage}, {point.total}
Цвет графика Из палитры или колонка SQL-объекта
Добавить график Несколько серий на одном графике (только SQL-объекты)
Показывать заголовки осей Названия осей
Подпись оси X / Y Заданные значения подменяют названия параметров из SQL-объекта
Не удалять метрические сокращения Не убирать «тыс.», «млн» и т.п. из подписей значений
Начинать ось Y с минимального значения Ось Y стартует с минимума из данных, а не с 0
Отображать значения по оси Y зеркально Зеркальный вывод значений по оси Y
Округлять значения оси Y до целых Целые числа на оси Y вместо дробных
Кол-во знаков после запятой в тултипе -1 = определяется автоматически по данным
Показывать легенду Для секторных и воронки — легенда, для линейных/столбчатых — название
Открывать задачи по клику Список объектов для каждой области (не поддерживается для SQL View)
Тип шкалы Линейная / Логарифмическая / Авто логарифмическая
Мин./Макс. по оси X/Y Границы осей
Цена деления по оси X/Y ⚠️ Не работает для Apex Charts
Количество значений на оси Y ⚠️ Не работает для Apex Charts

Кнопка «Добавить график» открывает блок настройки новой серии: название, тип, шаблон подсказки, цвет и столбец значений из SQL-объекта.

Настройка ещё одной серии на графике

⚠️ Не все типы графиков совместимы в одном блоке. Линейная + столбчатая — совместимы. Линейная + секторная — нет.

Меню

В пользовательском интерфейсе отображается как набор кнопок-переходов на страницы.

Виджет «Меню» на портальной странице

Произвольное количество кнопок с действиями (переход на страницу).

Дополнительные настройки блока «Меню»

Параметр Описание
Текст ссылки* Название (обязательное). Текст или смарт-выражение
Css иконки Фрагмент CSS для форматирования индикатора
Путь к изображению Адрес файла с изображением
Ссылка Внутренняя (от /) или внешняя (http/https)
Открывать ссылку в Текущее окно / Модальное окно / Новая вкладка
Набор иконок material
Иконка из набора Название с маленькой буквы, слова через подчёркивание (calendar_today)

Пункт добавляется кнопкой «Добавить» в открывшемся окне.

Добавление нового пункта меню

Настроенные кнопки редактируются из колонки «Настройки»; порядок меняется перетаскиванием строк или стрелками.

Окно настройки кнопки (пункта меню)

Фильтрация данных не поддерживается.

Мини-опрос (с 2.267)

Виджет для пульс-опросов на портале. Создание и деактивация опросов выполняется в самом виджете на портале — администратор настраивает только параметры отображения.

Параметр Тип Обязательный Описание
Группа модераторов Выбор группы (одной или нескольких) Да Пользователи из выбранной группы могут создавать и деактивировать опросы в виджете. Если группа не выбрана — поле подсвечивается с подсказкой «без группы опросы в виджете не создаются»
Ответы в подробном окне Переключатель Нет Если включено — варианты ответа скрыты за кнопкой, по клику открывается модальное окно. Если выключено — варианты ответа отображаются сразу в виджете

В админке нет элементов создания, редактирования или удаления самих опросов — это делается в виджете на портале пользователями с ролью модератора.

Что видит пользователь в виджете:

Роль Опрос активен? Что отображается
Модератор Нет Форма создания опроса прямо в виджете
Модератор Да, обычный режим Результаты опроса (модератор может проголосовать, но видит результаты и без голосования)
Модератор Да, «Ответы в подробном окне» Вопрос + кнопки «Ответить на опрос» / «Смотреть результаты», открывающие модальное окно
Обычный пользователь Нет Заглушка «Опрос не настроен»
Обычный пользователь Да, обычный режим Вопрос с вариантами ответа сразу в виджете
Обычный пользователь Да, «Ответы в подробном окне» Вопрос + кнопка «Ответить на опрос» / «Смотреть результаты» (после голосования), открывающая модальное окно

Модератору по правому клику на виджете доступен пункт контекстного меню «Создать опрос». Если в виджете уже есть активный опрос, перед созданием нового текущий деактивируется — модератору показывается предупреждение «Результаты сохранятся в истории».

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

Паттерн: несколько блоков-отчётов с разными фильтрами

Частый сценарий: на портале нужно вывести однотипные графические виджеты для разных направлений/подразделений.

Подход:

  1. Все виджеты имеют тип «Отчет» и вызывают один и тот же отчёт
  2. В фильтре каждого виджета передаётся разное значение параметра:

    {"27":{"name":"Direction","value":"3034","type":"Dropdown"}}
    
    где 27 — ID фильтра, 3034 — ID направления.

  3. Отчёт содержит диаграмму + два источника данных: таблица показателей и таблица цветовых настроек

  4. Цветовая схема определяется в зависимости от значения параметра (@Direction)
  5. Подвал отчёта с легендой отображается только на последнем блоке через событие AfterData:
    private void ReportSummary1_AfterData(object sender, EventArgs e)
    {
        string direction = ((String)Report.GetParameterValue("FilterDirection"));
        if (direction != "3032")
            ReportSummary1.Visible = false;
    }