import {Component, inject, OnInit} from '@angular/core';
import {FormBuilder, FormGroup, ReactiveFormsModule, Validators} from "@angular/forms";
import {MatFormField, MatLabel} from "@angular/material/form-field";
import {MatInput} from "@angular/material/input";
import {MatButton} from "@angular/material/button";
import {
  MatDialogActions,
  MatDialogClose,
  MatDialogContent,
  MatDialogRef,
  MatDialogTitle
} from "@angular/material/dialog";
import {Employee} from "../Employee";
import EmployeeApiService from "../../services/employee-api.service";
import {NgIf} from "@angular/common";

@Component({
  selector: 'app-create-employee',
  imports: [
    ReactiveFormsModule,
    MatFormField,
    MatInput,
    MatButton,
    MatLabel,
    MatDialogContent,
    MatDialogTitle,
    MatDialogActions,
    MatDialogClose,
    NgIf,
  ],
  templateUrl: './create.component.html',
  standalone: true,
  styleUrl: './create.component.css'
})
export class CreateComponent implements OnInit {
  employeeForm: FormGroup | null = null;
  employeeService: EmployeeApiService = inject(EmployeeApiService);
  formBuilder: FormBuilder = inject(FormBuilder);
  dialogRef: MatDialogRef<CreateComponent> = inject(MatDialogRef);

  ngOnInit(): void {
    this.employeeForm = this.formBuilder.group({
      firstName: ['', Validators.required],
      lastName: ['', Validators.required],
      street: ['', Validators.required],
      postcode: ['', [Validators.required, Validators.minLength(5), Validators.maxLength(5)]],
      city: ['', Validators.required],
      phone: ['', Validators.required],
    });
  }

  submit() {
    if (this.employeeForm === null || !this.employeeForm.valid) {
      console.error('Form invalid');
      return;
    }

    this.employeeService.create(this.employeeForm.value as Employee).subscribe();
    this.dialogRef.close(true);
  }
}