positiva-navigation-plugin

Implementa um padrão de UX relacionado a navegação de uma aplicação @Positiva.

Tabela de conteúdo

1. Motivação
2. Dependências
3. Como importar
4. Como usar
5. Autor
6. Licença

Motivação

A navegação pela estrutura de uma aplicação ao ser definido se torna um padrão. Esse plugin implementa esse padrão, abstraindo ele do programador.

Dependências

npm i vuetify

Como importar

import PositivaNavigation from 'positiva-navigation-plugin';

Vue.use(PositivaNavigation);

Como usar

O plugin tem um component e alguns atributos globais

Componentes

<positiva-navigation></positiva-navigation>

productName

O nome do produto que será mostrado na barra lateral,

• tipo String
• obrigatório

links

• tipo Array
• obrigatório

{
    endpoint, // endpoint do link, por exemplo, /settings
    icon, // icone do link
    text, // texto que será mostrado no link e na barra superior
    hideToolbar, // opção aso nao queira mostrar a barra superior nesse link
    hide, // opção caso queira esconder o link
}

color

A cor de fundo da barra lateral (desktop) e barra inferior (mobile).

• tipo String
• padrão white

iconColor

A cor dos ícones dos links de navegação.

• tipo String
• padrão blue darken-3

textColor

A cor dos textos dos links de navegação.

• tipo String
• padrão white--text

Atributos

path

Endpoint atual

currentPage

O valor desse atributo será mostrado na barra superior, no canto esquerdo.

showReturnBtn

Caso verdadeiro, na barra superior mostrará um botão de voltar.

isMobileDevice

Diz se o dispositivo é mobile (true) ou desktop (false).

Autor

Renan Tashiro ([email protected])

Licença

AGPL-3.0