<?php
$conexion = mysqli_connect('localhost', 'root', 'BpjysVrFK6LJ5XyW', 'micpu');
$conexion->set_charset("utf8");

$nombreFiltro = isset($_GET['nombre']) ? trim($_GET['nombre']) : '';
$apellidoFiltro = isset($_GET['apellido']) ? trim($_GET['apellido']) : '';
?>

<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8" />
<title>Reportes de Mantenimiento Correctivo</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<style>
body {
    font-family: 'Segoe UI', sans-serif;
    background-color: #f4f6f9;
    padding: 20px;
}
.header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
}
.header .info {
    display: flex;
    align-items: center;
}
.header img {
    height: 60px;
    margin-right: 15px;
}
.header h1 {
    font-size: 1.5rem;
    color: #005e14;
    margin: 0;
}
.header p {
    margin: 0;
    color: #555;
}
.logout {
    text-align: right;
}
.logout a {
    color: #c00;
    text-decoration: none;
    font-weight: bold;
}
.filtros {
    background: #fff;
    padding: 15px;
    border-radius: 8px;
    margin-bottom: 20px;
    box-shadow: 0 2px 6px rgba(0,0,0,0.05);
}
.filtros input, .filtros select, .filtros button {
    padding: 8px;
    margin: 5px;
    border: 1px solid #ccc;
    border-radius: 6px;
}
.grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: 20px;
}
.card {
    background: #fff;
    padding: 15px;
    border-radius: 10px;
    box-shadow: 0 2px 6px rgba(0,0,0,0.05);
}
.card h2 {
    margin: 0 0 10px;
    color: #005e14;
}
.boton {
    padding: 8px 16px;
    margin: 5px;
    border: 1px solid #ccc;
    border-radius: 6px;
    background-color: #e0e0e0;
    cursor: pointer;
    transition: background-color 0.3s ease, border-color 0.3s ease;
    text-decoration: none;
    display: inline-block;
    color: black;
    font-family: inherit;
    font-size: 1rem;
    line-height: 1.5;
    height: 40px;
    box-sizing: border-box;
}
.boton:hover {
    background-color: #a5d6a7;
    border-color: #81c784;
}
.mensaje {
    text-align: center;
    font-size: 1.1rem;
    color: #888;
    margin-top: 30px;
}
</style>
</head>
<body>

<div class="header">
    <div class="info">
        <img src="IMG/imgutsem/micpusinfondo.png" alt="Logo UTSEM">
        <div>
            <h1>Universidad Tecnológica del Sur del Estado de México</h1>
            <p>Departamento de Sistemas - Reportes de Mantenimiento Correctivo</p>
        </div>
    </div>
</div>

<!-- Formulario de filtro -->
<div class="filtros">
    <form method="GET" id="formularioBusqueda">
        <p style="font-weight: bold; display: flex; align-items: center; gap: 8px;">
            <span style="font-size: 1.2rem;">ℹ️</span>
            Para consultar el estatus de tu solicitud, filtra por nombre o apellido del usuario:
        </p>

        <label for="nombre">Nombre:</label>
        <input type="text" name="nombre" id="nombre" value="<?php echo htmlspecialchars($nombreFiltro); ?>" placeholder="Escribe un nombre">

        <label for="apellido">Apellido:</label>
        <input type="text" name="apellido" id="apellido" value="<?php echo htmlspecialchars($apellidoFiltro); ?>" placeholder="Escribe un apellido">

        <button type="submit" class="boton">Buscar</button>
        <button type="button" class="boton" onclick="limpiarFormulario()">Limpiar</button>
        <a href="home.php" class="boton">Regresar a Inicio</a>
    </form>
</div>

<?php
if ($nombreFiltro !== '' || $apellidoFiltro !== '') {
    $query = "SELECT Id, Nombre, Apellidos, Necesidad, Diagnostico, Componente, Actividad, Estatus, fecha FROM mcorrect WHERE 1=1";
    $params = [];
    $types = "";

    if ($nombreFiltro !== '') {
        $query .= " AND Nombre LIKE ?";
        $params[] = "%$nombreFiltro%";
        $types .= "s";
    }

    if ($apellidoFiltro !== '') {
        $query .= " AND Apellidos LIKE ?";
        $params[] = "%$apellidoFiltro%";
        $types .= "s";
    }

    $stmt = $conexion->prepare($query);
    if (!empty($params)) {
        $stmt->bind_param($types, ...$params);
    }
    $stmt->execute();
    $resultado = $stmt->get_result();

    if ($resultado->num_rows > 0) {
        echo '<div class="grid">';
        while ($fila = mysqli_fetch_assoc($resultado)) {
            echo '<div class="card">';
            echo '<p><strong>ID:</strong> ' . htmlspecialchars($fila['Id']) . '</p>';
            echo '<h2>' . htmlspecialchars($fila['Nombre'] . ' ' . $fila['Apellidos']) . '</h2>';
            echo '<p><strong>Fecha de captura:</strong> ' . date("d/m/Y", strtotime($fila['fecha'])) . '</p>';
            echo '<p><strong>Necesidad:</strong> ' . htmlspecialchars($fila['Necesidad']) . '</p>';
            echo '<p><strong>Diagnóstico técnico:</strong> ' . htmlspecialchars($fila['Diagnostico']) . '</p>';
            echo '<p><strong>Requiere componente:</strong> ' . htmlspecialchars($fila['Componente']) . '</p>';
            echo '<p><strong>Actividad:</strong> ' . htmlspecialchars($fila['Actividad']) . '</p>';
            echo '<p><strong>Estatus:</strong> ' . htmlspecialchars($fila['Estatus']) . '</p>';
            echo '</div>';
        }
        echo '</div>';
    } else {
        echo '<div class="mensaje">No se encontraron resultados';
        if ($nombreFiltro !== '') echo ' para <strong>nombre: ' . htmlspecialchars($nombreFiltro) . '</strong>';
        if ($apellidoFiltro !== '') echo ' <strong>apellido: ' . htmlspecialchars($apellidoFiltro) . '</strong>';
        echo '.</div>';
    }
}
?>

<script>
function limpiarFormulario() {
    document.getElementById('nombre').value = '';
    document.getElementById('apellido').value = '';
    window.location.href = window.location.pathname;
}
</script>

</body>
</html>
