# 📋 Declaración de Información de Familiares

## 📱 Nuevo Tab Agregado al Formulario

Se agregó un **tercer tab** al formulario móvil de actualización de datos para que los trabajadores declaren información sobre sus familiares.

### 🎯 Tabs del Formulario (Ahora 3)

```
┌──────────────────────────────────────────────────────┐
│  [📍 Personales]  [🎓 Educación]  [👥 Familiares]   │
└──────────────────────────────────────────────────────┘
```

## 📝 Secciones de Declaración de Familiares

### 1️⃣ **Funcionarios Públicos**

**Pregunta:**
¿Es usted o su cónyuge (o conviviente), familiar hasta el cuarto grado de consanguinidad y segundo de afinidad de algún funcionario público?

**Parentesco por consanguinidad:**
- Grado 1°: Padre/Madre, Hijo/Hija
- Grado 2°: Abuelo/Abuela, Hermano/Hermana, Nieto/Nieta
- Grado 3°: Bisabuelo/Bisabuela, Tío/Tía, Sobrino/Sobrina, Biznieto/Biznieta
- Grado 4°: Primos, Tíos abuelos

**Parentesco por afinidad:**
- Esposo/Esposa
- Grado 1°: Suegro/Suegra, Yerno/Nuera
- Grado 2°: Cuñado/Cuñada

**Datos a capturar (si responde Sí):**
- Número de familiares funcionarios públicos (1-10)
- Por cada familiar:
  - Apellidos y Nombres
  - Parentesco (select con opciones predefinidas)
  - Entidad en la que labora
  - Cargo

### 2️⃣ **Trabajadores de SMCV**

**Pregunta:**
¿Es usted o su cónyuge (o conviviente), familiar de algún trabajador de Sociedad Minera Cerro Verde?

**Datos a capturar (si responde Sí):**
- Número de familiares (1-10)
- Por cada familiar:
  - Apellidos y Nombres
  - Parentesco (Prima, Tío, Padre, Madre, Hermano, Hijo, Esposo, Otro)
  - Área en la que labora su familiar (Mantenimiento Mina Acarreo, Operaciones, Administración, etc.)

### 3️⃣ **Relación Familiar / Empresarial con Contratistas**

**Pregunta:**
¿Tiene usted o su cónyuge (o conviviente) relación familiar o empresarial con alguna de las empresas contratistas de SMCV?

**Datos a capturar (si responde Sí):**
- Número de relaciones (1-10)
- Por cada relación:
  - Apellidos y Nombres
  - Parentesco / Tipo de Relación (Familiar, Socio, Accionista, Representante Legal, Otro)
  - Empresa Contratista
  - Cargo

## 🗄️ Estructura de Datos

### Base de Datos

**Tabla: `user_workers`**
```sql
ALTER TABLE user_workers
ADD COLUMN family_declaration JSON NULL AFTER education_documents;
```

**Tabla: `worker_data_updates`**
```sql
ALTER TABLE worker_data_updates
ADD COLUMN family_data JSON NULL AFTER education_data;

ALTER TABLE worker_data_updates
MODIFY COLUMN update_type ENUM('personal', 'education', 'family', 'both');
```

### Formato JSON Almacenado

```json
{
  "has_public_officials": true,
  "public_officials": [
    {
      "full_name": "Juan Pérez García",
      "relationship": "Tío (a)",
      "institution": "Fuerza Aérea del Perú",
      "position": "Capitán FAP"
    }
  ],
  "has_smcv_workers": true,
  "smcv_workers": [
    {
      "full_name": "María López",
      "relationship": "Prima (a)",
      "area": "Mantenimiento Mina Acarreo"
    }
  ],
  "has_contractor_relations": false,
  "contractor_relations": []
}
```

## 🎨 Características del Diseño

### Visual

- **Colores por sección:**
  - Funcionarios Públicos: Indigo (índigo-500 a índigo-600)
  - Trabajadores SMCV: Verde (green-500 a green-600)
  - Relación Contratistas: Naranja (orange-500 a orange-600)

- **Iconos:**
  - Funcionarios Públicos: Badge/Escudo
  - Trabajadores SMCV: Grupo de personas
  - Relación Contratistas: Grupo de personas con empresa

### Interactividad

- **Pregunta Sí/No inicial** en cada sección
- **Formulario detallado** se muestra solo si responde "Sí" (con animación slide-in)
- **Select de cantidad**: Usuario indica cuántos familiares/relaciones declarar
- **Formularios dinámicos**: Se generan tantos bloques como cantidad indicada
- **Validación en tiempo real**: Campos obligatorios solo si responde "Sí"

### Mobile-First

- **Tabs responsivos**: 3 tabs en diseño compacto (texto más pequeño, iconos más pequeños)
- **Indicador animado**: Barra azul se mueve al 33.333% de ancho entre 3 posiciones (0%, 100%, 200%)
- **Formularios apilados**: Diseño vertical optimizado para scroll en móvil
- **Botones grandes**: Áreas táctiles de mínimo 44x44px

## 💾 Componentes Creados

### Backend

**1. Livewire Component**
```
app/Livewire/WorkerDataUpdate/FamilyRelationsForm.php
```

Características:
- Manejo de estado para 3 secciones independientes
- Validación condicional (required_if cuando responde "Sí")
- Arrays dinámicos que se ajustan según cantidad indicada
- Auto-aprobación de cambios
- Emisión de eventos para notificaciones

**2. Modelo UserWorker**
```
app/Models/UserWorker.php
```

Agregado:
- `family_declaration` en fillable
- Cast a array para JSON

**3. Modelo WorkerDataUpdate**
```
app/Models/WorkerDataUpdate.php
```

Agregado:
- `family_data` en fillable
- Cast a array para JSON
- Actualización de `applyChangesToWorker()` para aplicar declaración de familiares

### Frontend

**1. Vista Livewire**
```
resources/views/livewire/worker-data-update/family-relations-form.blade.php
```

Características:
- Diseño mobile-first con gradientes
- 3 secciones colapsables con Sí/No
- Selects dinámicos de cantidad
- Formularios repetidos por cada familiar/relación
- Validación con mensajes de error
- Mensaje de éxito con auto-close
- Botón de guardado con loading state

**2. Vista Principal**
```
resources/views/public/worker-data/index-mobile.blade.php
```

Modificaciones:
- Agregado tercer tab "Familiares" con icono de grupo de personas
- Indicador ajustado para 3 tabs (33.333% width)
- Transform calculado dinámicamente (0%, 100%, 200%)
- Componente Livewire family-relations-form integrado

### Migraciones

**1. Agregar campo a user_workers**
```
database/migrations/2026_06_04_000001_add_family_declaration_fields_to_user_workers_table.php
```

**2. Agregar campo a worker_data_updates**
```
database/migrations/2026_06_04_000002_add_family_data_to_worker_data_updates_table.php
```

**3. Actualizar enum de update_type**
```
database/migrations/2026_06_04_000003_update_worker_data_updates_update_type_enum.php
```

## 🚀 Flujo de Trabajo

### 1. Trabajador Accede al Formulario
```
http://informados.test/trabajadores/actualizar/{codigo_encriptado}
```

### 2. Navega al Tab "Familiares"
- Click en tercer tab
- Indicador azul se mueve a la tercera posición (transform: 200%)

### 3. Completa las 3 Secciones

**Funcionarios Públicos:**
1. Selecciona "Sí" o "No"
2. Si "Sí": Indica cantidad (1-10)
3. Completa formulario por cada uno

**Trabajadores SMCV:**
1. Selecciona "Sí" o "No"
2. Si "Sí": Indica cantidad (1-10)
3. Completa formulario por cada uno

**Relación con Contratistas:**
1. Selecciona "Sí" o "No"
2. Si "Sí": Indica cantidad (1-10)
3. Completa formulario por cada uno

### 4. Guarda la Declaración
- Click en botón "Guardar Declaración de Familiares"
- Loading state mientras procesa
- Se crea registro en `worker_data_updates` con:
  - `update_type` = 'family'
  - `family_data` = JSON con todas las declaraciones
  - `status` = 'auto_approved'
  - IP y user agent para auditoría
- Se aplica automáticamente a `user_workers.family_declaration`
- Mensaje de éxito se muestra y desaparece en 5 segundos

### 5. Admin Revisa (Opcional)
- Accede a `/admin/worker-data-updates`
- Filtra por tipo "family"
- Ve historial completo de declaraciones
- Puede filtrar, exportar, analizar

## ✅ Validaciones Implementadas

### Globales
- `has_public_officials`: required, boolean
- `has_smcv_workers`: required, boolean
- `has_contractor_relations`: required, boolean

### Condicionales (solo si responde "Sí")

**Funcionarios Públicos:**
- `full_name`: required_if, string, max:255
- `relationship`: required_if, string, max:100
- `institution`: required_if, string, max:255
- `position`: required_if, string, max:255

**Trabajadores SMCV:**
- `full_name`: required_if, string, max:255
- `relationship`: required_if, string, max:100
- `area`: required_if, string, max:255

**Relación Contratistas:**
- `full_name`: required_if, string, max:255
- `relationship`: required_if, string, max:100
- `company`: required_if, string, max:255
- `position`: required_if, string, max:255

## 📊 Casos de Uso

### Caso 1: No tiene ninguna relación
```
Trabajador:
- Funcionarios Públicos: No
- Trabajadores SMCV: No
- Relación Contratistas: No

JSON guardado:
{
  "has_public_officials": false,
  "public_officials": [],
  "has_smcv_workers": false,
  "smcv_workers": [],
  "has_contractor_relations": false,
  "contractor_relations": []
}
```

### Caso 2: Tiene 2 familiares funcionarios y 1 en SMCV
```
Trabajador:
- Funcionarios Públicos: Sí (2)
  1. Juan Pérez - Tío - Fuerza Aérea - Capitán
  2. María García - Prima - SUNAT - Auditora
- Trabajadores SMCV: Sí (1)
  1. Carlos López - Hermano - Operaciones
- Relación Contratistas: No

JSON guardado incluye los 3 arreglos con sus datos completos
```

## 🔧 Próximos Pasos

1. **Ejecutar migraciones**:
   ```bash
   php artisan migrate
   ```

2. **Probar formulario**:
   - Generar código de prueba
   - Acceder al formulario
   - Navegar al tab Familiares
   - Completar declaración
   - Guardar y verificar en BD

3. **Revisar en admin panel**:
   - Ver registro en worker_data_updates
   - Verificar JSON almacenado
   - Confirmar auto-aprobación

## 📱 Vista Final

El formulario móvil ahora tiene esta estructura:

```
┌─────────────────────────────────────────────┐
│  Actualización de Datos                     │
│  JUAN CARLOS GARCÍA PÉREZ                   │
├─────────────────────────────────────────────┤
│  Registro: T001234    DNI: 12345678         │
├─────────────────────────────────────────────┤
│  [📍] [🎓] [👥]  ← 3 tabs compactos         │
│   ─── indicador se mueve entre los 3        │
├─────────────────────────────────────────────┤
│  Tab Familiares:                            │
│                                             │
│  ┌───────────────────────────────────────┐ │
│  │ 🔵 1. Funcionarios Públicos           │ │
│  │ [Pregunta] [Sí/No]                    │ │
│  │ [Formularios dinámicos si Sí]         │ │
│  └───────────────────────────────────────┘ │
│                                             │
│  ┌───────────────────────────────────────┐ │
│  │ 🟢 2. Trabajadores SMCV               │ │
│  │ [Pregunta] [Sí/No]                    │ │
│  │ [Formularios dinámicos si Sí]         │ │
│  └───────────────────────────────────────┘ │
│                                             │
│  ┌───────────────────────────────────────┐ │
│  │ 🟠 3. Relación Contratistas           │ │
│  │ [Pregunta] [Sí/No]                    │ │
│  │ [Formularios dinámicos si Sí]         │ │
│  └───────────────────────────────────────┘ │
│                                             │
│  [💾 Guardar Declaración de Familiares]    │
└─────────────────────────────────────────────┘
```

## 🎉 Características Destacadas

✅ **3 Secciones Independientes**: Cada una con su pregunta Sí/No
✅ **Formularios Dinámicos**: Cantidad ajustable de 1 a 10
✅ **Mobile-First**: Diseño optimizado para pantallas pequeñas
✅ **Validación Condicional**: Solo requiere datos si responde "Sí"
✅ **Auto-Aprobación**: Cambios se aplican automáticamente
✅ **Auditoría Completa**: IP, user agent, fechas
✅ **Animaciones Suaves**: Transiciones en tabs y formularios
✅ **Colores Diferenciados**: Cada sección con su color distintivo
✅ **JSON Estructurado**: Datos bien organizados para análisis posterior