@extends('layouts.app')

@section('scripts')
    <script src="{{{ URL::asset('js/views/patio/caixa.js?123456') }}}"></script>
@endsection

@section('titulo')
  <h4><b>&nbsp;&nbsp;SiGP - {{ Auth::user()->Unidade->getNome() }}</b> - <i class="fas fa-calculator"></i> Pagar / Sair</h4> 
@endsection

@section('pagina')
    

<div class="content-wrapper">
    <input type="hidden" id="hdnUsuario"    name="idusuario" data="{{ Auth::user()->getId() }}"/>
    <input type="hidden" id="hdnId"         name="id"        data=""/>
    <input type="hidden" id="hdnVeiculo"    name="veiculo"   data=""/>
    <input type="hidden" id="hdnMotorista"  name="motorista" data=""/>
    <input type="hidden" id="hdnData"       name="data"      data=""/>
    <input type="hidden" id="hdnDataSaida"  name="datasaida" data=""/>
    <input type="hidden" id="hdnDataCaixa"  name="datacaixa" data=""/>
    <input type="hidden" id="hdnDiaria"     name="diaria"    data=""/>
    <input type="hidden" id="hdnAteSeis"    name="ateseis"   data=""/>
    <input type="hidden" id="hdnAdicional"  name="adicional" data=""/>
    <input type="hidden" id="hdnTempo"      name="tempo"     data=""/>
    <input type="hidden" id="hdnAvulso"     name="avulso"    data=""/>
    <input type="hidden" id="hdnCliente"    name="cliente"   data=""/>
    <input type="hidden" id="hdnDestinoS2gpi"    name="destinos2gpi"     data=""/>
    <input type="hidden" id="hdnFeedback"   name="feedback"  data=""/>
    <input type="hidden" id="hdnUnidade"    name="unidade"   data=""/>
    <input type="hidden" id="hdnAvulso"     name="avulso"    data=""/>
    <input type="hidden" id="hdnOperacao"   name="operacao"  data=""/>

    <div class="container-fluid mt-2">
        
        <div id="cadastro" class="card mt-2" style="display: none; background-color:#fff; color:#056367; border-radius: 20px 0px 20px 0px;">
            
            @csrf
            
            <div class="card-body">
                <div class="row" style="padding-right: 2px;">
                    <div class="col-md-8">
                        <!-- <h4 style="color:#056367;"><i class="fas fa-calculator"></i> Baixar para sair</h4> -->
                    </div>
                    <div class="col-md-4">
                        <div class="col text-right">
                            
                            <button id="btnVoltar" type="button" class="btn btn-secondary" aria-label="Left Align" >
                                <i class="fas fa-arrow-left"></i> Voltar
                            </button>
                            
                        </div>
                    </div>
                    
                </div>
                <br>
                <h6><i class="fas fa-truck fa-lg"></i><b> Dados do Veículo</b></h6>
                <hr style="color:gray;"></hr>
                <div class="row" >
                    <div class="col-md-2">
                        <label id="txtPlaca_label" for="txtPlaca"  class="col-form-label text-md-left">Placa Cavalo <span style="color: #ff0000;"></span></label>
                        <input id="txtPlaca" class="form-control" name="placa" type="text" maxlength="7" value="" />
                    </div>
                    <div class="col-md-2">
                        <label id="txtPlaca_carreta_label" for="txtPreco"  class="col-form-label text-md-left">Placa Carreta</label>
                        <input id="txtPlaca_carreta" class="form-control" name="placa_carreta" type="text" maxlength="7" value="" />
                    </div>
                    <div class="col-md-4">
                        <label id="txtMarca_label" for="txtMarca"  class="col-form-label text-md-left">Marca</label>
                        <input id="txtMarca" class="form-control" name="marca" type="text" maxlength="50" value="" />
                    </div>
                    <div class="col-md-4">
                        <label id="txtModelo_label" for="txtModelo"  class="col-form-label text-md-left">Modelo</label>
                        <input id="txtModelo" class="form-control" name="modelo" type="text" maxlength="50" value="" />
                    </div>
                </div>

                <br>
                <h6><i class="fas fa-user-tie fa-lg"></i><b> Dados do Motorista</b></h6>
                <hr style="color:gray;"></hr>
                <div class="row" >
                    <div class="col-md-2">
                        <label id="txtCpf_label" for="txtCpf"  class="col-form-label text-md-left">CPF <span style="color: #ff0000;"></span></label>
                        <input id="txtCpf" class="form-control" name="cpf" type="text" maxlength="11" value="" />
                    </div>
                    <div class="col-md-5">
                        <label id="txtNome_carreta_label" for="txtNome"  class="col-form-label text-md-left">Nome do Motorista <span style="color: #ff0000;"></span></label>
                        <input id="txtNome" class="form-control" name="nome" type="text" maxlength="50" value="" />
                    </div>
                    <div class="col-md-2">
                        <label id="txtCelular_label" for="txtCelular"  class="col-form-label text-md-left">Celular (com DDD)<span style="color: #ff0000;"></span></label>
                        <input id="txtCelular" class="form-control" name="celular" type="text" maxlength="11" value="" />
                    </div>
                    <div class="col-md-2">
                        <label id="txtCnh_label" for="txtCnh"  class="col-form-label text-md-left">CNH</label>
                        <input id="txtCnh" class="form-control" name="cnh" type="text" maxlength="20" value="" />
                    </div>
                    <div class="col-md-1">
                        <label id="txtCategoria_label" for="txtCategoria"  class="col-form-label text-md-left">Categoria</label>
                        <input id="txtCategoria" class="form-control" name="categoria" type="text" maxlength="3" value="" />
                    </div>
                </div>

                <br>
                <h6><i class="fas fa-box fa-lg"></i><b> Dados da Carga</b></h6>
                <hr style="color:gray;"></hr>
                <div class="row" >
                    <div class="col-md-3">
                        <label id="txtCliente_label" for="txtCliente"  class="col-form-label text-md-left">Cliente <span style="color: #ff0000;"></span></label>
                        <input id="txtCliente" class="form-control" name="cliente" type="text" maxlength="7" value="" />
                    </div>
                    <div class="col-md-4">
                        <label id="txtPlaca_label" for="txtPlaca"  class="col-form-label text-md-left">Produto <span style="color: #ff0000;"></span></label>
                        <select id="cbProduto" class="form-control">
                            
                        </select>
                    </div>
                    <div class="col-md-1">
                        <label id="txtQtde_label" for="txtQtde"  class="col-form-label text-md-left">Qtde (kG)</label>
                        <input id="txtQtde" class="form-control" name="qtde" type="text" maxlength="10" value="" />
                    </div>
                    <div class="col-md-2">
                        <label id="txtPedido_label" for="txtPedido"  class="col-form-label text-md-left">Pedido</label>
                        <input id="txtPedido" class="form-control" name="pedido" type="text" maxlength="20" value="" />
                    </div>
                    <div class="col-md-2">
                        <label id="cbTipocarga_label" for="cbTipocarga"  class="col-form-label text-md-left">Tipo de Carga <span style="color: #ff0000;"></span></label>
                        <select id="cbTipocarga" class="form-control">
                            <option value="" selected>...Todos</option>
                            <option value="BG">BAGS</option>
                            <option value="CS">CARGA GERAL</option>
                            <option value="GR">GRANEL</option>
                            <option value="TQ">TANQUE</option>
                            
                        </select>
                    </div>
                </div>
                <div class="row" >
                    <div class="col-md-2">
                        <label id="txtData_label" for="txtData"  class="col-form-label text-md-left">Data Prevista <span style="color: #ff0000;"></span></label>
                        <input id="txtData" class="form-control" name="data" onKeyUp="mascara_data(this)" type="text" maxlength="10" value="" required/>
                    </div>
                    <div class="col-md-4">
                        <label id="cbDestino_carreta_label" for="cbDestino"  class="col-form-label text-md-left">Destino <span style="color: #ff0000;"></span></label>
                        <select id="cbDestino" class="form-control">
                            
                        </select>
                    </div>
                    <div class="col-md-6">
                        <label id="cbTransp_label" for="cbTransp"  class="col-form-label text-md-left">Transportador <span style="color: #ff0000;"></span></label>
                        <select id="cbTransp" class="form-control">
                            
                        </select>
                    </div>
                </div>
                <div class="row" >
                    <div class="col-md-12">
                        <label id="txtObs_label" for="txtObs"  class="col-form-label text-md-left">Observação</label>
                        <input id="txtObs" class="form-control" name="marca" type="text" maxlength="200" value="" />
                    </div>
                </div>
                <div class="row  mt-2">
                    <div class="col-md-12">
                        <div class="col text-right">
                            
                            <button id="btnVoltar2" type="button" class="btn btn-secondary" aria-label="Left Align" >
                                <i class="fas fa-arrow-left"></i> Voltar
                            </button>

                            <!-- <button id="btnSalvar2" type="button" data="" class="btn btn-success" aria-label="Left Align" >
                                <i class="fas fa-sign-out-alt"></i> Sair do Pátio
                            </button> -->
                            
                        </div>
                    </div>
                </div>

            </div>
            
        </div>

        <div id="baixa" class="card mt-2" style="display: none; background-color:#fff; color:#056367; border-radius: 20px 0px 20px 0px;">
            
            <div class="card-body">
                <div class="row" style="padding-right: 2px;">
                    <div class="col-md-8">
                       <!--  <h4 style="color:#056367;"><i class="fas fa-calculator"></i> Baixar para sair</h4> -->
                    </div>
                    <div class="col-md-4">
                        <div class="col text-right">
                            
                            <button id="btnVoltarBaixa" type="button" class="btn btn-secondary" aria-label="Left Align" >
                                <i class="fas fa-arrow-left"></i> Voltar
                            </button>

                           <button id="btnSalvarBaixa" type="button" data="" class="btn btn-success" aria-label="Left Align" >
                                <i class="fas fa-sign-out-alt"></i> Baixar Estadia (sair)
                            </button>
                            
                            <a target="_blank" href="{{route('patio.imprecibo')}}">
                                <button id="btnImprimirRecibo" type="button" class="btn btn-warning" aria-label="Left Align" >
                                    <i class="fas fa-print fa-lg"></i> Recibo Soene
                                </button>
                            </a>

                            <a target="_blank" href="{{route('patio.impreciboroma')}}">
                                <button id="btnImprimirReciboRoma" type="button" class="btn btn-warning" aria-label="Left Align" >
                                    <i class="fas fa-print fa-lg"></i> Recibo Roma
                                </button>
                            </a>

                           <!--  <a target="_blank" href="{{route('patio.imprecibobrasil')}}">
                                <button id="btnImprimirReciboBrasil" type="button" class="btn btn-warning" aria-label="Left Align" >
                                    <i class="fas fa-print fa-lg"></i> Recibo Interbras
                                </button>
                            </a> -->

                        </div>
                    </div>
                    
                </div>
                <div class="row">
                    <div id="caixa" class="col col-lg-5 col-12 text-left">
                        <label for="cbCaixa2" class="col-form-label text-md-left">Caixa Selecionado</label>
                        <br/>
                        <select id="cbCaixa2" class="form-control">
                            
                        </select>
                    </div>
                </div>

                <br>
                <h6><i class="fas fa-truck fa-lg"></i><b> Dados da Estadia</b></h6>
                <hr style="color:gray;"></hr>
                <div class="row" >
                    <div class="col-md-2">
                        <label id="txtPlaca_label" for="txtPlaca2"  class="col-form-label text-md-left">Placa Cavalo</label>
                        <input id="txtPlaca2" class="form-control" name="placa2" type="text" maxlength="7" value="" />
                    </div>
                    <div class="col-md-4">
                        <label id="txtMotorista2_label" for="txtMotorista2"  class="col-form-label text-md-left">Motorista</label>
                        <input id="txtMotorista2" class="form-control" name="placa2" type="text" maxlength="50" value="" />
                    </div>
                    <div class="col-md-2">
                        <label id="txtCpf_label" for="txtCpf2"  class="col-form-label text-md-left">CPF</label>
                        <input id="txtCpf2" class="form-control" name="cpf2" type="text" maxlength="11" value="" />
                    </div>
                    <div class="col-md-4">
                        <label id="txtTransportador2_label" for="txtTransportador2"  class="col-form-label text-md-left">Transportador</label>
                        <input id="txtTransportador2" class="form-control" name="txtTransportador2" type="text" maxlength="50" value="" />
                    </div>
        
                </div>
                <div class="row" >
                    <div id="caixa" class="col col-lg-4 col-12 text-left">
                        <label for="cbCategoria" class="col-form-label text-md-left">Categoria da Estadia</label>
                        <br/>
                        <select id="cbCategoria" class="form-control">
                            
                        </select>
                    </div>
                    <div class="col-md-4">
                        <label id="txtCliente_label" for="txtCliente2"  class="col-form-label text-md-left">Cliente</label>
                        <input id="txtCliente2" class="form-control" name="cliente2" type="text" maxlength="50" value="" />
                    </div>
                    <div class="col-md-4">
                        <label id="txtDestino2_label" for="txtDestino2"  class="col-form-label text-md-left">Destino</label>
                        <input id="txtDestino2" class="form-control" name="destino2" type="text" maxlength="50" value="" />
                    </div>
                </div>
                <div class="row" >
                    <div class="col-md-2">
                        <label id="txtTicket_label" for="txtTicket"  class="col-form-label text-md-left">Ticket</label>
                        <input id="txtTicket" class="form-control" name="ticket" type="text" maxlength="50" value="" />
                    </div>
                    <div class="col-md-2">
                        <label id="txtOperacao_label" for="txtOperacao"  class="col-form-label text-md-left">Operação</label>
                        <input id="txtOperacao" class="form-control" name="operacao" type="text" maxlength="50" value="" />
                    </div>
                    
                    <div class="col-md-3">
                        <label id="txtDataEntrada_label" for="txtDataEntrada"  class="col-form-label text-md-left">Data Entrada</label>
                        <input id="txtDataEntrada" class="form-control" name="dataentrada" type="text" maxlength="50" value="" />
                    </div>
                    <div class="col-md-3">
                        <label id="txtDataSaida_label" for="txtDataSaida"  class="col-form-label text-md-left">Data Saída</label>
                        <input id="txtDataSaida" class="form-control" name="datasaida" type="text" maxlength="50" value="" />
                    </div>
                    <div class="col-md-2">
                        <label id="txtTempo_label" for="txtTempo"  class="col-form-label text-md-left">Tempo</label>
                        <input id="txtTempo" class="form-control" name="tempo" type="text" maxlength="50" value="" />
                    </div>
                </div>

                <br>
                <h6><i class="fas fa-calculator fa-lg"></i><b> Dados do Pagamento</b></h6>
                <hr style="color:green;"></hr>

                <div class="row" >
                    <div class="col-md-2">
                        <label id="txtEstadia_label" for="txtTicket"  class="col-form-label text-md-left">Estadia</label>
                        <input id="txtEstadia" class="form-control" name="estadia" type="text" maxlength="10" value="" />
                    </div>
                    <div class="col-md-2">
                        <label id="txtDesconto_label" for="txtDesconto"  class="col-form-label text-md-left">Desconto</label>
                        <input id="txtDesconto" class="form-control" onkeyup="calcula()" name="desconto" type="text" maxlength="10" value="" />
                    </div>
                    <div class="col-md-2">
                        <label id="txtTotal_label" for="txtTotal"  class="col-form-label text-md-left">Total</label>
                        <input id="txtTotal" class="form-control" name="total" style="font-size: 14; font-bold: true;" type="text" maxlength="10" value="" />
                    </div>
                    <div class="col col-lg-2 text-left">
                        <label for="cbFormapgto" class="col-form-label text-md-left">Forma Pgto</label>
                        <br/>
                        <select id="cbFormapgto" class="form-control">
                            <option value="" selected>...Selecione</option>
                            <option value="CC">CRÉDITO</option>
                            <option value="CD">DÉBITO</option>
                            <option value="ES">ESPÉCIE</option>                            
                            <option value="FA">FATURADO</option>
                            <option value="PX">PIX</option>
                        </select>
                    </div>
                    <div class="col-md-2">
                        <label id="txtPago_label" for="txtPago"  class="col-form-label text-md-left">Valor Pago</label>
                        <input id="txtPago" class="form-control" onkeyup="troco()" name="pago" type="text" maxlength="10" value="" />
                    </div>
                    <div class="col-md-2">
                        <label id="txtTroco_label" for="txtTroco"  class="col-form-label text-md-left">Troco</label>
                        <input id="txtTroco" class="form-control" onkeyup="troco()" name="troco" type="text" maxlength="10" value="" />
                    </div>
                    

                </div>

                <div class="row mt-2" >
                    <div class="col-md-12">
                        <div class="col text-right">
                            
                            <button id="btnVoltarBaixa2" type="button" class="btn btn-secondary" aria-label="Left Align" >
                                <i class="fas fa-arrow-left"></i> Voltar
                            </button>

                           <button id="btnSalvarBaixa2" type="button" data="" class="btn btn-success" aria-label="Left Align" >
                                <i class="fas fa-sign-out-alt"></i> Baixar Estadia (sair)
                            </button>

                            <a target="_blank" href="{{route('patio.imprecibo')}}">
                                <button id="btnImprimirRecibo2" type="button" class="btn btn-warning" aria-label="Left Align" >
                                    <i class="fas fa-print fa-lg"></i> Recibo Soene
                                </button>
                            </a>

                            <a target="_blank" href="{{route('patio.impreciboroma')}}">
                                <button id="btnImprimirReciboRoma2" type="button" class="btn btn-warning" aria-label="Left Align" >
                                    <i class="fas fa-print fa-lg"></i> Recibo Roma
                                </button>
                            </a>
                            
                            <!-- <a target="_blank" href="{{route('patio.imprecibobrasil')}}">
                                <button id="btnImprimirReciboBrasil2" type="button" class="btn btn-warning" aria-label="Left Align" >
                                    <i class="fas fa-print fa-lg"></i> Recibo Interbras
                                </button>
                            </a> -->

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


        <div id="totalcaixa" class="card mt-2" style="display: none; background-color:#fff; color:#056367; border-radius: 20px 0px 20px 0px;">
            
            <div class="card-body">
                <div class="row" style="padding-right: 2px;">
                    <div class="col-md-6">
                        <h4 style="color:#056367;"><i class="fas fa-times"></i> Fechar o Caixa</h4>
                    </div>
                    <div class="col-md-6">
                        <div class="col text-right">
                            
                            <button id="btnVoltarTotal" type="button" class="btn btn-secondary" aria-label="Left Align" >
                                <i class="fas fa-arrow-left"></i> Voltar
                            </button>
                            <button id="btnTotalizarCaixa" type="button" data="" class="btn btn-info" aria-label="Left Align" >
                                <i class="fas fa-sync"></i> Totalizar Valores
                            </button>
                            <button id="btnFecharTotalCaixa" type="button" data="" class="btn btn-success" aria-label="Left Align" >
                                <i class="fas fa-times fa-lg"></i> Fechar Caixa
                            </button>
                            <a target="_blank" href="{{route('patio.impcaixa')}}">
                                <button id="btnImprimirCaixa" type="button" class="btn btn-warning" aria-label="Left Align" >
                                    <i class="fas fa-print fa-lg"></i> Impressão
                                </button>
                            </a>
                            
                        </div>
                    </div>
                    
                </div>
                <div class="row">
                    <div id="caixa" class="col col-lg-3 col-12 text-left">
                        <label for="cbCaixa3" class="col-form-label text-md-left">Caixa Selecionado</label>
                        <br/>
                        <select id="cbCaixa3" class="form-control">
                            
                        </select>
                    </div>
                </div>
                

                <br>
                <h6><i class="fas fa-calculator fa-lg"></i><b> Dados do Caixa</b></h6>
                <hr style="color:gray;"></hr>
                <div class="row" >
                    <div class="col-md-2  col-12">
                        <label id="txtDatacx_label" for="txtDataCaixa2"  class="col-form-label text-md-left">Data Caixa</label>
                        <input id="txtDatacx" class="form-control" name="datacx" type="text" maxlength="10" value="" />
                    </div>
                    <div class="col col-md-2  col-12 text-left">
                        <label for="cbTurnocx" class="col-form-label text-md-left">Turno</label>
                        <br/>
                        <select id="cbTurnocx" class="form-control">
                           
                        </select>
                    </div>
                    <div class="col col-md-2  col-12 text-left">
                        <label for="cbGuichecx" class="col-form-label text-md-left">Guichê</label>
                        <br/>
                        <select id="cbGuichecx" class="form-control">
                            <option value="" selected>...Selecione</option>
                            <option value="1">01</option>
                            <option value="2">02</option>
                            <option value="3">03</option>
                            <option value="4">04</option>
                        </select>
                    </div>
                    <div class="col col-md-4 col-12 text-left">
                        <label for="cbUsuariocx" class="col-form-label text-md-left">Usuário</label>
                        <br/>
                        <select id="cbUsuariocx" class="form-control">
                           
                        </select>
                    </div>
                    <div class="col col-md-2 col-12 text-left">
                        <label for="cbStatuscx" class="col-form-label text-md-left">Status</label>
                        <br/>
                        <select id="cbStatuscx" class="form-control">
                            <option value="" selected>...Selecione</option>
                            <option value="1">ABERTO</option>
                            <option value="0">FECHADO</option>
                            
                        </select>
                    </div>
                </div>
                <div class="row" >
                    <div class="col-md-2">
                        <label id="txtInicialcx_label" for="txtDataCaixa2"  class="col-form-label text-md-left">Valor Inicial</label>
                        <input id="txtInicialcx" class="form-control" name="inicialcx" type="text" maxlength="10" value="" />
                    </div>
                    <div class="col-md-2">
                        <label id="txtEspeciecx_label" for="txtEspeciecx"  class="col-form-label text-md-left">Total Espécie</label>
                        <input id="txtEspeciecx" class="form-control" name="especiecx" type="text" maxlength="10" value="" />
                    </div>
                    <div class="col-md-2">
                        <label id="txtDebitocx_label" for="txtDebitocx"  class="col-form-label text-md-left">Total Débito</label>
                        <input id="txtDebitocx" class="form-control" name="debitocx" type="text" maxlength="10" value="" />
                    </div>
                    <div class="col-md-2">
                        <label id="txtCreditocx_label" for="txtCreditocx"  class="col-form-label text-md-left">Total Crédito</label>
                        <input id="txtCreditocx" class="form-control" name="creditocx" type="text" maxlength="10" value="" />
                    </div>
                    <div class="col-md-2">
                        <label id="txtDescontocx_label" for="txtDescontocx"  class="col-form-label text-md-left">Total Desconto</label>
                        <input id="txtDescontocx" class="form-control" name="descontocx" type="text" maxlength="10" value="" />
                    </div>
                    <div class="col-md-2">
                        <label id="txtTotalcx_label" for="txtTotalcx"  class="col-form-label text-md-left">Total Geral</label>
                        <input id="txtTotalcx" class="form-control" name="totalcx" type="text" maxlength="10" value="" />
                    </div>
                </div>
                <div class="row" >
                    <div class="col-md-12">
                        <label id="txtObscx_label" for="txtObscx"  class="col-form-label text-md-left">Observação</label>
                        <input id="txtObscx" class="form-control" name="obscx" type="text" maxlength="200" value="" />
                    </div>
                </div>

                <div class="row mt-3">
                    <div class="col panel panel-primary table-responsive">

                        <table id="tbCaixa" class="table table-striped table-bordered text-left ">
                            <thead  style="background-color:#404040; color: #ccc; font-weight: bold;">
                                <tr>
                                    <th>Placa</th>
                                    <th>Motorista</th>
                                    <th>Cliente</th>
                                    <th>Entrada</th>
                                    <th>Saída</th>
                                    <th>Tempo</th>
                                    <th>Valor</th>
                                    <th>Desconto</th>
                                    <th>Total</th>
                                    <th>Forma Pgto</th>
                                    <th>Tipo</th>
                                    <th>Inspeção</th>
                                </tr>
                            </thead>
                            <tbody>
                                

                            </tbody>
                        </table>

                    </div>
                </div>

            </div>
        </div>


        <div id="lista" class="card mt-2" style="background-color:#fff; color:#056367; border-radius: 20px 0px 20px 0px;">
            <div class="card-body">
                <div class="row" style="padding-bottom: 5px; padding-right: 2px;">
                    
                    <div class="col-md-4">
                        <label id="txtBusca_label" for="txtBusca"  class="col-form-label text-md-left">Busca (Placa / Nome / CPF / Celular / Cliente/ Pedido /Obs)</label>
                        <input id="txtBusca" class="form-control" name="busca" type="text" maxlength="30" value="" />
                    </div>
                    <div class="col-md-8 text-right">
                        <label for="cbPesqLabel" class="col-form-label text-md-left">&nbsp;</label>
                        <br/>
                        <button id="btnPesquisar" type="button" class="btn btn-secondary" aria-label="Left Align" >
                            <i class="fas fa-search"></i> Pesquisar
                        </button>
                        
                    </div>
                    
                </div>
                <div class="row">
                    <div id="caixa" class="col col-lg-4 col-12 text-left">
                        <label for="cbCaixa" class="col-form-label text-md-left">Selecione um caixa</label>
                        <br/>
                        <select id="cbCaixa" class="form-control">
                            
                        </select>
                    </div>
                    <div class="col-md-1" id="novo-caixa">
                        <label id="btnCaixa_carreta_label" for="btnCaixa"  class="col-form-label text-md-left">&nbsp;</label><br>
                        <button id="btnCaixa" type="button" class="btn btn-primary" aria-label="Left Align" title="novo caixa">
                            <i class="fas fa-plus"></i>
                        </button>
                        <button id="btnTotalCaixa" type="button" class="btn btn-success" aria-label="Left Align" title="fechar caixa">
                            <i class="fas fa-times"></i>
                        </button>
                    </div>   
                   <!--  <div class="col-md-1" id="fechar-valor-caixa">
                        <label id="btnFechaCaixa_carreta_label" for="btnCaixa"  class="col-form-label text-md-left">&nbsp;</label><br>
                        
                    </div>  -->
                    <div id="caixa-data" class="col-md-2">
                        <label id="txtDatacaixa_label" for="txtDatacaixa"  class="col-form-label text-md-left">Data Caixa</label>
                        <input id="txtDatacaixa" class="form-control" name="datacaixa" type="text" maxlength="10" value="" />
                    </div>
                    <div id="caixa-turno" class="col col-lg-2 text-left">
                        <label for="cbTurno" class="col-form-label text-md-left">Turno</label>
                        <br/>
                        <select id="cbTurno" class="form-control">
                           
                        </select>
                    </div>
                    <div id="caixa-guiche" class="col col-lg-1 text-left">
                        <label for="cbGuiche" class="col-form-label text-md-left">Guichê</label>
                        <br/>
                        <select id="cbGuiche" class="form-control">
                            <option value="" selected>...Selecione</option>
                            <option value="1">01</option>
                            <option value="2">02</option>
                            <option value="3">03</option>
                            <option value="4">04</option>
                            
                        </select>
                    </div>
                    <div id="caixa-inicial" class="col-md-2">
                        <label id="txtValorini_label" for="txtValorini"  class="col-form-label text-md-left">Valor Inicial</label>
                        <input id="txtValorini" class="form-control" name="valorini" type="text" maxlength="10" value="" />
                    </div>

                    <div class="col-md-1" id="salvar-caixa">
                        <label id="btnSalvaCaixa_carreta_label" for="btnSalvaCaixa"  class="col-form-label text-md-left">&nbsp;</label><br>
                        <button id="btnSalvaCaixa" type="button" class="btn btn-success" aria-label="Left Align" title="salvar caixa">
                            <i class="fas fa-check"></i>
                        </button>
                        <button id="btnFecharCaixa" type="button" class="btn btn-default" aria-label="Left Align" title="fechar novo caixa">
                            <i class="fas fa-door-open"></i>
                        </button>
                    </div> 
                   
                </div>
                <div class="row mt-2">
                    <div class="col panel panel-primary table-responsive">

                        <table id="tbSair" class="table table-striped table-bordered text-left ">
                            <thead  style="background-color:#404040; color: #ccc; font-weight: bold;">
                                <tr>
                                    <th>Dados das Estadias</th>
                                    <th></th>
                                </tr>
                            </thead>
                            <tbody>
                                

                            </tbody>
                        </table>

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


<script>

    function mascara_data(campo) {
        if (campo.value.length == 2) {
            campo.value += '/';
        }
        if (campo.value.length == 5) {
            campo.value += '/';
        }
    }

    function mascara_hora(campo) {
        if (campo.value.length == 2) {
            campo.value += ':';
        }
    }

    function mascara_letra(campo) {
        if (campo.value == '-') {
            campo.value += '';
        }
        if (campo.value == '=') {
            campo.value += '';
        }
    
    }

</script>

@endsection