<!doctype html>
<?php
    session_start(); // Iniciar la sesión
    // Verifica si la sesión 'cedula' está iniciada
    if (!isset($_SESSION['cedula'])) {
        // Si no hay una sesión iniciada, redirige a login.php con un mensaje
        header("Location: login.php?mensaje=" . urlencode("Debe iniciar sesión para poder ver esta página"));
        exit(); // Asegurarse de que el script se detenga aquí
    } else {
        // Verifica si la sesión 'tipo' está definida y es igual a "paciente"
        if (isset($_SESSION['tipo']) && $_SESSION['tipo'] == "Especialista") {
             // El usuario tiene sesión iniciada, pero no es de tipo "paciente"
            header("Location: login.php?mensaje=" . urlencode("Debe tener privilegios de Paciente para poder ver esta página"));
            exit(); // Asegurarse de que el script se detenga aquí
        } else {
        }
    }
    include('conexion.php');
    include('menus.php');
    sesion_paciente();
?>
<html class="no-js" lang="zxx">
    <?php
        
        head_1();
    ?>
    <body>
        <?php
            menu_registro();
            vericar_sesion ();
        ?>
        <section class="appointment">
            <div class="container">
                <div class="row">
                    <div class="col-lg-12">
                        <div class="section-title">
                            <h2>¿Necesitas un medicamento? Solicítalo aquí</h2>
                            <img src="img/section-img.png" alt="#">
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="mdl-js-ripple-effect">
                        <div class="mdl-tabs__tab-bar" >
                            <a href="nuevo_medicamento.php" class="mdl-tabs__tab is-active" style="background-color: #7c2b83; color: white;">NUEVO</a>
                            <a href="medicamentos.php" class="mdl-tabs__tab" style="background-color: #7c2b83; color: white;">LISTADO</a>
                        </div>
                        <?php
                        $sql = "SELECT medicamento_id, nombre, unidades, descripcion, administracion, presentacion, cantidad, fecha_vencimiento, categoria, estado, Stock, imagen FROM medicamentos";
                        $result = $conn->query($sql);
                        ?>
                        <div class="mdl-tabs__panel" id="tabListProducts">
                            <div class="mdl-grid">
                                <div class="mdl-cell mdl-cell--4-col-phone mdl-cell--8-col-tablet mdl-cell--12-col-desktop">
                                    <form action="#">
                                        <div class="mdl-textfield mdl-js-textfield mdl-textfield--expandable">
                                            <label class="mdl-button mdl-js-button mdl-button--icon" for="searchProduct">
                                                <i class="zmdi zmdi-search"></i>
                                            </label>
                                            <div class="mdl-textfield__expandable-holder">
                                                <input class="mdl-textfield__input" type="text" id="searchProduct" placeholder="Buscar producto...">
                                                <label class="mdl-textfield__label"></label>
                                            </div>
                                        </div>
                                    </form>
                                    <nav class="full-width menu-categories">
                                        <ul class="list-unstyle text-center" id="categoryList">
                                            <li><a href="#" data-category="Analgésicos">Analgésicos</a></li>
                                            <li><a href="#" data-category="Anticoagulantes">Anticoagulantes</a></li>
                                            <li><a href="#" data-category="Antihipertensivos">Antihipertensivos</a></li>
                                            <li><a href="#" data-category="Antiinflamatorios">Antiinflamatorios</a></li>
                                            <li><a href="#" data-category="Antipalúdicos">Antipalúdicos</a></li>
                                            <li><a href="#" data-category="Corticosteroides">Corticosteroides</a></li>
                                            <li><a href="#" data-category="Inmunomoduladores">Inmunomoduladores</a></li>
                                            <li><a href="#" data-category="Inmunosupresores">Inmunosupresores</a></li>
                                        </ul>
                                    </nav>
                                    <div id="productList" class="mdl-grid full-width text-center" style="padding: 30px 0; display: flex; justify-content: center; flex-wrap: wrap;">
                                        <?php
                                        if ($result->num_rows > 0) {
                                            while ($row = $result->fetch_assoc()) {
                                                echo '<div class="mdl-cell mdl-cell--4-col mdl-card mdl-shadow--2dp full-width product-card" style="margin: 10px;" data-category="' . $row["categoria"] . '">';
                                                echo '    <div class="mdl-card mdl-shadow--2dp full-width">';
                                                echo '      <div class="mdl-card__title">';
                                                echo '        <img src="' . $row["imagen"] . '" alt="product" class="img-responsive">';
                                                echo '      </div>';
                                                echo '      <div class="mdl-card__supporting-text">';
                                                echo '        <small><strong>Nombre:</strong> ' . $row["nombre"] . '</small><br>';
                                                echo '        <small><strong>Unidades:</strong> ' . $row["unidades"] . '</small><br>';
                                                echo '        <small><strong>Descripción:</strong> ' . $row["descripcion"] . '</small><br>';
                                                echo '        <small><strong>Forma de Administración:</strong> ' . $row["administracion"] . '</small><br>';
                                                echo '        <small><strong>Presentación:</strong> ' . $row["presentacion"] . '</small><br>';
                                                echo '        <small><strong>Cantidad:</strong> ' . $row["cantidad"] . '</small><br>';
                                                echo '        <small><strong>Fecha de Vencimiento:</strong> ' . $row["fecha_vencimiento"] . '</small><br>';
                                                echo '        <small><strong>Categoría:</strong> ' . $row["categoria"] . '</small><br>';
                                                echo '        <small><strong>Estado:</strong> ' . $row["estado"] . '</small><br>';
                                                echo '        <small><strong>Stock:</strong> ' . $row["Stock"] . '</small>';
                                                echo '      </div>';
                                                echo '      <div class="mdl-card__actions mdl-card--border">';
                                                echo '        <strong>' . $row["nombre"] . ' - ' . $row["unidades"] . '</strong>';
                                                echo '        <button class="mdl-button mdl-button--icon mdl-js-button mdl-js-ripple-effect">';
                                                echo '            <i class="zmdi zmdi-more"></i>';
                                                echo '        </button>';
                                                echo '      </div>';
                                                echo '     
                                                </div>';
                                                echo '</div>';
                                            }
                                        } else {
                                            echo "No hay productos disponibles";
                                        }
                                        ?>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-6 col-md-12 ">
                        <div class="appointment-image">
                            <img src="img/contact-img.png" alt="#">
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <?php
            footer_1();
        ?>
        <script>
            document.getElementById("searchProduct").addEventListener("keyup", function () {
                let searchQuery = this.value.toLowerCase();
                let products = document.querySelectorAll("#productList .product-card");
                products.forEach(product => {
                    let productName = product.querySelector(".mdl-card__actions strong").innerText.toLowerCase();
                    if (productName.includes(searchQuery)) {
                        product.style.display = "flex";
                    } else {
                        product.style.display = "none";
                    }
                });
            });
            document.querySelectorAll("#categoryList a").forEach(category => {
                category.addEventListener("click", function (e) {
                    e.preventDefault();
                    let selectedCategory = this.getAttribute("data-category");
                    let products = document.querySelectorAll("#productList .product-card");
                    products.forEach(product => {
                        if (product.getAttribute("data-category") === selectedCategory) {
                            product.style.display = "flex";
                        } else {
                            product.style.display = "none";
                        }
                    });
                });
            });
        </script>
        <script>
            document.getElementById("formulario").addEventListener("submit", function(event) {
                let select = document.getElementById("nombre1");
                if (!select.checkValidity()) {
                    event.preventDefault();
                    select.reportValidity(); // Muestra el mensaje nativo del navegador
                }
            });
        </script>
    </body>
</html>