Войти

Выпадающий список со строкой поиска (Lookup)

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

Компонент Lookup в стандартной услуге представляет собой выпадающий список со строкой поиска, который позволяет пользователю выбрать одно из значений в загруженном справочнике


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

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

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

В стандартной услуге

Снимок экрана 2024-08-16 в 16.09.39.png

В услуге Робота Макса

В услуге.png

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

lookup_1.png

Если включен вызов внешнего справочника, то отобразятся блоки «Описание запроса к внешней системе» и «Заголовки запроса»

lookup_2.png

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

ВКУ JSON
В конструкторе Атрибут Тип Описание
1 Идентификатор компонента id string Уникальный идентификатор компонента в JSON
2 Имя компонента name string Допускается ввод любых данных для отображения в конструкторе, однако классическим видом является s1_с1, где номера — сгенерированные идентификаторы, s — экран, c — компонент
3 Заголовок компонента label string Название поля. Описывает, что пользователю необходимо ввести в отображаемое ему поле
4 Компонент обязателен для заполнения required boolean Принуждает пользователя к взаимодействию с компонентом
Дополнительные атрибуты
5 Вызов справочника / Вызов внешнего сервиса VKUrestCallType string Настройка, позволяющая выбрать источник данных
5.1.1 Код справочника dictionaryType string Название справочника, данные которого нужно загрузить
Маппинг параметров
5.1.2 Идентификатор параметра idPath string Атрибут справочника
5.1.3 Параметр, значение которого будет отображаться в выпадающем списке textPath string Путь до параметра, значение которого нужно отображать в выпадающем списке
5.1.4 URL загружаемого словаря dictionaryUrlType string Имя используемого API для предоставления справочника. Примеры:
  • dictionary
  • nsiSuggest
  • lkApi
  • childrenClubsApi
Дополнительные опции при обращении к справочнику
5.1.5 Количество элементов на странице pageSize string Размер страницы, по умолчанию устанавливается значение 1000. Это означает, что все элементы справочника делятся на страницы по 1000 элементов каждая
5.1.6 Атрибуты, выбираемые из словаря selectAttributes array Перечень атрибутов справочника, которые запрашиваются из api/nsi/v1/dictionary/. Указывается для уменьшения объёма передаваемых данных и размера черновика
Параметры сортировки
5.1.7 Наименование атрибута, по которому будет происходить сортировка attribute Name string Имя атрибута, по которому будут сортироваться элементы справочника
5.1.8 Порядок сортировки sortDirection string Позволяет выбрать порядок сортировки:
  • По возрастанию
  • По убыванию
5.1.9 Ссылка на значение родителя для отбора по многоуровневому справочнику parentRefItemValue string Код родительского элемента. По умолчанию пустое значение
5.1.10 Фильтрация со сложной логикой dictionaryFilterV2 object Позволяет настроить динамическую фильтрацию со сложной логикой. Подробнее в статье
Фильтрация по выбранному словарю
5.1.11 Наименование атрибута фильтрации attributeName/key string Атрибут, по которому необходимо фильтровать справочник
5.1.12 Операция сравнения condition string Критерий или условие осуществления фильтрации
5.1.13 Источник значения для фильтра valuetype string Тип значения
5.1.14 Осуществлять интерактивный поиск searchProvider boolean Поиск по справочнику производится по значению, введённому в поле
5.1.15 Количество элементов на странице pageSize string Количество значений справочника, отображаемых на странице
5.1.16 Атрибуты, выбираемые из словаря selectAttributes array Перечень атрибутов, по которым происходит выбор из справочника
5.1.17 Параметры сортировки orderBy array Позволяет выбрать порядок сортировки для заданных атрибутов
5.1.18 Ссылка на значение родителя для отбора по многоуровневому справочнику parentRefItemValue string Код родительского элемента для интерактивного поиска. По умолчанию пустое значение
5.1.19 Фильтрация со сложной логикой для интерактивного поиска dictionaryFilterV2 object Позволяет настроить динамическую фильтрацию со сложной логикой для интерактивного поиска. Подробнее в статье
5.1.20 Настройка фильтрации для интерактивного поиска dictionaryFilter array Позволяет настроить фильтрацию для интерактивного поиска
5.1.21 Минимальное количество символов для интерактивного поиска queryMinSymbolsCount integer Позволяет задать минимальное количество символов для осуществления интерактивного поиска
Описание запроса к внешней системе
5.2.1 HTTP-метод method string Метод для запроса к внешней системе
5.2.2 Путь до сервиса path string Путь до сервиса внешней системы
5.2.3 URL вызываемого сервиса url string URL вызываемого сервиса
5.2.4 Тело запроса body string Тело запроса
5.2.5 Заголовки запроса headers object Заголовки запроса
6 Зависимости с ранее введёнными данными ref array of objects Массив объектов, в элементах которых описываются зависимости и правила отображения полей
7 Название атрибута, по которому происходит фильтрация attributeName string Вторичная фильтрация. Производится на frontend из тех значений, что вернул backend при первичной фильтрации
8 Список значений выбранного атрибута value array Указываются значения из справочника, которые необходимо исключить или показать на форме
9 Изменить заданные значения атрибута isExclude boolean Позволяет сформировать список только с заданными значениями или исключить их
10 Предустановка значения в справочнике vkuPreset string Позволяет выбрать предустановку значения в справочнике по заданному значению или индексу
11 Значение из справочника, которое будет выбрано по умолчанию lookupDefaultValue string Указывается значение из списка, которое будет отображаться в поле по умолчанию
12 Валидация выбранных значений validation array Если настройка добавлена для нескольких компонентов на одном экране, то позволяет сделать обязательным заполнение хотя бы одного из них. Компонент с данной настройкой должен быть необязательным для заполнения
13 Проверять выбранное значение на backend для исключения подмены validationSwitchOn boolean Атрибут позволяет исправить поломку компонента при больших справочниках
Атрибут, по которому проводится валидация на backend
14 Название атрибута, по которому производится валидация idName string Название атрибута из справочника
15 Тип атрибута idType string Тип атрибута, по которому по которому производится валидация. По умолчанию «asString»
16 Путь до значения в ответе справочника answerJsonPath string Путь к значению атрибута в ответе справочника. Указывается для случаев, когда ответ справочника не стандартен для nsi и уникальный атрибут хранится по пути originalItem.value, а не в attributes
17 Валидировать параметры фильтра на backend при заданных зависимостях с ранее введёнными данными dictionaryValidation object Включает валидацию на backend, которая проверяет, что выбранное в компоненте значение присутствует в справочнике. Если флаг не указан, то при валидации полученное значение сравнивается по полю ID в зависимостях с ранее введёнными данными
18 Только для чтения disabled string Атрибут предназначен для отключения возможности пользователю выбирать значение из справочника
19 Отображение компонента в повторяющихся блоках RepeatableFields onlyFirstScreen boolean Можно выбрать отображение только в первом блоке или наоборот. Если оставить выпадающий список пустым, то компонент Lookup будет отображаться во всех блоках компонента RepeatableFields
20 Возможность сброса выбранного из справочника значения isClearable boolean Возможность сброса выбранного из справочника значения. Если указать true, то будет отображаться крестик для сброса выбранного значения
21 Подсказка, отображаемая под компонентом hint string Текст, который отображается под компонентом
22 Пример значения в поле placeholder string Введённое значение отобразится в строке в качестве примера
23 Отображать иконку загрузки вместо лупы при прогрузке справочника searchIconForcedShowing boolean Указывается, если нужно вместо лупы отображать иконку загрузки
24 Развернуть список со значениями при открытии страницы focusOnInitAndStartSearch boolean Указывается, если нужно, чтобы при открытии страницы список со значениями был автоматически развёрнут
25 Отображать иконку выпадающего списка вместо лупы showExpandCollapse boolean При значении true вместо лупы отображает иконку выпадающего списка, как в компоненте DropDown. По умолчанию принимает значение false
26 Модальные окна с пояснениями clarifications array of objects Позволяет раскрыть блок «Настроить модальное окно с пояснением вручную» или сделать список ссылок на пояснительные переходы
27 Настроить модальное окно с пояснением вручную acceptableTypes additionalProperties Позволяет настроить модальные окна
28 Настройка формирования health-метрик healthList array of objects Позволяет задать список событий компонента, по которым будут формироваться health-запросы
29 Ссылки на значения атрибутов для подстановки в отображаемый текст refs array of objects Ссылки на значения компонентов, которые необходимо отобразить
30 Вычисляемые аргументы компонента (linkedValues) linkedValues array of objects Атрибуты компонента, позволяющие реализовать сложный функционал
31 Идентификатор подсказки suggest suggestionId string Механизм отображения пользователю набора подходящих для ввода данных и автоматическое заполнение полей формы этими данными
32 Идентификаторы компонентов, для которых чистить кэш clearCacheForComponentIds array Если ответ на текущий компонент отличается от того, что указан в cachedAnswers, при наличии, то будут удалены все cachedValues, указанные в этом поле
33 Не использовать значение компонента при автогенерации VM шаблона notUseInVm boolean Атрибут функционала автоматического создания VM шаблонов для услуг на ПГС 3.0

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

{

  "visited": true,

  "value": {

    "originalItem": {

      "value": "113028007415/66",

      "title": "Филиал ГКУ РЦСПН по г.Белебею РБ",

      "isLeaf": true,

      "children": [],

      "attributes": [

        {

          "name": "SHORT_TITLE",

          "type": "STRING",

          "value": {

            "asString": "Филиал ГКУ РЦСПН по г.Белебею РБ",

            "typeOfValue": "STRING",

            "value": "Филиал ГКУ РЦСПН по г.Белебею РБ"

          },

          "valueAsOfType": "Филиал ГКУ РЦСПН по г.Белебею РБ"

        },

        {

          "name": "ADDRESS",

          "type": "STRING",

          "value": {

            "asString": "452000, Республика Башкортостан, г. Белебей, ул. Революционеров 3",

            "typeOfValue": "STRING",

            "value": "452000, Республика Башкортостан, г. Белебей, ул. Революционеров 3"

          },

          "valueAsOfType": "452000, Республика Башкортостан, г. Белебей, ул. Революционеров 3"

        },

        {

          "name": "PHONE",

          "type": "STRING",

          "value": {

            "asString": "8(347)200-80-80",

            "typeOfValue": "STRING",

            "value": "8(347)200-80-80"

          },

          "valueAsOfType": "8(347)200-80-80"

        },

        {

          "name": "CODE",

          "type": "STRING",

          "value": {

            "asString": "113028007415/66",

            "typeOfValue": "STRING",

            "value": "113028007415/66"

          },

          "valueAsOfType": "113028007415/66"

        },

        {

          "name": "TITLE",

          "type": "STRING",

          "value": {

            "asString": "Филиал ГКУ РЦСПН по г.Белебею РБ",

            "typeOfValue": "STRING",

            "value": "Филиал ГКУ РЦСПН по г.Белебею РБ"

          },

          "valueAsOfType": "Филиал ГКУ РЦСПН по г.Белебею РБ"

        }

      ],

      "attributeValues": {

        "CODE": "113028007415/66",

        "TITLE": "Филиал ГКУ РЦСПН по г.Белебею РБ",

        "SHORT_TITLE": "Филиал ГКУ РЦСПН по г.Белебею РБ",

        "ADDRESS": "452000, Республика Башкортостан, г. Белебей, ул. Революционеров 3",

        "PHONE": "8(347)200-80-80"

      }

    },

    "id": "113028007415/66",

    "text": "Филиал ГКУ РЦСПН по г.Белебею РБ"

  }

}

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

Компонент используется в случаях, когда пользователю необходимо выбрать один вариант из загруженного словаря. Наиболее частым вариантом использования является выбор территориального органа из списка. Кроме того, в настройках компонента существует возможность фильтрации по выбранному словарю. Статическая фильтрация по атрибуту задаётся явным указанием значения атрибута в поле «Константное значение для фильтра»

Рисунок1.png


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