Documentação
VMTECH.Report Detalhada
O json de
entrada para que você tenha um retorno de json, xlsx ou pdf, contém a seguinte
estrutura básica:
{
"token":"123456789",
"type":"pdf",
"fields":[
],
"data":[
],
"report":{
"orientation": "P",
"pagesize": "Letter",
"margins": {
"left": 10,
"top":
15,
"right": 10
},
"rowh":12,
"header":{
"titles":[
],
"columns":[
],
"bgcolor":{
"red":144,
"green":144,
"blue":144
},
"size":9,
"font":"arial",
"style":"BI",
"align":"L",
"grid":
[
],
"line":1
},
"detail":{
"columns":[
],
"size":10,
"font":"courier",
"align":"L",
"grid":
[
],
"zebracolor":{
"red":200,
"green":200,
"blue":200
}
},
"footer":{
"line":1,
"content":[
]
},
"formulas":[
],
"init":[
],
"content":[
]
}
}
É sua área
em nosso servidor para a realização do relatório ou gráfico.
O retorno
que você está solicitando para o relatório, json, xlsx, pdf.
São os
campos de sua tabela de dados que será gerado o Report,
poderá ser acrescentado também os campos calculados para uma totalização de
algum campo, por exemplo. Podendo conter a quantidade de campos calculados
necessários.
Exemplo:
"fields":[
{
"name":"DATE"
},
{
"name":"CATEGORY"
},
{
"name":"AMOUNT"
},
{
"name":"T", Campo calculado
"formula":"(T+AMOUNT)"
},
{
"name":"TOTAL", Campo calculado
"formula":"AMOUNT/(100-amount/100)"
},
]
Tabela de
dados, onde irá trazer os dados contendo os campos definidos no "fields", com EXCEÇÃO dos campos calculados. Os campos
calculados serão criados.
Exemplo:
"data" : [
{
"DATE": "2017-10-11",
"CATEGORY":
"Communications",
"AMOUNT": 120
},
{
"DATE": "2018-12-30
10:20:30",
"CATEGORY":
"Service",
"AMOUNT": 290
},
]
Retorno em
PDF. Obrigatoriamente é necessário criar o layout na propriedade Report. (O
painel da VMTECH.Report está sendo
desenvolvido e será disponibilizado para todos os parceiros).
Layout do report = O
relatório pode ser PRÉ-DEFINIDO ou pode ser LIVRE;
LIVRE = Você pode criar o que for
necessário para seu relatório.
PRÉ-DEFINIDO = Teremos as propriedades:
·
"header":
é o cabeçalho do relatório. "titles" é onde
definirá o texto, título, "columns" é o
título da coluna de dados;
·
"detail": é o corpo do relatório. Você irá definir os
"columns" novamente, porém agora com o nome
do campo que irá utilizar com os dados que será impresso. Então, nesta
propriedade, poderá colocar os campos definidos em sua tabela e os campos
calculados que foi criado.
·
"footer": é o rodapé do relatório.
·
"groupheader" e "groupfooter".
O group existe para realizar agrupamentos, por
exemplo, Cliente 1 comprou os produtos A, B, C, Cliente 2 comprou os produtos
X, Y, Z. Neste caso, o "groupheader"
conterá as informações de cabeçalho antes de detalhar os dados do Cliente 1 no
corpo, e o "groupfooter" conterá o rodapé
deste agrupamento. Então, para cada quebra de cliente, poderá ter um "groupheader" e um "groupfooter".
·
"formulas":
fórmulas durante o relatório, elas possuem propriedades específicas para definir
qual fórmula você precisa, por exemplo, para realizar a totalização de vendas
do cliente no grupo, então a fórmula seria TotalG
(total do grupo) = TotalG + Total das Vendas, então
essa fórmula vai fazer o acúmulo do todas as vendas e será inserida a cada quebra de cliente,
você pode incluir uma função (que esterá na
documentação) ou qualquer expressão matemática.
·
"init": As variáveis que você cria no Report também pode ser inicializada com um determinado
valor. Se não for definido nada a variável sempre será inicializada no zero,
porém, se precisar iniciar a variável em um determinado valor, 200 por exemplo,
então a propriedade "init" existe para
colocar os valores iniciais de uma variável. O valor pode ser uma constante ou
um valor iniciado através de uma fórmula.
·
"content": Para os relatórios que não precisam utilizar
o "detail". Você poderá utilizar o "content" do Report para
escrever o que precisar, ele é livre. Sempre entre linhas e colunas. Então, se
precisar utilizar um "header", um "footer"
e escrever um conteúdo, mas não precisa utilizar um "detail"
(que é para detalhe, como colunar), está é a propriedade.
ATENÇÃO:
Você não pode utilizar o "detail" e o
"content" do report
juntos, pois um irá sobrescrever o outro.
Estrutura:
"report":{
"orientation":
"P/L" Portrait/Landscape
"pagesize":
"A3/A4/A5/Letter/Legal"
"margins":
{
"left": 0,
"top": 5,
"right": 0
}
"rowh":12 Altura
padrão da linha
"header":{
"titles": Texto do cabeçalho
"columns": Título da coluna
de dados
"bgcolor":{
Cor
de fundo da linha dos títulos das colunas
"red":0,
"green":0,
"blue":0
}
"size":9 Tamanho
da fonte
"font":"arial"
arial/helvetica/symbol/zapfdingbats/courier
"style":"BI" "/B/I/BI" Bold/Italic/BoldItalic
"align":"L" "L/R/C/T/B/M" Left/Right/Center/Top/Bottom/Middle
"grid": Largura
de cada coluna, com máximo de tamanho 12
"line":1 Altura
da linha separadora do cabeçalho
}
"detail":{ Detalhe do relatório
"columns": Componentes como text, image, barcode e qrcode
"size":10
"font":"courier",
"align":"L",
"grid":
"zebracolor":{ Cor do zebrado
"red":200,
"green":200,
"blue":200
}
}
"groupheader":{
"reset": Variáveis
para reiniciar após groupheader
"fields": Campos
para a quebra do grupo
"line":1,
"newpage":true/false Nova página antes de imprimir groupheader
"content": Componentes
como text, image, barcode e qrcode
},
"groupfooter":{
"reset": Variáveis
para reiniciar após groupfooter
"fields": Campos
para a quebra do grupo
"line":1 Altura
da linha após groupfooter
"lineb":3, Altura
da linha antes groupfooter
"newpage":true/false
"content": Componentes
}
"footer":{
"line":1,
"content": Componentes
como text, image, barcode e qrcode
},
"formulas": Fórmulas
a serem utilizadas no report
"init": Inicialização
de variáveis
"content": Componentes
como text, image, barcode e qrcode.
Exemplo:
"report":{
"orientation": "P",
"pagesize": "Letter",
"margins": {
"left": 10,
"top":
15,
"right": 10
},
"rowh":12,
"header":{
"titles":[
{
"rowh":12,
"components":[
{
"type":"text",
"col":12,
"value":"’Relatório de Nota Fiscal’",
"size":12,
"font":"arial",
"style":"BI",
"align":"C"
}
]
}
],
"columns":[
"QRCODE",
"Nro",
"Data",
"Cliente",
"Total",
"Subtotal"
],
"bgcolor":{
"red":144,
"green":144,
"blue":144
},
"size":9,
"font":"arial",
"style":"BI",
"align":"L",
"grid":
[
1,
1, 2, 6, 1, 1
],
"line":1
},
"detail":{
"columns":[
{
"type":"qrcode",
"col":1,
"value":"qrcode",
"center":false,
"percent":70
},
"sprintf(‘#0.0f‘,nronota)",
"format(’02-Jan-2006‘,data)",
"cliente",
{
"type":"text",
"col":2,
"value":"sprintf(‘#0.2f‘,total)",
"size":10,
"font":"arial",
"align":"R"
},
{
"type":"text",
"col":2,
"value":"sprintf(‘#0.2f‘,subtotal)",
"size":10,
"font":"arial",
"style":"BI",
"align":"R"
}
],
"size":10,
"font":"courier",
"align":"L",
"grid":
[
1,
1, 2, 4, 2, 2
],
"zebracolor":{
"red":200,
"green":200,
"blue":200
}
},
"footer":{
"line":1,
"content":[
{
"rowh":10,
"components":[
{
"type":"text",
"col":12,
"value":"’Total geral: ‘+sprintf(‘#0.2f‘,tg)",
"size":10,
"font":"arial",
"style":"B",
"align":"R"
}
]
},
{
"rowh":6,
"components":[
{
"type":"text",
"col":12,
"value":"’Página _PAGE_’",
"size":9,
"font":"arial",
"style":"B",
"align":"C"
}
]
}
]
},
"formulas":[
{
"name":"tg",
"formula":"tg+total"
}
],
"init":[
{
"name":"tg",
"value":10
}
]
}
}
São objetos
que irá utilizar para realizar impressão, desenhar linhas, novas páginas, etc.
Eles podem ser utilizados no cabeçalho, detalhe, groupheader,
groupfooter, footer e são
"type" text, image, qrcode e barcode.
1. "type":"text", no "value"
pode ser uma constante, variável ou campo, conseguindo misturar textos com
fórmulas ou expressões, no entanto os textos sempre precisam estar em ‘aspas
simples’
2. Área de impressão é quantidade de
colunas que você está utilizando e altura da linha, se uma imagem, por exemplo,
for menor que a área disponível irá fazer um stretch,
se for maior irá encolher para ocupar o espaço
3. "type":"barcode", para gerar código de barra, o "value" geralmente são numerações
Exemplo:
"rowh":20, Altura
da linha
"components":[
{
"type":"text"
"col": Quantidade de colunas que irá ocupar
"value": (1)
"size": Tamanho da fonte
"font": Fonte que irá utilizar
"style": Negrito, itálico
"align": Esquerda, direita,
top, bottom, center
}
{
"type":"image"
"col": Quantidade de colunas que irá ocupar
"value": Imagem na base 64
(apenas para imagem)
"center":true/false
"percent": Percentual de
ocupação da área para impressão (2)
}
{
"type":"qrcode"
"col": Quantidade de colunas que irá ocupar
"value": Link de um site,
por exemplo, para ser redirecionado ao fazer a leitura
"center":true/false
"percent": Percentual de
ocupação da área para impressão (2)
}
{
"type":"barcode"
"col": Quantidade de colunas que irá ocupar
"value": (3)
"center":true/false
"percent": Percentual de
ocupação da área para impressão (2)
}
]
Componentes extra para o Content Report
Lembrando que o Content
é para relatórios que não utilizam o Detail.
·
"border": tudo que for impresso na linha ficará entre
bordas
·
"bgcolor": cor do fundo da impressão
·
"line": para desenhar uma linha, quando for necessária
uma separação, o valor é a espessura da linha
·
"newpage": para forçar uma página antes que ela
termine, lembrando que a paginação é automática toda vez que é preenchido o
tamanho escolhido
Exemplo:
{
"border":true/false
}
{
"bgcolor":{
"red":200,
"green":200,
"blue":200
}
}
{
"line":1
}
{
"newpage":true/false
}
1. strlen(): Retorna comprimento de uma string
2. substr(text,start,len): Retorna parte de uma string
3. max(…): Retorna o maior valor de um conjunto
de dados
4. min(…): Retorna o menor valor de um conjunto
de dados
5. if(expression,true,false): Avalia expressão condicional e retorna
o valor de true ou false
6. avg(…): Retorna média aritmética de um
conjunto de dados
7. trunc(x): Retorna o valor inteiro de x
8. round(x): Retorna o número inteiro mais próximo
de x
9. abs(x): Retorna o valor absoluto de x
10. pow(x,y): Retorna x ** y, a base x exponencial de y
11. sqrt(x):
Retorna a raiz quadrada de x
12. mod(x): Retorna o resto de ponto flutuante de
x / y. A magnitude do resultado é menor que y e seu sinal concorda com o de x
13. sprintf(): Formata de acordo com um
especificador de formato e retorna a string
resultante
Exemplos:
%f default width,
default precision
%9f width 9, default precision
%.2f default width, precision 2
%9.2f width 9, precision 2
%9.f width 9, precision 0
14. lower(): Retorna string em
caixa baixa
15. upper(): Retorna string em caixa alta
16. contains(str,subs): Retorna true o false
17. count(str,subs): Retorna total de ocorrência de subs
em str
18. index(str,subs): Retorna o índice da primeira
instância de substr em str,
ou -1 se substr não estiver presente em str
19. repeat(str, count): Retorna uma nova string
consistindo de cópias de contagem da string str
20. replace(str,old,new,n): Retorna uma cópia da string str com as primeiras n instâncias não sobrepostas de old substituídas por new
21. title(): Retorna uma cópia da string com todas as letras Unicode que iniciam palavras
mapeadas para maiúsculas e minúsculas
22. trim(str,cutset): Retorna uma fatia da string str com todos os pontos de código Unicode à esquerda e à
direita contidos no cutset removidos
23. now(): Retorna date time no formato yyyy-mm-dd hh:nn:ss
24. format(layout,datetime): Retorna data formatada de acordo com o layout
fornecido
Layout
|
Formato
|
2006-01-02
|
yyyy-MM-dd
|
20060102
|
yyyyMMdd
|
January
02, 2006
|
MMMM
dd, yyyy
|
02
January 2006
|
dd
MMMM yyyy
|
02-Jan-2006
|
dd-MMM-yyyy
|
01/02/06
|
MM/dd/yy
|
01/02/2006
|
MM/dd/yyyy
|
010206
|
MMddyy
|
Jan-02-06
|
MMM-dd–yy
|
Jan-02-2006
|
MMM-dd–yyyy
|
06
|
Yy
|
Mon
|
EEE
|
Monday
|
EEEE
|
Jan-06
|
MMM-yy
|
15:04
|
HH:mm
|
15:04:05
|
HH:mm:ss
|
3:04
PM
|
K:mm
a
|
03:04:05
PM
|
KK:mm:ss
a
|
2006-01-02T15:04:05
|
yyyy-MM-dd T HH:mm:ss
|
2006-01-02T15:04:05-0700
|
yyyy-MM-dd T HH:mm:ssZ
|
2
Jan 2006 15:04
|
d
MMM yyyy HH:mm
|
2
Jan 2006 15:04:05
|
d
MMM yyyy HH:mm:ss
|
Mon,
2 Jan 2006 15:04:05 MST
|
EEE,
d MMM yyyy HH:mm:ss z
|
API
para Apresentação de Gráficos
{
"token":"",
"title":{
"text":"",
"subtitle":"",
"link":"",
"target":"",
"top":"",
"bottom":"",
"left":"",
"right":""
},
"legend":{
"left":"",
"top":"",
"right":"",
"bottom":""
},
"xAxis":[
{
"name":"",
"data":[
]
}
],
"yAxis":[
{
"name":""
}
],
"series":[
{
"name":"",
"data":[
]
}
],
"label":{
"show":true/false,
"color":"",
"position":""
}
}
Exemplo:
{
"token":"111111111",
"title":
{"text":"Bar","subtitle":"Subtitle","right": "40per"},
"legend":
{"right":"80per"},
"xAxis":
[{"name":"Nome do Produto","data":["Camisa","Jeans","Calças
de moletom","Meias","Jaquetas","Suéteres"]}],
"yAxis": [{"name":"Volume de vendas"}],
"series": [
{"name":"Marca
A","data":[36,27,20,26,28,12]},
{"name":"Marca
B","data":[39,18,34,20,33,40]}
],
"label":{
"show":true
}

{
"token":"",
"title":{
"text":"",
"subtitle":"",
"link":"",
"target":"",
"top":"",
"bottom":"",
"left":"",
"right":""
},
"legend":{
"left":"",
"top":"",
"right":"",
"bottom":""
},
"series":{
"":0,
},
"label":{
"show":true/false,
"color":"",
"position":""
}
}
Exemplo:
{
"token":"111111111",
"title":
{"text":"Pie","subtitle":"Subtitle"},
"series":{
"Camisa":
31,
"Jeans": 37,
"Calças de moletom":47,
"Meias":9,
"Jaquetas":31,
"Suéteres":18
},
"label":{
"show":true
}
}

{
"token":"",
"title":{
"text":"",
"subtitle":"",
"link":"",
"target":"",
"top":"",
"bottom":"",
"left":"",
"right":""
},
"legend":{
"left":"",
"top":"",
"right":"",
"bottom":""
},
"xAxis":[
{
"name":"",
"data":[
]
}
],
"yAxis":[
{
"name":""
}
],
"series":[
{
"name":"",
"data":[
]
}
],
"label":{
"show":true/false,
"color":"",
"position":""
}
}
Exemplo:
{
"token":"111111111",
"title":
{"text":"Line","subtitle":"Subtitle","right": "40per"},
"legend":
{"right":"80per"},
"xAxis":
[{"name":"Nome do Produto","data":["Camisa","Jeans","Calças
de moletom","Meias","Jaquetas","Suéteres"]}],
"yAxis": [{"name":"Volume de vendas"}],
"series": [
{"name":"Marca
A","data":[36,27,20,26,28,12]},
{"name":"Marca
B","data":[39,18,34,20,33,40]}
],
"label":{
"show":true
}
}

GRÁFICO DE BARRAS COM LINHAS
{
"token":"",
"title":{
"text":"",
"subtitle":"",
"link":"",
"target":"",
"top":"",
"bottom":"",
"left":"",
"right":""
},
"legend":{
"left":"",
"top":"",
"right":"",
"bottom":""
},
"xAxis":[
{
"name":"",
"data":[
]
}
],
"yAxis":[
{
"name":""
}
],
"series":[
{
"name":"",
"data":[
]
}
],
"label":{
"show":true/false,
"color":"",
"position":""
}
}
Exemplo:
{
"token":"111111111",
"title":
{"text":"Bar-Line","subtitle":"Overlap","right": "40per"},
"legend":
{"right":"80per"},
"xAxis":
[{"name":"Nome do Produto","data":["Camisa","Jeans","Calças
de moletom","Meias","Jaquetas","Suéteres"]}],
"yAxis": [{"name":"Volume de vendas"}],
"series": [
{"name":"Marca
A","data":[36,27,20,26,28,12]},
{"name":"Marca
B","data":[39,18,34,20,33,40]}
],
"label":{
"show":true
}
}

{
"token":"",
"title":{
"text":"",
"subtitle":"",
"link":"",
"target":"",
"top":"",
"bottom":"",
"left":"",
"right":"",
"textStyle":{"color":"","style":"","size":0}
},
"legend":{
"left":"",
"top":"",
"right":"",
"bottom":"",
"textStyle":{"color":"","style":"","size":0}
},
"series":[
{
"name":"",
"data":[
],
"itemStyle":{"color":"","borderColor":"","opacity":0.0},
"lineStyle":{"color":"","type":"","width":1,"opacity":0.0,"curveness":0},
"areaStyle":{"color":"","opacity":0.0}
}
],
"backgroundColor":
""
"with":"",
"height":""
}
Exemplo:
{
"token":"111111111",
"title":
{"text":"Radar","textStyle":{"color":"#eee"},"right":"center"},
"legend":
{"bottom":"5px","data":["Paraná","São Paulo","Rio
de Janeiro"],"textStyle":{"color":"#eee"}},
"radar":
{"indicator":[{"name":"AQI","max":300},{"name":"PM2.5","max":250},{"name":"PM10","max":300},{"name":"CO","max":5},{"name":"NO2","max":200},{"name":"SO2","max":100}],"shape":"circle","splitNumber":5,"splitArea":{"show":false},"splitLine":{"show":true,"lineStyle":{"opacity":0.1}}},
"series": [
{"name":"Paraná","data":[[55, 9, 56, 0.46, 18,
6],[25, 11, 21, 0.65, 34,
9]],"itemStyle":{"color":"#F9713C"},"lineStyle":{"width":1,"opacity":0.5},"areaStyle":{"opacity":0.1}},
{"name":"São
Paulo","data":[[26, 37, 27, 1.163, 27,
13],[85, 62, 71, 1.195, 60,
8]],"itemStyle":{"color":"#B3E4A1"},"lineStyle":{"width":2,"opacity":0.5},"areaStyle":{"opacity":0.1}},
{"name":"Rio
de Janeiro","data":[[91, 45, 125,
0.82, 34, 23],[65, 27, 78, 0.86, 45, 29]],"itemStyle":{"color":"rgb(238, 197,
102)"},"lineStyle":{"width":3,"opacity":0.5},"areaStyle":{"opacity":0.1}}
],
"backgroundColor":
"#161627"
}

{
"token":"",
"title":{
"text":"",
"subtitle":"",
"link":"",
"target":"",
"top":"",
"bottom":"",
"left":"",
"right":"",
"textStyle":{"color":"","style":"","size":0}
},
"legend":{
"left":"",
"top":"",
"right":"",
"bottom":"",
"textStyle":{"color":"","style":"","size":0}
},
"visualMap":{"calculable":true,"max":0,"range":[],"inRange":{"color":[]}},
"xAxis":
{"data":[]},
"yAxis":
{"data":[]},
"grid":
{"boxWidth":100,"boxHeight":100,"boxDepth":100},
"series":[
{
"name":"",
"data":[
]
}
],
"backgroundColor":
""
"with":"",
"height":""
}
Exemplo:
{
"token":"111111111",
"title":
{"text":"Bar3D"},
"visualMap":{"calculable":true,"max":30,"range":[0,30],"inRange":{"color":["#313695","#4575b4","#74add1","#abd9e9","#e0f3f8","#fee090","#fdae61","#f46d43","#d73027","#a50026"]}},
"xAxis":
{"data":["12a","1a","2a","3a","4a","5a","6a","7a","8a","9a","10a","11a","12p","1p","2p","3p","4p","5p","6p","7p","8p","9p","10p","11p"]},
"yAxis":
{"data":["Sábado","Sexta","Quinta","Quarta","Terça","Segunda","Domingo"]},
"grid":
{"boxWidth":200,"boxDepth":80},
"series": [
{
"name":"bar3d","data":[[0,0,5],[1,0,1],[2,0,0],[3,0,0],[4,0,0],[5,0,0],[6,0,0],[7,0,0],[8,0,0],[9,0,0],[10,0,0],[11,0,2],[12,0,4],[13,0,1],[14,0,1],[15,0,3],[16,0,4],[17,0,6],[18,0,4],[19,0,4],[20,0,3],[21,0,3],[22,0,2],[23,0,5],[0,1,7],[1,1,0],[2,1,0],[3,1,0],[4,1,0],[5,1,0],[6,1,0],[7,1,0],[8,1,0],[9,1,0],[10,1,5],[11,1,2],[12,1,2],[13,1,6],[14,1,9],[15,1,11],[16,1,6],[17,1,7],[18,1,8],[19,1,12],[20,1,5],[21,1,5],[22,1,7],[23,1,2],[0,2,1],[1,2,1],[2,2,0],[3,2,0],[4,2,0],[5,2,0],[6,2,0],[7,2,0],[8,2,0],[9,2,0],[10,2,3],[11,2,2],[12,2,1],[13,2,9],[14,2,8],[15,2,10],[16,2,6],[17,2,5],[18,2,5],[19,2,5],[20,2,7],[21,2,4],[22,2,2],[23,2,4],[0,3,7],[1,3,3],[2,3,0],[3,3,0],[4,3,0],[5,3,0],[6,3,0],[7,3,0],[8,3,1],[9,3,0],[10,3,5],[11,3,4],[12,3,7],[13,3,14],[14,3,13],[15,3,12],[16,3,9],[17,3,5],[18,3,5],[19,3,10],[20,3,6],[21,3,4],[22,3,4],[23,3,1],[0,4,1],[1,4,3],[2,4,0],[3,4,0],[4,4,0],[5,4,1],[6,4,0],[7,4,0],[8,4,0],[9,4,2],[10,4,4],[11,4,4],[12,4,2],[13,4,4],[14,4,4],[15,4,14],[16,4,12],[17,4,1],[18,4,8],[19,4,5],[20,4,3],[21,4,7],[22,4,3],[23,4,0],[0,5,2],[1,5,1],[2,5,0],[3,5,3],[4,5,0],[5,5,0],[6,5,0],[7,5,0],[8,5,2],[9,5,0],[10,5,4],[11,5,1],[12,5,5],[13,5,10],[14,5,5],[15,5,7],[16,5,11],[17,5,6],[18,5,0],[19,5,5],[20,5,3],[21,5,4],[22,5,2],[23,5,0],[0,6,1],[1,6,0],[2,6,0],[3,6,0],[4,6,0],[5,6,0],[6,6,0],[7,6,0],[8,6,0],[9,6,0],[10,6,1],[11,6,0],[12,6,2],[13,6,1],[14,6,3],[15,6,4],[16,6,0],[17,6,0],[18,6,0],[19,6,0],[20,6,1],[21,6,2],[22,6,2],[23,6,6]]
}
]
}
