@extends('layouts.simple.master')

@section('title', 'Form Validation')

@section('css')
<link rel="stylesheet" type="text/css" href="{{ asset('assets/css/vendors/animate.css') }}">
<link rel="stylesheet" type="text/css" href="{{ asset('assets/css/vendors/intltelinput.min.css') }}">
<link rel="stylesheet" type="text/css" href="{{ asset('assets/css/vendors/tagify.css') }}">
@endsection

@section('main_content')
<div class="container-fluid">
    <div class="page-title">
        <div class="row">
            <div class="col-sm-6">
                <h3>Incluir MDF-e</h3>
            </div>
            <div class="col-sm-6">
                <ol class="breadcrumb">
                    <li class="breadcrumb-item"><a href=""> <svg class="stroke-icon">
                                <use href="{{ asset('assets/svg/icon-sprite.svg#stroke-home') }}"></use>
                            </svg></a></li>
                    <li class="breadcrumb-item">Incluir</li>
                    <li class="breadcrumb-item active">MDf-e</li>
                </ol>
            </div>
        </div>
    </div>
</div><!-- Container-fluid starts-->
<div class="container-fluid">
    <div class="row">
        <div class="col-md-12">
            <div class="card">
                <div class="card-body">
                    <p class="mb-3"><b>Preencha abaixo as informações necessárias para emitir o MDF-e</b></p>
                    <p class="mb-0">O Manifesto Eletrônico de Documentos Fiscais (MDF-e) deve ser emitido sempre que realizar o transporte com veículo próprio, arrendados ou autônomos</p>
                </div>
                <form class="theme-form needs-validation" name="pedidos_form" id="pedidos_form" novalidate="" action="{{ route('mdf.create-mdf') }}" method="post">
                    @csrf
                    <div class="card-header">
                        <h5>Sobre o Veículo</h5><span><a href="#"></a></span>
                    </div>
                    <div class="card-body">
                        <div class="row">
                            <div class="row">
                                <div class="col-md-3 mb-3">
                                    <label class="form-label" for="validationVenda">RNTRC</label>
                                    <input class="form-control" id="validationVenda" name="validationVenda" type="text" oninput="handleInput(event)">
                                </div>
                                <div class="col-md-3 mb-3">
                                    <label class="form-label" for="validationVenda">CIOT</label>
                                    <input class="form-control" id="validationVenda" name="validationVenda" type="text" oninput="handleInput(event)">
                                </div>
                                <div class="col-md-3 mb-3">
                                    <label class="form-label" for="validationDt_entrada">Cód. Interno do Veículo</label>
                                    <input class="form-control" id="validationDt_entrada" name="validationDt_entrada" oninput="handleInput(event)" type="text">
                                </div>
                                <div class="col-md-3 mb-3">
                                    <label class="form-label" for="validationDt_saida">Placa</label>
                                    <input class="form-control" id="validationDt_saida" name="validationDt_saida" oninput="handleInput(event)" type="text">
                                </div>

                            </div>
                            <div class="row">
                                <div class="col-md-3 mb-3">
                                    <label class="form-label" for="validationDt_saida">Estado</label>
                                    <input class="form-control" id="validationDt_saida" name="validationDt_saida" oninput="handleInput(event)" type="text">
                                </div>
                                <div class="col-md-3 mb-3">
                                    <label class="form-label" for="validationVenda">Tipo de Rodado</label>
                                    <input class="form-control" id="validationVenda" name="validationVenda" type="text" oninput="handleInput(event)">
                                </div>
                                <div class="col-md-3 mb-3">
                                    <label class="form-label" for="validationVenda">Tipo de Carroceria</label>
                                    <input class="form-control" id="validationVenda" name="validationVenda" type="text" oninput="handleInput(event)">
                                </div>
                                <div class="col-md-3 mb-3">
                                    <label class="form-label" for="validationDt_entrada">Tara em KG</label>
                                    <input class="form-control" id="validationDt_entrada" name="validationDt_entrada" oninput="handleInput(event)" type="text">
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-md-5 mb-3">
                                    <label class="form-label" for="validationVenda">Capacidade em KG</label>
                                    <input class="form-control" id="validationVenda" name="validationVenda" type="text" oninput="handleInput(event)">
                                </div>
                                <div class="col-md-3 mb-3">
                                    <label class="form-label" for="validationVenda">Capacidade em M3</label>
                                    <input class="form-control" id="validationVenda" name="validationVenda" type="text" oninput="handleInput(event)">
                                </div>
                            </div>

                            <div class="card-header">
                                <h5>Sobre o Condutor</h5>
                            </div>
                            <div class="card-body">
                                <div class="row">
                                    <div class="col-md-6 mb-3">
                                        <label class="form-label" for="validationProd">CPF</label>
                                        <input class="form-control" id="validationProd" name="validationProd" type="text" oninput="handleInput(event)">
                                    </div>
                                    <div class="col-md-6 mb-3">
                                        <label class="form-label" for="validationProd">Nome Completo</label>
                                        <input class="form-control" id="validationProd" name="validationProd" type="text" oninput="handleInput(event)">
                                    </div>
                                </div>
                            </div>
                            <div class="card-header">
                                <h5>Carregamento</h5>
                            </div>
                            <div class="card-body">
                                <div class="row">
                                    <div class="col-md-4 mb-3">
                                        <label class="form-label" for="validationProd">Estado</label>
                                        <input class="form-control" id="validationProd" name="validationProd[]" type="text" oninput="handleInput(event)">
                                    </div>
                                    <div class="col-md-5 mb-3">
                                        <label class="form-label" for="validationLote">Cidade</label>
                                        <input class="form-control" id="validationLote" name="validationLote[]" type="text" oninput="handleInput(event)">
                                    </div>
                                </div>
                            </div>
                            <div class="card-header">
                                <h5>Descarregamento</h5>
                            </div>
                            <div class="card-body">
                                <div class="row">
                                    <div class="col-md-4 mb-3">
                                        <label class="form-label" for="validationProd">Estado</label>
                                        <input class="form-control" id="validationProd" name="validationProd[]" type="text" oninput="handleInput(event)">
                                    </div>
                                    <div class="col-md-5 mb-3">
                                        <label class="form-label" for="validationLote">Cidade</label>
                                        <input class="form-control" id="validationLote" name="validationLote[]" type="text" oninput="handleInput(event)">
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-md-12 mb-3">
                                        <label class="form-label" for="validationLote">Estados do Percurso (separados por vírgula: SP, RJ, MG)</label>
                                        <input class="form-control" id="validationLote" name="validationLote[]" type="text" oninput="handleInput(event)">
                                    </div>
                                </div>
                            </div>
                            <div class="card-header">
                                <h5>Totais de Carga</h5><span><a href="#"></a></span>
                            </div>
                            <div class="card-body">
                                <div class="row">
                                    <div class="col-md-5 mb-3">
                                        <label class="form-label" for="validationSubtotal">Valor Total da Carga</label>
                                        <input class="form-control" id="validationSubtotal" name="validationSubtotal" type="text" oninput="handleInput(event)">
                                    </div>
                                    <div class="col-md-5 mb-3">
                                        <label class="form-label" for="validationDesconto">Peso Bruto Total da Carga</label>
                                        <input class="form-control" id="validationDesconto" name="validationDesconto" type="text" maxlength="15" oninput="handleInput(event)">
                                    </div>
                                    <div class="col-md-2 mb-3">
                                        <label class="form-label" for="validationOutros">Unidade</label>
                                        <input class="form-control" id="validationOutros" name="validationOutros" type="text" maxlength="15" oninput="handleInput(event)">
                                    </div>
                                </div>
                            </div>
                            <div class="card-footer text-end">
                                <button id="btn_cadastrar" class="btn btn-success" type="submit">Salvar</button>
                                <a href="{{ route('nfsaida') }}" class="btn btn-secondary">Voltar</a>
                            </div>
                </form>
            </div>
        </div>
    </div>
</div>
@endsection

@section('scripts')
<script src="{{ asset('assets/js/form-validation-custom.js') }}"></script>
<script src="{{ asset('assets/js/height-equal.js') }}"></script>
<script src="{{ asset('assets/js/custom-animated-form.js') }}"></script>
<script src="{{ asset('assets/js/custom-pwd-validation.js') }}"></script>
<script src="{{ asset('assets/js/bootstrap-maxlength.min.js') }}"></script>
<script src="{{ asset('assets/js/bootstrap-multiselectsplitter.min.js') }}"></script>
<script src="{{ asset('assets/js/base-input/custom-inputs.js') }}"></script>
<script src="{{ asset('assets/js/base-input/maxlength-input.js') }}"></script>
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
<script>
    // Dynamic Form Field
    var room = 1;

    function cart_fields() {
        room++;
        var objTo = document.getElementById("cart_fields");
        var divtest = document.createElement("div");
        divtest.setAttribute("class", "form-group removeclass" + room);
        var rdiv = "removeclass" + room;
        divtest.innerHTML =
            '<div class="row"><div class="col-md-2 mb-3"><label class="form-label" for="validationProd">Produto</label><input class="form-control" id="validationProd" name="validationProd[]" type="text" oninput="handleInput(event)"></div><div class="col-md-2 mb-3"><label class="form-label" for="validationLote">Lote</label><input class="form-control" id="validationLote" name="validationLote[]" type="text" oninput="handleInput(event)"></div><div class="col-md-2 mb-3"><label class="form-label" for="validationQuant">Quantidade</label><input class="form-control" id="validationQuant" name="validationQuant[]" type="text" oninput="handleInput(event)"></div><div class="col-md-2 mb-3"><label class="form-label" for="validationVlr_uni">Valor Unitário</label><input class="form-control" id="validationVlr_uni" name="validationVlr_uni[]" type="text" oninput="handleInput(event)"></div><div class="col-md-2 mb-3"><label class="form-label" for="validationDesc">Desconto</label><input class="form-control" id="validationDesc" name="validationDesc[]" type="text" oninput="handleInput(event)"></div><div class="col-md-2 mb-3"><label class="form-label" for="validationTotal">Total</label><input class="form-control" id="validationTotal" name="validationTotal[]" type="text" oninput="handleInput(event)"></div><div class="col-12"><div class="input-group-btn"><button class="btn btn-danger"onclick="remove_cart_fields(' +
            room +
            ');"type=button>Remove Item</button></div></div></div></div><div class=clear></div></div>';

        objTo.appendChild(divtest);
    }

    function remove_cart_fields(rid) {
        $(".removeclass" + rid).remove();
    }

    function handleInput(e) {
        var ss = e.target.selectionStart;
        var se = e.target.selectionEnd;
        e.target.value = e.target.value.toUpperCase();
        e.target.selectionStart = ss;
        e.target.selectionEnd = se;
    }

    document.addEventListener('DOMContentLoaded', function() {

        const submitButton = document.getElementById('btn_cadastrar');

        submitButton.addEventListener('click', function(event) {

            var destinatario = $("input[name='ValidationDestinario']").val();
            console.log(destinatario);

            if (!destinatario) {

                // Se nenhum checkbox for marcado, evitar o envio e mostrar alerta
                event.preventDefault(); // Previne o envio do formulário
                Swal.fire({
                    title: 'Erro!',
                    text: 'Selecione o Destinatario',
                    icon: 'error',
                    confirmButtonText: 'Ok'
                });

            } else {

                Swal.fire({
                    title: "Good job!",
                    text: "Pedido Incluido com Sucesso",
                    icon: "success",
                    confirmButtonText: 'OK'

                }).then(function() {
                    window.location.href = "/pedidos/pedidos";
                });



            }
        });
    });
</script>
@endsection