hyper-jobs-login-component v2.2.33

hyper-jobs-login-component

Instalação

Para instalar esta biblioteca, execute:

$ npm install hyper-jobs-login-component --save

Consumindo sua biblioteca

Uma vez que você publicou sua biblioteca para npm, você pode importar sua biblioteca em qualquer aplicativo angular executando:

$ npm install hyper-jobs-login-component

depois importe em seu Angular AppModule:

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';

import { AppComponent } from './app.component';

// Importe seu módulo de rotas
import { AppRoutingModule } from './app.routing.module';
// Importe a biblioteca hyper-jobs-login-component
import { LoginModule } from 'hyper-jobs-login-component';

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,

    // Importe o módulo LoginModule passando o environment para o forRoot 
    LoginModule.forRoot(environment),
    // Crie ou use seu módulo de rotas existente
    AppRoutingModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

Uma vez que sua biblioteca é importada, você pode usar seus componentes, diretrizes e pipes em seu aplicativo Angular:

<!-- Neste exemplo foi utilizado a diretiva `authenticate` --> 
<!-- que faz com que o usuário logue antes de executar a ação -->
<h1>Exemplo</h1>
<button (authenticate)="funcao()" type="button">Botao de ação</button>

Utilizando a diretiva via typescript:

import { ActionAuthenticatedDirective } from 'hyper-jobs-login-component';

@ViewChild(ActionAuthenticatedDirective) refDirective: ActionAuthenticatedDirective;

callTeste() {
    this.refDirective.eventClick();
  }

Folhas de Estilo(CSS)

É necessário adicionar dois css no arquivo index.html dando um identificador para cada um:

<link id="css_hj_ui" rel="stylesheet" href="">

No arquivo app.component.ts verifico qual ambiente estou utilizando e mudo a url dos css's:

import { Component, OnInit, Inject } from '@angular/core';
import { DOCUMENT } from '@angular/platform-browser';
import { environment } from './../environments/environment';
   
constructor(
    @Inject(DOCUMENT) private document
  )
  { }
ngOnInit() {
  this.document.getElementById('css_hj_ui').setAttribute('href', environment.assets + 'css/hj-ui.css');
}

Emit()

O componente Login emite os seguintes eventos:

listenerLoginComponent - Quando o usuário logou com sucesso este evento retorna o objeto deste usuário. listenerLogoutComponent - Quando o usuário desloga este evento retorna 'true' para sucesso e 'false' para fail. takeWhile - Quando retornou um código que preciso cancelar as requisições

subscribe()

O componente Login se inscreve nos seguintes eventos:

openLoginModal - Escuta este evento esperando o parametro 'true' para que abra o modal de login. logout - Escuta este evento esperando um 'true' para deslogar o usuário.

Environments

É necessário ter no mínimo os seguintes nós no environments

export const environment = {
  production: false,
  homeUrl: '//dash.hyper.jobs/',
  upgradePlanUrl: '//ti.hyper.jobs/patrick.castro/homev2/worker/register/payment/?id=',
  feedBlog: '//blog.hyper.jobs/api/get_posts/',
  apiUrl: '//ti.hyper.jobs/fabio.moreira/api2.0/v1/',
  apiUrlDirect: '//ti.hyper.jobs/fabio.moreira/api2.0/v1/',
  meUrl: '//ti.hyper.jobs/dejair.espindola/me/',
  hostBigJobV1: '//ti.hyper.jobs/dejair.espindola/big/',
  hostHyperJobsV1: '//ti.hyper.jobs/fabio.moreira/appv1/',
  urlHjChat: 'https//server03.hyper.jobs:1338/',
  nodeNotifications: 'https//server03.hyper.jobs:3292/',
  urlPhotoUpload: '//ti.hyper.jobs/patrick.castro/api2.0/',
  googlePlayUrl: '//play.google.com/store/apps/details?id=jobs.hyper.hyperjobs',
  imageProfileDefault: '//files.hyper.jobs/user/profile/default-profile.png',
  ftpFilesHJ: '//files.dev.hyper.jobs',
  assets: '//assets.dev.hyper.jobs/',
  baseUrl: '//homolog.hyper.jobs/dash2/'
  loginConfig: { //OPCIONAL
    worker: true,
    sponsor: false
  },
  urlRoot: '//homolog.jyper.jobs/coach' //cada caixinha possui sua urlRoot
};
// OBS: sempre finalizar com / as URL's

Nós Opcionais:

// Habilita ou desabilita os botões "Worker" e "Sponsor" no momento do login
loginConfig: {
  worker: true,
  sponsor: false
}

License

MIT © Fabio Junior Moreira