🌎 Vue IntergrAll Plugins

Biblioteca de plugins feitos em Vue para serem utilizados em qualquer lugar dentro das necessidades do Sistema IntergrAll.

Template Generator:

Props:

templates:

type: Object
required: true
desc: Objeto dos templates a serem exibidos.

identifier:

type: String
required: true
desc: Identificador único para o componente. Útil para caso seja necessário disparar uma função de dentro do componente.

dictionary:

type: Object
required: true
desc: Dicionário de palavras a ser utilizado no componente.

hasButton:

type: Boolean
required: false
default: true
desc: Exibir botão de envio. Faz a emissão do evento @click-trigger.

iconButton:

type: Boolean
required: false
desc: Estiliza o botão para ser apenas um ícone 'fas fa-paperplane'. Para funcionar a opção hasButton deve ser true (default).

columnSelect:

type: Boolean
required: false
desc: Torna o container do select de templates em coluna, onde encima ficará o título, "Template:" e embaixo o select. O padrão é o título e o select na mesma linha.

resizeParentOnSelect:

type: Boolean
required: false
desc: Indica ao selecionar um template que o componente pai deve ter seu tamanho corrigido caso não faça isso naturalmente. Faz a emissão do evento @resize-parent.

placement:

type: String
required: false
default: "bottom"
desc: Indica se as opções do select devem abrir para cima('top'), ou para baixo('bottom', default).

allVariables:

type: Boolean
required: false
default: true
desc: Indica se todas variáveis devem ser exibidas quando houver o clique sobre o input para digitar o valor das variáveis.

Emitters:

@click-trigger:

desc: Emitido ao clicar no botão.

@selected-template:

desc: Emitido ao selecionar alguma opção do template.
sent_data: String - código do template ou 'envio_msg', que indica que o template é uma mensagem a ser digitada pelo usuário.

@resize-parent:

desc: Emitido ao selecionar algum template.

@template-data:

desc: Emitido quando é selecionado um template sem variáveis ou conforme o preenchimento da(s) variável(eis).
sent_data: Object - envia os dados do template com os valores a serem atribuidos a variável na posição 'currentText'.

@static-message:

desc: Emitido conforme o preenchimento do campo de texto.
sent_data: String - valor da mensagem

Text Footer:

Props:

textId:

type: String
required: true
desc: Identificador único para o componente. Útil para caso seja necessário disparar uma função de dentro do componente.

dictionary:

type: Object
required: true
desc: Dicionário de palavras a ser utilizado no componente.

buttons:

type: Object
required: false
default: { hasEmojis: false, hasSendButton: false, hasFiles: false, hasAudio: false }
desc: Objeto responsável por habilitar os possíveis botões do componente. Sendo eles, emojis, enviar, arquivos e áudio, todos aceitam Boolean, true ou false.

cssStyle:

type: Object
required: false
default: { width: "full", backgroundColor: "#FFF", outsideButtons: false }
desc: Objeto de estilização, onde:
- width: Largura do componente. Aceita a String "full" (100%), "almostFull" (95%) ou "medium" (75%).
- backgroundColor: Cor de fundo do compoennte. Aceita String com qualquer código de cor CSS válido.
- outsideButtons: Coloca os botões flutuando na parte superior direita do componente. Aceita Boolean, true ou false.

textareaSettings:

type: Object
required: false
default: { placeholderMessage: "", maxCharacters: 0, sendOnEnter: false, disabled: false }
desc: Configurações do campo de texto, onde:
- placeholderMessage: Placeholder do campo de texto. Aceita qualquer String.
- maxCharacters: Máximo de caracteres aceitos no campo de texto. Aceita qualquer número positivo.
- sendOnEnter: Faz a emissão do evento que dispara a mensagem. Aceita Boolean, true ou false.
- disabled: Desabilita o campo de texto. Aceita Boolean, true ou false.

emojiSettings:

type: Object
required: false
default: { openEmojisFrom: "top", smallEmojis: false }
desc: Configurações dos emojis, onde:
- openEmojisFrom: Direção que a caixa de seleção de emojis vai abrir. Aceita String "top" ou "bottom".
- smallEmojis: Diminui o tamanho dos emojis renderizados na caixa de seleção. Aceita Boolean, true ou false.

formattedMessageSettings:

type: Object
required: false
default: { hasStandardMessages: false, msgType: 0, token_cliente: "" }
desc: Configurações das mensagens formatadas, onde:
- hasStandardMessages: Faz a aparição do botão de mensagem formatada caso verdadeiro. Aceita Boolean, true ou false.
- msgType: Tipo da mensagem formatada. Aceita os números 0 (sem mensagem), 1 (tipo mensagem 1) ou 2 (tipo mensagem 2).
- token_cliente: Para que a requisição de obter as mensagens formatadas funcione, é necessário passar o token_cliente.

fileSettings:

type: Object
required: false
default: { docsExtensions: "", imagesExtensions: "", multiple: false, systemButton: false, max: 3 }
desc: Configurações dos arquivos, onde:
- docsExtensions, imagesExtensions aceitam uma regex contendo as possíveis extensões a serem enviadas: Faz a aparição do botão de mensagem formatada caso verdadeiro. Aceita Boolean, true ou false.
- multiple: Caso aceite múltiplos arquivos para serem enviados.
- systemButton: Caso necessite de um botão extra. Emite o evento "@open-file-system".
- max: Máximo de arquivos que podem ser selecionados.

isSending:

type: Boolean
required: false
default: false
desc: Variável de controle que, quando marcada como true, coloca um loader no campo de texto para que não sejam realizadas múltiplas requisições enquanto uma já está em andamento.

isMainChat:

type: Boolean
required: false
default: false
desc: Controle de verificação para saber se o chat em questão é o principal da tela (tende a ser excluído nas próximas implementações)

Emitters:

@final-message:

desc: Emitido conforme o preenchimento do campo de texto.
sent_data: String - valor da mensagem. Obs: Para os emojis, é enviado o seu respectivo código em HTML.

@send-message:

desc: Emitido ao disparar mensagem pelo botão, tecla enter ou shift + enter, dependendo das props recebidas.
sent_data: String - valor da mensagem. Obs: Para os emojis, é enviado o seu respectivo código em HTML.

@obj-message:

desc: Emitido ao disparar mensagem pelo botão, tecla enter ou shift + enter, dependendo das props recebidas.
sent_data: Object - Contém os seguintes valores referentes a mensagem:
- message: String, valor da mensagem;
- attachment: File, arquivo enviado;
- isDoc: Boolean, sinaliza se a mensagem é um documento;
- image: File, imagem enviada;
- isAudio: Boolean, sinaliza se a mensagem é do tipo áudio;
- audioAttachment: File, arquivo de áudio enviado.

@open-file-system