@extends('layouts.app')

@section('scripts')
    <script src="{{{ URL::asset('js/views/mineracao/saidamina.js?1234') }}}"></script>
@endsection

@section('titulo')
  SGPT - {{ Auth::user()->Unidade->getNome() }}</b> - <i class="fas fa-arrow-left"></i> Saída da Mineradora
@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="hdnData" name="data" 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 20px 20px 20px;">
            
            @csrf
            
            <div class="card-body">
                <div class="row" style="padding-right: 2px;">
                    <div class="col-md-2">
                        <!-- <h4 style="color:#056367;"><i class="fas fa-map-marker-alt"></i> Destinos</h4> -->
                    </div>
                    <div class="col-md-10">
                        <div class="col text-right">
                            
                            <button id="btnVoltar" type="button" class="btn btn-secondary btn-redondo" aria-label="Left Align" >
                                <i class="fas fa-arrow-left"></i> Voltar
                            </button>

                            <button id="btnSalvar" type="button" data="" class="btn btn-success btn-redondo" aria-label="Left Align" >
                                <i class="fas fa-save"></i> Salvar
                            </button>
                            
                        </div>
                    </div>
                    
                </div>
                <hr></hr>
                
                <div class="row" >
                    <div class="col-md-2">
                        <label id="txtData_label" for="txtData"  class="col-form-label text-md-left">Data Saída <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-1">
                        <label id="txtHora_label" for="txtData"  class="col-form-label text-md-left">Hora <span style="color: #ff0000;">*</span></label>
                        <input id="txtHora" class="form-control" name="hora" onKeyUp="mascara_hora(this)" type="text" maxlength="5" value="" required/>
                    </div>

                    <div class="col-md-5">
                        <label id="txtOperacao_label" for="txtOperacao"  class="col-form-label text-md-left">Operação <span style="color: #ff0000;">*</span></label>
                        <input id="txtOperacao" class="form-control" name="operacao" type="text" maxlength="50" value="" required/>
                    </div>
                    <div class="col-md-4">
                        <label id="txtTransp_label" for="txtTransp"  class="col-form-label text-md-left">Transportadora <span style="color: #ff0000;">*</span></label>
                        <select id="cbTransp" class="form-control">
                            
                        </select>
                    </div>
                </div>

                <div class="row" >
                    <div class="col-md-4">
                        <label id="cbVeiculo_label" for="cbVeiculo"  class="col-form-label text-md-left">Veículo <span style="color: #ff0000;">*</span></label>
                        <select id="cbVeiculo" class="form-control">
                            
                        </select>
                    </div>
                    <div class="col-md-4">
                        <label id="cbMotora_label" for="cbMotora"  class="col-form-label text-md-left">Motorista <span style="color: #ff0000;">*</span></label>
                        <select id="cbMotora" class="form-control">
                            
                        </select>
                    </div>
                    <div class="col-md-4">
                        <label id="txtProduto_label" for="txtProduto"  class="col-form-label text-md-left">Produto <span style="color: #ff0000;">*</span></label>
                        <select id="cbProduto" class="form-control">
                            
                        </select>
                    </div>
                </div>

                <div class="row" >
                    <div class="col-md-2">
                        <label id="txtLote_label" for="txtLote"  class="col-form-label text-md-left">Lote <span style="color: #ff0000;">*</span></label>
                        <input id="txtLote" class="form-control" name="lote" type="text" maxlength="10" value="" required/>
                    </div>
                    <div class="col-md-2">
                        <label id="txtEstimado_label" for="txtEstimado"  class="col-form-label text-md-left">Qtde Conchas <span style="color: #ff0000;">*</span></label>
                        <input id="txtQtde" class="form-control" name="qtde" type="text" maxlength="10" value="" required/>
                    </div>
                    <div class="col-md-4">
                        <label id="cbTipo_label" for="cbTipo"  class="col-form-label text-md-left">Tipo Caçamba <span style="color: #ff0000;">*</span></label>
                        <select id="cbTipo" class="form-control">
                            
                        </select>
                    </div>
                    <div class="col-md-2">
                        <label id="txtEstimado_label" for="txtEstimado"  class="col-form-label text-md-left">Peso Estimado (Kg) <span style="color: #ff0000;">*</span></label>
                        <input id="txtPesoEst" class="form-control" name="estimado" type="text" maxlength="10" value="" required/>
                    </div>
                </div>
            </div>
            
        </div>

        <div id="lista" class="card mt-2" style="background-color:#fff; color:#056367; border-radius: 20px 20px 20px 20px;">
            <div class="card-body">
                <div class="row" style="padding-bottom: 5px; padding-right: 2px;">
                    
                    <div class="col-md-6">
                        <label id="cbOperacao_label" for="cbOperacao"  class="col-form-label text-md-left">Operação</label>
                        <select id="cbOperacao" class="form-control">
                            
                        </select>
                    </div>
                    <div class="col-md-6 text-right">
                        <label id="txtBotao_label" for="txtbotao"  class="col-form-label text-md-left">&nbsp;</label><br>
                        <button id="btnPesquisar" type="button" class="btn btn-secondary btn-redondo" aria-label="Left Align" >
                            <i class="fas fa-search"></i> Pesquisar
                        </button>
                        <button id="btnNovo" type="button" class="btn btn-primary btn-redondo" aria-label="Left Align" >
                            <i class="fas fa-plus-circle"></i> Novo
                        </button>
                    </div>
                    
                </div>
                
                <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: #ccc; font-weight: bold;">
                                <tr>
                                    <th>Dados das Operações</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