import { Component, OnInit, AfterViewInit,ViewChild } from '@angular/core';
import { UserService } from './user.service';
import { Router } from '@angular/router';
import { FormBuilder, FormGroup, Validators, FormControl } from '@angular/forms';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { User } from '../UserEntity/datamodel';
import { UserManageRightsModel } from '../UserEntity/datamodel';
import { Http, Response } from '@angular/http';
//import { Global } from '../../Shared/global';
//import { DBOperation } from 'S';
import { Observable } from 'rxjs/Observable';
import { ConfirmService } from '../../Shared/Confirm/confirm.service';
import 'rxjs/Rx';
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/filter';
import { LoadingService } from '../../shared/loading.service';   
declare var $: any;
import { DatePipe } from '@angular/common';
import { GlobalService } from '../../Shared/global';
@Component({
  templateUrl:'./users.component.html' // '../../../../../wwwroot/html/UpdateProfile/updateuserprofile.component.html'
})

export class UsersList implements OnInit {

  Mode: string = 'Manage';
  modalTitle: string;
  Users: FormGroup;
  adduserFrm: FormGroup;
  managerightFrm: FormGroup;
  alerts: string;
  public UserTypeList: any;
  public AccountTypeList: any;
  public UserList: any;
  public UserManageRightsList: Array<UserManageRightsModel>;
  emailPattern = "^[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,4}$";
  public UserTypeListByLicense: any;
  public AccountNumberList: any;
  public ProductEditionList: any;
  UserEntity: User;
  public UserManageRightsEntity: UserManageRightsModel;
  topPos: string = '2000px';
  datePipe: DatePipe = new DatePipe('en-US');
  error;
  selectedRow: number = 0;
  selectedId: number = 0;
  divClass: string;
  isActive: boolean;
  NoRecord: string;
  //@ViewChild("profileModal")
  //profileModal: ModalComponent;
  //errorMessage: any;
  constructor(private _loadingService: LoadingService,private userservice: UserService, private router: Router, private fb: FormBuilder, private http: Http,
    private _confirmService: ConfirmService,private global:GlobalService
  ) { }
 
  ngOnInit(): void {
    this.modalTitle = 'LIST USER';
    this.alerts = '';
    this.NoRecord = this.global.NoRecords;
    this.Users = this.fb.group({
      FirstName:[''],
      LastName: [''],
      EmailId:  [''],
      AccountNumber: [''],
      UserTypeId: [''],
      AccountTypeId:['']
     // Gender: ['', Validators.required],
   //   Email: ['']
          
    });
    this.adduserFrm = this.fb.group({
      id: [''],
      UserName: ['', Validators.required],
      Password: ['', [Validators.required, Validators.minLength(8)]],
      ConfirmPassword: ['', Validators.required],
      FirstName: ['', Validators.required],
      LastName: ['', Validators.required],
      EmailId: ['', Validators.required],
      AccountNumber: [''],
      UserType: [''],
      AccountType: [''],
      Createddate: [''],
      LastModifiedDate: [''],
      Createdby: [''],
      Modifiedby: [''],
      DeactivationDate: [''],
      isActive: [false],
      UserStatusActive: ['false'],
      UserStatusInActive:['']
    });
    this.managerightFrm = this.fb.group({
      id: [''],
      UserTypeTitle: ['']
    });
    this._loadingService.ShowLoading("global-loading");
    this.GetUserType();
    this.GetAccountType();
    this._loadingService.HideLoading("global-loading");
    $('#fixed_hdr2').fxdHdrCol({
      fixedCols: 0,
      width: "100%",
      height: 300,
      colModal: [
        { width: 180, align: 'center' },
        { width: 230, align: 'center' },
        { width: 150, align: 'Center' },
        { width: 150, align: 'Center' },
        { width: 350, align: 'Center' },
        { width: 200, align: 'Center' },
        { width: 130, align: 'Center' },
        { width: 120, align: 'center' },
        { width: 280, align: 'Center' },
        { width: 180, align: 'center' },
        { width: 200, align: 'center' },
        { width: 170, align: 'center' },
        { width: 80, align: 'center' },
        { width: 150, align: 'center' },
        { width: 150, align: 'center' },
        { width: 180, align: 'Center' },
        { width: 400, align: 'Center' },
        { width: 150, align: 'center' },
        { width: 110, align: 'center' },
      ],
      sort: true
    });
    document.getElementById("fixed_table_rc").remove();
    var testScript = document.createElement("script");
    testScript.setAttribute("id", "fixed_table_rc");
    testScript.setAttribute("src", "../assets/scripts/fixed_table_rc.js");
    testScript.setAttribute("type", "text/javascript");
    document.body.appendChild(testScript);
    this._loadingService.ShowLoading("global-loading");
    //this.bindUsers();   
    this._loadingService.HideLoading("global-loading");
    
    //this.GetUserList();
  }
  handleChange(evt) {
    debugger;
    var target = evt.target;
    if (target.value == 'true') {
      this.isActive = true;
    }
    else if (target.value == 'false') {
      this.isActive = false;
    }
  }
  
  public SetClickedRow(i: number, item: any) {
    this.selectedRow = i;
    this.selectedId = item['Id'];
    this.UserEntity = item;
  }
  public SetClickedRowManageRight(j: number, item: any) {
    this.selectedRow = j;
    this.selectedId = item['Id'];
    this.UserManageRightsList = item;
  }
  redirect() {
    this.router.navigate(['/']);
  }
 
  GetUserType() {
    this.userservice.GetUserType().subscribe(x => { this.UserTypeList = x; }, error => this.error = <any>error);
  }
  GetAccountType() {
    this.userservice.GetAccountType().subscribe(x => { this.AccountTypeList = x; }, error => this.error = <any>error);
  }
  GetUserList() {
    //this.userservice.GetUserList().subscribe(x => { this.UserList = x; }, error => this.error = <any>error);
  }
  GetUserRights() {
    this.userservice.GetManageUserRights({
      UserId: this.managerightFrm.controls['id'].value,
      UserType: this.managerightFrm.controls['UserTypeTitle'].value
    })
      .subscribe(x => { console.log(x); this.UserManageRightsList = x }, error => {
        this.error = <any>error;
        this.alerts = "<span>" + this.error + "</span>";
      });
  }
  SearchUserList(this)
  {
    this._loadingService.ShowLoading("global-loading");
    var UserFilterControl = this.Users.value;
    this.userservice.GetUserList(
      {
        FirstName: this.Users.controls['FirstName'].value,
        LastName: this.Users.controls['LastName'].value,
        EmailId: this.Users.controls['EmailId'].value,
        AccountNumber: this.Users.controls['AccountNumber'].value,
        UserTypeId: (this.Users.controls['UserTypeId'].value != null && this.Users.controls['UserTypeId'].value !='' ? this.Users.controls['UserTypeId'].value:0),
        AccountTypeId: (this.Users.controls['AccountTypeId'].value != null && this.Users.controls['AccountTypeId'].value != ''? this.Users.controls['AccountTypeId'].value : 0),
        

      })

      .subscribe(x => { this.BindFormFields(x) }, error => this.error = <any>error);
    
  }
  BindFormFields(data) {
    this.UserList = data;
    if (this.UserList.length > 0) {
      this.NoRecord = '';
      this._loadingService.HideLoading("global-loading");
    }
    if (this.UserList.length == 0) {
      this.NoRecord = this.global.NoRecords;
      this._loadingService.HideLoading("global-loading");
    }
  }
  EditUser() {
    debugger;
    this.Mode = 'Edit';
    this.modalTitle = 'Edit USER';
    this.topPos = '100px';
    this.divClass = 'col-sm-10 col-sm-offset-1 col-md-8 col-md-offset-2 col-lg-6 col-lg-offset-3';
    this.alerts = '';
    this.adduserFrm.controls['id'].setValue(this.UserEntity.Id)
    this.adduserFrm.controls['FirstName'].setValue(this.UserEntity.FirstName)
    this.adduserFrm.controls['LastName'].setValue(this.UserEntity.LastName)
    this.adduserFrm.controls['EmailId'].setValue(this.UserEntity.EmailId)
    this.adduserFrm.controls['UserName'].setValue(this.UserEntity.LoginId)
    this.adduserFrm.controls['Password'].setValue(this.UserEntity.Password)
    this.adduserFrm.controls['ConfirmPassword'].setValue(this.UserEntity.Password)
    this.adduserFrm.controls['AccountNumber'].setValue(this.UserEntity.AccountNumber)
    this.adduserFrm.controls['UserType'].setValue(this.UserEntity.UserTypeTitle)
    this.adduserFrm.controls['AccountType'].setValue(this.UserEntity.AccountTypeTitle)
    this.adduserFrm.controls['Createddate'].setValue(this.datePipe.transform(this.UserEntity.CreationDate, 'MM/dd/yyyy'))
    this.adduserFrm.controls['LastModifiedDate'].setValue(this.datePipe.transform(this.UserEntity.ModifiedDate, 'MM/dd/yyyy'))
    this.adduserFrm.controls['Createdby'].setValue(this.UserEntity.Createdby)
    this.adduserFrm.controls['Modifiedby'].setValue(this.UserEntity.Modifiedby)
    this.adduserFrm.controls['DeactivationDate'].setValue(this.datePipe.transform(this.UserEntity.DeactivationDate, 'MM/dd/yyyy'))
    if (this.UserEntity.UserStatus == 'Active') {
      this.adduserFrm.controls['UserStatusActive'].setValue('true')
    }
    else {
      this.adduserFrm.controls['UserStatusActive'].setValue('false')
    }
    //this.adduserFrm.controls['UserStatusActive'].setValue(true)
    //this.adduserFrm.controls['UserStatusInActive'].setValue(false)
    this.isActive = (this.UserEntity.UserStatus=='Active'?true :false)
    
  }

  EditManageUserRights() {
    this.Mode = 'ManageRight';
    this.modalTitle = 'MANAGE USER Right';
    this.topPos = '100px';
    this.divClass = 'col-sm-10 col-sm-offset-1 col-md-8 col-md-offset-2 col-lg-6 col-lg-offset-3';
    this.alerts = '';
    this.managerightFrm.controls['id'].setValue(this.UserEntity.Id);
    this.managerightFrm.controls['UserTypeTitle'].setValue(this.UserEntity.UserTypeTitle);
    this.GetUserRights();
  }

  public UpdateUser(this) {
    this.alerts = '';
    if (this.adduserFrm.value.UserName == '') {
      this.alerts += '<span>User Name is required.</span>';
    }
    if (this.adduserFrm.value.Password == '') {
      this.alerts += '</br><span>Password of minimum 8 characters is required.</span>';
    }
    if (this.adduserFrm.value.ConfirmPassword == '') {
      this.alerts += '</br><span>Confirm Password is required.</span>';
    }
    if (this.adduserFrm.value.EmailId == '') {
      this.alerts += '</br><span>Email Id is required.</span>';
    }
    if (this.adduserFrm.value.FirstName == '') {
      this.alerts += '</br><span>First Name is required.</span>';
    }
    if (this.adduserFrm.value.LastName == '') {
      this.alerts += '</br><span>Last Name is required.</span>';
    }
    if (this.adduserFrm.value.newPassword != this.adduserFrm.value.confirmPassword) {
      this.alerts += '</br><span>Password and confirm password must be same</span>';
    }
    
    if (this.adduserFrm.valid && this.alerts == '') {
      this.adduserFrm.controls['isActive'].setValue(this.adduserFrm.value.UserStatusActive) 
      
      var UserEntity = this.adduserFrm.value;
       
      return this.userservice.UpdateUserEntity(UserEntity)
        .subscribe(
        n => (this.AfterInsertData(n)),
        error => {
          this.error = <any>error;
          this.alerts = "<span>" + this.error + "</span>";
        });
    }

  }

  //public DeleteUnblockedUser(this) {
  //  this.alerts = '';
  //}

  AfterInsertData(data) {
  
    if (data == "User updated successfully") {
      this.alerts = '';
      this._confirmService.activate("User updated successfully.", "alertMsg");
    }
    //if (this.closeflag) {
    //  this.close.emit(null);
    //}
    //else {
    //}
  }
  
  ResetFormFields() {
    //this.ChangeUserIdFrm.reset()
    //this.ChangeUserIdFrm.controls['id'].setValue(this.user.Id)
    //this.ChangeUserIdFrm.controls['loginid'].setValue(this.user.LoginId)
    //this.ChangeUserIdFrm.controls['newloginid'].setValue('')
    //this.ChangeUserIdFrm.controls['confirmloginid'].setValue('')
    this.alerts = '';
  }
  
}