<?php
// registro_bastonera.php
error_reporting(E_ALL);
ini_set('display_errors', 1);
ini_set('display_startup_errors', 1);

// 1. Apuntamos a la ruta real de tu archivo de base de datos
require_once 'modelo/Db.php';
$bd = new clsbdd();

$mensaje = "";
$tipo_mensaje = "";

if ($_SERVER['REQUEST_METHOD'] === 'POST') {
    // 2. Usamos el método interno $bd->esc() para sanitizar de forma segura las entradas
    $bas_cedula             = $bd->esc(trim($_POST['bas_cedula'] ?? ''));
    $bas_nombres            = $bd->esc(mb_strtoupper(trim($_POST['bas_nombres'] ?? ''), 'UTF-8'));
    $bas_apellidos          = $bd->esc(mb_strtoupper(trim($_POST['bas_apellidos'] ?? ''), 'UTF-8'));
    $bas_fecha_nacimiento = $bd->esc($_POST['bas_fecha_nacimiento'] ?? '');
    $bas_correo             = $bd->esc(trim($_POST['bas_correo'] ?? ''));
    
    // Campos individuales de la Alumna
    $bas_telefono           = $bd->esc(trim($_POST['bas_telefono'] ?? ''));
    $bas_telefono_conv    = $bd->esc(trim($_POST['bas_telefono_conv'] ?? ''));
    $bas_nacionalidad     = $bd->esc(mb_strtoupper(trim($_POST['bas_nacionalidad'] ?? 'ECUATORIANA'), 'UTF-8'));
    $bas_direccion        = $bd->esc(mb_strtoupper(trim($_POST['bas_direccion_real'] ?? ''), 'UTF-8'));
    $bas_tiktok             = $bd->esc(trim($_POST['bas_tiktok'] ?? ''));

    // Campos individuales del Representante
    $bas_rep_cedula        = $bd->esc(trim($_POST['bas_rep_cedula'] ?? ''));
    $bas_rep_nombre        = $bd->esc(mb_strtoupper(trim($_POST['bas_rep_nombre_real'] ?? ''), 'UTF-8'));
    $bas_rep_nacionalidad = $bd->esc(mb_strtoupper(trim($_POST['bas_rep_nacionalidad'] ?? 'ECUATORIANA'), 'UTF-8'));
    $bas_rep_telefono      = $bd->esc(trim($_POST['bas_rep_telefono_real'] ?? ''));
    $bas_rep_telefono_conv= $bd->esc(trim($_POST['bas_rep_telefono_conv'] ?? ''));
    $bas_rep_estado_civil = $bd->esc($_POST['bas_rep_estado_civil'] ?? 'SOLTERO/A');
    $bas_rep_profesion    = $bd->esc(mb_strtoupper(trim($_POST['bas_rep_profesion'] ?? ''), 'UTF-8'));
    $bas_rep_ocupacion    = $bd->esc(mb_strtoupper(trim($_POST['bas_rep_ocupacion'] ?? ''), 'UTF-8'));
    
    // Datos médicos / físicos
    $bas_tipo_sangre        = $bd->esc($_POST['bas_tipo_sangre'] ?? '');
    $bas_estatura_cm        = intval($_POST['bas_estatura_cm'] ?? 0);
    $bas_peso_kg            = floatval($_POST['bas_peso_kg'] ?? 0.00);
    $bas_alergias_lesiones = $bd->esc(mb_strtoupper(trim($_POST['bas_alergias_input'] ?? 'NINGUNA'), 'UTF-8'));

    // Validar duplicado de cédula
    $sql_check = "SELECT bas_id FROM bas_bastoneras WHERE bas_cedula = '$bas_cedula'";
    $res_check = $bd->ejecutar($sql_check);

    if ($res_check && $res_check->num_rows > 0) {
        $mensaje = "La cédula de la alumna ya se encuentra registrada en el sistema.";
        $tipo_mensaje = "danger";
    } else {
        
        // --- PROCESAMIENTO DE SUBIDA DE FOTO ---
        $nombre_foto = null;
        if (isset($_FILES['bas_foto']) && $_FILES['bas_foto']['error'] === UPLOAD_ERR_OK) {
            $file_tmp  = $_FILES['bas_foto']['tmp_name'];
            $file_name = $_FILES['bas_foto']['name'];
            $ext       = strtolower(pathinfo($file_name, PATHINFO_EXTENSION));
            
            // Extensiones permitidas
            $allowed = ['jpg', 'jpeg', 'png'];
            if (in_array($ext, $allowed)) {
                // Generar un nombre único seguro para evitar sobreescritura
                $nombre_foto = "bastonera_" . $bas_cedula . "_" . uniqid() . "." . $ext;
                $destino     = "assets/img/fotosbastoneras/" . $nombre_foto;
                
                // Intentar mover el archivo al directorio físico
                if (!move_uploaded_file($file_tmp, $destino)) {
                    $nombre_foto = null; // Si falla la subida, se inserta como NULL o default
                }
            }
        }

        // Se registra mapeando cada nueva columna de forma limpia e independiente
        $sql_insert = "INSERT INTO bas_bastoneras (
            bas_cedula, bas_nombres, bas_apellidos, bas_fecha_nacimiento, 
            bas_correo, bas_telefono, bas_telefono_conv, bas_direccion, 
            bas_nacionalidad, bas_rep_cedula, bas_rep_nombre, bas_rep_nacionalidad, 
            bas_rep_telefono, bas_rep_telefono_conv, bas_rep_estado_civil, 
            bas_rep_profesion, bas_rep_ocupacion, bas_tipo_sangre, 
            bas_estatura_cm, bas_peso_kg, bas_foto, bas_tiktok, 
            bas_alergias_lesiones, bas_fecha_ingreso, bas_estado
        ) VALUES (
            '$bas_cedula', '$bas_nombres', '$bas_apellidos', '$bas_fecha_nacimiento', 
            '$bas_correo', '$bas_telefono', '$bas_telefono_conv', '$bas_direccion', 
            '$bas_nacionalidad', '$bas_rep_cedula', '$bas_rep_nombre', '$bas_rep_nacionalidad', 
            '$bas_rep_telefono', '$bas_rep_telefono_conv', '$bas_rep_estado_civil', 
            '$bas_rep_profesion', '$bas_rep_ocupacion', '$bas_tipo_sangre', 
            $bas_estatura_cm, $bas_peso_kg, " . ($nombre_foto ? "'$nombre_foto'" : "NULL") . ", '$bas_tiktok', 
            '$bas_alergias_lesiones', CURDATE(), 0
        )";

        if ($bd->ejecutar($sql_insert)) {
            $mensaje = "¡Registro enviado con éxito! Su ficha está pendiente de revisión y aprobación por el Administrador.";
            $tipo_mensaje = "success";
        } else {
            $mensaje = "Error al procesar el registro técnico.";
            $tipo_mensaje = "danger";
        }
    }
}
?>
<!DOCTYPE html>
<html lang="es">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Registro de Alumnas | Stage Dance</title>
    <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;600&display=swap" rel="stylesheet">
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
    <style>
        body {
            font-family: 'Poppins', sans-serif;
            background: linear-gradient(135deg, #f26a8d 0%, #111b24 100%);
            min-height: 100vh;
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 40px 15px;
        }
        .reg-card {
            background: rgba(255, 255, 255, 0.98);
            padding: 35px;
            border-radius: 20px;
            box-shadow: 0 15px 35px rgba(0,0,0,0.3);
            width: 100%;
            max-width: 750px;
        }
        .btn-stage {
            background-color: #f26a8d;
            color: white;
            border: none;
            font-weight: 600;
        }
        .btn-stage:hover {
            background-color: #db5375;
            color: white;
        }
        .section-title {
            font-size: 0.85rem;
            letter-spacing: 0.8px;
            border-left: 4px solid #f26a8d;
            padding-left: 10px;
            color: #111b24;
        }
    </style>
</head>
<body>

    <div class="reg-card shadow-lg">
        <div class="text-center mb-4">
            <img src="assets/img/stage.png" alt="Stage Dance Class" style="max-width: 120px; height: auto;">
            <h4 class="fw-bold mt-3">Formulario de Inscripción</h4>
            <p class="text-muted small mb-0">Ingrese los datos para procesar la Ficha Técnica de la Alumna.</p>
        </div>

        <?php if (!empty($mensaje)): ?>
            <div class="alert alert-<?php echo $tipo_mensaje; ?> small py-3 mb-4 text-center" role="alert">
                <i class="fas <?php echo $tipo_mensaje === 'success' ? 'fa-check-circle' : 'fa-times-circle'; ?> me-2"></i>
                <strong><?php echo $mensaje; ?></strong>
            </div>
            <?php if ($tipo_mensaje === 'success'): ?>
                <div class="text-center">
                    <a href="login.php" class="btn btn-stage rounded-pill px-5 py-2 text-uppercase small">Ir al Login</a>
                </div>
            <?php exit(); endif; ?>
        <?php endif; ?>

        <form action="" method="POST" enctype="multipart/form-data" class="needs-validation" autocomplete="off">
            
            <!-- DATOS DE LA ALUMNA Y FOTO -->
            <p class="section-title fw-bold text-uppercase mb-3"><i class="fas fa-user me-2"></i>Datos de la Alumna</p>
            <div class="row g-3 mb-4">
                <div class="col-md-4 text-center border-end pe-md-3 d-flex flex-column align-items-center justify-content-center">
                    <div class="position-relative d-inline-block mb-2">
                        <img id="previewFoto" src="assets/img/default-avatar.png" class="img-thumbnail rounded-circle shadow-sm" style="width: 120px; height: 120px; object-fit: cover; border: 2px solid #f26a8d;">
                        
                        <!-- Botón flotante exclusivo para abrir la cámara -->
                        <button type="button" class="btn btn-stage position-absolute bottom-0 end-0 rounded-circle shadow-sm p-0 d-flex align-items-center justify-content-center" style="width: 38px; height: 38px; border: 2px solid #fff;" onclick="document.getElementById('bas_camara').click();" title="Tomar foto con cámara">
                            <i class="fas fa-camera text-white" style="font-size: 0.9rem;"></i>
                        </button>
                    </div>
                    
                    <label class="form-label text-muted small fw-bold mb-1">Foto de Perfil</label>
                    
                    <!-- Input tradicional para buscar en la galería/archivos -->
                    <input type="file" class="form-control form-control-sm bg-light mb-1" name="bas_foto" id="bas_foto" accept="image/*">
                    
                    <!-- Input oculto exclusivo para forzar la apertura de la cámara en celulares -->
                    <input type="file" class="d-none" id="bas_camara" accept="image/*" capture="environment">
                </div>

                <div class="col-md-8">
                    <div class="row g-3">
                        <div class="col-md-6">
                            <label class="form-label text-muted small fw-bold">Cédula Alumna *</label>
                            <input type="text" name="bas_cedula" class="form-control form-control-sm bg-light" required pattern="[0-9]{10}" placeholder="10 dígitos">
                        </div>
                        <div class="col-md-6">
                            <label class="form-label text-muted small fw-bold">Fecha de Nacimiento *</label>
                            <input type="date" name="bas_fecha_nacimiento" class="form-control form-control-sm bg-light" required>
                        </div>
                        <div class="col-md-6">
                            <label class="form-label text-muted small fw-bold">Nombres Completos *</label>
                            <input type="text" name="bas_nombres" class="form-control form-control-sm bg-light" required>
                        </div>
                        <div class="col-md-6">
                            <label class="form-label text-muted small fw-bold">Apellidos Completos *</label>
                            <input type="text" name="bas_apellidos" class="form-control form-control-sm bg-light" required>
                        </div>
                    </div>
                </div>
            </div>

            <div class="row g-3 mb-4">
                <div class="col-md-4">
                    <label class="form-label text-muted small fw-bold">Nacionalidad Alumna *</label>
                    <input type="text" name="bas_nacionalidad" class="form-control form-control-sm bg-light" value="ECUATORIANA" required>
                </div>
                <div class="col-md-4">
                    <label class="form-label text-muted small fw-bold">Celular Contacto *</label>
                    <input type="text" name="bas_telefono" class="form-control form-control-sm bg-light" required>
                </div>
                <div class="col-md-4">
                    <label class="form-label text-muted small fw-bold">Teléfono Convencional</label>
                    <input type="text" name="bas_telefono_conv" class="form-control form-control-sm bg-light" placeholder="Opcional">
                </div>
                <div class="col-md-6">
                    <label class="form-label text-muted small fw-bold">Correo Electrónico</label>
                    <input type="email" name="bas_correo" class="form-control form-control-sm bg-light">
                </div>
                <div class="col-md-6">
                    <label class="form-label text-muted small fw-bold"><i class="fab fa-tiktok me-1"></i> Usuario TikTok</label>
                    <input type="text" name="bas_tiktok" class="form-control form-control-sm bg-light" placeholder="@usuario">
                </div>
                <div class="col-12">
                    <label class="form-label text-muted small fw-bold">Dirección de Domicilio Completa *</label>
                    <textarea name="bas_direccion_real" class="form-control form-control-sm bg-light text-uppercase" rows="2" placeholder="Ej: Av. Principal y Secundaria, Barrio, N° de Casa" required></textarea>
                </div>
            </div>

            <!-- FICHA DE SALUD Y DATOS FÍSICOS -->
            <p class="section-title fw-bold text-uppercase mb-3"><i class="fas fa-notes-medical me-2"></i>Ficha de Salud y Datos Físicos</p>
            <div class="row g-3 mb-4">
                <div class="col-md-4">
                    <label class="form-label text-muted small fw-bold">Tipo de Sangre</label>
                    <select name="bas_tipo_sangre" class="form-select form-select-sm bg-light">
                        <option value="">Seleccione...</option>
                        <option value="O+">O+</option><option value="O-">O-</option>
                        <option value="A+">A+</option><option value="A-">A-</option>
                        <option value="B+">B+</option><option value="B-">B-</option>
                        <option value="AB+">AB+</option><option value="AB-">AB-</option>
                        <option value="OTRO">No sé / Otro</option>
                    </select>
                </div>
                <div class="col-md-4">
                    <label class="form-label text-muted small fw-bold">Estatura (cm)</label>
                    <input type="number" name="bas_estatura_cm" class="form-control form-control-sm bg-light" placeholder="Ej: 162">
                </div>
                <div class="col-md-4">
                    <label class="form-label text-muted small fw-bold">Peso (kg)</label>
                    <input type="number" step="0.01" name="bas_peso_kg" class="form-control form-control-sm bg-light" placeholder="Ej: 50.5">
                </div>
                <div class="col-12">
                    <label class="form-label text-muted small fw-bold">Padece Enfermedades, Alergias o Lesiones Médicas</label>
                    <textarea name="bas_alergias_input" class="form-control form-control-sm bg-light" rows="2" placeholder="Describa si padece asma, alergias específicas, etc."></textarea>
                </div>
            </div>

            <!-- DATOS DEL REPRESENTANTE -->
            <p class="section-title fw-bold text-uppercase mb-3"><i class="fas fa-users me-2"></i>Representante / Acceso Familiar</p>
            <div class="row g-3 mb-4">
                <div class="col-md-6">
                    <label class="form-label text-muted small fw-bold">Cédula del Representante *</label>
                    <input type="text" name="bas_rep_cedula" class="form-control form-control-sm bg-light" required placeholder="Cédula de identidad">
                </div>
                <div class="col-md-6">
                    <label class="form-label text-muted small fw-bold">Nacionalidad Representante *</label>
                    <input type="text" name="bas_rep_nacionalidad" class="form-control form-control-sm bg-light" value="ECUATORIANA" required>
                </div>
                <div class="col-md-6">
                    <label class="form-label text-muted small fw-bold">Nombre Completo Representante *</label>
                    <input type="text" name="bas_rep_nombre_real" class="form-control form-control-sm bg-light" required placeholder="Nombres y Apellidos">
                </div>
                <div class="col-md-3">
                    <label class="form-label text-muted small fw-bold">Celular / WhatsApp *</label>
                    <input type="text" name="bas_rep_telefono_real" class="form-control form-control-sm bg-light" required>
                </div>
                <div class="col-md-3">
                    <label class="form-label text-muted small fw-bold">Teléf. Convencional</label>
                    <input type="text" name="bas_rep_telefono_conv" class="form-control form-control-sm bg-light" placeholder="Opcional">
                </div>
                <div class="col-md-4">
                    <label class="form-label text-muted small fw-bold">Estado Civil Representante</label>
                    <select name="bas_rep_estado_civil" class="form-select form-select-sm bg-light">
                        <option value="SOLTERO/A">Soltero/a</option>
                        <option value="CASADO/A">Casado/a</option>
                        <option value="DIVORCIADO/A">Divorciado/a</option>
                        <option value="UNIÓN DE HECHO">Unión de Hecho</option>
                        <option value="VIUDO/A">Viudo/a</option>
                    </select>
                </div>
                <div class="col-md-4">
                    <label class="form-label text-muted small fw-bold">Profesión</label>
                    <input type="text" name="bas_rep_profesion" class="form-control form-control-sm bg-light" placeholder="Ej: Ingeniero, Licenciado">
                </div>
                <div class="col-md-4">
                    <label class="form-label text-muted small fw-bold">Ocupación Actual</label>
                    <input type="text" name="bas_rep_ocupacion" class="form-control form-control-sm bg-light" placeholder="Ej: Empleado Privado, Comerciante">
                </div>
            </div>

            <div class="row g-2 mt-2">
                <div class="col-6">
                    <a href="login.php" class="btn btn-light btn-sm w-100 rounded-pill text-muted fw-bold py-2"><i class="fas fa-arrow-left me-2"></i> Cancelar</a>
                </div>
                <div class="col-6">
                    <button type="submit" class="btn btn-stage btn-sm w-100 rounded-pill shadow-sm py-2 text-uppercase">Enviar Registro</button>
                </div>
            </div>
        </form>
    </div>

    <script>
    document.addEventListener('DOMContentLoaded', function() {
        const inputFoto = document.getElementById('bas_foto');
        const inputCamara = document.getElementById('bas_camara');
        const previewFoto = document.getElementById('previewFoto');

        // Función auxiliar para actualizar la vista previa y asignar el archivo al input principal del formulario
        function procesarArchivo(file) {
            if (file) {
                const reader = new FileReader();
                reader.onload = function(e) {
                    previewFoto.setAttribute('src', e.target.result);
                }
                reader.readAsDataURL(file);
            }
        }

        // Si el usuario selecciona una foto de la galería/archivos
        if (inputFoto) {
            inputFoto.addEventListener('change', function() {
                if (this.files && this.files[0]) {
                    procesarArchivo(this.files[0]);
                }
            });
        }

        // Si el usuario toma la foto con el botón flotante de la cámara
        if (inputCamara) {
            inputCamara.addEventListener('change', function() {
                if (this.files && this.files[0]) {
                    const file = this.files[0];
                    procesarArchivo(file);

                    // Truco técnico: Transferimos el archivo tomado por la cámara al input principal (bas_foto) 
                    // para que PHP lo reciba correctamente al enviar el formulario.
                    const dataTransfer = new DataTransfer();
                    dataTransfer.items.add(file);
                    inputFoto.files = dataTransfer.files;
                }
            });
        }
    });
    </script>
</body>
</html>