Login

Boa tarde, Julio! Como vai?

O que vc chegou a tentar como solução?

Uma forma simples que eu pesei aqui e que talvez resolva o seu problema é utilizar a diretiva *ngIf para colocar no DOM da sua aplicação apenas os elementos que vc queira de acordo com o privilégio do usuário.

Exemplo:

<ion-item *ngIf="usuario.privilegio == 'admin'">
...
</ion-item>

Nesse caso, o ion-item só entraria no DOM caso o seu usuario fosse do tipo admin.

Vc chegou a testar essa solução? Caso não tenha, teste aí e diga se funcionou. Qualquer coisa é só falar que daí iremos pensando em outros caminhos caso seja necessário.

Abraço,Gabriel Leite.

Boa noite,

Desculpe a demora pra responder. Eu já havia visto de fazer o ngIf, mas estou com problema no seguinte, ao fazer o login, consigo retornar o usuario correto e identificar o tipo de usuario pelo console.log, mas não estou conseguindo saber como posso mandar esse usuario p/ a tela de home, do modo que fiz eu teria que criar 1 tipo de tela pra cada tipo de usuario, mas se conseguisse mandar esse usuario p/ home eu acho que consigo usar esse ngIf p/ mostrar só oque é necessario p/ cada tipo usuario. Abaixo vou enviar como estou recebendo o objeto.

login(req){
    this.service.loginUser(req.value).subscribe(
      data => {
        this.user =data;
        if(data.isadministrador == 1){
          console.log('Administrador Logado com sucesso!');
          this.navCtrl.push(MenuPage);
          this.toastCtrl.create({
            message: 'Seja Bem Vindo!',
            position: 'top', duration: 2000 }).present();
        } else if(data.isfuncionario == 1){
          console.log('Funcionario Logado com sucesso!');
          this.navCtrl.push(MenuPage);
          this.toastCtrl.create({
            message: 'Seja Bem Vindo!',
            position: 'top', duration: 2000 }).present()
        } else {
          console.log('Cliente Logado com sucesso!');
          this.navCtrl.push(MenuPage);
          this.toastCtrl.create({
            message: 'Seja Bem Vindo!',
            position: 'top', duration: 2000 }).present()
        }
      },
      err => this.toastCtrl.create({
        message: 'Erro ao tentar logar, por favor confira os campos.',
        position: 'botton', duration: 3000 }).present()
    );
  }

Boa noite, Julio!

Vc já tem um serviço responsável por fazer o login do usuário. Use esse mesmo serviço pra armazenar o usuário logado. Daí, quando precisar recuperar o usuário a partir de outras telas, será apenas injetar esse seu serviço na classe referente à tela e pegar o usuário.

O método que estou usando no serviço é esse

loginUser(params){
        let headers = new Headers({ 'Content-Type' : 'application/json'});
        return this.http.post(this.apiUrl + 'login', params, {
          headers:headers,
          method: "POST"
        }).map((res: Response) => { return res.json(); })
      }

No caso terei que fazer um outro método com get? E se sim então terei que passar um parametro p/ buscar o usuario que foi logado? Eu estou bem perdido nessa parte...

Bom dia, Julio!

A ideia não seria fazer uma outra requisição com método get e sim armazenar o usuário no serviço para que fosse recuperado posteriormente quando necessário.

Exemplo prático:

//usuario-service.ts
@Injectable
export class UsuarioService {
    private _usuarioLogado: Usuario;

    constructor(http: Http){}

    loginUser(params){
        let headers = new Headers({ 'Content-Type' : 'application/json'});
        return this.http.post(this.apiUrl + 'login', params, {
            headers:headers,
            method: "POST"
        })
        .map((res: Response) => { return res.json(); })
        .do((usuario: Usuario) => this._usuarioLogado = usuario);
    }

    get usuarioLogado() {
        return this._usuarioLogado;
    }
}

Repare que no código tentei representar o seu serviço que faz o login chamando de UsuarioService. Dentro dele, coloquei o método loginUser(params) que vc descreveu e acrescentei nesse método a função do() do RxJS. Essa função vc precisará importar da mesma forma que se faz com o map() e o objetivo dela é executar algo quando o Observable é bem sucedido (no seu caso específico, quando a requisição é bem sucedida). Então, dentro do do() eu pego o usuário que vem do map() e coloco ele dentro do atributo da classe chamado _usuarioLogado.

Por fim, eu criei um getter para o atributo _usuarioLogado de modo que seja possível recuperar o usuário que está logado em outros componentes.

Assim, sempre que vc precisar do usuario logado, basta fazer algo do tipo:

//home.ts
@Component
export class HomePage {
    constructor(public usuarioService: UsuarioService){}
}

//home.html
<ion-header>
...
</ion-header>
<ion-content>
    Usuario logado no momento: {{usuarioService.usuarioLogado}}
</ion-content>

Abraço,Gabriel Leite.