Commit ff35e300 authored by Alfonso Rafael Solis Rangel's avatar Alfonso Rafael Solis Rangel
Browse files

Implementacion de niceselect

parent 3afc4b97

resources/views/adminGen/contactos/export.blade.php

+29 −9
Original line number Diff line number Diff line 
<meta name="_token" content="{{ csrf_token() }}">

<x-layout.default>

    <script src="/assets/js/simple-datatables.js"></script>

    <link rel='stylesheet' type='text/css' href='{{ Vite::asset("resources/css/nice-select2.css") }}'>

    <link rel="stylesheet" href="{{ Vite::asset('resources/css/swiper-bundle.min.css') }}">

    <script src="/assets/js/swiper-bundle.min.js"></script>

    <div x-data="contactos">
@@ -14,8 +14,8 @@ 
        </ul>

        <div class="panel mt-6">

            <p><b>Nota: </b>Este módulo aun se encuentra en desarrollo, por lo que podría haber errores.</p>

            <div class="p-6 bg-gray-100 rounded-lg shadow-md">

                <form method="GET" action="" class="space-y-4" onsubmit="event.preventDefault(); logData();">

            <div class="p-6 bg-gray-100 rounded-lg shadow-md w-full">

                <form method="GET" action="" class="space-y-4 w-full" onsubmit="event.preventDefault(); logData();">



                    <!-- Contacto -->

                    <div class="flex items-center space-x-2">
@@ -31,7 +31,7 @@ class="w-full px-3 py-2 bg-white border border-gray-300 rounded-md" 
                    <!-- Grupos -->

                    <div class="flex flex-col space-y-2">

                        <label for="grupos" class="text-gray-700 font-semibold">Grupos:</label>

                        <div class="flex space-x-2">

                        <div class="w-full">

                            <select id="grupos" class="w-full px-3 py-2 bg-white border border-gray-300 rounded-md" onchange="cargarSubgrupos(this.value)">

                                <option value="" selected>Selecciona un grupo</option>

                                @foreach($grupos as $grupo)
@@ -44,8 +44,8 @@ class="w-full px-3 py-2 bg-white border border-gray-300 rounded-md" 
                    <!-- Subgrupos -->

                    <div class="flex flex-col space-y-2">

                        <label for="subgrupos" class="text-gray-700 font-semibold">Subgrupos:</label>

                        <div class="flex space-x-2">

                            <select id="subgrupos" class="w-full px-3 py-2 bg-white border border-gray-300 rounded-md">

                        <div class="flex justify-between space-x-2 w-full">

                            <select id="subgrupos" class="flex-grow px-3 py-2 bg-white border border-gray-300 rounded-md">

                                <option value="" disabled selected>Selecciona un subgrupo</option>

                                @foreach($subgrupos as $subgrupo)

                                    <option value="{{ $subgrupo->id }}">{{ $subgrupo->nombre }}</option>
@@ -59,7 +59,7 @@ class="w-full px-3 py-2 bg-white border border-gray-300 rounded-md" 
                    <!-- Rango de fechas -->

                    <div class="flex flex-col space-y-2">

                        <label for="fechaInicio" class="text-gray-700 font-semibold">Rango de Fechas:</label>

                        <div class="flex space-x-2">

                        <div class="flex space-x-2 w-full">

                            <input type="date" id="fechaInicio" class="w-full px-3 py-2 bg-white border border-gray-300 rounded-md">

                            <input type="date" id="fechaFin" class="w-full px-3 py-2 bg-white border border-gray-300 rounded-md">

                        </div>
@@ -68,7 +68,7 @@ class="w-full px-3 py-2 bg-white border border-gray-300 rounded-md" 
                    <!-- Campos a exportar -->

                    <div class="flex flex-col space-y-2">

                        <label for="exportar" class="text-gray-700 font-semibold">Campos:</label>

                        <div class="flex space-x-2">

                        <div class="flex space-x-2 w-full">

                            <select id="exportar" class="w-full px-3 py-2 bg-white border border-gray-300 rounded-md">

                                <option value="" disabled selected>Selecciona los campos a exportar</option>

                                <option value="todos">Todos</option>
@@ -85,7 +85,7 @@ class="w-full px-3 py-2 bg-white border border-gray-300 rounded-md" 
                    <!-- Tipo de archivo a exportar -->

                    <div class="flex flex-col space-y-2">

                        <label for="archivo" class="text-gray-700 font-semibold">Tipo de archivo:</label>

                        <div class="flex space-x-2">

                        <div class="flex space-x-2 w-full">

                            <select id="archivo" class="w-full px-3 py-2 bg-white border border-gray-300 rounded-md">

                                <option value="" disabled selected>Selecciona el formato de archivo a exportar</option>

                                <option value="ambos">Ambos</option>
@@ -113,11 +113,26 @@ class="w-full px-3 py-2 bg-white border border-gray-300 rounded-md" 
    <link rel="stylesheet" href="{{ Vite::asset('resources/css/highlight.min.css') }}">

    <script src="/assets/js/highlight.min.js"></script>



    <script src="/assets/js/nice-select2.js"></script>

    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>

    <link rel="stylesheet" href="/assets/css/jquery.toast.css">

    <script src="/assets/js/jquery.toast.js"></script>



    <script>

        document.addEventListener("DOMContentLoaded", function(e){

            var els = document.querySelectorAll(".selectize");

            els.forEach(function(select){

                NiceSelect.bind(select);

            });

        });



        var options = {

            searchable: true

        };



        NiceSelect.bind(document.getElementById("grupos"), options);

        var subgrupo_select = NiceSelect.bind(document.getElementById("subgrupos"), options);



        let contactosSeleccionados = [];

        let listasSeleccion = [];

        let caracteristicasSeleccion = [];
@@ -275,6 +290,9 @@ function logData() { 
            



            const subgruposSelect = document.getElementById('subgrupos');



            subgrupo_select.destroy();



            subgruposSelect.innerHTML = '<option value="" disabled selected>Selecciona un subgrupo</option>'; // Limpiar los subgrupos previos



            subgrupos.forEach(subgrupo => {
@@ -283,6 +301,8 @@ function logData() { 
                option.textContent = subgrupo.nombre;

                subgruposSelect.appendChild(option);

            });



            subgrupo_select = NiceSelect.bind(subgruposSelect, options);

        }

    </script>