Histórico da Página
...
- API Rest desenvolvida no útlimo padrão divulgado pelo Framework;
- API Rest fazer uso da include "utp/ut-api";
- Utilização do Framework PO-UI na última versão disponível (v2.4.0);
- Utilização do Framework Tomcat Datasul;
03. TÉCNICAS
Técnica Back-End Progress:
Introdução:
A técnica Back-End Progress se divide basicamente em três partes:
- Construção de API Rest para tela customizada.
- Cadastro de Programa / EPC;
- Includes para chamada UPC na API Rest;
- Desenvolvimento da UPC;
...
Construção de API REST para tela customizada:
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.
Com isto alteramos a include "utp/ut-api" que já encontra-se na maioria das API's REST para identificar se a API em questão possuí uma EPC cadastrada.
Includes para chamada UPC na API Rest:
HTML construída em PO-UI, necessitamos que o Back-End nos retorne qual o metadado e os valores da tela em questão através de uma API Rest.
Sendo assim essa API deve conter no mínimo dois endpoints básicos:
- Endpoint que retornará o metadados da tela;
- Endpoint para retornar os valores da tela;
Cadastro de Programa / EPC:
Tendo criado a API REST que retorna os dados básicos para a tela, partimos para o segundo o passo, que é preparação da API para customização.
Esta API 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.
Devido a alteração que fizemos na include "utp/ut-api", a mesma identificará que a API em questão possuí uma UPC cadastrada.A
Informações | ||
---|---|---|
| ||
IMPORTANTE: A UPC para APIs REST possui um formato diferenciado das UPCs Padrões e de Ponto Estratégico, pois |
...
um dos parâmetros utilizados é um JsonObject. |
Includes para chamada UPC na API Rest:
Enfim para chamarmos um programa de customização, criamos uma include que fará esta chamada. Abaixo segue mais detalhes sobre esta include.
Ela encontra-se na pasta include e possui o nome i-epcrest.i, conforme o exemplo abaixo:
...
Informações | ||
---|---|---|
| ||
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. |
Pré-Processadores da include i-epcrest.i:
Abaixo temos a lista de pré-processadores que devem ser passados para a include i-epcrest.i:
...
Informações | ||
---|---|---|
| ||
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.*. |
Parâmetros recebidos na UPC da API REST:
Parametro | Tipo | Tipo de Dados | Descrição |
---|---|---|---|
pEndPoint | INPUT | CHARACTER | Contem o nome do endpoint que está sendo executado. |
pEvent | INPUT | CHARACTER | Contem o nome do evento que está sendo executado. |
pAPI | INPUT | CHARACTER | Contem o nome da API que está sendo executada. |
jsonIO | INPUT-OUTPUT | JSONObject | Contem o JSON com os dados (campos ou valores) que poderão ser customizados. |
Front-End PO-UI:
Introdução:
Para termos uma tela dinâmica do de acordo com o que o Back-End retorna precisamos utilizar os componentes dinâmicos do PO-UI sendo eles:
Componentes:
- Dynamic-Form (https://po-ui.io/documentation/po-dynamic-form);
- Dynamic-View (https://po-ui.io/documentation/po-dynamic-view);
...
04. EXEMPLO DE UTILIZAÇÃO
Back-End Progress
Primeiramente temos que cadastrar a API REST no cadastro de programas (MEN012AA) e também especificar a UPC a ser utilizada, conforme o exemplo abaixo:
...
Bloco de código | ||
---|---|---|
| ||
Busca do METADADOS onde foram adicionados os novos campos cod_usuario e nom_usuario: GET - http://localhost:8180/dts/datasul-rest/resources/prg/trn/v1/idiomas/metadados "items": [ { "visible": true, "property": "cod_idioma", "disabled": false, "label": "Idioma", "type": "string" }, { "visible": true, "property": "des_idioma", "disabled": false, "label": "Descrição", "type": "string" }, { "visible": true, "property": "cod_idiom_padr", "disabled": false, "label": "Idioma Padrão", "type": "string" }, { "visible": true, "property": "cod_usuario", "disabled": false, "label": "Usuário", "type": "string" }, { "visible": true, "property": "nom_usuario", "disabled": false, "label": "Nome", "type": "string" } ] Busca dos dados onde foram adiconados novos valores: GET - http://localhost:8180/dts/datasul-rest/resources/prg/trn/v1/idiomas "items": [ { "codIdioma": "12345678", "desIdioma": "12345678901234567890", "cod_dialet": "Pt", "cod_usuario": "super", "nom_usuario": "Super" }, { "codIdioma": "ale", "desIdioma": "Alemão", "cod_dialet": "PT", "cod_usuario": "Manoel", "nom_usuario": "Manoel de Carvalho" }, { "codIdioma": "EN", "desIdioma": "Ingles", "cod_dialet": "PT", "cod_usuario": "Joao", "nom_usuario": "Joao da Silva" } ] |
Front-End PO-UI
Introdução:
Basicamente utilizamos o componente de Page-Dynamic-Detail para comunicar com o back-end através de duas APIS:
...