cliente-novo.component.ts

/**
 * Created by benevideschissanga on 13/04/17.
 */
import {Component, ElementRef, HostListener, Inject, OnInit, Renderer, ViewChild} from '@angular/core';
import {FormArray, FormBuilder, FormGroup, Validators} from '@angular/forms';
import {FirstNamePipe} from '../../../pipes/pipes';
import {Http} from '@angular/http';
import {UIRouter} from 'ui-router-ng2';
import {ValidationService} from '../../../ui-kit.components/ui-kit.message/validation.service';
@Component({
  selector: 'app-novo-client',
  templateUrl: 'atendimento/clientes/cliente-novo/cliente-novo.html'
})
export class NovoClienteComponent implements OnInit {
  public selectedClient = {
    'emails': [{}],
    'enderecos': [{}],
    'sexo': 'M',
    'telefones': [{}],
    'codigo': undefined,
    'nome': undefined,
    'apelido': undefined,
    'cpf': undefined,
    'nascimento': undefined,
    'emailPreferencial': 0,
    'telefonePreferencial': 0
  };

  configTipo: any = {
    searchField: ['nome'],
    create: false,
    plugins: ['dropdown_direction', 'no_results'],
    dropdownDirection: 'auto',
    valueField: 'codigo',
    labelField: 'nome',
  };
  formAddCE: FormGroup;
  cpf: number;
  nascimento: Date;
  nome: string;
  sexo: string;
  apelido: string;
  datepickerOpts = {
    autoclose: true,
    endDate: new Date(),
    icon: 'glyphicon glyphicon-calendar',
    language: 'pt-BR',
    placeholder: 'Insira uma data',
    orientation: 'auto bottom',
    container: '.content'
  };
  @ViewChild('cpfEl') cpfEl: ElementRef;
  @ViewChild('pop') pop;
  cpfElForValidation: ElementRef;

  constructor(private formBuilder: FormBuilder,
              private http: Http, private  render: Renderer,
              @Inject('uiMessageService') private uiMessageService: any,
              private  router: UIRouter,
              @Inject('uiModalService') private uiModalService: any) {
  }

  ngOnInit(): void {
    this.cpfElForValidation = this.cpfEl;
    this.formAddCE = this.formBuilder.group({
      cpf: ['', null, ValidationService.asyncCpfValidator.bind(this)],
      nome: ['', Validators.required],
      nascimento: [''],
      apelido: [''],
      sexo: ['', Validators.required],
      emails: this.formBuilder.array([this.initEmails()]),
      telefones: this.formBuilder.array([this.initTelefones()])
    });
  }

  initEmails() {
    return this.formBuilder.group({
      email: ['']
    });
  }

  addEmail() {
    const control = < FormArray > this.formAddCE.controls['emails'];
    control.push(this.initEmails());
  }

  removeEmail(i: number) {
    const control = < FormArray > this.formAddCE.controls['emails'];
    control.removeAt(i);
  }

  initTelefones() {
    return this.formBuilder.group({
      telefone: [''],
      ddd: [''],
      tipo: ['']
    });
  }

  removeTel(i: number) {
    const control = < FormArray > this.formAddCE.controls['telefones'];
    control.removeAt(i);
  }

  isRequiredTel(item): any {
    return (item.numero && item.numero !== '' || item.ddd && item.ddd !== '');
  };

  makeNick(nome: string) {
    if (nome && !this.selectedClient.apelido || nome && this.selectedClient.apelido === '') {
      this.selectedClient.apelido = new FirstNamePipe().transform(nome);
    }
  };

  addCE(form) {
    console.log(form);
  }

  @HostListener('click', ['$event']) onClick(event) {
    if (event.srcElement.className !== `icon icon-info-dots` && this.pop && this.pop.isOpen) {
      this.pop.hide();
    }
  }
}