src/main/java/com/primefactorsolutions/model/Employee.java

@@ -19,6 +19,21 @@ import java.util.List;
 public class Employee extends BaseEntity {
     private String firstName;
     private String lastName;
+    private LocalDate birthday;
+    private String birthCity;
+
+    @Enumerated(EnumType.STRING)
+    private MaritalStatus maritalStatus;
+
+    private String residenceAddress;
+    private String phoneNumber;
+    private String personalEmail;
+
+    private String emergencyCName;
+    private String emergencyCAddress;
+    private String emergencyCPhone;
+    private String emergencyCEmail;
+
     @Enumerated(EnumType.STRING)
     private Status status;
 
@@ -26,4 +41,11 @@ public class Employee extends BaseEntity {
         ACTIVE,
         INACTIVE
     }
+
+    public enum MaritalStatus {
+        SINGLE,
+        MARRIED,
+        WIDOWED,
+        DIVORCED
+    }
 }

src/main/java/com/primefactorsolutions/service/EmployeeService.java

@@ -11,6 +11,8 @@ import org.springframework.stereotype.Service;
 
 import java.util.List;
 import java.util.UUID;
+import java.util.Optional;
+
 
 @Service
 @Data
@@ -31,7 +33,8 @@ public class EmployeeService {
     }
 
     public Employee getEmployee(final UUID id) {
-        return null;
+        Optional<Employee> employee = employeeRepository.findById(id);
+        return employee.orElse(null);
     }
 
     public Page<Employee> getEmployeesPaginated(int pageNo, int pageSize, String sortField, boolean ascending) {

src/main/java/com/primefactorsolutions/views/EmployeeView.java

@@ -3,8 +3,16 @@ package com.primefactorsolutions.views;
 import com.primefactorsolutions.model.Employee;
 import com.primefactorsolutions.service.EmployeeService;
 import com.vaadin.flow.component.Component;
+import com.vaadin.flow.component.button.Button;
+import com.vaadin.flow.component.combobox.ComboBox;
+import com.vaadin.flow.component.html.H2;
+import com.vaadin.flow.component.html.H3;
+import com.vaadin.flow.component.notification.Notification;
+import com.vaadin.flow.component.orderedlayout.HorizontalLayout;
+import com.vaadin.flow.component.orderedlayout.VerticalLayout;
 import com.vaadin.flow.component.textfield.EmailField;
 import com.vaadin.flow.component.textfield.TextField;
+import com.vaadin.flow.data.value.ValueChangeMode;
 import com.vaadin.flow.router.BeforeEvent;
 import com.vaadin.flow.router.HasUrlParameter;
 import com.vaadin.flow.router.PageTitle;
@@ -13,6 +21,7 @@ import com.vaadin.flow.spring.annotation.SpringComponent;
 import jakarta.annotation.security.PermitAll;
 import org.apache.commons.lang3.StringUtils;
 import org.springframework.context.annotation.Scope;
+import org.vaadin.firitin.components.datepicker.VDatePicker;
 import org.vaadin.firitin.form.BeanValidationForm;
 
 import java.util.List;
@@ -24,21 +33,150 @@ import java.util.UUID;
 @PageTitle("Employee")
 @Route(value = "/employees", layout = MainLayout.class)
 public class EmployeeView extends BeanValidationForm<Employee> implements HasUrlParameter<String> {
+
     private final EmployeeService employeeService;
 
-    private TextField name = null;
+    private final TextField firstName;
+    private final TextField lastName;
+    private final ComboBox<String> status;
+    private final VDatePicker birthday;
+    private final TextField birthCity;
+    private final ComboBox<String> maritalStatus;
+    private final TextField residenceAddress;
+    private final TextField phoneNumber;
+    private final EmailField personalEmail;
+
+    private final TextField emergencyCName;
+    private final TextField emergencyCAddress;
+    private final TextField emergencyCPhone;
+    private final EmailField emergencyCEmail;
+
+    private final H2 mt;
+    private final H3 fs;
+    private final H3 ss;
 
     public EmployeeView(final EmployeeService employeeService) {
         super(Employee.class);
         this.employeeService = employeeService;
-        name = new TextField();
+
-        name.setWidthFull();
+        mt = new H2("Información General del Empleado");
-        name.setLabel("Name");
+        fs = new H3("Información Personal");
+        ss = new H3("Datos de Contacto de Emergencia");
+
+        final HorizontalLayout mainLayout = new HorizontalLayout();
+        final VerticalLayout sidebar = createSidebar();
+        final VerticalLayout contentLayout = createContentLayout();
+        final VerticalLayout contentLayout2 = createContentLayout();
+
+        firstName = new TextField("Nombres: ");
+        firstName.setWidthFull();
+        firstName.setMaxLength(30);
+        firstName.setRequired(true);
+
+        lastName = new TextField("Apellidos");
+        lastName.setWidthFull();
+        lastName.setMaxLength(30);
+        lastName.setRequired(true);
+
+        status = new ComboBox<>("Estado");
+        status.setItems(List.of("ACTIVE", "INACTIVE"));
+        lastName.setWidthFull();
+        lastName.setMaxLength(30);
+        status.setRequired(true);
+
+        birthday = new VDatePicker("Fecha de Nacimiento");
+        birthday.setWidthFull();
+
+        birthCity = new TextField("Ciudad y País de Nacimiento");
+        birthCity.setWidthFull();
+        birthCity.setMaxLength(20);
+
+        maritalStatus = new ComboBox<>("Estado Civil");
+        maritalStatus.setItems(List.of("Soltero", "Casado", "Viudo", "Divorciado"));
+        maritalStatus.setWidthFull();
+
+        residenceAddress = new TextField("Dirección de Residencia");
+        residenceAddress.setWidthFull();
+        residenceAddress.setMaxLength(50);
+
+        phoneNumber = new TextField("Teléfono");
+        phoneNumber.setWidthFull();
+        phoneNumber.setMaxLength(8);
+        phoneNumber.setValueChangeMode(ValueChangeMode.EAGER);
+        phoneNumber.addValueChangeListener(e -> {
+            if (!e.getValue().matches("\\d*")) {
+                phoneNumber.setErrorMessage("El teléfono debe contener solo números.");
+            }
+        });
+
+        personalEmail = new EmailField("E-mail");
+        personalEmail.setWidthFull();
+        personalEmail.setMaxLength(30);
+
+        emergencyCName = new TextField("Nombres y Apellidos de Contacto");
+        emergencyCName.setWidthFull();
+        emergencyCName.setMaxLength(50);
+
+        emergencyCAddress = new TextField("Dirección de Contacto");
+        emergencyCAddress.setWidthFull();
+        emergencyCAddress.setMaxLength(50);
+
+        emergencyCPhone = new TextField("Teléfono de Contacto");
+        emergencyCPhone.setWidthFull();
+        emergencyCPhone.setMaxLength(8);
+        emergencyCPhone.setValueChangeMode(ValueChangeMode.EAGER);
+        emergencyCPhone.addValueChangeListener(e -> {
+            if (!e.getValue().matches("\\d*")) {
+                emergencyCPhone.setErrorMessage("El teléfono debe contener solo números.");
+            }
+        });
+
+        emergencyCEmail = new EmailField("Email de Contacto");
+        emergencyCEmail.setWidthFull();
+        emergencyCEmail.setMaxLength(30);
+
+        contentLayout.add(
+                mt, fs, firstName, lastName, status, birthday, birthCity, maritalStatus,
+                residenceAddress, phoneNumber, personalEmail);
+
+        contentLayout2.add(
+                ss, emergencyCName, emergencyCAddress, emergencyCPhone, emergencyCEmail);
 
         setSavedHandler((SavedHandler<Employee>) employee -> {
-            final Employee saved = employeeService.createOrUpdate(employee);
+            if (validateForm()) {
-            setEntityWithEnabledSave(saved);
+                final Employee saved = employeeService.createOrUpdate(employee);
+                Notification.show("Empleado guardado exitosamente.");
+                getUI().ifPresent(ui -> ui.navigate(EmployeesListView.class));
+                setEntityWithEnabledSave(saved);
+            } else {
+                Notification.show("Acción inválida. Por favor, complete todos los campos requeridos correctamente.", 3000, Notification.Position.MIDDLE);
+            }
         });
+
+        mainLayout.add(sidebar, contentLayout, contentLayout2);
+        addClassName("main-layout");
+    }
+
+    private boolean validateForm() {
+        return !firstName.isEmpty() && !lastName.isEmpty() && status.getValue() != null;
+    }
+
+    private VerticalLayout createSidebar() {
+        VerticalLayout sidebar = new VerticalLayout();
+        sidebar.setWidth("250px");
+        sidebar.add(new Button("Información General", e -> navigateToSection("Información General")));
+        sidebar.add(new Button("Detalles Profesionales", e -> navigateToSection("Detalles Profesionales")));
+        return sidebar;
+    }
+
+    private void navigateToSection(final String section) {
+        Notification.show("Navigating to " + section);
+    }
+
+    private VerticalLayout createContentLayout() {
+        VerticalLayout contentLayout = new VerticalLayout();
+        contentLayout.setWidth("100%");
+        return contentLayout;
     }
 
     @Override
@@ -53,7 +191,24 @@ public class EmployeeView extends BeanValidationForm<Employee> implements HasUrl
 
     @Override
     protected List<Component> getFormComponents() {
-        return List.of(name);
+        return List.of(
+                mt,
+                fs,
+                firstName,
+                lastName,
+                status,
+                birthday,
+                birthCity,
+                maritalStatus,
+                residenceAddress,
+                phoneNumber,
+                personalEmail,
+                ss,
+                emergencyCName,
+                emergencyCAddress,
+                emergencyCPhone,
+                emergencyCEmail
+        );
     }
 }