Как задействовать компоненту Флаг на странице?
Постановка задачи: на пользовательской странице Карточка задачи, скрыть блоки параметров, касающихся сроков исполнения задачи и задействованных по ней сотрудников. При этом расположить и сделать видимыми компоненты Флаг, с помощьюкоторых можно открыть (cделать видимыми) изначально скрытые блоки.
Решение задачи:
Предполагается, что страница Карточка задачи уже создана бизнес-аналитиком.
- Страница содержит блоки “Общие сведения”, “Сроки”, “Действующие лица”, реализованные с использованием компонент Группа полей. Снять с этих компонент параметр “Видимость”, чтобы при первоначальной загрузке страницы блоки “Сроки” и “Действующие лица” были невидимы. (рис.1)

- в структуру страницы добавить 2 компоненты Флаг (без возможности сохранения), сразу после каждого из блоков “Сроки” и “Действующие лица”. Подобрать наименования для этих компонент, указывающее их назначение. Произвести настройку параметров “Надпись”, “Значение” (выставить FALSE) и “Расширенные настройки”→ “CSS классы” (рис. 2)

класс check-invert предписывает расположить сам визуальный значок компоненты перед параметром компоненты “Надпись”
класс free-label предписывает не форматировать значение параметра “Надпись”, располагая его свободным текстом после визуального значка компоненты
- в структуру страницы добавить 2 компоненты Обработка событий для управления событиями и реакцией на них в случае изменения пользователем состояния компонент Флаг, а именно проставления флага или его снятия. Подобрать наименования для этих компонент, указывающее их назначение. Произвести настройку алгоритма реакции на событие. (рис. 3)
|
|
|
В результате выполнения указанной последовательности действий и запуска приложения, интерфейс экранной формы примет следующий вид:
image2019-3-7_17-38-11.png (image/png)
image2019-4-5_18-55-34.png (image/png)
image2019-3-7_18-12-24.png (image/png)
image2019-4-5_16-45-44.png (image/png)
image2019-4-5_16-45-5.png (image/png)
image2019-4-5_16-53-0.png (image/png)
image2019-4-5_20-3-0.png (image/png)
image2019-4-5_18-50-4.png (image/png)
image2019-4-5_19-20-34.png (image/png)
image2019-4-5_20-7-42.png (image/png)
image2019-4-5_20-11-3.png (image/png)
image2019-4-5_20-14-16.png (image/png)
image2019-4-5_20-13-49.png (image/png)
image2019-4-5_20-19-41.png (image/png)
image2019-4-8_12-20-22.png (image/png)
image2019-7-15_13-26-0.png (image/png)
image2019-7-15_13-32-14.png (image/png)
image2019-7-15_13-32-32.png (image/png)
image2019-7-15_13-33-3.png (image/png)
image2019-7-15_13-33-37.png (image/png)
image2019-7-15_13-37-36.png (image/png)
image2019-7-15_13-44-24.png (image/png)
2019-07-15_15-13-17.gif (image/gif)

