Открыть Freedom UI страницу из пользовательского обработчика

Средний

Пример. На странице записи пользовательского раздела Handler Chain Service добавить кнопку Открыть страницу (Open page). Кнопка открывает Freedom UI страницу StudioHomePage.

1. Настроить интерфейс страницы 

  1. Используя шаблон Данные и бизнес-процессы (Records & business processes), создайте пользовательское приложение Handler Chain Service. Для этого воспользуйтесь инструкцией, которая приведена в статье Создать пользовательское приложение.
  2. В рабочей области страницы приложения Handler Chain Service откройте страницу Страница записи Handler Chain Service (Handler Chain Service form page).
  3. Добавьте кнопку, которая открывает страницу StudioHomePage.

    1. На панель инструментов Freedom UI дизайнера добавьте компонент типа Кнопка (Button).
    2. На панели действий Freedom UI дизайнера нажмите на кнопку и на панели настройки заполните свойство кнопки Заголовок (Title) — "Открыть страницу" ("Open page").

  4. На панели действий Freedom UI дизайнера нажмите на кнопку . После сохранения настроек страницы открывается исходный код страницы Freedom UI.

2. Настроить открытие Freedom UI страницы 

Бизнес-логика настраивается в дизайнере клиентского модуля. В этом примере настроим открытие Freedom UI страницы.

  1. Подключите сервис открытия страниц sdk.HandlerChainService. Для этого добавьте в AMD-модуль зависимость @creatio-devkit/common.

    Зависимости AMD-модуля
    /* Объявление AMD-модуля. */
    define("UsrAppHandlerChainSe_FormPage", /**SCHEMA_DEPS*/["@creatio-devkit/common"] /**SCHEMA_DEPS*/, function/**SCHEMA_ARGS*/(sdk)/**SCHEMA_ARGS*/ {
            ...
        };
    });
    
  2. В секции viewConfigDiff измените значение свойства clicked для элемента OpenPageButton на usr.OpenUsrTestPageRequest. Свойство clicked отвечает за действие, которое выполняется при нажатии на кнопку.

    Секция viewConfigDiff
    viewConfigDiff: /**SCHEMA_VIEW_CONFIG_DIFF*/[
        {
            "operation": "insert",
            "name": "OpenPageButton",
            "values": {
                ...,
                "clicked": {
                    /* Привязывает к событию кнопки clicked отправку кастомного запроса usr.OpenUsrTestPageRequest. */
                    "request": "usr.OpenUsrTestPageRequest"
                }
            },
            ...
        }
    ]/**SCHEMA_VIEW_CONFIG_DIFF*/,
    
  3. В секции handlers добавьте реализацию обработчика пользовательского запроса usr.OpenUsrTestPageRequest.

    1. Получите экземпляр singleton-сервиса открытия страниц sdk.HandlerChainService.
    2. Отправьте системный запрос crt.OpenPageRequest, который выполняет открытие страницы StudioHomePage.
    Секция handlers
    handlers: /**SCHEMA_HANDLERS*/[
        {
            request: "usr.OpenUsrTestPageRequest",
            /* Реализация обработчика пользовательского запроса. */
            handler: async (request, next) => {
                /* Получает экземпляр singleton-сервиса открытия страниц. */
                const handlerChain = sdk.HandlerChainService.instance;
                /* Отправляет системный запрос crt.OpenPageRequest, который выполняет открытие указанной Freedom UI страницы. */
                await handlerChain.process({
                    type: 'crt.OpenPageRequest',
                    schemaName: 'StudioHomePage'
                });
                /* Вызывает следующий обработчик, если он присутствует, и возвращаем его результат. */
                return next?.handle(request);
            }
        }
    ] /**SCHEMA_HANDLERS*/,
    
    Полный исходный код схемы страницы
  4. На панели инструментов дизайнера клиентского модуля нажмите Сохранить (Save).

Результат выполнения примера 

Чтобы посмотреть результат выполнения примера:

  1. Перейдите на страницу приложения Handler Chain Service и нажмите Запустить приложение (Run app).
  2. На панели инструментов приложения Handler Chain Service нажмите Добавить (New).
  3. На странице записи пользовательского раздела Handler Chain Service нажмите Открыть страницу (Open page).

В результате выполнения примера открывается Freedom UI страница StudioHomePage.