<div class="container py-1" style="background-color: white;">


        <ul class="nav nav-tabs" id="myTab" role="tablist">

          <li class="nav-item" role="presentation">
            <button class="nav-link active" id="home-tab" data-bs-toggle="tab" data-bs-target="#home" type="button" role="tab" aria-controls="home" aria-selected="true">Datos</button>
          </li>
          <li class="nav-item" role="presentation">
            <button class="nav-link" id="intervinientes-tab" data-bs-toggle="tab" data-bs-target="#intervinientes" type="button" role="tab" aria-controls="intervinientes" aria-selected="true">Intervinientes</button>
          </li>
          <li class="nav-item" role="presentation">
            <button class="nav-link" id="delitos-tab" data-bs-toggle="tab" data-bs-target="#delitos" type="button" role="tab" aria-controls="delitos" aria-selected="true">Delitos</button>
          </li>
          <li class="nav-item" role="presentation">
            <button class="nav-link" id="Solicitudes-tab" data-bs-toggle="tab" data-bs-target="#Solicitudes" type="button" role="tab" aria-controls="Solicitudes" aria-selected="true">Solicitudes</button>
          </li>
          <li class="nav-item" role="presentation">
            <button class="nav-link" id="Solicitudes-tab" data-bs-toggle="tab" data-bs-target="#Solicitudes" type="button" role="tab" aria-controls="Solicitudes" aria-selected="true">Equipo</button>
          </li>
          <li class="nav-item" role="presentation">
            <button class="nav-link" id="Solicitudes-tab" data-bs-toggle="tab" data-bs-target="#Solicitudes" type="button" role="tab" aria-controls="Solicitudes" aria-selected="true">Notificaciones</button>
          </li>
          <li class="nav-item" role="presentation">
            <button class="nav-link" id="Solicitudes-tab" data-bs-toggle="tab" data-bs-target="#Solicitudes" type="button" role="tab" aria-controls="Solicitudes" aria-selected="true">Actas</button>
          </li>
          <li class="nav-item" role="presentation">
            <button class="nav-link" id="Solicitudes-tab" data-bs-toggle="tab" data-bs-target="#Solicitudes" type="button" role="tab" aria-controls="Solicitudes" aria-selected="true">Video</button>
          </li>
          <li class="nav-item" role="presentation">
            <button class="nav-link" id="Solicitudes-tab" data-bs-toggle="tab" data-bs-target="#Solicitudes" type="button" role="tab" aria-controls="Solicitudes" aria-selected="true">Arcivos</button>
          </li>
        </ul>
        <div class="tab-content" id="myTabContent">
          <div class="tab-pane fade show active" id="home" role="tabpanel" aria-labelledby="home-tab"><?php require_once "audienciaInfo.php";?></div>
          <div class="tab-pane fade  " id="intervinientes" role="tabpanel" aria-labelledby="intervinientes-tab"><?php require_once "card-info-intervinientes.php"; ?></div>
          <div class="tab-pane fade  " id="delitos" role="tabpanel" aria-labelledby="delitos-tab"><?php require_once "card-info-delitos.php"; ?></div>
          <div class="tab-pane fade  " id="Solicitudes" role="tabpanel" aria-labelledby="Solicitudes-tab"><?php require_once "card-info-solicitudes.php"; ?></div>
        </div>
      </div>

 <script>
    // Al cargar el documento
    document.addEventListener("DOMContentLoaded", function () {
        // Obtener el tab activo del localStorage
        var activeTab = localStorage.getItem("activeTab");

        // Si hay un tab activo guardado, activarlo
        if (activeTab) {
            var tabButton = document.getElementById(activeTab);
            var tabPane = document.getElementById(activeTab.replace("-tab", ""));
            if (tabButton && tabPane) {
                // Cambia la clase a active para el botón y la pestaña correspondiente
                tabButton.classList.add("active");
                tabPane.classList.add("show", "active");

                // Remueve la clase active de las demás pestañas
                var otherButtons = document.querySelectorAll('.nav-link');
                otherButtons.forEach(function (button) {
                    if (button !== tabButton) {
                        button.classList.remove("active");
                    }
                });

                var otherPanes = document.querySelectorAll('.tab-pane');
                otherPanes.forEach(function (pane) {
                    if (pane !== tabPane) {
                        pane.classList.remove("show", "active");
                    }
                });
            }
        }

        // Guardar el tab activo al hacer clic en un botón
        var tabButtons = document.querySelectorAll('.nav-link');
        tabButtons.forEach(function (button) {
            button.addEventListener('click', function () {
                localStorage.setItem("activeTab", this.id); // Guarda el ID del botón activo
            });
        });
    });
</script>

Comentarios

Entradas populares de este blog

Libro de gobierno

Sistema de Juzgado con Asignación Equitativa de Turnos

libros de gobierno por un software.