import { Component, OnInit } from '@angular/core';
import { FormBuilder, FormGroup } from '@angular/forms';
import { ApiService } from '../shared/api.service';

@Component({
  selector: 'app-employee',
  templateUrl: './employee.component.html',
  styleUrls: ['./employee.component.css']
})
export class EmployeeComponent implements OnInit {
  addPanel: boolean = false;
  editPanel: boolean = false;
  employees: any;
  addForm !: FormGroup;
  editForm !: FormGroup;

  constructor(
    private api: ApiService,
    private formBuilder: FormBuilder
    ) { }

  ngOnInit(): void {
    this.getEmployees();
    this.addForm = this.formBuilder.group({
      name: [''],
      city: [''],
      salary: ['']
    });
    this.editForm = this.formBuilder.group({
      id: [''],
      name: [''],
      city: [''],
      salary: ['']
    });
  }

  getEmployees() {
    this.api.getEmployees().subscribe({
      next: data => {
        this.employees = data;
      },
      error: err => {
        console.log('Hiba! A dolgozók letöltése sikertelen!');
      }
    });
  }

  addEmployee() {
    let employee = {
      name: this.addForm.value.name,
      city: this.addForm.value.city,
      salary: this.addForm.value.salary,
    }
    
    this.api.addEmployee(employee).subscribe({
      next: res => {
        console.log(res)
        this.employees.push(res);
      }
    });
  }

  showAddPanel() {
    this.addPanel = true;
  }

  delEmployee(employee: any) {
    this.api.delEmployee(employee.id).subscribe({
      next: res => {
        console.log(res);
        this.employees.forEach( (emp: any, index: number) => {
          if (emp.id === employee.id ) {
            this.employees.splice(index, 1)
          }
        })

      }
    });
  }

  showEdit(employee: any) {
    this.editForm.patchValue({id: employee.id});
    this.editForm.patchValue({name: employee.name});
    this.editForm.patchValue({city: employee.city});
    this.editForm.patchValue({salary: employee.salary});
    this.editPanel = true;
  }

  updateEmployee() {
    let employee = {
      id: this.editForm.value.id,
      name: this.editForm.value.name,
      city: this.editForm.value.city,
      salary: this.editForm.value.salary
    }
    this.api.updateEmployee(employee).subscribe({
      next: res => {
        console.log(res);
        this.editPanel = false;
        this.getEmployees();
      }      
    });    
  }
}