Данный инструмент позволяет реализовать любой дизайн интерфейса покупателя на кассе самообслуживания.
Примечание. Вид и свойства элементов конфигуратора и встроенных интерфейсов могут улучшаться/дополняться с выходом новых версий, возможны расхождения со скриншотами.
1. Логика работы
С помощью конфигуратора можно создать вариант интерфейса в виде файла конфигурации:
Чтобы применить настройки из созданного файла конфигурации к конкретной кассе, нужно добавить данный файл на кассовом сервере по адресу: Магазин – Типы касс, где сначала необходимо выбрать тип кассы и нажать кнопку Настройки. Порядок действий отражен на скриншоте ниже:
1 – выбрать нужный магазин;
2 – зайти в раздел кассового сервера : Магазин – Типы касс;
3 – выбрать тип касс, к которому необходимо применить настройки созданного конфигурационного файла;
4 – нажать кнопку Редактировать;
5 – в поле Конфиг КСОЗ выбрать из выпадающего списка созданный конфигурационный файл, который появится в нем по факту создания в разделе Конфигуратор;
6 – нажать кнопку Сохранить.
2. Доступ к конфигуратору
Для доступа к конфигуратору необходимо на кассовом сервере нажать войти в раздел Конфигуратор:
3. Создание файла конфигурации
Для создания файла конфигурации необходимо нажать на кнопку "Создать":
Требуется заполнить поля Название и Описание. После нажатия на кнопку Создать осуществится переход в интерфейс конфигуратора:
4. Интерфейс конфигуратора
4.1. Верхнее меню
4.1.1. Доступные экраны
Здесь отображаются доступные для конфигурации экраны. Также, по нажатию на кнопку "+", возможно добавить другие:
Список всех экранов, доступных для кастомизации:
- Приветствие
- Чек
- Каталог
- Подытог
- Спасибо
- Ассистент
- Поиск
- СуперМаг Vision
- StandBy.
Данный список может дополняться.
4.1.2. Настройки
Здесь возможно изменить следующие параметры:
- Разметка экрана – выбор вариантов разметок экрана из заранее преднастроенных (список разметок может дополняться):
- Цветовая схема – настройка цветовой схемы согласно теории цвета:
- primary;
- secondary;
- accent;
- error;
- surface.
- Можно выполнить следующие настройки:
- название файла конфигурации;
- шрифты;
- настроить полосы прокрутки;
- активировать или деактивировать доступные форматы отображения:
- portrait 3x4 (768x1024);
- portrait 9x16 (1080x1920);
- landscape 4x3 (1024x768);
- landscape 16x9 (1920x1080);
- portraitM 1x2 (720x1440).
- Можно загрузить следующие "вшитые" варианты интерфейса, чтобы не производить настройку "с нуля":
- Ритейл А;
- Ритейл П;
- Ритейл С;
- Ритейл В;
- Ритейл Р;
- Ритейл Х.
Выйти из настроек можно, нажав кнопку Назад в браузере.
4.1.3. Сохранение
С помощью данной кнопки можно сохранить все выполненные изменения.
4.1.4. Выбор формата отображения
С помощью этой настройки можно изменить формат отображения в зависимости от тех, что были выставлены в разделе Настройки.
4.1.5. Выбор варианта отображения
- В режиме разметки – возможно ознакомиться с выбранной в разделе Настройки разметкой для выбранного экрана.
- В режиме редактирования – основной режим, в котором производятся все изменения в интерфейсе.
- В режиме воспроизведения – в данном режиме возможно ознакомиться с тем, как будет работать настроенный вариант вживую.
Нажав на иконку Корзина можно выйти к списку созданных файлов конфигурации:
4.2. Левое меню
Здесь отображаются все добавленные на экран элементы интерфейса.
4.3. Правое меню
Здесь отображаются настройки выбранного в левом меню элемента интерфейса.
4.4. Центральная часть
Здесь отображается результат добавления/изменения/удаления элементов. В таком же виде интерфейс будет отображаться на устройстве.
5. Элементы интерфейса
Для удобства восприятия, описание будет происходить на примере встроенного интерфейса под названием Ритейл В:
Элемент может быть как глобальным, т.е. доступным к добавлению на любом экране, так и локальным, т.е. доступным на одном или нескольких экранах.
При выделении элемента в левом меню, происходит его выделение в центральной части – и наоборот.
5.1. Глобальные элементы
5.1.1. Контейнер
Основной элемент, позволяющий хранить в себе один вложенный элемент:
Настройки
Пример:
- Функция – позволяет выбрать ту или иную функцию, которая будет выполняться по результату нажатия на элемент на настраиваемом экране:
- перейти в каталог;
- контекстный поиск;
- перейти к экрану распознавания СуперМаг Vision;
- перейти к подытогу;
- перейти в меню ассистента;
- запустить сценарий регистрации покупателя;
- перейти в окно добавления товара по коду;
- запустить сценарий отмены чека;
- позвать ассистента;
- перейти в окно добавления товара из пик-листа;
- добавить пакет;
- к предыдущему экрану;
- к следующему экрану;
- оплата;
- служебные функции из меню ассистента:
- открыть информацию о кассе и её статус;
- выйти на рабочий стол;
- обнулить весы;
- скорректировать цену.
- Размеры – позволяет выбрать ширину и высоту элемента.
- Отступы – позволяет выбрать значения отступов для всех вложенных элементов со всех 4-х сторон элемента.
- Радиус – позволяет выбрать закругления на всех 4-х углах элемента как вместе, так и по отдельности.
- Рамка – при активации позволяет установить рамку со всех 4-х сторон элемента как вместе, так и по отдельности.
- Цвет – позволяет выбрать цвет элемента из списка настроенных в разделе Цветовая схема.
- Тень – при активации позволяет выбрать:
- значения отступов тени элемента;
- степень рассеивания;
- уровень прозрачности тени;
- цвет тени из списка настроенных в разделе Цветовая схема.
- Задний фон – при активации позволяет задать любое изображение в качестве заднего фона элемента со следующими настройками:
- Источник:
- из библиотеки;
- по URL.
- URL – ссылка на картинку при выборе варианта источника по URL.
- Позиционирование:
- справа;
- слева;
- сверху;
- снизу;
- по центру.
- Размер картинки:
- по размеру картинки – масштабирование происходит по наименьшей стороне элемента;
- по размеру блока – масштабирование происходит по большей стороне элемента;
- заданный размер – масштабирование можно установить вручную.
- Раппорт – дублирование картинки по всей площади элемента.
- Источник:
5.1.2. Список
Основной элемент, позволяющий хранить в себе несколько вложенных элементов:
Настройки
Пример:
- Колонка или строка – позволяет выбрать вариант расположения вложенных элементов.
- Позиционирование блоков – позволяет настроить позиционирование вложенных элементов со следующими настройками:
- Интервал – позволяет выбрать расстояние между вложенными элементами.
- Позиционирование / выравнивание – позволяет настроить расположение вложенных элементов в зависимости от выбранного варианта расположения (колонка или строка):
- по левому краю;
- по правому краю;
- по верхнему краю;
- по нижнему краю;
- по центру;
- по ширине.
- Скроллинг:
- Автоматический (auto);
- Скрытый (hidden);
- Видимый с полосой прокрутки (scroll);
- Видимый без полосы прокрутки (visible).
- Отступы – позволяет выбрать значения отступов для всех вложенных элементов со всех 4-х сторон элемента.
- Режим пролистывания – при активации позволяет настроить вариант пролистывания в зависимости от настроенного скроллинга.
- Цвет кнопок – позволяет выбрать цвет элемента из списка настроенных в разделе Цветовая схема.
- Иконка "В начало" – позволяет задать любое изображение в качестве иконки В начало:
- из библиотеки;
- по URL.
- Иконка "В конец" – позволяет задать любое изображение в качестве иконки В конец:
- из библиотеки;
- по URL.
5.1.3. Текст
Основной элемент, позволяющий добавить текст:
Настройки
Пример:
- Текст – позволяет (по нажатию на троеточие):
- выбрать текст из списка заготовленных;
- изменить текст на другой (по нажатию на значок редактирования (карандаш) напротив того или иного текста):
- Стили – позволяет выбрать стиль текста элемента.
- Размеры – позволяет выбрать размер текста элемента (недоступен при выбранном cтиле).
- Высота строки – позволяет выбрать высоту строки текста элемента.
- Цвет – позволяет выбрать цвет элемента из списка настроенных в разделе Цветовая схема.
- Жирность – позволяет выбрать степень жирности элемента.
- Выравнивание – позволяет установить выравнивание текста относительно элемента, в котором он находится.
- Кёрнинг – позволяет выбрать расстояние между буквами элемента.
- Прозрачность – позволяет установить степень прозрачности элемента.
- Курсив – при активации делает текст элемента курсивным.
- Верхний регистр – при активации изменяет все буквы элемента на заглавные.
- Перенос строк – при активации позволяет указать количество строк, на которое следует переносить текст элемента, если он не умещается в элемент, в котором находится.
- Декор – позволяет выбрать вариант декора текста элемента:
- line-through – перечёркнутый текст;
- underline – подчёркнутый текст.
5.1.4. Кнопка
Основной элемент, позволяющий реализовать стандартный функционал кнопки:
Настройки
Пример:
- Функция – позволяет выбрать ту или иную функцию, которая будет выполняться по результату нажатия на элемент на настраиваемом экране:
- перейти в каталог;
- контекстный поиск;
- перейти к экрану распознавания СуперМаг Vision;
- перейти к подытогу;
- перейти в меню ассистента;
- запустить сценарий регистрации покупателя;
- перейти в окно добавления товара по коду;
- запустить сценарий отмены чека;
- позвать ассистента;
- перейти в окно добавления товара из пик-листа;
- добавить пакет;
- к предыдущему экрану;
- к следующему экрану;
- оплата;
- служебные функции из меню ассистента:
- открыть информацию о кассе и её статус;
- выйти на рабочий стол;
- обнулить весы;
- скорректировать цену.
- Тип – позволяет выбрать тип отображения информации:
- только иконка – отображение только настроенной иконки;
- только текст – отображение только настроенного текста;
- смешанный однострочный – отображение и настроенного текста, и настроенной иконки в одну строчку;
- смешанный двустрочный – отображение и настроенного текста, и настроенной иконки в две строчки.
- Вариант – позволяет выбрать вариант заливки:
- заливка;
- заливка инверсивная;
- обводка.
- Цвет кнопки – позволяет выбрать цвет элемента из списка настроенных в разделе Цветовая схема.
- Размеры – позволяет выбрать ширину и высоту элемента.
- Отступы – позволяет выбрать значения отступов для всех вложенных элементов со всех 4-х сторон элемента.
- Радиус – позволяет выбрать закругления на всех 4-х углах элемента как вместе, так и по отдельности.
- Тень – позволяет выбрать:
- значения отступов тени элемента;
- степень рассеивания;
- уровень прозрачности тени;
- цвет тени из списка настроенных в разделе Цветовая схема.
- Свойства иконки – раздел, в котором можно настроить отображение иконки:
- Иконка:
- из библиотеки
- по URL.
- URL – ссылка на картинку при выборе варианта источника по URL.
- Размеры – позволяет выбрать ширину и высоту иконки.
- За текстом – при активации переносит иконку за текст.
- Иконка:
- Свойства текста – раздел, в котором можно настроить отображение текста.
- Настройки элемента идентичны настройкам элемента Текст, за исключением некоторых неактуальных.
5.1.5. Таблица (доступно, начиная с версии 1.61)
Основной элемент, позволяющий добавить элемент с возможностями таблицы в ту или иную часть настраиваемого экрана:
Настройки
Пример:
- Колонки /строки – позволяет добавить колонку/строку со следующими параметрами:
- fr – при активации позволяет указать размер настраиваемой колонки/строки в абсолютном значении; в деактивированном состоянии работает логика пропорции (один к двум, два к трём и т.д.);
- + – позволяет добавить колонку/строку.
- Размеры – позволяет выбрать ширину и высоту элемента.
- Отступы – позволяет выбрать значения отступов для всех вложенных элементов со всех 4-х сторон элемента.
- Позиционирование блоков – блок, позволяющий настроить отступы между столбцами/строками:
- Интервал – позволяет выбрать расстояние между колонками.
- Межстрочный интервал – позволяет выбрать расстояние между строчками.
- Интервал между колонок – позволяет выбрать расстояние между колонками.
- Цвет – позволяет выбрать цвет элемента из списка настроенных в разделе Цветовая схема.
В данный элемент возможно добавить единственный доступный к добавлению элемент:
5.1.5.1. Ячейка
Позволяет настроить конкретную ячейку таблицы. Количество ячеек должно соответствовать настроенной сетке таблицы (например: если в таблице присутствует 2 строчки и 2 столбца, то ячеек должно быть 4 штуки – для возможности настройки каждой из них):
Настройки
Пример:
- Слияние колонок – позволяет настроить количество колонок, которые требуется объединить в одну.
- Слияние строк – позволяет настроить количество строк, которые требуется объединить в одну.
- Отступы – позволяет выбрать значения отступов для всех вложенных элементов со всех 4-х сторон элемента.
- Цвет – позволяет выбрать цвет элемента из списка настроенных в разделе Цветовая схема.
5.1.6. Разделитель
Основной элемент, позволяющий добавить декор в ту или иную часть настраиваемого экрана:
Настройки
Пример:
- Тип разделителя – позволяет выбрать вариант отображения разделителя:
- wave – в виде волны;
- dotted – в виде точек;
- solid – в виде линии.
- Цвет – позволяет выбрать цвет из списка настроенных в разделе Цветовая схема.
- Прозрачность – позволяет установить степень прозрачности разделителя.
5.1.7. Статус кассы
Основной элемент, информирующий о том, в каком статусе находится касса:
Настройки
Пример:
- Функция – позволяет выбрать ту или иную функцию, которая будет выполняться по результату нажатия на элемент на настраиваемом экране:
- перейти в каталог;
- контекстный поиск;
- перейти к экрану распознавания СуперМаг Vision;
- перейти к подытогу;
- перейти в меню ассистента;
- запустить сценарий регистрации покупателя;
- перейти в окно добавления товара по коду;
- запустить сценарий отмены чека;
- позвать ассистента;
- перейти в окно добавления товара из пик-листа;
- добавить пакет;
- к предыдущему экрану;
- к следующему экрану;
- оплата;
- служебные функции из меню ассистента:
- открыть информацию о кассе и её статус;
- выйти на рабочий стол;
- обнулить весы;
- скорректировать цену.
- Тип – позволяет выбрать тип отображения информации:
- только иконка – отображение только настроенной иконки;
- только текст – отображение только настроенного текста;
- смешанный однострочный – отображение и настроенного текста, и настроенной иконки в одну строчку;
- смешанный двустрочный – отображение и настроенного текста, и настроенной иконки в две строчки.
- Вариант – позволяет выбрать вариант заливки:
- заливка;
- заливка инверсивная;
- обводка.
- Размеры – позволяет выбрать ширину и высоту элемента.
- Отступы – позволяет выбрать значения отступов для всех вложенных элементов со всех 4-х сторон элемента.
- Радиус – позволяет выбрать закругления на всех 4-х углах элемента как вместе, так и по отдельности.
- Тень – позволяет выбрать:
- значения отступов тени элемента;
- степень рассеивания;
- уровень прозрачности тени;
- цвет тени из списка настроенных в разделе Цветовая схема.
- Свойства иконки – раздел, в котором можно настроить отображение иконки:
- Иконка:
- из библиотеки;
- по URL.
- URL – ссылка на картинку при выборе варианта источника по URL.
- Размеры – позволяет выбрать ширину и высоту иконки.
- За текстом – при активации переносит иконку за текст.
- Иконка:
- Свойства текста – раздел, в котором можно настроить отображение текста:
- Настройки элемента идентичны настройкам элемента Текст, за исключением некоторых неактуальных.
- Цвет кнопки – позволяет выбрать цвет элемента из списка настроенных в разделе Цветовая схема для состояния Без ошибок.
- Цвет ошибки – позволяет выбрать цвет элемента из списка настроенных в разделе Цветовая схема для состояния Ошибка.
- Цвет предупреждения – позволяет выбрать цвет элемента из списка настроенных в разделе Цветовая схема для состояния Предупреждение.
5.1.8. Итого
Основной элемент, позволяющий отобразить информацию о тех или иных суммах добавленных в чек товаров:
Настройки
Пример:
- Значение – позволяет выбрать, какую сумму будет отображать элемент:
- cумма чека без скидок;
- cумма чека со скидками;
- cумма скидок;
- cумма оплат.
- Стили – позволяет выбрать стиль текста элемента.
- Размеры – позволяет выбрать размер текста элемента (недоступен при выбранном cтиле).
- Высота строки – позволяет выбрать высоту строки текста элемента.
- Цвет – позволяет выбрать цвет элемента из списка настроенных в разделе Цветовая схема.
- Жирность – позволяет выбрать степень жирности элемента.
- Кёрнинг – позволяет выбрать расстояние между буквами элемента.
- Прозрачность – позволяет установить степень прозрачности элемента.
- Курсив – при активации делает текст элемента курсивным.
- Декор – позволяет выбрать вариант декора текста элемента:
- line-through – перечёркнутый текст;
- underline – подчёркнутый текст.
5.1.9. Регистрация клиента
Основной элемент, позволяющий настроить отображение вложенных элементов в двух состояниях:
- До добавления в чек карты участника программы лояльности, например:
- После добавления в чек карты участника программы лояльности, например:
Элемент добавляется с двумя вложенными элементами с типом Контейнер:
- до регистрации;
- после регистрации.
Настройка данных контейнеров производится согласно логике настройки элемента Контейнер.
5.1.10. Список скидок
Основной элемент, позволяющий добавить информацию о списке применённых в чеке скидок.
Элемент может быть добавлен только в элемент Контейнер:
Настройки
Настройки элемента будут добавлены позже.
5.1.11. Чек
Основной элемент, позволяющий добавить информацию о добавленных в чек товарах:
Настройки
Пример:
- Тип разделителя – позволяет выбрать вариант отображения разделителя между товарными позициями:
- wave – в виде волны;
- dotted – в виде точек;
- solid – в виде линии.
- Группировка по SKU – позволяет группировать одинаковые позиции в одну строчку. Параметр будет доступен позже.
- Удалённые товары – при активации отображает удалённые из открытого чека товарные позиции.
- Размеры – позволяет выбрать ширину и высоту элемента.
- Отступы – позволяет выбрать значения отступов для всех вложенных элементов со всех 4-х сторон элемента.
- Радиус – позволяет выбрать закругления на всех 4-х углах элемента как вместе, так и по отдельности.
- Рамка – при активации позволяет установить рамку со всех 4-х сторон элемента как вместе, так и по отдельности.
- Цвет – позволяет выбрать цвет элемента из списка настроенных в разделе Цветовая схема.
- Тень – при активации позволяет выбрать:
- значения отступов тени элемента;
- степень рассеивания;
- уровень прозрачности тени;
- цвет тени из списка настроенных в разделе Цветовая схема.
Данный элемент добавляется с тремя вложенными элементами:
5.1.11.1. Товар
Автоматически добавляемый элемент, в который вложены все параметры с возможностью их кастомизации.
Настройки
Пример:
- Тип товарной карточки – позволяет выбрать тип товарной карточки из списка преднастроенных.
- Отступы – позволяет выбрать значения отступов со всех 4-х сторон элемента.
- Цвет – позволяет выбрать цвет элемента из списка настроенных в разделе Цветовая схема.
- Пустой чек – его настройка производится согласно логике настройки элемента Контейнер.
Настройки вложенных в элемент Товар элементов:
- Название – отображает название товара. Настройки:
- Отступы – позволяет выбрать значения отступов со всех 4-х сторон элемента.
- Остальные настройки элемента идентичны настройкам элемента Текст, за исключением некоторых неактуальных.
- Цена – содержит в себе 2 элемента:
- Итоговая – отображает итоговую цену товара с учётом скидки. Настройки:
- Отступы – позволяет выбрать значения отступов со всех 4-х сторон элемента.
- Остальные настройки элемента идентичны настройкам элемента Текст, за исключением некоторых неактуальных.
- Без скидки – отображает итоговую цену товара без учёта скидки. Настройки:
- Отступы – позволяет выбрать значения отступов со всех 4-х сторон элемента.
- Остальные настройки элемента идентичны настройкам элемента Текст, за исключением некоторых неактуальных.
- Итоговая – отображает итоговую цену товара с учётом скидки. Настройки:
- Стоимость товара – отображает стоимость товара (за единицу). Настройки:
- Отступы – позволяет выбрать значения отступов со всех 4-х сторон элемента.
- Остальные настройки элемента идентичны настройкам элемента Текст, за исключением некоторых неактуальных.
- Картинка – при доступности элемента на карточке товара позволяет настроить формат отображения картинки товара. Настройки:
- Картинка по умолчанию – раздел, в котором можно настроить отображение картинки по умолчанию:
- из библиотеки;
- по URL.
- URL – ссылка на картинку при выборе варианта источника по URL.
- Размеры – позволяет выбрать ширину и высоту элемента.
- Отступы – позволяет выбрать значения отступов со всех 4-х сторон элемента.
- Цвет иконки – позволяет выбрать цвет элемента из списка настроенных в разделе Цветовая схема.
- Радиус – позволяет выбрать закругления на всех 4-х углах элемента как вместе, так и по отдельности.
- Картинка по умолчанию – раздел, в котором можно настроить отображение картинки по умолчанию:
- Скидки – при доступности элемента на карточке товара позволяет настроить отображение скидки товара. Настройки:
- Отображать скидки – активирует отображение скидки.
- Итоговая скидка – при активации изменяет название скидки на её значение.
- Отступы – позволяет выбрать значения отступов со всех 4-х сторон элемента.
- Свойства текста – раздел, в котором можно настроить отображение текста. Настройки:
- Настройки элемента идентичны настройкам элемента Текст, за исключением некоторых неактуальных.
- Настройка иконки скидки – раздел, в котором можно настроить иконку скидки. Настройки:
- Иконка:
- из библиотеки;
- по URL.
- URL – ссылка на картинку при выборе варианта источника по URL.
- Цвет иконки – позволяет выбрать цвет элемента из списка настроенных в разделе Цветовая схема.
- Размеры – позволяет выбрать ширину и высоту элемента.
- Иконка:
- Артикул – при доступности элемента на карточке товара позволяет настроить отображение артикула товара. Настройки:
- Отображать артикул – активирует отображение артикула.
- Иконка SKU:
- из библиотеки;
- по URL.
- URL – ссылка на картинку при выборе варианта источника по URL.
- Остальные настройки элемента идентичны настройкам элемента Текст, за исключением некоторых неактуальных.
- Количество – блок, объединяющий в себе отображение информации о количестве товара и кнопками увеличения/уменьшения количества и/или удаления товара. Настройки:
- Для элемента:
- Единица измерения – активирует отображение единицы измерения товара.
- Минимальное значение 0 – активирует минимальное значение "0" для товара (актуально для списка товаров, например, с пакетами, когда предлагается выбрать 1 из нескольких пакетов из списка).
- Цвет блока – позволяет выбрать цвет блока из списка настроенных в разделе Цветовая схема.
- Радиус – позволяет выбрать закругления на всех 4-х углах блока как вместе, так и по отдельности.
- Отступы – позволяет выбрать значения отступов со всех 4-х сторон блока.
- Свойства текста – раздел, в котором можно настроить отображение текста. Настройки:
- Настройки элемента идентичны настройкам элемента Текст, за исключением некоторых неактуальных.
- Для вложенных кнопок (Увеличить, Уменьшить, Удалить):
- Настройки элемента идентичны настройкам элемента Кнопка, за исключением некоторых неактуальных.
- Для элемента:
- Удалить – при доступности кнопки на карточке товара, позволяет настроить формат отображения кнопки удаления товара.
- Настройки элемента идентичны настройкам элемента Кнопка, за исключением некоторых неактуальных.
5.1.11.2. Пустой чек
Автоматически добавляемый элемент, который позволяет настроить отображение экрана пустого чека.
Настройка производится согласно логике настройки элемента Контейнер.
5.1.11.3. Эффекты добавления
Вручную добавляемый элемент, позволяющий настроить формат отображения анимации при добавлении товара в чек.
В данном элементе имеется 1 вложенный элемент:
- Анимация добавления:
Настройки
Пример:
- Время анимации:
- Всплытие – позволяет настроить время отображения анимации всплытия карточки (в миллисекундах).
- Задержка – позволяет настроить время отображения карточки (в миллисекундах).
- Скрытие – позволяет настроить время отображения анимации скрытия карточки (в миллисекундах).
- Рамка – при активации позволяет установить рамку со всех 4-х сторон элемента как вместе, так и по отдельности.
- Тень – при активации позволяет выбрать:
- значения отступов тени элемента;
- степень рассеивания;
- уровень прозрачности тени;
- цвет тени из списка настроенных в разделе Цветовая схема.
Элемент добавляется с вложенным элементом Карточка, настройки которого идентичны настройкам карточки каталога.
5.1.12. Список push-уведомлений
Основной элемент, позволяющий реализовать отображение всплывающих сообщений (push-уведомлений) о списке применённых в чеке скидок.
Настройки
Пример:
- Наложение пуш-уведомлений – настройка позволяет либо располагать push-уведомления друг за другом, либо накладывать их поверх по мере появления новых событий.
- Остальные настройки элемента идентичны настройкам элемента Список.
В данном элементе имеется 1 вложенный элемент:
5.1.12. Пуш-уведомление
Локальный элемент, позволяющий осуществить настройку возникающего push-уведомления.
Настройки
Пример:
- Событие пуш-уведомления – настройка позволяет указать, на какое событие будет возникать настраиваемое push-уведомление.
- Остальные настройки элемента идентичны настройкам элемента Список, за исключением некоторых неактуальных.
Для корректной работы новых событий push-уведомлений, требуется дополнить конфигурационный файл toasters.conf (ui\toasters.conf), добавив в него следующее:
{
event = "ScanAge", //событие всплывает после добавления акцизного товара. Диалог про напоминание о 18+ возрасте при этом не показывается
closeTimeOut = 15 seconds // number seconds, если 0, то не исчезает сам, по умолчанию 15sec
},
{
event = "ScanSomePosition", //событие всплывает после добавления позиции в чек по счёту, указанному в поле param
param = 3, // Номер позиции, при добавлении которой показывать событие ScanSomePosition
closeTimeOut = 15 seconds // number seconds, если 0, то не исчезает сам, по умолчанию 15sec
}
Данный файл расположен на кассовом сервере по адресу: Магазин – Типы касс, где нужно выбрать тип кассы и нажать кнопку Настройки:
После применения настроек необходимо выполнить быструю перезагрузку.
5.1.13. СуперМаг DS
Глобальный элемент, позволяющий добавлять контент, воспроизводимый через инструмент СуперМаг Digital Signage:
Данный элемент может быть добавлен только в элемент Контейнер выбранной разметки. Добавление во вложенные контейнеры/списки недоступно.
Настройки
Тип проигрывателя – позволяет выбрать тип настроенного в инструменте Digital Signage проигрывателя для экрана Чек:
- standBy – экран ожидания;
- receipt – экран оформления чека.
Для отображения большего количества заранее настроенных типов проигрывателей, необходимо настроить соединение с СуперМаг DS в разделе Настройки.
В данный элемент возможно добавить следующие элементы:
5.1.13.1. Бегущая строка
Локальный элемент, позволяющий добавить бегущую строку к контенту, воспроизводимому через инструмент Digital Signage:
Настройки
Пример:
- Бегущая строка – позволяет отобразить бегущую строку с текстом и выбрать её расположение:
- сверху;
- снизу;
- сверху и снизу.
- Свойства текста – раздел, в котором можно настроить отображение текста.
- Настройки элемента идентичны настройкам элемента Текст, за исключением некоторых неактуальных.
5.1.14. Селфи-камера
Глобальный элемент, позволяющий отобразить селфи-камеру.
Настройки элемента доступны в разделе Настройки.
Для отображения изображения с веб-камеры в конфигураторе, требуется выполнить следующую настройку браузера (селфи-камера использует технологию WebRTC, которая требует HTTPS-соединения):
- Открыть новую вкладку chrome://flags.
- Найти unsafely-treat-insecure-origin-as-secure.
- Вписать http://[url_или_ip_cервера].
- Включить – Enabled.
- Перезапустить браузер:
5.2. Локальные элементы
5.2.1. Каталог
Локальный элемент, позволяющий добавить каталог, доступный на следующих экранах:
- Каталог
- СуперМаг Vision
- Чек
- Подытог:
Настройки
Пример:
Настройки элемента идентичны настройкам элемента Таблица.
В данном элементе имеются 5 вложенных элементов:
5.2.1.1. Вкладки
Вручную добавляемый элемент, позволяющий отобразить и настроить панель с вкладками, где отображаются доступные пик-листы:
Настройки
Пример:
- Цвет – позволяет выбрать цвет элемента из списка настроенных в разделе Цветовая схема.
- Цвет активный – позволяет выбрать цвет активной вкладки элемента из списка настроенных в разделе Цветовая схема.
- Размеры – позволяет выбрать высоту элемента.
- Вариант – позволяет выбрать тип отображения информации:
- только иконка – отображение только иконки пик-листа;
- только текст – отображение только названия пик-листа;
- смешанный однострочный – отображение и названия, и иконки пик-листа в одну строчку;
- смешанный двустрочный – отображение и названия, и иконки пик-листа в две строчки.
- Количество – позволяет выбрать количество отображаемых на странице вкладок пик-листов.
5.2.1.2. Поиск по каталогу
Вручную добавляемый элемент, позволяющий отобразить и настроить кнопку поиска по пик-листам:
Настройки
Пример:
- Поиск сразу включён – реализует активированный режим поиска сразу при переходе на экран с данным элементом.
- Остальные настройки элемента идентичны настройкам элемента Кнопка, за исключением некоторых неактуальных.
5.2.1.3. Пейджер
Вручную добавляемый элемент, позволяющий отобразить и настроить элемент перехода между страницами пик-листов (от англ. "page" – "страница"):
Настройки элемента отсутствуют.
5.2.1.4. Breadcrumbs
Вручную добавляемый элемент, позволяющий отобразить и настроить элемент навигации по дереву пик-листов:
Настройки
Пример:
- Основная категория/путь до категории – раздел, в котором можно настроить соответствующий текст элемента. Настройки раздела идентичны настройкам элемента Текст.
- Картинка-разделитель – раздел, в котором можно настроить отображение картинки-разделителя навигации:
- Иконка:
- из библиотеки;
- по URL.
- URL – ссылка на картинку при выборе варианта источника по URL.
- Размеры – позволяет выбрать ширину и высоту иконки.
- Цвет иконки – позволяет выбрать цвет картинки-разделителя из списка настроенных в разделе Цветовая схема.
- Иконка:
5.2.1.5. Товары каталога
Вручную добавляемый элемент, позволяющий отобразить товары каталога в табличном представлении:
Настройки
Пример:
- Количество столбцов – позволяет выбрать количество столбцов карточек каталога.
- Отступы – позволяет выбрать значения отступов со всех 4-х сторон элемента.
- Позиционирование блоков – блок, позволяющий настроить отступы между позициями пик-листа:
- Межстрочный интервал – позволяет выбрать расстояние между строчками позиций пик-листа;
- Интервал между колонок – позволяет выбрать расстояние между столбцами позиций пик-листа.
В элементе имеется 1 вложенный элемент:
5.2.1.5.1. Карточка
Настройки
Пример:
- Размеры – позволяет выбрать высоту элемента.
- Цвет – позволяет выбрать цвет элемента из списка настроенных в разделе Цветовая схема.
- Отступы – позволяет выбрать значения отступов для всех вложенных элементов со всех 4-х сторон элемента.
- Радиус – позволяет выбрать закругления на всех 4-х углах элемента как вместе, так и по отдельности.
Элемент добавляется с вложенным элементом Таблица.
5.2.2. QR-код
Локальный элемент, позволяющий добавить информацию о QR-коде сформированного по результату оплаты фискального чека. Элемент доступен на следующих экранах:
- Спасибо.
Настройки:
- Отступы – позволяет выбрать значения отступов со всех 4-х сторон элемента.
- Размеры – позволяет выбрать размер элемента.
6. Настройка диалоговых окон интерфейса
Настройка диалоговых окон осуществляется в разделе Диалоги верхнего меню.
6.1. Основные окна
В данном разделе настраивается глобальный вид всех возникающих диалоговых окон:
Настройки
Пример:
- Позиционирование – позволяет выбрать вариант расположения вложенных в диалоговое окно элементов.
- Размеры – позволяет выбрать ширину и высоту диалогового окна.
- Отступы – позволяет выбрать значения отступов для всех вложенных элементов со всех 4-х сторон элемента.
- Радиус – позволяет выбрать закругления на всех 4-х углах элемента как вместе, так и по отдельности.
- Цвет – позволяет выбрать цвет элемента из списка настроенных в разделе Цветовая схема.
- Тень – при активации позволяет выбрать:
- значения отступов тени элемента;
- степень рассеивания;
- уровень прозрачности тени;
- цвет тени из списка настроенных в разделе Цветовая схема.
- Задний фон – при активации позволяет задать любое изображение в качестве заднего фона элемента со следующими настройками:
- Источник:
- из библиотеки;
- по URL.
- URL – ссылка на картинку при выборе варианта источника по URL.
- Позиционирование:
- справа;
- слева;
- сверху;
- снизу;
- по центру.
- Размер картинки:
- по размеру картинки – масштабирование происходит по наименьшей стороне элемента;
- по размеру блока – масштабирование по большей стороне элемента;
- заданный размер – масштабирование можно установить вручную.
- Раппорт – дублирование картинки по всей площади элемента.
- Источник:
6.2. Диалоговое окно
Все имеющиеся в интерфейсе диалоговые окна сгруппированы по их типу. Настройка для каждого диалогового окна одного и того же типа производится одинаковым образом:
Список категорий возникающих диалоговых окон:
- Сообщения
- Блокировка UI
- Подтверждения
- Ввод
- Выбор из списка
- Антифрод
- Список товаров
Любое диалоговое окно, вне зависимости от его категории, имеет настройки, аналогичные элементу Список.
В настраиваемое диалоговое окно можно добавить те или иные элементы, в зависимости от типа настраиваемого окна.
Доступные для добавления элементы интерфейса:
6.2.1. Контейнер
Настройки аналогичны элементу Контейнер.
6.2.2. Картинка
Настройки
Пример:
- Картинка – раздел, в котором можно настроить отображение картинки в диалоговом окне:
- из библиотеки;
- по URL.
- URL – ссылка на картинку при выборе варианта источника по URL.
- Цвет иконки – позволяет выбрать цвет элемента из списка настроенных в разделе Цветовая схема.
- Размеры – позволяет выбрать ширину и высоту элемента.
6.2.3. Заголовок
Настройки аналогичны элементу Текст.
6.2.4. Описание
Настройки аналогичны элементу Описание.
6.2.5. Кнопка (подтверждения, согласия/отказа)
Настройки аналогичны элементу Кнопка.
6.2.6. Выбор "один из"
Настройки будут доступны позже.
6.2.7. Строковая форма
Настройки будут доступны позже.
6.2.8. Числовая форма
Настройки будут доступны позже.
6.2.9. Информация анти-фрод
Настройки будут доступны позже.












































































