@extends('header_nuevo_generico')
@section('main')
    <style>
    /* Ajustá este valor a la altura real del menú fixed */
    body { padding-top: 100px; }
    /* Si no querés afectar todo el body:
    .after-menu { margin-top: 72px; } */
    </style>

    <div class="container my-4 after-menu">
    <h1 class="h4 mb-3">Carga de archivo (Staff)</h1>

    @if(session('ok'))
        <div class="alert alert-success small mb-3">{{ session('ok') }}</div>
    @endif

    @if($errors->any())
        <div class="alert alert-danger small mb-3">
        <ul class="mb-0">
            @foreach($errors->all() as $e)
            <li>{{ $e }}</li>
            @endforeach
        </ul>
        </div>
    @endif

    <form id="form-staff-archivo"
            method="post"
            enctype="multipart/form-data"
            action="{{ route('staff.procesar') }}">
        @csrf
        <div class="row g-3 align-items-end">
        <div class="col-md-5">
            <label for="formFile" class="form-label">Seleccionar archivo</label>
            <input class="form-control" type="file" id="formFile" name="archivo">
        </div>

        <!-- <div class="col-md-4">
            <label for="fecha" class="form-label">Fecha</label>
            <input type="text" class="form-control" id="fecha" name="fecha" placeholder="YYYY-MM-DD">
        </div> -->

        <div class="col-md-3 d-grid">
            <button type="submit" class="btn btn-primary" id="btn-solicitar" disabled>
            <i class="bi bi-send-fill me-1"></i> Solicitar
            </button>
        </div>



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

    

    
@endsection
@section('funcionesJS')
    <script>
    $(function() {
    // Datepicker
    $("#fecha").datepicker({
        dateFormat: "yy-mm-dd",
        changeMonth: true,
        changeYear: true,
        showAnim: "fadeIn"
    });

    // Habilitar / deshabilitar botón
    function validarCampos() {
        const archivo = $("#formFile").val();
        //const fecha   = $("#fecha").val();
        //$("#btn-solicitar").prop("disabled", !(archivo && fecha));
        $("#btn-solicitar").prop("disabled", !archivo);
    }
    $("#formFile").on("change", validarCampos);
    //$("#fecha").on("change keyup", validarCampos);
    });
    </script>
@endsection