@extends('base')
@section('titulo','Generar Reporte de Estado de Cuenta')
@section('extracss')
    <style>
        .always-cover{
            min-height: calc(100vh - 76px - 96px);
        }
    </style>

@endsection
@section('extrajs')
    <script src="{{ asset('dist/jquery.bootstrap-duallistbox.js') }}"></script>
    <script>$('#dual_list').bootstrapDualListbox({
            // default text
            filterTextClear: 'Mostrar todo',
            filterPlaceHolder: 'Filtrar',
            moveSelectedLabel: 'Mover seleccionado',
            moveAllLabel: 'Mover todo',
            removeSelectedLabel: 'Eliminar seleccionado',
            removeAllLabel: 'Eliminar todo',
            // true/false (forced true on androids, see the comment later)
            moveOnSelect: true,
            // 'all' / 'moved' / false
            preserveSelectionOnMove: false,
            // 'string', false
            selectedListLabel: false,
            // 'string', false
            nonSelectedListLabel: false,
            // 'string_of_postfix' / false
            helperSelectNamePostfix: '_helper',
            // minimal height in pixels
            selectorMinimalHeight: 100,
            // whether to show filter inputs
            showFilterInputs: true,
            // string, filter the non selected options
            nonSelectedFilter: '',
            // string, filter the selected options
            selectedFilter: '',
            // text when all options are visible / false for no info text
            infoText: 'Mostrando todo {0}',
            // when not all of the options are visible due to the filter
            infoTextFiltered: '<span class="badge badge-warning">Fitrado</span> {0} de {1}',
            // when there are no options present in the list
            infoTextEmpty: 'Lista vacia',
            // sort by input order
            sortByInputOrder: false,
            // filter by selector's values, boolean
            filterOnValues: false,
            // boolean, allows user to unbind default event behaviour and run their own instead
            eventMoveOverride: false,
            // boolean, allows user to unbind default event behaviour and run their own instead
            eventMoveAllOverride: false,
            // boolean, allows user to unbind default event behaviour and run their own instead
            eventRemoveOverride: false,
            // boolean, allows user to unbind default event behaviour and run their own instead
            eventRemoveAllOverride: false,
            // sets the button style class for all the buttons
            btnClass: 'btn-outline-secondary',
            // string, sets the text for the "Move" button
            btnMoveText: '&gt;',
            // string, sets the text for the "Remove" button
            btnRemoveText: '&lt;',
            // string, sets the text for the "Move All" button
            btnMoveAllText: '&gt;&gt;',
            // string, sets the text for the "Remove All" button
            btnRemoveAllText: '&lt;&lt;'
        });
    </script>
@endsection

@section('content')
    <div class="container">

        <h3>Generar Reporte de Análisis de Saldo ({{ucfirst($locacion)}})</h3>
        <form action="{{route('CuentasPorCobrar.ReporteAnalisisDeSaldo')}}" method="get" target="_blank">
            <input type="hidden" name="location" value="{{$locacion}}">
            <fieldset class="border">
                <legend>Filtros</legend>
                <div class="row">
                    {{-- <div class="form-group col-sm-6" >
                        <label for="" class="control-label">Desde: </label>
                        <input  type="date" name="desde" id="desde"

                        class="form-control" required>
                    </div> --}}
                    <div class="form-group col-sm-6" >
                        <label for="" class="control-label">AL: </label>
                        <input  type="date" name="hasta" id="hasta"
                                class="form-control" required>
                    </div>
                </div>
            </fieldset>
            <div class="form-group">
                <label for="">Clientes</label>
                <select multiple="multiple" name="seleccionados[]"  id="dual_list">

                    <option value="all">Todos</option>
                    @foreach ($clientes as $cliente)
                        <option value="{{$cliente->id}}">{{$cliente->nombre_cliente}}</option>
                    @endforeach
                </select>
            </div>
            <button class="btn btn-primary mx-auto" type="submit"><i class="ki-outline ki-some-files fs-2"></i> Generar Reporte</button>
        </form>
    </div>
@endsection