@extends('usuarios.clientes.master.layoutcliente')
@section('conteudo')
<script src="{{asset('js/jquery.dataTables.min.js') }}"></script>
{{-- SELECT STYLE --}}
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-select@1.13.14/dist/css/bootstrap-select.min.css">
@php $i=1; @endphp

    <div class="container-fluid">
        <div class="page-header">
            <div class="row align-items-end">
                <div class="col-lg-8">
                    <div class="page-header-title">
                           <div class="card-body">
                            <a  href="#"><i class="ik ik-box bg-success"></i><h4>Listagem  Geral de Caixas</h4></a>
                        </div>
                        <div class="d-inline">


                        </div>
                    </div>
                </div>
                <div class="col-lg-4">
                     <nav class="breadcrumb-container" aria-label="breadcrumb">
                        <ol class="breadcrumb">
                            <li class="breadcrumb-item">
                                <a href="#"><i class="ik ik-home"></i></a>
                            </li>
                            <li class="breadcrumb-item"><a href="#">caixas</a></li>
                            <li class="breadcrumb-item active" aria-current="page">Listagem</li>
                        </ol>
                    </nav>
                </div>
            </div>
        </div>




      

        <div class="row">
            <div class="col-md-12">
                <div class="card">
                    <div class="card-body">

                         <div class="container-fluid">
                            <form class="" action="{{route('us.admin.cliente.GestConsulta.consulta.doc.fisicos')}}" >
                                    @csrf
                                    <div class="row  text-left">

                                    <div class="col-2">
                                        <label for="validationTooltip02" class="form-label">Estado</label>  <br>
                                        <select id="Sector2"  class="position-relative form-control " wire:model='estado' name="estado" wire:click="filtrarCaixas" wire:keydown="filtrarCaixas"  wire:keyup="filtrarCaixas"   wire:change="filtrarCaixas" style="width:140px;" >
                                            <option style="" class="">Vazio</option>
                                            <option value="1">Reservado</option>
                                            <option value="2" >Anulado</option>
                                            <option value="3" >Entrada</option>
                                            <option value="4" >Arrumado</option>
                                            <option value="5" >Aberto</option>
                                            <option value="6" >Em aviso de eliminação</option>
                                            <option value="7" >Eliminado</option>
                                            <option value="8" >Destruído</option>
                                            <option value="9" >Devolvido</option>
                                            <option value="10" >Em trânsito</option>
                                        </select>

                                    </div>




                                    <div class="col-6">
                                        <nav class="row">
                                            <div class="col-4">
                                                <label for="validationTooltip02" class="form-label clienteListCombo">Número inicial</label>  <br>
                                                <input class="form-control" type="number" min="1" max="100000000" wire:model='numeroInicial' name='numeroInicial' wire:keydown="filtrarCaixas"  wire:keyup="filtrarCaixas"   wire:change="filtrarCaixas" id="numeroInicial" placeholder="Inicial" >

                                            </div>
                                            <div class="col-4">
                                                <label for="validationTooltip02" class="form-label clienteListCombo">Número final</label>  <br>
                                                <input class="form-control" type="number" min="1" max="100000000" wire:model='numeroFinal' name='numeroFinal' wire:keydown="filtrarCaixas"  wire:keyup="filtrarCaixas"   wire:change="filtrarCaixas" id="numeroFinal" placeholder="Final" >

                                            </div>
                                            <div class="col-4">
                                                <label for="validationTooltip02" class="form-label clienteListCombo">Número caixa</label>  <br>
                                                <input class="form-control" type="number" min="1" max="100000000" wire:model='numeroUnico' name='numeroUnico' wire:keydown="filtrarCaixas"  wire:keyup="filtrarCaixas"   wire:change="filtrarCaixas" id="numeroUnico" placeholder="Caixa" >
                                            </div>
                                        </nav>
                                    </div>



                                    <div class="col-2 pt-2">
                                            <button class="btn btn-sm btn-success mt-4" type="submit"  ><i class="fa fa-search"></i> Filtrar</button>
                                    </div>
                                </div>

                            </form>
                        </div>


                            <br><br/>
                        <div class="row">
                            <div class="table-responsive">
                                    <table id="example1" class="table container  table-striped table-hover">
                                        <thead>
                                            <tr>
                                                <th>Nº da Caixa</th>
                                                <th>Departamento</th>
                                                <th>Estado</th>
                                                <!--<th>Tipo Caixa</th>
                                                <th>Autor</th>--->
                                                <th>Documentos</th>
                                                <th>Data_entrada</th>
                                                <th>Acção</th>

                                            </tr>
                                            </thead>
                                            <tbody>
                                                @if(isset($dados))
                                                @forelse($dados as $dado)
                                            <tr>


                                                   <th>{{$dado->numerodacaixa}}</th>
                                                    <th>{{$dado->departamento}}</th>
                                                   <th>{{$dado->estado}}</th>

                                                   <!---<th class="text-start">{{$dado->nome}}</th>--->
                                                   <th>0</th>
                                                   <th>{{$dado->created_at}}</th>

                                                @php

                                                    try {

                                                         $decrypted =Crypt::encryptString($dado->id);

                                                         } catch (DecryptException $e) {
                                                             $decrypted=0;
                                                         }

                                                @endphp


                                                   <td>
                                                       <a href="{{ route('us.admin.cliente.GestConsulta.open.box.select',$decrypted) }}" class="btn btn-success"><i class="fa fa-eye"></i></a>
                                                    </td>

                                             </tr>

                                            @empty

                                             @endforelse
                                            @endif
                                            </tbody>

                                        <tfoot></tfoot>
                                    </table>


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

        </div>

</div>

<script src="https://cdn.jsdelivr.net/npm/bootstrap-select@1.13.14/dist/js/bootstrap-select.min.js"></script>

<!-- (Optional) Latest compiled and minified JavaScript translation files -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap-select@1.13.14/dist/js/i18n/defaults-*.min.js"></script>
<script src="//cdn.jsdelivr.net/npm/promise-polyfill@8/dist/polyfill.js"></script>
<script src="//cdn.jsdelivr.net/npm/sweetalert2@10"></script>

<script>

    $(function () {
        $("#example1").DataTable();
        $('#example2').DataTable({
            "paging": true,
            "lengthChange": false,
            "searching": true,
            "ordering": true,
            "info": true,
            "autoWidth": false,
        });
    });
    </script>

    <script>
            $(function () {
                $("#tabela").DataTable();
                $('#example2').DataTable({
                    "paging": true,
                    "lengthChange": false,
                    "searching": false,
                    "ordering": true,
                    "info": true,
                    "autoWidth": true,
                });
            });

  </script>

@endsection