Войти

Компонент блока ввода или проверки данных по детям (ChildrenList)

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

При наличии у пользователя заполненных данных о детях в ЛК ЕПГУ, компонент ChildrenList позволяет выбрать одного или нескольких детей из выпадающего списка, а также добавить одного или нескольких детей без сохранения в ЛК. Является компонентом-контейнером, все компоненты внутри будут вложенными.

Поддерживаемые экраны

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

Внешний вид компонента

В услуге


photo_2023-04-21_09-45-43.jpg

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

ChildrenList.jpg

Содержимое контейнера ChildrenList

2.jpg

В расширенной настройке компонентов «Название поля, в которое записать ответ пользователя» обязательно должны называться следующим образом:

  • Для компонента ec2 StringInput hidden- StringInput(hidden) = «id».
  • Для компонента ec3  Фамилия - StringInput = «firstName».
  • Для компонента ec4 Имя - StringInput = «lastName».
  • Для компонента ec5 Отчество - StringInput = «middleName».
  • Для компонента ec6 Дата рождения - DateInput = «birthDate».
  • Для компонента ec7 Пол - RadioInput = «gender».
  • Для компонента ec8 isNew - RadioInput(hidden) = «isNew».

Важно! Компонент NewChild - RadioInput(hidden) необходимо добавлять в том случае, если необходимо добавить нового ребенка, которого нет в ЛК ЕПГУ.

Структура компонента ChildrenList

ВКУ

JSON

 

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

Атрибут

Тип

Описание

1

Идентификатор компонента

id

string

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

2

Удобочитаемое имя компонента

   

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

3

Название кнопки добавления ребенка

label

string

Название для кнопки клонирования блока «Добавить ещё ребёнка»

4

Дополнительные атрибуты

 

4.1

Подсказка под компонентом

Текст, который отображается под компонентом

4.2

Отключить валидацию на бэке?

validateOff

boolean

Данная валидация проверяет, соответствуют ли данные по выбранному ребёнку. Если да – формирует модальное окно, которое дальше не пропускает

4.3
Компонент предназначен для выбора только одного ребенка? singleChild boolean Ввод одного ребёнка на экране (блокирует клонируемый блок)

4.4

Формирование списка детей из значений другого компонента ChildrenList

childListRef

string

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

4.5

Включить цикличность компонента?

isCycled

boolean

Указывает, что по выбранным или введенным детям будет организован цикл

4.6

Минимальный возраст ребенка

minAge

integer

Минимальный возраст ребёнка

4.7

Максимальный возраст ребенка

maxAge

integer

Максимальный возраст ребёнка

4.8

Минимальная дата рождения детей

bornAfterDate

string

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

4.9

Максимальная дата рождения детей

bornbeforeDate

string

Атрибут отфильтровывает детей, родившихся до заданной даты, с указанным значением в конце

5

Фильтрация по полу ребенка

gender

string

Атрибут фильтрует детей по полу
6 Максимальное количество добавляемых детей repeatAmount integer Максимальное количество клонируемых блоков
7 Минимальное количество добавляемых детей minOccures integer Минимальное количество клонируемых блоков. Используется, когда нужно запрещать переход на следующий экран, пока Заявитель не добавит нужное количество детей
8 Выбрать по умолчанию всех детей, загруженных из ЛК? expandAllChildrenBlocks boolean Флаг, отвечающий за функционал автоматического отображения блоков для всех детей, загруженных из ЛК
9 Скрыть кнопку добавления нового ребёнка в выпадающем списке? hideAddNewChildButton boolean Показать или скрыть добавление нового ребёнка в выпадающем списке
10
Принудительный запрос на ввод данных о ребёнке, если в профиле нет детей, и принудительный выбор ребёнка, если он один obligated boolean Принудительный запрос на ввод данных о ребёнке, если в профиле нет детей, и принудительный выбор ребёнка, если он один. По умолчанию – false
11 Отображать в выпадающем списке имя и фамилию ребенка? hideAddNewChildButton boolean Показать или скрыть кнопку добавления нового ребёнка в выпадающем списке
12 Вывод дополнительной информации о ребенке

В выпадающем списке добавляется соответствующая информация
13 Отображать заголовок блока 'Ребенок Х'? listLabel boolean Заголовок для блока клон-панели с нумерацией *Имя заголовка*
14 Подсказка над полем выбора ребенка
chooseChildLabel string Лейбл поля
15
Текст, отображаемый вместо прочерка, если не выбран ни один ребенок из списка defaultLabelList string Переопределение вида выбранного значения. По умолчанию «-»
16 Наименование элемента в выпадающем списке для добавления нового ребенка defaultNewList string Текст на кнопке добавления нового блока
17 Отображать элемент очистки поля? isClearable boolean true – есть элемент очистки поля, false – поле очистить нельзя. По умолчанию true
18 Объект, добавляемый если для атрибутов нужно задать уникальные значения



Ключи уникальности keys array of objects Массив атрибутов, для которых проверяется уникальность

Массив атрибутов, для которых проверяется уникальность



Название поля



Идентификатор компонента, уникальность которого проверяется

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

Наименование поля, уникальность которого проверяется



Сообщение об ошибке, которое выводится при неуникальности значения errorMsg string Текст ошибки, который выводится при неуникальности значения

Дисклеймер disclaimer object Дисклеймер

Заголовок дисклеймера title string Заголовок дисклеймера

Текст дисклеймера description string Текст дисклеймера, может быть с html тегами

Цвет элемента type string Цвет полоски у дисклеймера, по умолчанию красный также может быть в значении warn (жёлтый), info (серый), advice (голубой) 
Важно! Согласно редакционной политике рекомендуется использовать жёлтый цвет дисклеймера

Пояснительные переходы clarifications object Настройка модальных окон

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

Настройка формирования health-метрик
healthList
array of objects


Тип события в компоненте




Идентификаторы компонентов, для которых чистить кэш


true – включение механизма сохранения данных, введённых пользователем в локальный кэш устройства пользователя (Local Storage). По умолчанию выключено (false)

Атрибут isCycled (Включить цикличность компонента?) в значении true– используется в том случае, если компонент ChildrenList является инициализирующий экраном для цикла.
 

Пример JSON структуры компонента передаваемой в DTO

{

visited: true,

value: [

          {

               "firstName": "Василий",

               "lastName": "Сидоренко",

               "gender": "M",

               "middleName": "Петрович",

               "Id": "7481412",

               "birthDate": "2018-12-01T00:00:00.000Z",

                "NewChild": false

          },

          {

               "firstName": "Николай",

               "lastName": "Сидоренков",

                "gender": "M",

                "middleName": "Петрович",

                "Id": "7471606",

                "birthDate": "2018-02-05T00:00:00.000Z",

                "NewChild": false

}

]

}

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

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

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

Для реализации данного механизма необходимо:

  1. В блоке «Объект, добавляемый если для атрибутов нужно задать уникальные значения» – «Массив атрибутов, для которых проверяется уникальность» добавить перечень необходимых полей, которые будут проверяться на уникальность. К каждому полю или группе полей можно задать свое сообщение об ошибке.
  2. В блоке «Дисклеймер» задать дисклеймер, отображаемый при нарушении правил уникальности, заданных в блоке «Массив атрибутов, для которых проверяется уникальность».

Важно! Для проверки уникальности должны быть выполнены оба требования!

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