portal-FE-os/src/app/pages/users/user-details-form/user-details-form.component.ts

   1 import { Component, OnInit } from '@angular/core';
   2 import { FormBuilder, FormGroup, Validators } from '@angular/forms';
   3 import { MustMatch } from 'src/app/shared/helpers/must-match-validator';
   4 import { UsersService } from 'src/app/shared/services';
   5 import { NgbActiveModal, NgbModal } from '@ng-bootstrap/ng-bootstrap';
   6 import { ConfirmationModalComponent } from 'src/app/modals/confirmation-modal/confirmation-modal.component';
   7
   8 @Component({
   9   selector: 'app-user-details-form',
  10   templateUrl: './user-details-form.component.html',
  11   styleUrls: ['./user-details-form.component.scss']
  12 })
  13 export class UserDetailsFormComponent implements OnInit {
  14   addNewUserForm: FormGroup;
  15   submitted = false;
  16
  17   constructor(private formBuilder: FormBuilder,
  18     private usersService: UsersService,
  19     public activeModal: NgbActiveModal,
  20     public ngbModal: NgbModal) { }
  21
  22   ngOnInit() {
  23     this.addNewUserForm = this.formBuilder.group({
  24       firstName: ['', Validators.required],
  25       middleInitial: [''],
  26       lastName: ['', Validators.required],
  27       email: ['', [Validators.required, Validators.email]],
  28       loginId: ['', Validators.required],
  29       loginPwd: ['', Validators.required],
  30       confirmPassword: ['', Validators.required]
  31     }, {
  32         validator: MustMatch('loginPwd', 'confirmPassword')
  33       });
  34   }
  35
  36   get formValue() {
  37     return this.addNewUserForm.controls;
  38   }
  39
  40   addUser() {
  41     this.submitted = true;
  42     if (this.addNewUserForm.invalid) {
  43       console.log("Invalid form!!");
  44       return;
  45     }
  46     console.log("New user Json : " + JSON.stringify(this.addNewUserForm.value));
  47     console.log("Get Raw value : " + this.addNewUserForm.getRawValue());
  48     let newUserFormData = JSON.stringify(this.addNewUserForm.getRawValue());
  49     this.usersService.addNewUser(newUserFormData).subscribe(result => {
  50       console.log("Result : ", result);
  51       const modalSuccess = this.ngbModal.open(ConfirmationModalComponent);
  52       modalSuccess.componentInstance.title = "Success";
  53       modalSuccess.componentInstance.message = 'User added Successfully!';
  54     }, error => {
  55       console.log("Error : ", error);
  56       const modalErrorRef = this.ngbModal.open(ConfirmationModalComponent);
  57       modalErrorRef.componentInstance.title = "Error";
  58       modalErrorRef.componentInstance.message = 'Something went wrong. Error Message: ' + error.message;
  59     })
  60     this.activeModal.close();
  61   }
  62
  63 }