Navegar de e para uma página gerativa usando a API do cliente

Este artigo fornece exemplos de navegação até páginas generativas em aplicativos controlados por modelos usando o método navigateTo da API do cliente. Saiba como abrir páginas generativas embutidas ou em uma caixa de diálogo e como passar parâmetros de entrada, como uma ID de registro ou dados personalizados.

Observação

Esse método só tem suporte na Interface Unificada.

Localizar a ID da página

Cada um dos exemplos a seguir requer a ID da página de geração de destino. Para localizar a ID da página:

  1. Abra o aplicativo controlado por modelos que contém a página de geração no designer de aplicativos.
  2. Selecione a página de geração na lista de páginas.
  3. No painel de propriedades, copie o GUID mostrado no campo página Generativa.

Abrir uma página geradora inline sem parâmetros

Abre uma página generativa como uma exibição em linha de página inteira sem parâmetros de entrada.

var pageInput = {
    pageType: "generative",
    pageId: "<genPageID>"
};
var navigationOptions = {
    target: 1
};
Xrm.Navigation.navigateTo(pageInput, navigationOptions)
    .then(
        function () {
            // Called when page opens
        }
    ).catch(
        function (error) {
            // Handle error
        }
    );

Abrir uma página generativa em linha com o contexto de registro

Passa um recordId e entityName para a página gerativa, permitindo que ela carregue e exiba um registro específico. A página de geração de destino deve ser configurada para aceitar esses parâmetros.

var pageInput = {
    pageType: "generative",
    pageId: "<genPageID>",
    entityName: "account",
    recordId: "00aa00aa-bb11-cc22-dd33-44ee44ee44ee" // replace with actual record GUID
};
var navigationOptions = {
    target: 1
};
Xrm.Navigation.navigateTo(pageInput, navigationOptions)
    .then(
        function () {
            // Called when page opens
        }
    ).catch(
        function (error) {
            // Handle error
        }
    );

Abre uma página generativa em linha com dados personalizados

Passa um objeto data contendo pares chave-valor personalizados para a página generativa. A página de geração de destino deve ser configurada para aceitar esses parâmetros.

var pageInput = {
    pageType: "generative",
    pageId: "<genPageID>",
    data: { status: "active", category: "premium" }
};
var navigationOptions = {
    target: 1
};
Xrm.Navigation.navigateTo(pageInput, navigationOptions)
    .then(
        function () {
            // Called when page opens
        }
    ).catch(
        function (error) {
            // Handle error
        }
    );

Abrir uma página generativa como uma caixa de diálogo centralizada

Abre uma página generativa em uma caixa de diálogo centralizada, passando o contexto do registro e os dados personalizados. Ajuste width e height conforme necessário.

var pageInput = {
    pageType: "generative",
    pageId: "<genPageID>",
    entityName: "account",
    recordId: "00aa00aa-bb11-cc22-dd33-44ee44ee44ee", // replace with actual record GUID
    data: { view: "summary" }
};
var navigationOptions = {
    target: 2,
    position: 1,
    width: { value: 70, unit: "%" },
    height: { value: 80, unit: "%" },
    title: "<dialog title>"
};
Xrm.Navigation.navigateTo(pageInput, navigationOptions)
    .then(
        function () {
            // Called when the dialog closes
        }
    ).catch(
        function (error) {
            // Handle error
        }
    );

Abrir uma página gerada como uma janela lateral de diálogo

Abre uma página generativa como uma caixa de diálogo lateral usando position: 2.

var pageInput = {
    pageType: "generative",
    pageId: "<genPageID>"
};
var navigationOptions = {
    target: 2,
    position: 2,
    width: { value: 500, unit: "px" },
    title: "<dialog title>"
};
Xrm.Navigation.navigateTo(pageInput, navigationOptions)
    .then(
        function () {
            // Called when the dialog closes
        }
    ).catch(
        function (error) {
            // Handle error
        }
    );

Sem suporte: abra uma página gerativa em um painel lateral

Importante

No momento, não há suporte para abrir uma página de geração usando Xrm.App.sidePanes.createPane() .

// Not supported — page content doesn't render
const pane = await Xrm.App.sidePanes.createPane({
    title: "My Generative Page",
    paneId: "GenPage",
    canClose: false,
    width: 400
});
pane.navigate({ pageType: "generative", pageId: "<genPageID>" });

Em vez disso, use um diálogo centralizado ou lateral via Xrm.Navigation.navigateTo.

Quando você navega de dentro de um componente de página gerativa, use (window as any).Xrm para acessar o objeto Xrm, já que o escopo do componente React não fornece acesso direto a ele.

const xrm = (window as any).Xrm;
xrm.Navigation.navigateTo({
    pageType: "generative",
    pageId: targetPageId,
    entityName: "account",
    recordId: selectedRecordId,
    data: { view: "summary" }
});

Observação

Ao navegar em aplicativos controlados por modelos, evite construir URLs brutas ou manipular window.location.

Você pode navegar até uma página gerativa construindo uma URL com a seguinte estrutura:

https://<your-org>.crm.dynamics.com/main.aspx?appid={app-id}&pagetype=genux&id={page-id}&recordid={recordId}&entityname={entityName}&data={encoded-json}

Você deve codificar o parâmetro data em URL como JSON. Por exemplo, para passar um objeto de filtro personalizado:

https://<your-org>.crm.dynamics.com/main.aspx?appid={app-id}&pagetype=genux&id={page-id}&data=%7B%22status%22%3A%22active%22%7D

Você deve configurar a página de geração de destino para aceitar esses parâmetros.