# Виджет «EQL-поиск»

> [HTML Version](eql-search-widget.html)

Виджет **EQL-поиск** размещается на формах приложений и страницах и позволяет осуществлять [поисковые запросы на языке EQL365](eql365-search.md) (ELMA365 Query Language). Пользователи смогут применять операции и функции разработанного синтаксиса, задавать сложную выборку данных с множеством условий и выполнять поиск по параметрам любого приложения системы.

## Настройка EQL-поиска при помощи виджета

Виджет **EQL-поиск** представляет собой строку поиска, в которой пользователи указывают EQL-запрос. Поиск по запросу осуществляется при помощи скрипта, который создаётся в дизайнере интерфейсов. Пользователь запускает его на странице или форме, например, при нажатии на настроенную кнопку. Результат поиска выводится в специальной добавленной переменной.

Рассмотрим подробнее настройку EQL-поиска в виджете. Для примера разместим виджет на отдельной странице **Конверсия сделок**, где отображается график перехода элементов по их статусам. Настроим поиск на странице по параметрам приложения **Сделки**.

**(eql-search-widget-1.png)**

### Шаг 1. Добавление контекстных переменных

Чтобы настроить виджет **EQL-поиск**, в дизайнере интерфейсов создайте специальные контекстные переменные. Они используются для сопоставления с настройками виджета, а также для отображения результатов поиска.

1. В дизайнере интерфейсов перейдите на вкладку **Контекст**. 

2. Добавьте свойства. Названия и коды переменных приведены для примера. Типы данных должны совпадать с указанными:

**(eql-search-widget-2.png)**

- **Строка EQL-запроса** (\[OBJECT\]) — свойство с типом [Строка](360009707032.md#string). Указывается в настройках виджета и используется для ввода EQL-запроса;

- **Параметры EQL-поиска** (\[OBJECT\]) — свойство [Произвольный тип](360009707032.md#any). Указывается в настройках виджета. Используется для передачи составленного запроса из виджета в скрипте его обработки;

- **Результат EQL-поиска** (\[OBJECT\]) — свойство типа [Приложение (несколько)](app-data-type.md) с указанием приложения, по параметрам которого будет осуществляться поиск. В нашем примере используется приложение **Сделки**. Свойство добавляется на поле для моделирования для отображения всех элементов, совпадающих с условиями введённого пользователем EQL-запроса.  

### Шаг 2. Размещение и настройка виджета EQL-поиск

На следующем этапе настройте виджет EQL-поиск. Для этого:

1. Перейдите на вкладку **Шаблон** и перетащите виджет с правой панели дизайнера интерфейсов в ту область поля для моделирования, где хотите разместить строку поиска.

2. В открывшемся окне на вкладке **Основные** укажите настройки виджета:

**(eql-search-widget-3.png)**

- **Строка EQL** — сопоставьте опцию с переменной типа **Строка**, добавленной на шаге 1. Нажмите **<Не установлено>** и выберите свойство из списка. В нашем примере — это **Строка EQL-запроса**;

- **Параметры EQL** — сопоставьте опцию с переменной **Произвольный тип**, добавленной на шаге 1. Нажмите **<Не установлено>** и выберите свойство из списка, например **Параметры EQL-поиска**;

- **Приложение\*** — выберите приложение, по параметрам которого будет выполняться поиск с учётом условий составленных EQL-запросов. В нашем примере — приложение **Сделки**.

3. На вкладках **События** и **Системные** вы можете задать системные настройки, одинаковые для всех виджетов. Они позволяют управлять видимостью и доступом виджета, настраивать поведение при наведении курсора и т. д. Подробнее об этом читайте в статье [«Системные настройки виджетов»](common_widget_settings.md)

4. Сохраните заданные в виджете параметры.

### Шаг 3. Настройка скрипта обработки EQL-запроса

Поиск по составленному пользователем EQL-запросу должен осуществляться с помощью скрипта. В дизайнере интерфейсов необходимо предусмотреть его запуск и обработку. Например, пользователи могут нажимать на кнопку, чтобы загрузить EQL-запрос и просмотреть результаты поиска. 

Чтобы это настроить, выполните следующие действия: 

1. На вкладке **Виджеты** на правой панели дизайнера интерфейсов найдите виджет [Кнопка](button_widget.md). Перетащите его на поле для моделирования, например, разместите кнопку под строкой EQL-поиска. 

2. В открывшемся окне настройте отображение кнопки и задайте её название, например, **Поиск**.

3. В поле **Выполняемый скрипт** нажмите **Создать** и укажите название скрипта, который будет запускаться при нажатии на кнопку, например, **Click**;

4. Нажмите на появившуюся в поле кнопку **Открыть**, чтобы перейти на вкладку **Скрипты **и задать следующую команду:

````
async function Click (): Promise<void> \{  
    Context.data.appItems = await Context.fields.appItems.app.search().where(Context.data.eql\!, Context.data.parameters).all();  
\}

### ````
Шаг 4. Настройка отображения результата поиска

Согласно заданному скрипту найденные по EQL-запросу элементы приложения записываются в переменную **Результат EQL-поиска**, созданную на шаге 1. Её можно использовать в дизайнере интерфейсов. Например, отобразим результат поиска на странице. Для этого:

1. Перейдите на вкладку **Шаблон** и на правой боковой панели нажмите **Свойства**.

2. Перетащите свойство **Результат EQL-поиска** на поле для моделирования. Например, разместите его под настроенной кнопкой **Поиск**.

3. В открывшемся окне настроек в поле **Только для чтения** отметьте **Да**, чтобы пользователи могли только просматривать отображаемые в свойстве элементы. 

4. Задайте другие настройки строки формы. Например, включите опцию **Скрывать, если не заполнено**, чтобы показывать поле с найденными элементами только после обработки EQL-запроса.

5. Сохраните заданные параметры.

### Шаг 5. Публикация настроенного интерфейса

Настройки страницы в дизайнере интерфейсов для нашего примера могут выглядеть следующим образом:

**(eql-search-widget-4.png)**

Чтобы страница стала доступна пользователям, нажмите **Сохранить** и **Опубликовать **на верхней панели дизайнера интерфейсов.

Теперь пользователи могут использовать EQL-поиск, чтобы искать элементы приложения **Сделки**.