@extends('layout/principal')
@section('titulo', 'Home')
@section('content')

<h5 class="card-title">IMPORTAR REPERTORIOS DE NOTARÍA</h5>
<hr>
<!-- ============ MENSAJES ==================================================================== -->
{{-- Mensajes estandar de Laravel --------}}
@if (isset($errors) && $errors->any())
<div class="alert alert-danger" role="alert">
    @foreach ($errors->all() as $error)
    {{ $error }}
    @endforeach
</div>
@endif
{{-- Mensajes de Session personalizados --}}
@if (Session::has('success')) <div class="alert alert-success" role="alert"> {{ Session::get('success') }} </div> @endif
@if (Session::has('danger')) <div class="alert alert-danger" role="alert"> {{ Session::get('danger') }} </div> @endif
@if (Session::has('info')) <div class="alert alert-info" role="alert"> {{ Session::get('info') }} </div> @endif
<!-- ========== FIN MENSAJES ================================================================== -->

<form action="{{ route('repertorioNotarial.importaExcel') }}" method="post" data-parsley-validate autocomplete="off"
    enctype="multipart/form-data">
    @csrf
    <div class="row row-sm mb-3">
        <div class="col-sm-2 mg-t-10 mg-sm-t-10">
            <label class="az-content-label tx-11 tx-medium tx-gray-600" for="notaria_emisora">Tipo de Repertorio</label>
            <select name="tipo_repertorio" id="tipo_repertorio" class="form-control" required>
                <option value="" disabled selected>{{-- Seleccione Notaría... --}}</option>
                <option value="escritura">ESCRITURA</option>
                <option value="vehiculo">VEHÍCULO</option>
            </select>
        </div>
        <div class="col-sm-2 mg-t-10 mg-sm-t-10">
            <label class="az-content-label tx-11 tx-medium tx-gray-600" for="fecha">Fecha de Emisión {{-- <ion-icon
                        name="calendar-outline" size="small" style="vertical-align:bottom"></ion-icon> --}}</label>
            <input type="date" name="fecha" class="{{-- datepicker --}} form-control" id="fecha" style="background-color: #ffffff" required>
        </div>
        <div class="col-sm-4 mg-t-10 mg-sm-t-10">
            <label class="az-content-label tx-11 tx-medium tx-gray-600" for="notaria_emisora">Notaría Emisora</label>
            <select name="notaria_emisora" id="notaria_emisora" class="form-control" required>
                <option value="" disabled selected>{{-- Seleccione Notaría... --}}</option>
                @foreach ($notarias as $notaria)
                <option
                    value="{{$notaria->id_notaria.'|'.$notaria->palabra.' Notaría de '.$notaria->comuna.'|'.$notaria->notario_titular_nombre}}">
                    {{$notaria->palabra}} Notaría de {{$notaria->comuna}}
                    {{$notaria->notario_titular_nombre}}</option>
                @endforeach
            </select>
        </div>
        <div class="col-sm-4 mg-t-10 mg-sm-t-10">
            <label class="az-content-label tx-11 tx-medium tx-gray-600">Notario Autorizante</label>
            <select name="notario_autorizante" id="notario_autorizante" class="form-control" required>
                <option value="" disabled selected>{{-- Seleccione Notario... --}}</option>
                @foreach ($notarios as $notario)
                <option
                    value="{{$notario->id_notario_autorizante.'|'.$notario->notario_autorizante_nombre.'|'.$notario->notario_autorizante_tipo}}">
                    {{$notario->notario_autorizante_nombre}}
                </option>
                @endforeach
            </select>
        </div>
        <div class="col-sm-4 mg-t-10 mg-sm-t-10">
            <label class="az-content-label tx-11 tx-medium tx-gray-600">Proceso</label>
            <select name="proceso" id="proceso" class="form-control" required>
                <option value="" disabled selected>{{-- Seleccione Proceso... --}}</option>
                @foreach ($procesos as $proceso)
                <option value="{{$proceso->id_proceso.'|'.$proceso->nombre}}">{{mb_strtoupper($proceso->nombre)}}</option>
                @endforeach
            </select>
        </div>
        <div class="col-sm-4 mg-t-10 mg-sm-t-10">
            <label class="az-content-label tx-11 tx-medium tx-gray-600">Mandante</label>
            <select name="mandante" id="mandante" class="form-control" required>
                <option value="" disabled selected>{{-- Seleccione Proceso...--}}</option>
                @foreach($mandantes as $mandante)
                <option value="{{$mandante->id_mandante.'|'.$mandante->razon_social}}">{{$mandante->razon_social}}
                </option>
                @endforeach
            </select>
        </div><!-- col -->
        <div class="col-sm-3 mg-t-20 mg-sm-t-10">
            <label class="az-content-label tx-11 tx-medium tx-gray-600">Archivo</label>
            <div>
                <input type="file" name="carga" id="carga" required>
            </div>
        </div><!-- col -->
        <div class="col-12 ">
            <br>
            <button type="submit" class="btn btn-az-primary btn-block" onclick="spinner()">Importar Excel</button>
        </div>

        <div class="modal fade" id="modalSpinner" tabindex="-1" role="dialog" aria-labelledby="modalSpinnerLabel"
            aria-hidden="true">
            <div class="modal-dialog modal-dialog-centered" role="document">
                <div class="modal-content">
                    <div class="modal-body text-center">
                        <div class="spinner-border text-primary" role="status">
                        </div>
                        <p class="mt-3">Cargando repertorios...</p>
                    </div>
                </div>
            </div>
        </div>
    </div><!-- row -->
</form>

<script>
    function spinner() {
        let fecha = document.getElementById('fecha').value;
        let notaria_emisora = document.getElementById('notaria_emisora').value;
        let notario_autorizante = document.getElementById('notario_autorizante').value;
        let proceso = document.getElementById('proceso').value;
        let mandante = document.getElementById('mandante').value;
        let carga = document.getElementById('carga').value;
        if (fecha == '' || notaria_emisora == '' || notario_autorizante == '' || proceso == '' || mandante == '' || carga == '') {
            alert('Debe completar todos los campos para importar los repertorios');
            return false;
        }
        $('#modalSpinner').modal({
			backdrop: 'static', // Bloquea cierre al hacer clic fuera
			keyboard: false     // Bloquea cierre con tecla ESC
		}).modal('show');
    }
</script>

@endsection