Histórico da Página

...

Painel

title	Browse

Expandir

title	Legendas / Status

Todas as legendas ou status utilizados em um Browse devem seguir seguintes orientações:

Alinhamento a esquerda da tabela;
Utilizar preferencialmente o formato “labels”;
Evitar legendas/status compridos
- Utilização de tooltip para detalhar o status, caso necessario.
Tamanho do label fixo, considerando o texto de maior comprimento.

Expandir

title	Colunas

As colunas de um browse, devem seguir a mesma formatação e nome do Protheus.

• Títulos de campos utilizar do dicionário SX3

• Ordenação, lista de campos da SX3

Expandir

title	Busca / Filtro Avançado

Foi definido que para a opção de filtro avançado deve ser utilizado o padrão de slide, conforme modelo proposto abaixo:

Expandir

title	Posicionamento- Botões e filtro

Os botões de um browser que definem as ações iniciais, posiciona-se a esquerda seguido de um filtro com a opção de busca avançada.

Um Browser que não tenha em suas definições iniciais botões porem apresenta a opção de busca e busca avançada alinhamos junto ao titulo.
Os botões posicionado no footer (rodapé) alinhar a direita e caso tenha muitas opções utilizar dropdown com ações relacionadas porem não colocar todas as ações da tela em um único para não perder o dinamismo da tela.

Referencias:

Expandir

title	Cores

Quando for necessário definir alguma cor manualmente através de algum componente, card ou gráfico. Deverão ser priorizadas as cores padrão do PO UI que são:

Image Added

Para rotinas onde haja uma necessidade maior de cores ou variações de tonalidade poderá ser utilizadas as cores padronizadas no método GetColorChart da classe CoreDash, conforme detalhamento da classe. Caso haja a necessidade de um número maior de cores, deverá ser alinhado previamente e incluídas as novas cores na paleta de cores abaixo para utilização de todo o BackOffice.

Expandir

title	GetColorChart()

Sintaxe:

CoreDash():GetColorChart()

Descrição:

Método responsável por retornar em um array todas as cores padronizadas para uso de gráficos DASH.

Se for passado ao metodo o ID da cor, será retornado somente a cor solicitada.

CoreDash():GetColorChart(X);

Onde X é o ID da cor solicitada.

Parâmetros:

Cor (Variável)	Descrição da Cor	ID	Código RGBA	Posição Array	Exemplo Cor
cGreenDk	Verde Escuro	1	rgba( 0,178,142, 1)	aArray[1][3]	Image Added
cGreenLht	Verde Claro	2	rgba( 0,201,161, 1)	aArray[2][3]	Image Added
cRedDk	Vermelho Escuro	3	rgba(198, 72, 64, 1)	aArray[3][3]	Image Added
cRedLht	Vermelho Claro	4	rgba(227, 73, 64, 1)	aArray[4][3]	Image Added
cYellDk	Amarelo Escuro	5	rgba(252,203, 76, 1)	aArray[5][3]	Image Added
cYellLht	Amarelo Claro	6	rgba(255,212,100, 1)	aArray[6][3]	Image Added
cOrangeDk	Laranja Escuro	7	rgba(234,155, 62, 1)	aArray[7][3]	Image Added
cOrangeLht	Laranja Claro	8	rgba(255,162, 54, 1)	aArray[8][3]	Image Added
cBlueDk	Azul Escuro	9	rgba( 0,120,255, 1)	aArray[9][3]	Image Added
cBlueLht	Azul Claro	10	rgba( 50,165,255, 1)	aArray[10][3]	Image Added
cGreyDk	Cinza Escuro	11	rgba(192,192,192, 1)	aArray[11][3]	Image Added
cGreyLht	Cinza Claro	12	rgba(200,200,210, 1)	aArray[12][3]	Image Added
cPurpleDk	Roxo Escuro	13	rgba(128, 0,128, 1)	aArray[13][3]	Image Added
cPurpleLht	Roxo Claro	14	rgba(185, 35,185, 1)	aArray[14][3]	Image Added
cBrownDk	Marron Escuro	15	rgba(128, 0, 0, 1)	aArray[15][3]	Image Added
cBrownLht	Marron Claro	16	rgba(160, 80, 40, 1)	aArray[16][3]	Image Added
cFuchsiaDk	Pink Escuro	17	rgba(255, 0,255, 1)	aArray[17][3]	Image Added
cFuchsiaLht	Pink Claro	18	rgba(255,120,255, 1)	aArray[18][3]	Image Added
cMnightBlue	Azul Meia Noite	19	rgba( 25, 25,112, 1)	aArray[19][3]	Image Added
cMediumBlue	Azul Médio	20	rgba( 0, 0,205, 1)	aArray[20][3]	Image Added
cDGreen	Verde	21	rgba( 0,100, 0, 1)	aArray[21][3]	Image Added
cFGreen	Verde Floresta	22	rgba( 34,139, 34, 1)	aArray[22][3]	Image Added
cGreenYel	Verde Limão	23	rgba(173,255, 47, 1)	aArray[23][3]	Image Added
cSalmon	Salmão	24	rgba(250,128,114, 1)	aArray[24][3]	Image Added
cTan	Rosa Queimado	25	rgba(210,180,140, 1)	aArray[25][3]	Image Added
cWheat	Rosa Trigo	26	rgba(245,222,179, 1)	aArray[26][3]	Image Added
cSlateGray	Cinza Ardósia	27	rgba(112,128,144, 1)	aArray[27][3]	Image Added
cMistyRose	Rosa Claro	28	rgba(255,228,225, 1)	aArray[28][3]	Image Added