Войти

Составной экран

Общая информация

Составной экран позволяет реализовать экран, состоящий из нескольких простых (примитивных) компонентов.

Внешний вид в конструкторе

Составной экран.jpg

Структура JSON составного экрана

ВКУ

JSON


В конструкторе

Атрибут

Тип

Описание

1

Идентификатор экрана

id

string

Уникальный идентификатор экрана в JSON

2

Название экрана

name

string

Допускается ввод любых данных для отображения в конструкторе, однако классическим видом является s1, где номера –  сгенерированные идентификатор, s –  экран

3

Заголовок экрана

header

string

Заголовок экранной формы, который отображается пользователю

4

Текст подзаголовка

subHeader

string

Подзаголовок экранной формы, содержащий информацию

5

Пояснительные переходы



Создание модального окна (поп-ап)

6

Настройка пояснительных переходов в подзаголовке




7

Признак первого экрана

isFirstScreen

boolean

Признак первого экрана, необходим на любом стартовом экране. Позволяет скрыть кнопку «назад»

8

Признак последнего экрана

isTerminal

boolean

Признак последнего экрана указывает что экран является финальным. С данного экрана нельзя совершить переход назад по услуге, так как заявление сформировано и отправлено в СМЭВ

9

Не отправлять заявление в СМЭВ



Признак указывает, что шаг отправки в СМЭВ на данном экране будет проигнорирован

10

Признак, скрывающий кнопку назад



Необходим, если не нужно показывать кнопку назад.

11

Признак запрета пересыла данных в СМЭВ



Запрещает взаимодействие со СМЭВ

12

Признак тупикового экрана



Осуществляет удаление черновика из ЛК и БД

13

Список условий




14

Атрибуты экрана

attrs


Переиспользование значений, указанных на предыдущих экранах, в полях ввода

14.1

Ключ

refs

string


14.2

Компонент

path

string


14.3

Преобразование

converter

string

Предназначен для изменения данных различным образом

14.4

Формат

format

string

Позволяет привести данные к указанному формату

15

Саджесты(Suggest/подсказки)



Смотри статью

15.1

Идентификатор группы




15.2

Поле suggestionId чекбокса на этом скрине




15.3

Поле suggestionId филда на этом скрине




16

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




16.1

Ключ



Должен совпадать со значением поля «Значение, отправляемое по нажатию на кнопку» кнопки экрана

16.2

Настройка модального окна подтверждения



Настройка связанная со всплывающим окном по нажатию на кнопку перехода на следующий шаг

16.3

Заголовок



Заголовок модального окна

16.4

Текст



Содержимое, основной текст модального окна

16.5

Атрибуты кнопки в модальном окне




16.6

Атрибуты обычной кнопки




17

Вычисляемые аргументы экрана (linkedValues)



Атрибуты компонента, позволяющие реализовать сложный функционал

Пример JSON

{

            "id": "pd19d",

            "type": "StringInput",

            "required": true,

            "label": "Стоимость, рублей",

            "attrs": {

                "placeholder": "0",

                "validation": [

                    {

                        "type": "RegExp",

                        "value": ".+",

                        "errorMsg": "Поле не может быть пустым"

                    },

                    {

                        "type": "RegExp",

                        "value": "^(s|d{1,10})*(s*?₽)?s*$",

                        "errorMsg": "Неверный формат числа, целое число, не более 10 знаков"

                    }

                ],

                "price": true

            },

            "value": "",

            "visited": false

        },

        {

            "id": "add16",

            "type": "StringInput",

            "required": false,

            "label": "Пробег, км",

            "attrs": {

                "customUnrecLabel": "можно не указывать",

                "placeholder": "0",

                "rank": true,

                "validation": [

                    {

                        "type": "RegExp",

                        "value": "^(s|d{1,10})*",

                        "errorMsg": "Неверный формат числа, целое число, не более 10 знаков"

                    }

                ]

            },

            "value": "",

            "visited": false

        },

Вариант использования

Составной экран используется для внесения пользователем каких-либо данных или сведений. Для получения информации о банковских реквизитах используется экран, представленный на скриншоте.

Командой ВКУ был разработан шаблон данного экрана, который можно посмотреть на экране s20.

Авторизуйтесь, чтобы оставить комментарий к статье