@extends('layouts.app')

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

@section('titulo')
  SGP - {{ Auth::user()->Unidade->getNome() }}</b> - <i class="fas fa-clock"></i> Usuário x Destinos
@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=""/>
    
    <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-4">
                       <!--  <h4 style="color:#056367;"><i class="fas fa-clock"></i> Categoria de Estadias</h4> -->
                    </div>
                    <div class="col-md-8">
                        <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>

                            <button id="btnSalvar" type="button" data="" class="btn btn-success" aria-label="Left Align" >
                                <i class="fas fa-save"></i> Salvar
                            </button>
                            
                        </div>
                    </div>
                    
                </div>
                <hr></hr>
                <div class="row" >
                    <div class="col-md-9">
                        <label id="txtDescricao_label" for="txtDescricao"  class="col-form-label text-md-left">Nome <span style="color: #ff0000;">*</span></label>
                        <input id="txtDescricao" class="form-control" name="descricao" type="text" maxlength="50" value="" required/>
                    </div>
                </div>
                <div class="row" >
                    <div class="col-md-2">
                        <label id="txtDiaria_label" for="txtDiaria"  class="col-form-label text-md-left">Valor Diária</label>
                        <input id="txtDiaria" class="form-control" name="diaria" type="text" maxlength="10" value="" />
                    </div>
                    <div class="col-md-2">
                        <label id="txtHora_label" for="txtHora"  class="col-form-label text-md-left">Valor Permanência (2h)</label>
                        <input id="txtHora" class="form-control" name="hora" type="text" maxlength="10" value="" />
                    </div>
                    <div class="col-md-2">
                        <label id="txtHoraadd_label" for="txtHoraadd"  class="col-form-label text-md-left">Valor Hora Adic (depois 2h)</label>
                        <input id="txtHoraadd" class="form-control" name="horaadd" type="text" maxlength="10" value="" />
                    </div>
                    <div class="col-md-2">
                        <label id="txtMotora_label" for="txtMotora"  class="col-form-label text-md-left">Motorista Paga?</label>
                        <br/>
                        <label class="switch">
                            <input id="cbMotora"  type="checkbox" data-off-color="danger" data-on-text="1" data-off-text="0">
                            <span class="slider round"></span>
                        </label>
                    </div>
                    <div class="col-md-2">
                        <label id="txtAtivo_label" for="txtAtivo"  class="col-form-label text-md-left">Ativo?</label>
                        <br/>
                        <label class="switch">
                            <input id="cbAtivo"  type="checkbox" data-off-color="danger" data-on-text="1" data-off-text="0">
                            <span class="slider round"></span>
                        </label>
                    </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 col-md-6 text-left">
                        <label for="cbStatus" class="col-form-label text-md-left">Usuário</label>
                        <br/>
                        <select id="cbUsuario" class="form-control">
                            
                        </select>
                    </div>
                    <div class="col-md-6 text-right">
                        <label for="cbStatus" 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>
                        <button id="btnNovo" type="button" class="btn btn-primary" aria-label="Left Align" >
                            <i class="fas fa-plus-circle"></i> Novo
                        </button>
                    </div>
                    
                </div>
                
                <div class="row mt-2" >
                    <div class="col-md-6">

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

                                <table id="tbDisponivel" class="table table-striped table-bordered text-left ">
                                    <thead  style="background-color:#404040; color: #ccc; font-weight: bold;">
                                        <tr>
                                            <th>Destinos Disponíveis</th>
                                            <th></th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        

                                    </tbody>
                                </table>

                            </div>
                        </div>
                    </div>
                
                    <div class="col-md-6">
                        <div class="row mt-2" >
                            <div class="col panel panel-primary table-responsive">

                                <table id="tbDestino" class="table table-striped table-bordered text-left ">
                                    <thead  style="background-color:#404040; color: #ffff00; font-weight: bold;">
                                        <tr>
                                            <th>Destinos do Usuário</th>
                                            <th></th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        

                                    </tbody>
                                </table>

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

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

@endsection