# Funcionalidad de Fotos de Empleados

## Descripción
La funcionalidad de fotos permite:
- Subir fotos de empleados al sistema
- Mostrar vista previa en tiempo real al seleccionar una imagen
- Mostrar foto de perfil en la lista de empleados (circular, 50x50px)
- Mostrar foto ampliada (150x150px) en el formulario de detalle
- Fallback automático a imagen por defecto si no hay foto

## Instalación

### 1. Ejecutar el Script de Instalación
Acceda a: `http://localhost/erp/instalar_fotos_empleados.php`

Este script hace lo siguiente:
- Agrega la columna `foto_filename` a la tabla `empleados`
- Crea el directorio `/fotos` si no existe
- Genera la imagen por defecto (default.png)

### 2. Alternativa: Ejecutar SQL Manualmente
Si prefiere ejecutar la migración manualmente, ejecute en MySQL:

```sql
ALTER TABLE empleados 
ADD COLUMN foto_filename VARCHAR(255) NULL 
AFTER numero_cuenta_banco;
```

### 3. Crear Directorio Manualmente
Si el directorio `/fotos` no se crea automáticamente:
```
mkdir c:\xampp\htdocs\erp\fotos
```

## Características

### Validación de Fotos
- **Tamaño máximo**: 5MB
- **Formatos permitidos**: JPG, PNG, GIF, WebP
- **Dimensiones recomendadas**: 200x200px mínimo
- **Almacenamiento**: Directorio `/fotos` de la aplicación

### Formato de Almacenamiento
Las fotos se guardan con el siguiente formato de nombre:
```
EMP_[timestamp]_[uniqid].[extension]
Ejemplo: EMP_1703001234_507c1234567890_jpg
```

### Vista Previa en Tiempo Real
Cuando selecciona una foto:
1. Se valida el archivo (tipo y tamaño)
2. Se muestra vista previa en la sección "Foto de Empleado"
3. Los errores se muestran en alertas del navegador

### Imagen por Defecto
La imagen por defecto (default.png):
- Dimensiones: 200x200px
- Formato: PNG
- Contenido: Avatar genérico (círculo gris con silueta blanca)
- Ubicación: `/fotos/default.png`

## Uso

### Crear Empleado con Foto
1. Vaya a "Nuevo Empleado"
2. Rellene los datos obligatorios
3. En la sección "Foto de Empleado":
   - Haga clic en "Seleccionar archivo"
   - Elija una imagen (JPG, PNG, GIF)
   - La vista previa aparecerá automáticamente
4. Haga clic en "Guardar"

### Actualizar Foto de Empleado
1. Vaya a "Editar Empleado"
2. Scroll hasta la sección "Foto de Empleado"
3. Haga clic en "Seleccionar archivo"
4. Elija una nueva imagen
5. La vista previa mostrará la nueva imagen
6. Haga clic en "Guardar"

### Cambiar o Eliminar Foto
- Para cambiar: Seleccione una nueva imagen como se describe arriba
- Para eliminar: No cargue un archivo nuevo y el sistema mantiene la foto existente
- Para usar la imagen por defecto: Elimine el archivo de foto del servidor

## Estructura de Archivos

```
/erp/
├── empleados.php           # Módulo principal (modificado)
├── fotos/                  # Directorio de almacenamiento
│   ├── default.png         # Imagen por defecto
│   └── EMP_*.{jpg|png|...} # Fotos de empleados
├── instalar_fotos_empleados.php    # Script de instalación
└── verificar_fotos_empleados.php   # Script de verificación
```

## Resolución de Problemas

### Problema: "Directorio /fotos no es escribible"
- Solución: Ejecutar `instalar_fotos_empleados.php`
- Alternativa: Establecer permisos manualmente (755 en Linux)

### Problema: "Tipo de archivo no permitido"
- Asegúrese que la imagen sea: JPG, PNG, GIF o WebP
- Revise que la extensión sea correcta

### Problema: "El archivo es demasiado grande"
- Reduzca el tamaño de la imagen a menos de 5MB
- Use herramientas como ImageOptim o TinyPNG

### Problema: Vista previa no aparece
- Asegúrese que JavaScript esté habilitado
- Intente actualizar la página
- Intente con un navegador diferente

### Problema: Foto no se guarda
- Verifique que el directorio `/fotos` sea escribible
- Revise los errores en la consola del navegador
- Verifique los logs del servidor

## Base de Datos

La columna agregada a `empleados`:
- **Nombre**: `foto_filename`
- **Tipo**: VARCHAR(255)
- **Nullable**: SÍ
- **Valor por defecto**: NULL

El campo almacena solo el nombre del archivo, no la ruta completa.
Las fotos se sirven desde: `/erp/fotos/{nombre_archivo}`

## Notas de Seguridad

1. **Validación en Cliente y Servidor**: Se valida el tipo y tamaño en ambos lados
2. **Nombres Únicos**: Se usan timestamps y uniqid() para evitar colisiones
3. **Extensión Preservada**: Se mantiene la extensión original del archivo
4. **Ruta Segura**: Las fotos NO se guardan en rutas accesibles directamente del $_FILES

## Compatibilidad

- PHP 5.4+ (para move_uploaded_file)
- PHP 7.4+ (recomendado)
- GD Library (para generar imagen por defecto)
- MySQL 5.5+
- Navegadores modernos con soporte de File API

## Funciones JavaScript

### previewFoto(input)
Muestra la vista previa de la foto seleccionada.

**Parámetros:**
- `input` (HTMLInputElement): El input file element

**Validaciones:**
- Máximo 5MB
- Solo formatos permitidos
- Muestra alertas si hay errores

## API de Archivos

### Archivos Creados/Modificados

1. **empleados.php** (Modificado)
   - Agregado enctype="multipart/form-data"
   - Agregado input file para foto
   - Agregada validación JavaScript
   - Agregado manejo de foto en POST CREATE
   - Agregado manejo de foto en POST UPDATE
   - Agregada columna foto en tabla de lista
   - Agregadas rutas de foto en vista previa

2. **instalar_fotos_empleados.php** (Nuevo)
   - Agrega columna a BD
   - Crea directorio /fotos
   - Genera imagen por defecto

3. **verificar_fotos_empleados.php** (Nuevo)
   - Verifica estado de la instalación
   - Diagnostica problemas

4. **agregar_foto_empleados.sql** (Nuevo)
   - Script SQL para ejecutar manualmente

## Última Actualización
- Fecha: Actual
- Versión: 1.0
- Función: Soporte completo para fotos de empleados