Gumga login ofereçe uma experiência moderna aos usuários, o login é feito pelo próprio componente,
armazenando o usuário e suas organizações na sessionStorage.
Dependências
Angular
bower install angular
// Adicione no seu projeto
<scriptsrc="/bower_components/angular/angular.min.js"></script>
Instalação
bower install gumga-login
Exemplo de uso
// Adicione no seu projeto
<scriptsrc="bower_components/gumga-login/dist/gumga-login.min.js"></script>
<linkrel="stylesheet"href="bower_components/gumga-login/dist/gumga-login.min.css">
angular
.module('app',['gumga.login'])
.controller('LoginController', ['$scope',function($scope) {
$scope.configuration= {
appURL :'http://gumga.studio/dashboard-api'//ROTA DA SUA API QUE SERÁ FEITO O LOGIN
};
$scope.onLogin= (user, organizations) => {
console.log(user, organizations)
}
$scope.exemplo= {
fields: [ // CAMPOS QUE SERÃO MOSTRADOS NO FORMULÁRIO
{
field:'name', // NOME DO ATRIBUTO
placeholder:'Nome', // DESCRIÇÃO DA INPUT
type:'text'// TIPO DA INPUT (color, date, datetime-local, email, month, number, range, tel, time, url, week)
},
{
field:'email',// NOME DO ATRIBUTO
placeholder:'E-mail',// DESCRIÇÃO DA INPUT
type:'email'// TIPO DA INPUT (color, date, datetime-local, email, month, number, range, tel, time, url, week)
},
{
field:'password',// NOME DO ATRIBUTO
placeholder:'Senha',// DESCRIÇÃO DA INPUT
type:'password'// TIPO DA INPUT (color, date, datetime-local, email, month, number, range, tel, time, url, week)
},
{
field:'confirmPassword',// NOME DO ATRIBUTO
placeholder:'Confirme sua senha',// DESCRIÇÃO DA INPUT
type:'password',// TIPO DA INPUT (color, date, datetime-local, email, month, number, range, tel, time, url, week)
conditions: [ // CONDIÇÕES DE VALIDAÇÃO DO CAMPO
{
operation:'==', // OPERAÇÃO DA CONDIÇÃO ( !=, ==, ==, <, >, <=, >= )
field:'password'// NOME DO ATRIBUTO DO OUTRO CAMPO DA CONDIÇÃO
}
]
}
],
//FUNÇÃO QUE SERÁ CHAMADA QUANDO O USUÁRIO CLICAR EM EXECUTAR, A FUNÇÃO RECEBE O PARAMETRO DATA QUE SÃO OS DADOS DO USUÁRIOsubmit:function(data){
console.log(data)
}
}
}])
angular
.module('app',['gumga.login'])
.controller('LoginController', ['$scope',function($scope) {
$scope.meumenu= [
{
label:'Pagina inicial', // DESCRIÇÃO DO MENU
link:true, // SE FOR URL DEIXAR TRUE, CASO FOR UM ESTADO DO ANGULAR DEIXAR FALSE
icon:'<i class="fa fa-etsy" aria-hidden="true"></i>', //ICONE
url:'https://www.gumga.io/'// URL DE REDIRECIONAMENTO
},
{
label:'Pagina inicial', // DESCRIÇÃO DO MENU
link:false, // SE FOR URL DEIXAR TRUE, CASO FOR UM ESTADO DO ANGULAR DEIXAR FALSE
icon:'<i class="fa fa-etsy" aria-hidden="true"></i>', //ICONE
url:'cliente.list'// NOME DO STATE PARA REDIRECIONAMENTO
}
]
}])
The Tidelift Subscription provides access to a continuously curated stream of human-researched and maintainer-verified data on open source packages and their licenses, releases, vulnerabilities, and development practices.