O Objetivo desta técnica é apresentar uma forma de customizar as telas HTML que foram construídas utilizando o Form Dinâmica do PO-UI.
No PO-UI, a Form Dinâmica trabalha recebendo uma lista de campos que serão apresentados em tela, bem como uma outra lista contendo os dados que serão apresentados nestes campos.
Para que possamos customizar uma tela, teremos que ter uma API REST que possa receber as informações do HTML, e esta API deverá permitir a utilização da técnica de EPC. A API REST para ser customizada, deverá ser cadastrada no cadastro de programas (MEN012AA), onde poderemos também especificar a UPC que será utilizada.
A UPC para APIs REST possui um formato diferenciado das UPCs Padrões e de Ponto Estratégico, pois ela passa como um dos parâmetros um JsonObject. Ela encontra-se na pasta include e possui o nome i-epcrest.i, conforme o exemplo abaixo:
{include/i-epcrest.i &endpoint=<nome_end_point> &event=<nome_do_evento> &jsonVar=<variavel_jsonObject_com_conteudo>} |
IMPORTANTE: Não é permitido misturar tipos diferentes de UPCs no mesmo programa, pois as assinaturas são incompatíveis e poderão ocorrer erros de parâmetros. |
Abaixo temos a lista de preprocessadores que devem ser passados para a include i-epcrest.i:
| Preprocessador | Descrição |
|---|---|
| endpoint | Especifica o endpoint que esta sendo chamado pelo HTML. Uma API REST deve possuir 1 ou mais endpoints. |
| event | É o nome do evento que esta ocorrendo antes de chamar a UPC. Exemplo: beforeCreate, getAll, getMetaData, etc. |
| jsonVar | É a variavel do tipo JsonObject que será passada como INPUT-OUTPUT para a UPC. |
IMPORTANTE: Todas as UPCs de API REST deverão importar os seguintes pacotes: USING PROGRESS.json.*. USING PROGRESS.json.ObjectModel.*. USING com.totvs.framework.api.*. |
Abaixo temos um exemplo de partes de uma API REST, que possui 2 procedures, a procedure pGetAll para tratar as chamadas GET dos dados a serem apresentados e a procedure pGetMetaData que trata os GETs para a criacção de novos campos.
PROCEDURE pGetAll:
DEFINE INPUT PARAMETER oJsonInput AS JsonObject NO-UNDO.
DEFINE OUTPUT PARAMETER oJsonOutput AS JsonObject NO-UNDO.
...
oIdiomas = JsonAPIUtils:convertTempTableToJsonArray(TEMP-TABLE ttIdiomas:HANDLE).
oObj = new JsonObject().
oObj:add('root', oIdiomas).
/* realiza a chamada da UPC Progress */
{include/i-epcrest.i &endpoint=getAll &event=getAll &jsonVar=oObj}
oIdiomas = oObj:getJsonArray('root').
oResponse = NEW JsonAPIResponse(oIdiomas).
oJsonOutput = oResponse:createJsonResponse().
...
END PROCEDURE.
PROCEDURE pGetMetaData:
DEFINE INPUT PARAMETER oJsonInput AS JsonObject NO-UNDO.
DEFINE OUTPUT PARAMETER oJsonOutput AS JsonObject NO-UNDO.
...
// monsta-se a lista de campos que aparecerão em tela
oObj = new JsonObject().
oObj:add('root', jAList).
/* realiza a chamada da UPC Progress */
{include/i-epcrest.i &endpoint=getMetaData &event=getMetaData &jsonVar=oObj}
oIdiomas = oObj:getJsonArray('root').
oResponse = NEW JsonAPIResponse(oIdiomas).
oJsonOutput = oResponse:createJsonResponse().
...
END PROCEDURE. |
Outras Ações / Ações relacionadas
| Ação | Descrição |
|---|---|
| Inclua a ação | Inclua a descrição relacionada |
| Inclua a ação | Inclua a descrição relacionada |
| Inclua a ação | Inclua a descrição relacionada |
Principais Campos e Parâmetros
| Campo | Descrição |
|---|---|
| Inclua o campo | Inclua a descrição relacionada |
| Inclua o campo | Inclua a descrição relacionada |
| Inclua o campo | Inclua a descrição relacionada |
<!-- esconder o menu -->
<style>
div.theme-default .ia-splitter #main {
margin-left: 0px;
}
.ia-fixed-sidebar, .ia-splitter-left {
display: none;
}
#main {
padding-left: 10px;
padding-right: 10px;
overflow-x: hidden;
}
.aui-header-primary .aui-nav, .aui-page-panel {
margin-left: 0px !important;
}
.aui-header-primary .aui-nav {
margin-left: 0px !important;
}
</style>
|