Árvore de páginas

Versões comparadas

Chave

  • Esta linha foi adicionada.
  • Esta linha foi removida.
  • A formatação mudou.

Realiza a busca dos dados que serão visualizados no detalhamento de um monitor, o detalhe será apresentado em uma janela contendo cabeçalho, tags e tabelas.

Parâmetros

NomeDireçãoTipo Descrição
ttVisaoMonitorINPUTTemp-TableTemp-Table contendo as informações do monitor na visão em que está sendo carregado.
iPageINPUTIntegerNúmero da página que está sendo consultada (caso a paginação seja executada)
cSerieINPUTCharacterCaso o detalhe seja executado através do clique em um gráfico, a categoria clicada será enviada
cCategoryINPUTCharacterCaso o detalhe seja executado através do clique em um gráfico, a série clicada será enviada
detailJsonOutputOUTPUTJsonObjectJSON contendo as definições de leiaute e dados que devem ser apresentados na tela.
RowErrorsOUTPUTTemp-TableTemp-Table contendo erros ocorridos durante a execução da Api de negócio.

...

O objeto detailJsonOutput (JsonObject) será construído através da classe utilitária DetailBuilder, que utiliza as seguintes Temp-Tables e propridades:

ttColunaDetalhe

Temp-table que herda a estrutura do PoTableColumn (https://po-ui.io/documentation/po-table) e possui algumas propriedades adicionais, que servirão para aplicar a técnica de detalhamento de uma coluna da tabela (opcional). Ao clicar sobre uma coluna que possui detalhamento, será aberta uma tela HTML externa, que deverá estar preparada para verificar a LocalStorage do navegador e capturar os parâmetros que serão inclusos pelo painel de Monitoramento.

...

Bloco de código
titleExemplo de utilização
DetailBuilder:setColumns(INPUT TABLE ttColunaDetalhe).

Temp-table de Dados

Além da definição das colunas (descritos acima) é necessário ser setado a temp-table contendo os dados e que possua os campos (fields) correspondentes com o campo ttColunaDetalhe.propriedade informado conforme documentado acima, essa temp-table deverá ser definida pelo desenvolver do Api de negócio e pode possuir o nome da preferencia do desenvolver, abaixo segue um exemplo de definição e utilização:

Bloco de código
titleExemplo de utilização
DEFINE TEMP-TABLE ttDados
     FIELD it-codigo AS CHARACTER SERIALIZABLE-NAME 'itemCode'.

CREATE ttDados.
ASSIGN ttDados.it-codigo.
DetailBuilder:setItems(INPUT TABLE ttDados).


...

ttHeadersDetalhe (Opcional)

Temp-table contendo registros que serão renderizados no cabeçalho da Modal ou na tela de detalhe genérico na forma de um quadrado que pode ser estilizado através dos campos classe-header e estilo-header. Útil para criar um “cabeçalho” para contextualizar as informações que estão contidas na tabela.

...

Bloco de código
titleExemplo de utilização
DetailBuilder:setColumns(INPUT TABLE ttColunaDetalhe).


...

ttTags  (Opcional)

Temp-table contendo registros que se tornarão tags, que podem ser usadas para exibir dados adicionais. As tags ficarão abaixo dos headers, se existirem.

...

Bloco de código
titleExemplo de utilização
DetailBuilder:setTags(INPUT TABLE ttTags).


...

hasNext (Opcional)

Utilizado para paginação. Caso o valor dessa propriedade seja true, o botão Buscar mais resultados ficará habilitado, tanto na modal quanto na tela de detalhe genérico. (Valor padrão: false)

Bloco de código
titleExemplo de utilização
DetailBuilder:setHasNext(FALSE).

...

canExportXLS (Opcional)

Determina se o botão de Exportar para Planilha ficará habilitado na modal ou tela genérica de detalhe. A exportação é dinâmica e irá gerar um arquivo .csv com as definições de colunas e dados conforme o objeto retornado automaticamente.

Bloco de código
titleExemplo de utilização
DetailBuilder:setCanExportXLS(TRUE).


...

modalMaxWidth (Opcional)

Se o detalhamento for via modal, essa propriedade define o tamanho máximo que ela poderá assumir na tela

Bloco de código
titleExemplo de utilização
DetailBuilder:setModalMaxWidth("1440px").


...

Exemplo de código

Depois de criar as temp-tables necessárias na aplicação, utilizamos a classe DetailBuilder para gerar o janela de Detalhe, conforme abaixo:

Bloco de código
titleExemplo Api de Negócio
linenumberstrue
collapsetrue
BLOCK-LEVEL ON ERROR UNDO, THROW.
 
USING PROGRESS.json.*.
USING PROGRESS.json.ObjectModel.*.
USING cdp.services.gestaoavista.*.   //A classe ChartBuilderDetailBuilder está definida aqui.
 
{method/dbotterr.i}
{cdp/services/gestaoavista/builder-utils.i}
{cdp/services/gestaoavista/monitor-utils.i}

FUNCTION fn-has-row-errors RETURNS LOGICAL ():
    FOR EACH RowErrors 
        WHERE UPPER(RowErrors.ErrorType) = 'INTERNAL':U:
        DELETE RowErrors. 
    END.

    RETURN CAN-FIND(FIRST RowErrors 
        WHERE UPPER(RowErrors.ErrorSubType) = 'ERROR':U).
    
END FUNCTION.   

PROCEDURE pi-get-monitor-data-detail: // O nome da procedure de detalhe sempre precisa ser esse
    DEFINE INPUT  PARAM TABLE FOR ttVisaoMonitor.
    DEFINE INPUT  PARAM iPage            AS INTEGER    NO-UNDO.
    DEFINE INPUT  PARAM cSerie           AS CHARACTER  NO-UNDO.
    DEFINE INPUT  PARAM cCategory        AS CHARACTER  NO-UNDO.
    DEFINE OUTPUT PARAM detailJsonOutput AS JsonObject NO-UNDO.
    DEFINE OUTPUT PARAM TABLE FOR RowErrors.
    
    DEFINE VARIABLE DetailBuilder  AS DetailBuilder  NO-UNDO.   
    
    DetailBuilder = NEW DetailBuilder(). // Classe utilitária que ajudará na montagem do objeto de detalhe
    
    FIND FIRST ttVisaoMonitor.

    DetailBuilder:setHeaders(INPUT TABLE ttHeadersDetalhe). /* Opcionalmente, também podemos montar cabeçalhos (headers) para a janela de detalhe */
    DetailBuilder:setTags(INPUT TABLE ttTags). /* Opcionalmente, também podemos incluir tags para adicionar informações complementares na janela de detalhe */  
    DetailBuilder:setColumns(INPUT TABLE ttColunaDetalhe). /* Setando as colunas que serão exibidas na janela de detalhe */
    DetailBuilder:setItems(JsonAPIUtils:convertTempTableToJsonArray(TEMP-TABLE ttDados:HANDLE, FALSE)). /* Setando os dados que serão apresentados nas colunas definidas na tabela do detalhe */ 
    /*
       Dica: O método convertTempTableToJsonArray transforma uma temp-table em um JsonArray. É necessário realizar essa conversão pois o DetailBuilder recebe os dados de negócio em formato de JsonArray.
    */
    
    /* Se a consulta for paginada e tiver mais resultados além dos que estão sendo retornados, deverá setar a variável 'hasNext' como TRUE. Desse modo o botão
    'Carregar mais resultados' ficará habilitado na janela de detalhe para que o usuário possa requisitar a próxima página. Recomendamos utilizar paginação
    caso exista a possibilidade da consulta demorar mais que um minuto para ser realizada */
    DetailBuilder:setHasNext(FALSE).      
    DetailBuilder:setCanExportXLS(TRUE). // Determina se o botão de exportação para planilha (formato CSV) ficará habilitado (TRUE) ou não (FALSE)
    DetailBuilder:setModalMaxWidth("1440px"). // Tamanho máximo de largura que a janela de detalhe poderá possuir
    
    ASSIGN detailJsonOutput = DetailBuilder:createDetail(). //Gera o objeto de detalhe
    
    /* A temp-table RowErrors pode ser utilizada para retornar mensagens de erro, caso necessário:
        
        CREATE RowErrors.
        ASSIGN RowErrors.ErrorNumber = 17006
               RowErrors.ErrorDescription = "ERRO DE EXEMPLO"
               RowErrors.ErrorSubType = "ERROR".
    */


    CATCH eSysError AS Progress.Lang.Error:
        CREATE RowErrors.
        ASSIGN RowErrors.ErrorNumber = 17006
               RowErrors.ErrorDescription = eSysError:getMessage(1)
               RowErrors.ErrorSubType = "ERROR".
    END.
    FINALLY: 
        IF fn-has-row-errors() THEN DO:
            UNDO, RETURN 'NOK':U.
        END.
    END FINALLY.

END PROCEDURE.

...