@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 Proposta</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">Cadastrar</li>
                    <li class="breadcrumb-item active">Propostas Comerciais</li>
                </ol>
            </div>
        </div>
    </div>
</div><!-- Container-fluid starts-->
<div class="container-fluid">
    <div class="row">
        <div class="col-md-12">
            <div class="card">
                <form class="theme-form needs-validation" name="pedidos_form" id="pedidos_form" novalidate="" action="{{ route('proposta.create-proposta') }}" method="post">
                    @csrf
                    <div class="card-header">
                        <h5>Propostas Comerciais</h5><span><a href="#"></a></span>
                    </div>
                    <div class="card-body">
                        <div class="row">
                            <div class="row">
                                <div class="col-md-6 mb-3">
                                    <label class="form-label" for="validationVenda">Natureza da Operação</label>
                                    <input class="form-control" id="validationVenda" name="validationVenda" type="text" oninput="handleInput(event)">
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-md-9 mb-3">
                                    <label class="form-label" for="validationDt_entrada">Cliente</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">Aos cuidados de </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-12 mb-3">
                                    <label class="form-label" for="validationDt_prevista">Introdução</label>
                                    <input class="form-control" id="validationDt_prevista" name="validationDt_prevista" oninput="handleInput(event)" type="text">
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-md-3 mb-3" id="div_cpf">
                                    <label class="form-label" for="ValidationDestinario">Nº Proposta</label>
                                    <input class="form-control" placeholder="" id="ValidationDestinario" name="ValidationDestinario" type="text" oninput="handleInput(event)" required="">
                                </div>
                                <div class=" col-md-3 mb-3" id="div_cnpj">
                                    <label class="form-label" for="validationTipo_pedido">Vendedor</label>
                                    <input class="form-control" placeholder="" id="validationTipo_pedido" name="validationTipo_pedido" type="text" oninput="handleInput(event)">
                                </div>
                                <div class="col-md-3 mb-3">
                                    <label class="form-label" for="validationStatus">Data</label>
                                    <input class="form-control" placeholder="" id="validationStatus" name="validationStatus" type="text" oninput="handleInput(event)">
                                </div>
                                <div class="col-md-3 mb-3">
                                    <label class="form-label" for="validationN_ope">Data do Próx Contato</label>
                                    <input class="form-control" id="validationN_ope" name="validationN_ope" type="text" oninput="handleInput(event)">
                                </div>
                            </div>
                        </div>
                        <div class="card-header">
                            <h5>itens Produtos ou Serviços</h5>
                        </div>
                        <div class="card-body">
                            <div id="cart_fields"></div>
                            <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">Cód(SKU)</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">UN</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">Preço un</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-success" type="button" onclick="cart_fields();">Add Item<span class="fa-solid fa-plus" aria-hidden="true"></span></button></div>
                                </div>
                                <div class="clear"></div>
                            </div>

                        </div>
                        <div class="card-header">
                            <h5>Outros itens e serviços</h5><span><a href="#"></a></span>
                        </div>
                        <div class="card-body">
                            <div class="row">
                                <div class="col-md-12 mb-3">
                                    <textarea class="form-control" id="validationObs" name="validationObs" oninput="handleInput(event)"></textarea>
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-md-4 mb-3">
                                    <label class="form-label" for="validationSubtotal">Total Outros</label>
                                    <input class="form-control" id="validationSubtotal" name="validationSubtotal" type="text" oninput="handleInput(event)">
                                </div>
                                <div class="col-md-4 mb-3">
                                    <label class="form-label" for="validationDesconto">Desconto</label>
                                    <input class="form-control" id="validationDesconto" name="validationDesconto" type="text" maxlength="15" oninput="handleInput(event)">
                                </div>
                                <div class="col-md-4 mb-3">
                                    <label class="form-label" for="validationOutros">Frete</label>
                                    <input class="form-control" id="validationOutros" name="validationOutros" type="text" maxlength="15" oninput="handleInput(event)">
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-md-3 mb-3">
                                    <label class="form-label" for="validationModalidade">Peso Bruto</label>
                                    <input class="form-control" id="validationModalidade" name="validationModalidade" type="text" oninput="handleInput(event)">
                                </div>
                                <div class="col-md-3 mb-3">
                                    <label class="form-label" for="validationFrete">Peso Líquido</label>
                                    <input class="form-control" id="validationFrete" name="validationFrete" type="text" oninput="handleInput(event)">
                                </div>
                                <div class="col-md-3 mb-3">
                                    <label class="form-label" for="validationImpostos">Total de itens</label>
                                    <input class="form-control" id="validationImpostos" name="validationImpostos" type="text" oninput="handleInput(event)">
                                </div>
                                <div class="col-md-3 mb-3">
                                    <label class="form-label" for="validationTot">Valor IPI</label>
                                    <input class="form-control" id="validationTot" name="validationTot" type="text" oninput="handleInput(event)">
                                </div>
                            </div>

                            <div class="row">
                                <div class="col-md-3 mb-3">
                                    <label class="form-label" for="validationSubtotal">Valor ICMS ST + FCP ST</label>
                                    <input class="form-control" id="validationSubtotal" name="validationSubtotal" type="text" oninput="handleInput(event)">
                                </div>
                                <div class="col-md-3 mb-3">
                                    <label class="form-label" for="validationDesconto">Total proposta</label>
                                    <input class="form-control" id="validationDesconto" name="validationDesconto" type="text" maxlength="15" oninput="handleInput(event)">
                                </div>

                            </div>

                        </div>
                        <div class="card-header">
                            <h5>Transportador</h5><span><a href="#"></a></span>
                        </div>
                        <div class="card-body">
                            <div class="row">
                                <div class="col-md-4 mb-3">
                                    <label class="form-label" for="validationTransp">Nome</label>
                                    <input class="form-control" id="validationTransp" name="validationTransp" type="text" oninput="handleInput(event)">
                                </div>
                                <div class="col-md-4 mb-3">
                                    <label class="form-label" for="validationfrete_conta">forma de Envio</label>
                                    <input class="form-control" id="validationfrete_conta" name="validationfrete_conta" type="text" oninput="handleInput(event)">
                                </div>

                                <div class="col-md-4 mb-3">
                                    <label class="form-label" for="validationFrt">Frete</label>
                                    <input class="form-control" id="validationFrt" name="validationFrt" type="text" oninput="handleInput(event)">
                                </div>
                            </div>
                        </div>
                        <div class="card-header">
                            <h5>Condições comerciais</h5><span><a href="#"></a></span>
                        </div>
                        <div class="card-body">
                            <div class="row">
                                <div class="col-md-4 mb-3">
                                    <label class="form-label" for="validationCondpg">Condição de Pagamento</label>
                                    <input class="form-control" id="validationCondpg" name="validationCondpg" type="text" oninput="handleInput(event)">
                                </div>

                                <div class="col-md-4 mb-3">
                                    <label class="form-label" for="validationCategoria">Categoria</label>
                                    <input class="form-control" id="validationCategoria" name="validationCategoria" type="text" oninput="handleInput(event)">
                                </div>
                            </div>

                         
                        </div>
                        <div class="card-header">
                            <h5>Condições Gerais</h5><span><a href="#"></a></span>
                        </div>
                        <div class="card-body">
                            <div class="row">
                                <div class="col-md-4 mb-3">
                                    <label class="form-label" for="validationCondpg">Validade Proposta</label>
                                    <input class="form-control" id="validationCondpg" name="validationCondpg" type="text" oninput="handleInput(event)">
                                </div>

                                <div class="col-md-4 mb-3">
                                    <label class="form-label" for="validationCategoria">Prazo de entrega</label>
                                    <input class="form-control" id="validationCategoria" name="validationCategoria" type="text" oninput="handleInput(event)">
                                </div>
                            </div>

                            <div class="row">
                                <div class="col-md-12 mb-3">
                                    <label class="form-label" for="validationCategoria">Observação</label>
                                    <input class="form-control" id="validationCategoria" name="validationCategoria" type="text" oninput="handleInput(event)">
                                </div>
                            </div>
                        </div>
                        <div class="card-header">
                            <h5>Assinatura</h5><span><a href="#"></a></span>
                        </div>
                        <div class="card-body">
                            <div class="row">
                                <div class="col-md-6 mb-3">
                                    <input class="form-control" id="validationCondpg" name="validationCondpg" type="text" oninput="handleInput(event)">
                                </div>

                                </div>

                            <div class="row">
                                <div class="col-md-6 mb-3">
                                    <input class="form-control" id="validationCategoria" name="validationCategoria" type="text" oninput="handleInput(event)">
                                </div>
                            </div>
                        </div>
                        <div class="card-header">
                            <h5>Anexo</h5><span><a href="#"></a></span>
                        </div>
                        <div class="card-body">

                        </div>



                        <div class="card-footer text-end">
                            <button id="btn_cadastrar" class="btn btn-success" type="submit">Salvar</button>
                            <a href="{{ route('pedidos') }}" 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