Создание глобального фильтра описано в соответствующем разделе: Добавление фильтра.
Для применения глобального фильтра следует воспользоваться соответствующим элементом, расположенным на слое проекта, если глобальный фильтр вынесен на слой, или нажать на кнопку , расположенную в правом верхнем углу окна просмотра проекта.
В зависимости от типа глобального фильтра далее необходимо выбрать значение из выпадающего списка или ввести необходимое значение в поле ввода.
Тип и вид фильтра зависят от настроенного шаблона.
Для фильтра типа «Поиск» при работе с числовыми значениями необходимо указывать дробные числа через «.» (например, «12.3») для корректного поиска по значениям. |
В случае длинного значения в глобальном фильтре при наведении на такое значение отображается подсказка, которая содержит значение целиком:
Для просмотра имеющихся в проекте глобальных фильтров следует нажать на кнопку , расположенную в правом верхнем углу окна просмотра проекта.
После нажатия на кнопку справа отобразится следующее окно:
Примененные фильтры отмечены чекбоксами.
Для сброса всех значений в примененных фильтрах следует нажать кнопку «Сбросить все». Фильтры с установленным значением по умолчанию сбросятся до этого значения, фильтры без установленного значения по умолчанию очистятся, и произойдет переход в окно просмотра проекта.
Для закрытия окна следует нажать кнопку , расположенную в верхнем правом углу окна, или нажать левую кнопку мыши вне области окна.
Если фильтр применен к объекту на одном слое, то при наличии аналогичного фильтра на другом слое, фильтрация может быть повторена при переходе на другой слой.
Для этого должны выполняться следующие условия:
На Слое 1 в фильтре выбрано значение «Владимир», виджет отсортирован по данному значению:
Перейдем на Слой 2. В фильтре установлено то же значение, что и на Слое 1, и другой виджет отсортирован по нему:
В случае если второй слой встроен в первый при помощи HTML-компонента iframe, для переноса значения (или массива значений) фильтра со слоя на слой используется JavaScript-фунцкция postMessage().
Предположим, что у нас есть Слой 1 и Слой 2, при этом Слой 1 встроен в Слой 2 при помощи iframe:
<!-- Встроенный iframe c указанием URL слоя 2, ширины, высоты и уникального идентификатора "frame". --> <iframe src="https://dev.platform.polymatica.ru/dashboard/project/82026/193019" width="1400" height="700" id="frame"></iframe> |
Также для примера создана кнопка, при нажатии на которую отправляется событие с функцией postMessage():
<!-- Кнопка для отправки события ChangeFilter с массивом value --> <button onclick="sendMessage()">кнопка фильтрации</button> <button onclick="goTo('project/82026/193019?qq=строка 3')">Кнопка перехода GoTo</button> <script> // Функция для отправки сообщения в родительское окно function sendMessage() { // Отправляем сообщение с событием changeFilter и массивом value в iframe var iframe = document.getElementById('frame'); iframe.contentWindow.postMessage({ event: 'changeFilter', // Название события value: value: [{ value: "строка 13", key: "qq" }, { value: "строка 3", key: "qqs" }, { value: ['январь'], key: "test123" }] // Массив с объектами значений // Массив с объектами значений }, new URL(iframe.src).origin); // Ограничиваем сообщение тем же источником, что и iframe } // Слушатель для обработки сообщений от iframe (если нужно) window.addEventListener('message', (event) => { console.log(event); // Выводим событие в консоль для отладки }); </script> |
Разберем структуру данных, которые отправляются в iframe при нажатии на кнопку фильтрации.
Отправляемые данные - это объект, имеющий поля event и value, где event – название отправляемого события, а value – значение.
Для передачи фильтра в iframe мы используем event с названием 'changeFilter'.
Структура value всегда имеет тип объекта или массива объектов, которые имеют по два обязательных свойства: value и key, где value – значение, передаваемое в фильтр, и key – ключ этого фильтра.
Рассмотрим несколько сценариев использования:
1)
iframe.contentWindow.postMessage({ event: 'changeFilter', value: value: { value: 'Весна', key: 'key1' } }, new URL(iframe.src).origin); |
Данный postMessage() передаст в iframe в фильтр, имеющий ключ 'key1' значение 'Весна'.
2)
iframe.contentWindow.postMessage({ event: 'changeFilter', value: value: { value: ['Весна', 'Зима'], key: 'key1' } }, new URL(iframe.src).origin); |
Данный postMessage() передаст в iframe в фильтр (мультисписок), имеющий ключ 'key1', значения 'Весна' и 'Зима'.
3)
iframe.contentWindow.postMessage({ event: 'changeFilter', value: value: [{ value: "Весна", key: "key1" }, { value: "Зима", key: "key2" }], }, new URL(iframe.src).origin); |
Данный postMessage() передаст в iframe в фильтры, имеющие ключи 'key1' и "key2", значения 'Весна' и 'Зима' соответственно.