@extends('layouts.app')
@section('css')
    <link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet" />

    <link rel="stylesheet" href="{{ asset('css/select2-bootstrap-5-theme.min.css') }}" />
    <style>
        @media (min-width: 1200px) {
            .modal-xl {
                max-width: 1640px;
            }
        }
    </style>
@endsection
@section('content')
    <div class="wrapper wrapper-content">
        <div class="row">
            <div class="col-lg-3">
                <div class="ibox ">
                    <div class="ibox-content">
                        <div class="file-manager">
                            <h5>ARCHIVADORES</h5>
                            <div class="hr-line-dashed"></div>
                            <livewire:submenu />
                            <div class="clearfix"></div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-lg-9 animated fadeInRight">
                <div class="row">
                    <div class="col-lg-12">
                        <div class="ibox">
                            <div class="ibox-content">
                                @if (isset($tipo_documento))
                                    <h2 class="text-center text-danger">{{ $tipo_documento }}</h2>
                                @endif

                            </div>

                            @if (isset($tipo_documento))
                                <div class="ibox-content">
                                    <div class="text-left pb-3 ">
                                        <div class="btn-group">
                                            @can('Agregar Documentos')
                                                <button data-toggle="modal" data-target="#modal_registrar" class="btn btn-white"
                                                    type="button"><i class="fa fa-plus-circle"></i> Agregar</button>
                                            @endcan
                                            @can('Editar Documentos')
                                                <button id="editar_uno" class="btn btn-white" type="button"><i
                                                        class="fa fa-pencil-square-o"></i>
                                                    Editar</button>
                                            @endcan
                                            @can('Eliminar Documentos')
                                                <button id="eliminar_varios" class="btn btn-white" type="button"><i
                                                        class="fa fa-trash"></i>
                                                    Eliminar</button>
                                            @endcan
                                            @can('Internar Documentos')
                                                <button id="internar_varios" class="btn btn-white" type="button"><i
                                                        class="fa fa-briefcase"></i> Internar</button>
                                            @endcan
                                            @can('Compartir Documentos')
                                                <button id="compatir_varios" class="btn btn-white" type="button"><i
                                                        class="fa fa-share-alt-square"></i> Compartir</button>
                                            @endcan

                                        </div>
                                        <div class="btn-group">

                                        </div>

                                    </div>
                                    <div class="row">
                                        <div class="col-lg-2 mb-3">
                                            <label><b>Fecha inicio</b> <span class=" text-danger"></span> </label>
                                            <input id="fecha_inicio" type="date" class="form-control "
                                                value="{{ now()->format('Y-m-d') }}">

                                        </div>
                                        <div class="col-lg-2 mb-3">
                                            <label><b>Fecha fin</b> <span class=" text-danger"></span> </label>
                                            <input id="fecha_fin" type="date" class="form-control "
                                                value="{{ now()->format('Y-m-d') }}">

                                        </div>

                                    </div>

                                    <div class="table-responsive text-nowrap">
                                        <table id="tabla_documentos"
                                            class="table table-striped table-bordered table-hover w-100">
                                            <thead>
                                                <tr>
                                                    <th>#</th>
                                                    <th></th>
                                                    <th>PDF</th>
                                                    <th>N° Doc.</th>
                                                    <th>Año</th>
                                                    <th>Fecha Doc.</th>
                                                    <th>Persona Natural y/o Jurídica</th>
                                                    <th>N° Folios</th>
                                                    <th>Oficina Origen</th>
                                                    <th>Oficina Actual</th>
                                                    <th>Archivador</th>
                                                    <th>N° Archivador</th>
                                                    <th>N° Tomo</th>
                                                    <th>Color Archivador</th>


                                                </tr>
                                            </thead>
                                            <tbody>

                                            </tbody>
                                            <tfoot>
                                                <tr>
                                                    <th>#</th>
                                                    <th></th>
                                                    <th>PDF</th>
                                                    <th>N° Doc.</th>
                                                    <th>Año</th>
                                                    <th>Fecha Doc.</th>
                                                    <th>Persona Natural y/o Jurídica</th>
                                                    <th>N° Folios</th>
                                                    <th>Oficina Origen</th>
                                                    <th>Oficina Actual</th>
                                                    <th>Archivador</th>
                                                    <th>N° Archivador</th>
                                                    <th>N° Tomo</th>
                                                    <th>Color Archivador</th>
                                                </tr>
                                            </tfoot>
                                        </table>
                                    </div>

                                </div>
                            @else
                                <div class="ibox-content text-center">
                                    <b>Seleccione un archivador</b>

                                </div>
                            @endif

                        </div>

                    </div>


                </div>
            </div>
        </div>
    </div>
    <script type="text/javascript">
        @isset($tipo_documento)
            var tipoDocumento = @json($tipo_documento);
            console.log(tipoDocumento);
        @endisset
    </script>


    <div class="modal inmodal fade show" id="modal_registrar" tabindex="-1" role="dialog" style="display: none;"
        aria-hidden="true">
        <div class="modal-dialog  modal-lg">
            <div class="modal-content ">
                <div class="modal-header py-2 px-3">
                    <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span
                            class="sr-only">Close</span></button>
                    <h4 class=" text-left">Agregar nuevo documento</h4>

                </div>

                <div class="modal-body bg-white">
                    <div class="row">
                        <div class="col-lg-6 mb-3">
                            <label> <b>Tipo de Archivador</b> <span class=" text-danger">*</span> </label>

                            <select class="form-select" id="tipo_archivador" disabled>
                                <option value="">Seleccione un tipo de documento</option>
                                @if (isset($tipo_documento))
                                    <option value="Informes Emitidos"
                                        {{ $tipo_documento == 'Informes Emitidos' ? 'selected' : '' }}>Informes Emitidos
                                    </option>
                                    <option value="Informes Recibidos"
                                        {{ $tipo_documento == 'Informes Recibidos' ? 'selected' : '' }}>Informes Recibidos
                                    </option>
                                    <option value="Memorándums Emitidos"
                                        {{ $tipo_documento == 'Memorándums Emitidos' ? 'selected' : '' }}>Memorándums
                                        Emitidos</option>
                                    <option value="Memorándums Recibidos"
                                        {{ $tipo_documento == 'Memorándums Recibidos' ? 'selected' : '' }}>Memorándums
                                        Recibidos</option>
                                    <option value="Oficios" {{ $tipo_documento == 'Oficios' ? 'selected' : '' }}>Oficios
                                    </option>
                                    <option value="Cartas" {{ $tipo_documento == 'Cartas' ? 'selected' : '' }}>Cartas
                                    </option>
                                    <option value="Resolución de Gerencia Municipal"
                                        {{ $tipo_documento == 'Resolución de Gerencia Municipal' ? 'selected' : '' }}>
                                        Resolución de Gerencia Municipal</option>
                                    <option value="Resolución de Alcaldía"
                                        {{ $tipo_documento == 'Resolución de Alcaldía' ? 'selected' : '' }}>Resolución de
                                        Alcaldía</option>
                                    <option value="Resolución Directoral"
                                        {{ $tipo_documento == 'Resolución Directoral' ? 'selected' : '' }}>Resolución
                                        Directoral</option>
                                    <option value="Ordenanza Municipal"
                                        {{ $tipo_documento == 'Ordenanza Municipal' ? 'selected' : '' }}>Ordenanza
                                        Municipal</option>
                                    <option value="Decretos de Alcaldía"
                                        {{ $tipo_documento == 'Decretos de Alcaldía' ? 'selected' : '' }}>Decretos de
                                        Alcaldía</option>
                                    <option value="Directivas" {{ $tipo_documento == 'Directivas' ? 'selected' : '' }}>
                                        Directivas</option>
                                    <option value="Comprobantes de Pago"
                                        {{ $tipo_documento == 'Comprobantes de Pago' ? 'selected' : '' }}>Comprobantes de
                                        Pago</option>
                                    <option value="Expedientes" {{ $tipo_documento == 'Expedientes' ? 'selected' : '' }}>
                                        Expedientes</option>
                                    <option value="Licencias de Construcción Emitidas"
                                        {{ $tipo_documento == 'Licencias de Construcción Emitidas' ? 'selected' : '' }}>
                                        Licencias de Construcción Emitidas</option>
                                    <option value="Parámetros Urbanísticos"
                                        {{ $tipo_documento == 'Parámetros Urbanísticos' ? 'selected' : '' }}>Parámetros
                                        Urbanísticos</option>
                                    <option value="Ordenes de Compra"
                                        {{ $tipo_documento == 'Ordenes de Compra' ? 'selected' : '' }}>Ordenes de Compra
                                    </option>
                                    <option value="Ordenes de Servicio"
                                        {{ $tipo_documento == 'Ordenes de Servicio' ? 'selected' : '' }}>Ordenes de
                                        Servicio</option>
                                    <option value="Adjudicaciones Simplificadas"
                                        {{ $tipo_documento == 'Adjudicaciones Simplificadas' ? 'selected' : '' }}>
                                        Adjudicaciones Simplificadas</option>
                                    <option value="Contratos de Locación de Servicios"
                                        {{ $tipo_documento == 'Contratos de Locación de Servicios' ? 'selected' : '' }}>
                                        Contratos de Locación de Servicios</option>
                                    <option value="Contratos de Servicio"
                                        {{ $tipo_documento == 'Contratos de Servicio' ? 'selected' : '' }}>Contratos de
                                        Servicio</option>
                                    <option value="Alquiler de Vehículos"
                                        {{ $tipo_documento == 'Alquiler de Vehículos' ? 'selected' : '' }}>Alquiler de
                                        Vehículos</option>
                                    <option value="Recibos de Ingreso"
                                        {{ $tipo_documento == 'Recibos de Ingreso' ? 'selected' : '' }}>Recibos de Ingreso
                                    </option>
                                    <option value="Convenios" {{ $tipo_documento == 'Convenios' ? 'selected' : '' }}>
                                        Convenios</option>
                                    <option value="Opiniones Legales"
                                        {{ $tipo_documento == 'Opiniones Legales' ? 'selected' : '' }}>Opiniones Legales
                                    </option>
                                    <option value="Proyectos" {{ $tipo_documento == 'Proyectos' ? 'selected' : '' }}>
                                        Proyectos</option>
                                    <option value="Inventario Patrimonio"
                                        {{ $tipo_documento == 'Inventario Patrimonio' ? 'selected' : '' }}>Inventario
                                        Patrimonio</option>
                                @endif
                            </select>



                        </div>
                        <input type="text"value="{{ Auth::user()->oficina->id }}" hidden id="id_oficina_auth">
                        <div class="col-lg-6 mb-3">
                            <label><b>Oficina/Área</b> <span class=" text-danger">*</span> </label>
                            <select class="form-select" id="oficina" >

                            </select>
                        </div>
                        <div class="col-lg-3 mb-3">
                            <label><b>N° Documento</b> <span class=" text-danger">*</span> </label>
                            <input id="numero_documento" type="text" class="form-control ">
                        </div>
                        <div class="col-lg-3 mb-3">
                            <label><b>Año del Documento</b> <span class=" text-danger">*</span> </label>
                            <select class="form-select" id="anio_documento">
                                <option value=""></option>
                                @for ($i = date('Y'); $i >= 2000; $i--)
                                    <option value="{{ $i }}">{{ $i }}</option>
                                @endfor
                            </select>
                        </div>
                        <div class="col-lg-3 mb-3">
                            <label><b>Fecha del Documento</b> <span class=" text-danger">*</span> </label>
                            <input id="fecha_documento" type="date" class="form-control " max="{{ date('Y-m-d') }}">
                        </div>

                        <div class="col-lg-3 mb-3">
                            <label><b>N° de Folios</b> <span class=" text-danger">*</span> </label>
                            <input id="numero_folios" type="number" class="form-control ">
                        </div>
                        <div class="col-lg-12 mb-3">
                            <label><b>Persona Natural y/o Jurídica</b> <span class=" text-danger">*</span> </label>
                            <textarea id="descripcion_documento" rows="3" class="form-control myi" style="resize:none;"></textarea>
                        </div>
                        <div class="col-lg-4 mb-3">
                            <label><b>N° de Tomo</b> <span class=" text-danger">*</span> </label>
                            <select class="form-select" id="numero_tomo">
                                <option value=""></option>
                                <option value="I">I</option>
                                <option value="II">II</option>
                                <option value="III">III</option>
                                <option value="IV">IV</option>
                                <option value="V">V</option>
                                <option value="VI">VI</option>
                                <option value="VII">VII</option>
                                <option value="VIII">VIII</option>
                                <option value="IX">IX</option>
                                <option value="XI">XI</option>
                                <option value="XII">XII</option>
                                <option value="XIII">XIII</option>
                                <option value="XIV">XIV</option>
                                <option value="XVI">XVI</option>
                                <option value="XVII">XVII</option>
                                <option value="XVIII">XVIII</option>
                            </select>
                        </div>

                        <div class="col-lg-4 mb-3">
                            <label><b> Color de Archivador</b> <span class=" text-danger">*</span> </label>
                            <input id="color_archivador" type="text" class="form-control ">
                        </div>
                        <div class="col-lg-4 mb-3">
                            <label><b> N° de Archivador </b><span class=" text-danger">*</span> </label>
                            <input id="numero_archivador" type="number" class="form-control ">
                        </div>
                        <div class="col-lg-12 mb-3">
                            <label><b>Documento (PDF)</b> <span class=" text-danger">*</span> </label>
                            <input id="documento" type="file"class="form-control " accept=".pdf">
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-white" data-dismiss="modal">Cerrar</button>
                    <button id="registrar" type="button" class="btn btn-primary">Agregar</button>
                </div>
            </div>
        </div>
    </div>
    <!-- Modal -->
    <div class="modal inmodal fade show" id="modal_editar" tabindex="-1" role="dialog" style="display: none;"
        aria-hidden="true">
        <div class="modal-dialog  modal-lg">
            <div class="modal-content ">
                <div class="modal-header py-2 px-3">
                    <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span
                            class="sr-only">Close</span></button>
                    <h4 class=" text-left">Editar documento</h4>

                </div>

                <div class="modal-body bg-white">
                    <div class="row">
                        <div class="col-lg-6 mb-3">
                            <label> <b>Tipo de Archivador</b> <span class=" text-danger">*</span> </label>
                            <select class="form-select" id="tipo_archivador_edit" disabled>
                                <option value="Informes Emitidos">Informes Emitidos</option>
                                <option value="Informes Recibidos">Informes Recibidos</option>
                                <option value="Memorándums Emitidos">Memorándums Emitidos</option>
                                <option value="Memorándums Recibidos">Memorándums Recibidos</option>
                                <option value="Oficios">Oficios</option>
                                <option value="Cartas">Cartas</option>
                                <option value="Resolución de Gerencia Municipal">Resolución de Gerencia Municipal</option>
                                <option value="Resolución de Alcaldía">Resolución de Alcaldía</option>
                                <option value="Ordenanza Municipal">Ordenanza Municipal</option>
                                <option value="Decretos de Alcaldía">Decretos de Alcaldía</option>
                                <option value="Directivas">Directivas</option>
                                <option value="Comprobantes de Pago">Comprobantes de Pago</option>
                                <option value="Expedientes">Expedientes</option>
                                <option value="Licencias de Construcción Emitidas">Licencias de Construcción Emitidas
                                </option>
                                <option value="Parámetros Urbanísticos">Parámetros Urbanísticos</option>
                                <option value="Ordenes de Compra">Ordenes de Compra</option>
                                <option value="Ordenes de Servicio">Ordenes de Servicio</option>
                                <option value="Adjudicaciones Simplificadas">Adjudicaciones Simplificadas</option>
                                <option value="Contratos de Locación de Servicios">Contratos de Locación de Servicios
                                </option>
                                <option value="Contratos de Servicio">Contratos de Servicio</option>
                                <option value="Alquiler de Vehículos">Alquiler de Vehículos</option>
                                <option value="Recibos de Ingreso">Recibos de Ingreso</option>
                                <option value="Convenios">Convenios</option>
                                <option value="Opiniones Legales">Opiniones Legales</option>
                                <option value="Proyectos">Proyectos</option>
                                <option value="Inventario Patrimonio">Inventario Patrimonio</option>

                            </select>
                        </div>
                        <div class="col-lg-6 mb-3">
                            <label><b>Oficina/Área</b> <span class=" text-danger">*</span> </label>
                            <select class="form-select" id="oficina_edit" >

                            </select>
                        </div>
                        <div class="col-lg-3 mb-3">
                            <label><b>N° Documento</b> <span class=" text-danger">*</span> </label>
                            <input id="numero_documento_edit" type="text" class="form-control ">
                        </div>
                        <div class="col-lg-3 mb-3">
                            <label><b>Año del Documento</b> <span class=" text-danger">*</span> </label>
                            <select class="form-select" id="anio_documento_edit">

                                @for ($i = date('Y'); $i >= 2000; $i--)
                                    <option value="{{ $i }}">{{ $i }}</option>
                                @endfor
                            </select>
                        </div>
                        <div class="col-lg-3 mb-3">
                            <label><b>Fecha del Documento</b> <span class=" text-danger">*</span> </label>
                            <input id="fecha_documento_edit" type="date" class="form-control "
                                max="{{ date('Y-m-d') }}">
                        </div>
                        <div class="col-lg-3 mb-3">
                            <label><b>N° de Folios</b> <span class=" text-danger">*</span> </label>
                            <input id="numero_folios_edit" type="number" class="form-control ">
                        </div>
                        <input type="text" id="id_edit" hidden>
                        <div class="col-lg-12 mb-3">
                            <label><b>Descripción</b> <span class=" text-danger">*</span> </label>
                            <textarea id="descripcion_documento_edit" rows="3" class="form-control myi" style="resize:none;"
                                placeholder="Descripcion del archivador"></textarea>
                        </div>
                        <div class="col-lg-4 mb-3">
                            <label><b>N° de Tomo</b> <span class=" text-danger">*</span> </label>
                            <select class="form-select" id="numero_tomo_edit">

                                <option value="I">I</option>
                                <option value="II">II</option>
                                <option value="III">III</option>
                                <option value="IV">IV</option>
                                <option value="V">V</option>
                                <option value="VI">VI</option>
                                <option value="VII">VII</option>
                                <option value="VIII">VIII</option>
                                <option value="IX">IX</option>
                                <option value="XI">XI</option>
                                <option value="XII">XII</option>
                                <option value="XIII">XIII</option>
                                <option value="XIV">XIV</option>
                                <option value="XVI">XVI</option>
                                <option value="XVII">XVII</option>
                                <option value="XVIII">XVIII</option>
                            </select>
                        </div>
                        <div class="col-lg-4 mb-3">
                            <label><b> Color de Archivador</b> <span class=" text-danger">*</span> </label>
                            <input id="color_archivador_edit" type="text" class="form-control ">
                        </div>
                        <div class="col-lg-4 mb-3">
                            <label><b> N° de Archivador </b><span class=" text-danger">*</span> </label>
                            <input id="numero_archivador_edit" type="number" class="form-control ">
                        </div>
                        <div class="col-lg-12 mb-3">
                            <label><b>Documento (PDF)</b> <span class=" text-danger">*</span> </label>
                            <input id="documento_edit" type="file"class="form-control ">
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-white" data-dismiss="modal">Cerrar</button>
                    <button id="editar" type="button" class="btn btn-primary">Actualizar</button>
                </div>
            </div>
        </div>
    </div>
    <!--Default Bootstrap Modal-->
    <div class="modal fade" id="modal_documento" role="dialog" aria-labelledby="demo-default-modal"
        aria-hidden="true">
        <div class="modal-dialog modal-lg">
            <div class="modal-content">
                <!--Modal header-->
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal"><i
                            class="pci-cross pci-circle"></i></button>

                </div>
                <!--Modal body-->
                <div class="modal-body">
                    <div class="row">
                        <div class="col-sm-12">
                            <div class="panel">
                                <div class="panel-body">
                                    <iframe id="documento_pdf" width="100%" height="700" src=""></iframe>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

            </div>
        </div>
    </div>


    <!-- Modal -->
    <div class="modal inmodal fade show" id="modal_compartir" tabindex="-1" role="dialog" style="display: none;"
        aria-hidden="true">
        <div class="modal-dialog ">
            <div class="modal-content ">
                <div class="modal-header py-2 px-3">
                    <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span
                            class="sr-only">Close</span></button>
                    <h4 class=" text-left">Compartir documentos</h4>

                </div>

                <div class="modal-body bg-white">
                    <div class="row">
                        <div class="col-lg-12 mb-3">
                            <label>Usuario Visualizador <span class=" text-danger">*</span> </label>
                            <select class="form-select" id="usuario_compartir">

                            </select>
                        </div>
                        <div class="col-lg-12 mb-3">
                            <label>Fecha Limite de Visualización <span class=" text-danger">*</span> </label>
                            <input type="date" class=" form-control" id="fecha_limite">
                        </div>
                        <input type="text" id="id_documento_compartir" hidden>

                    </div>

                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-white" data-dismiss="modal">Cerrar</button>
                    <button id="compartir" type="button" class="btn btn-primary">Compatir</button>
                </div>
            </div>
        </div>
    </div>
@endsection
@section('js')
    <script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js"></script>
    <script src="{{ asset('js/documentos.js') }}"></script>
    <script>
        $('#anio_documento').select2({
            dropdownParent: '#modal_registrar',
            theme: "bootstrap-5",
            width: $(this).data('width') ? $(this).data('width') : $(this).hasClass('w-100') ? '100%' : 'style',
            placeholder: $(this).data('placeholder'),
            placeholder: 'Seleccionar',
            language: {
                noResults: function() {
                    return 'No se encontraron resultados';
                }
            }
        });
        $('#tipo_archivador').select2({
            dropdownParent: '#modal_registrar',
            theme: "bootstrap-5",
            width: $(this).data('width') ? $(this).data('width') : $(this).hasClass('w-100') ? '100%' : 'style',
            placeholder: $(this).data('placeholder'),
            placeholder: 'Seleccionar',
            language: {
                noResults: function() {
                    return 'No se encontraron resultados';
                }
            }
        });
        $('#usuario_compartir').select2({
            dropdownParent: '#modal_compartir',
            theme: "bootstrap-5",
            width: $(this).data('width') ? $(this).data('width') : $(this).hasClass('w-100') ? '100%' : 'style',
            placeholder: $(this).data('placeholder'),
            placeholder: 'Seleccionar',
            language: {
                noResults: function() {
                    return 'No se encontraron resultados';
                }
            }
        });
        $('#oficina').select2({
            dropdownParent: '#modal_registrar',
            theme: "bootstrap-5",
            width: $(this).data('width') ? $(this).data('width') : $(this).hasClass('w-100') ? '100%' : 'style',
            placeholder: $(this).data('placeholder'),
            placeholder: 'Seleccionar',
            language: {
                noResults: function() {
                    return 'No se encontraron resultados';
                }
            }
        });
        $('#numero_tomo').select2({
            dropdownParent: '#modal_registrar',
            theme: "bootstrap-5",
            width: $(this).data('width') ? $(this).data('width') : $(this).hasClass('w-100') ? '100%' : 'style',
            placeholder: $(this).data('placeholder'),
            placeholder: 'Seleccionar',
            language: {
                noResults: function() {
                    return 'No se encontraron resultados';
                }
            }
        });

        $('#tipo_archivador_edit').select2({
            dropdownParent: '#modal_editar',
            theme: "bootstrap-5",
            width: $(this).data('width') ? $(this).data('width') : $(this).hasClass('w-100') ? '100%' : 'style',
        });
        $('#oficina_edit').select2({
            dropdownParent: '#modal_editar',
            theme: "bootstrap-5",
            width: $(this).data('width') ? $(this).data('width') : $(this).hasClass('w-100') ? '100%' : 'style',
        });
        $('#anio_documento_edit').select2({
            dropdownParent: '#modal_editar',
            theme: "bootstrap-5",
            width: $(this).data('width') ? $(this).data('width') : $(this).hasClass('w-100') ? '100%' : 'style',
        });
        $('#numero_tomo_edit').select2({
            dropdownParent: '#modal_editar',
            theme: "bootstrap-5",
            width: $(this).data('width') ? $(this).data('width') : $(this).hasClass('w-100') ? '100%' : 'style',
        });

        $('#anio').select2({
            dropdownParent: '#modal_registrar',
            theme: "bootstrap-5",
            width: $(this).data('width') ? $(this).data('width') : $(this).hasClass('w-100') ? '100%' : 'style',
            placeholder: $(this).data('placeholder'),
            placeholder: 'Seleccionar',
            language: {
                noResults: function() {
                    return 'No se encontraron resultados';
                }
            }
        });
        $('#tipo').select2({
            dropdownParent: '#modal_registrar',
            theme: "bootstrap-5",
            width: $(this).data('width') ? $(this).data('width') : $(this).hasClass('w-100') ? '100%' : 'style',
            placeholder: $(this).data('placeholder'),
            placeholder: 'Seleccionar',
            language: {
                noResults: function() {
                    return 'No se encontraron resultados';
                }
            }
        });
        $('#anio_edit').select2({
            dropdownParent: '#modal_editar_carpeta',
            theme: "bootstrap-5",
            width: $(this).data('width') ? $(this).data('width') : $(this).hasClass('w-100') ? '100%' : 'style',
        });
        input_mayusculas();

        function input_mayusculas() {
            var inputMayusculasList = document.querySelectorAll(".myi");

            // Agrega un controlador de eventos "input" a cada elemento para convertir el texto en mayúsculas
            inputMayusculasList.forEach(function(element) {
                element.addEventListener("input", function() {
                    this.value = this.value.toUpperCase();
                });
            });
        }
    </script>
@endsection