Histórico da Página
...
Informações | ||
---|---|---|
| ||
Neste guia vamos considerar que o monitor foi criado conforme anteriormente indicado neste artigo, com suporte para Gráfico e Texto. |
Exemplo de código
Depois de criar as temp-tables necessárias na aplicação, utilizamos a classe ChartBuilder para gerar o gráfico, conforme abaixo:
Bloco de código | ||||||
---|---|---|---|---|---|---|
| ||||||
BLOCK-LEVEL ON ERROR UNDO, THROW.
USING PROGRESS.json.*.
USING PROGRESS.json.ObjectModel.*.
USING cdp.services.gestaoavista.*. //A classe ChartBuilder 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-chart:
DEFINE INPUT PARAMETER TABLE FOR ttVisaoMonitor.
DEFINE OUTPUT PARAMETER monitorJsonOutput AS JsonObject.
DEFINE OUTPUT PARAMETER TABLE FOR RowErrors.
DEFINE VARIABLE ChartBuilder AS ChartBuilder NO-UNDO.
/* Instanciar a classe passando como parâmetro a ttVisaoMonitor, que contém as informações do monitor e visão que estão sendo processados nesse instante. */
ChartBuilder = NEW ChartBuilder(INPUT TABLE ttVisaoMonitor).
/* Depois que todas as entidades estão criadas, basta setá-las no objeto ChartBuilder */
ChartBuilder:setTags(INPUT TABLE ttTags).
ChartBuilder:setCategories(INPUT TABLE ttCategorias).
ChartBuilder:setSeries(INPUT TABLE ttSeries).
ChartBuilder:setHeight(290).
/* Chama o método para criar e devolver o gráfico completo e guarda o resultado na variável monitorJsonOutput */
monitorJsonOutput = ChartBuilder:createChart().
DELETE OBJECT ChartBuilder.
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. |
O retorno da API de negócio deverá respeitar a estrutura conforme exemplo abaixo:
Bloco de código | ||||||
---|---|---|---|---|---|---|
| ||||||
{
"altura": 290,
"categorias": [
"Estados dos CTs"
],
"series": [
{
"color": "#F50031",
"data": 1.0,
"label": "Parado",
"tooltip": "",
"type": "pie"
},
{
"color": "#26BA41",
"data": 2.0,
"label": "Produzindo",
"tooltip": "",
"type": "pie"
},
{
"color": "#007acc",
"data": 1,
"label": "Setup",
"tooltip": "",
"type": "pie"
},
{
"color": "#A0B9BF",
"data": 3.0,
"label": "Ocioso",
"tooltip": "",
"type": "pie"
}
],
"tags": [
{
"colorTexto": "",
"icone": "po-icon-pin",
"texto": "Área: 002"
},
{
"colorTexto": "",
"icone": "po-icon-manufacture",
"texto": "Produzido: 8,0000"
},
{
"colorTexto": "",
"icone": "po-icon-document-filled",
"texto": "Previsto: 220,0000"
},
{
"colorTexto": "",
"icone": "po-icon-minus-circle",
"texto": "Refugado: 2,0000"
}
]
} |
O resultado em tela do retorno exemplificado acima será um monitor conforme abaixo:
...
02.1. IMPLEMENTANDO A PROCEDURE DE MODO GRÁFICO
02.2. IMPLEMENTANDO A PROCEDURE DE MODO TEXTO
02.3. IMPLEMENTANDO A PROCEDURE DE MODO DETALHE
Visão Geral
Import HTML Content
Conteúdo das Ferramentas
Tarefas