Mudanças entre as edições de "Cadastro de Layouts"
(2 revisões intermediárias pelo mesmo usuário não estão sendo mostradas) | |||
Linha 1: | Linha 1: | ||
− | == | + | ==Gerenciamento== |
Para acessar a tela de gerenciamento dos layouts, basta acessar o menu “Layouts”. | Para acessar a tela de gerenciamento dos layouts, basta acessar o menu “Layouts”. | ||
Linha 10: | Linha 10: | ||
Clicando no nome do layout é possível editar os itens já cadastrados. | Clicando no nome do layout é possível editar os itens já cadastrados. | ||
− | == | + | ==Cadastro/Edição== |
Ao clicar no botão adicionar ou no nome do layout na listagem, será exibida a tela de cadastro/edição. | Ao clicar no botão adicionar ou no nome do layout na listagem, será exibida a tela de cadastro/edição. | ||
Linha 27: | Linha 27: | ||
Botão para cancelar o cadastro/edição e voltar para a listagem de layouts. | Botão para cancelar o cadastro/edição e voltar para a listagem de layouts. | ||
− | == | + | ==Padrão do HTML== |
O Html devará começar com a tag html <div>, podendo ou não possuir uma classe associado a ela. | O Html devará começar com a tag html <div>, podendo ou não possuir uma classe associado a ela. | ||
− | + | <syntaxhighlight lang="html" line="1" > | |
<div class="my-1-layout"> </div> | <div class="my-1-layout"> </div> | ||
− | + | </syntaxhighlight> | |
A div aonde o indicador será exibido deverá possuir o atributo id, onde o id deverá ser o Id do indicador na tabela “Indicator”. Este id poderá também ser identificado na área de configurações do indicador (Menu Indicadores) ao lado do nome do indicador. Necessariamente, o indicador deve ser vinculado com o painel antes de ser utilizador o layout personalizado. | A div aonde o indicador será exibido deverá possuir o atributo id, onde o id deverá ser o Id do indicador na tabela “Indicator”. Este id poderá também ser identificado na área de configurações do indicador (Menu Indicadores) ao lado do nome do indicador. Necessariamente, o indicador deve ser vinculado com o painel antes de ser utilizador o layout personalizado. | ||
Linha 40: | Linha 40: | ||
<syntaxhighlight lang="html" line="1" > | <syntaxhighlight lang="html" line="1" > | ||
<div class="my-layout1"> | <div class="my-layout1"> | ||
− | <div class="mL-tab-main"> | + | <div class="mL-tab-main"> |
− | <h1>Meu layout</h1> | + | <h1>Meu layout</h1> |
− | <div class="mL-container"> | + | <div class="mL-container"> |
− | + | <div class="myClass" id="1"></div> | |
− | <div class="myClass" id="2"></div> | + | <div class="myClass" id="2"></div> |
− | <div class="myClass" id="6"></div> | + | <div class="myClass" id="6"></div> |
− | <div class="myClass" id="15"></div> | + | <div class="myClass" id="15"></div> |
− | </div> | + | </div> |
− | </div> | + | </div> |
</div> | </div> | ||
</syntaxhighlight> | </syntaxhighlight> | ||
+ | |||
+ | == Página Inicial == | ||
+ | |||
+ | [[InfoCenter]] |
Edição atual tal como às 12h09min de 5 de janeiro de 2017
Gerenciamento
Para acessar a tela de gerenciamento dos layouts, basta acessar o menu “Layouts”.
Dentro da página existe uma listagem de todos os layouts cadastrados.
Nesta tela é possível o cadastro de novos layouts através do botão de adicionar que redirecionará para o formulário de cadastro.
Na listagem possui o ícone de exclusão que excluirá o layout desejado.
Clicando no nome do layout é possível editar os itens já cadastrados.
Cadastro/Edição
Ao clicar no botão adicionar ou no nome do layout na listagem, será exibida a tela de cadastro/edição.
Nesta tela é possível definir um nome para o layout e os arquivos que farão parte dele.
Extensões de arquivos suportados para upload: .css, .html e .js.
Ao ser escolhido o arquivo, temos as opções disponíveis na grid:
- Trocar opção para substituir o arquivo escolhido
- Excluir opção para excluir o arquivo escolhido
- Página principal: opção para definir qual será o primeiro arquivo html a ser carregado no painel (para caso de layouts que possuam n arquivos html).
Botão para salvar o cadastro/edição.
Botão para cancelar o cadastro/edição e voltar para a listagem de layouts.
Padrão do HTML
O Html devará começar com a tag html1 <div class="my-1-layout"> </div>
A div aonde o indicador será exibido deverá possuir o atributo id, onde o id deverá ser o Id do indicador na tabela “Indicator”. Este id poderá também ser identificado na área de configurações do indicador (Menu Indicadores) ao lado do nome do indicador. Necessariamente, o indicador deve ser vinculado com o painel antes de ser utilizador o layout personalizado.
Importante: O layout não poderá conter mais de uma div com o mesmo id (não repetir o mesmo indicador no mesmo layout).
Segue abaixo um exemplo de layout .html:
1 <div class="my-layout1">
2 <div class="mL-tab-main">
3 <h1>Meu layout</h1>
4 <div class="mL-container">
5 <div class="myClass" id="1"></div>
6 <div class="myClass" id="2"></div>
7 <div class="myClass" id="6"></div>
8 <div class="myClass" id="15"></div>
9 </div>
10 </div>
11 </div>