@extends('partes.corpo')

@section('ficha')
    active
@endsection


@section('corpo')

    <section class="" style="background-image: url('/model1.jpg'); background-repeat:repeat;width: 100%; height: 125px">
        <div class="container">
            <h2 class="text-center" style="color:#161b1d">
                <br>Simulate Financing
            </h2>
        </div>
    </section>



    <style>
        #customers {
            font-family: Arial, Helvetica, sans-serif;
            border-collapse: collapse;
            width: 100%;
        }

        #customers td, #customers th {
            border: 1px solid #ddd;
            padding: 8px;
        }

        #customers tr:nth-child(even){background-color: #f2f2f2;}

        #customers tr:hover {background-color: #ddd;}

        #customers th {
            padding-top: 12px;
            padding-bottom: 12px;
            text-align: left;
            background-color: #04AA6D;
            color: white;
        }
    </style>




    <script>

        function calculaPotencia(n, x){
            return Math.pow(n, x);
        }


        function calcularParcela(valorFinanciamento, taxaJuros, numeroParcelas) {
            var taxaMensal = taxaJuros / 100 / 12; // Calcula a taxa mensal a partir da taxa de juros anual
            var parcela = (valorFinanciamento * taxaMensal) / (1 - Math.pow(1 + taxaMensal, -numeroParcelas));
            return parcela.toFixed(2); // Retorna a parcela com duas casas decimais
        }



        function PreviewLoan(){

           var details = document.getElementById('details');
           details.style.display = 'none';

            var Vehicle_Price = $('#CreditApp_VehiclePrice').val();
            var Sales_Tax = $('#CreditApp_SalesTax').val();

            var DownPayment = $('#CreditApp_DownPayment').val();
            var InterestRate = $('#CreditApp_InterestRate').val();

            var TradeValue = $('#CreditApp_TradeInValue').val();
            var LoanTerm = $('#CreditApp_LoanTerm').val();

            var otherFeers = $('#CreditApp_otherFeers').val();


           var includeTaxes =  $('#includeTaxes').val();




            if(Vehicle_Price != 0 ){

                if(otherFeers == ''){
                    otherFeers = Number(0.00).toFixed(2);
                }else{
                    otherFeers = otherFeers.replace("$","");
                    otherFeers = otherFeers.replace(",","");
                    //otherFeers = otherFeers.replace(",",".");
                    otherFeers = parseFloat(otherFeers).toFixed(2);
                }
                if(TradeValue == ''){
                    TradeValue = Number(0.00).toFixed(2);
                }else {
                    TradeValue = TradeValue.replace("$","");
                    TradeValue = TradeValue.replace(",","");
                    //TradeValue = TradeValue.replace(",",".");
                    TradeValue = parseFloat(TradeValue).toFixed(2);
                }
                if(DownPayment == ''){
                    DownPayment = Number(0.00).toFixed(2);
                }else {
                    DownPayment = DownPayment.replace("$","");
                    DownPayment = DownPayment.replace(",","");
                    //DownPayment = DownPayment.replace(",",".");
                    DownPayment = parseFloat(DownPayment).toFixed(2);
                }




                Vehicle_Price = Vehicle_Price.replace("$","");
                Vehicle_Price = Vehicle_Price.replace(",","");
                //Vehicle_Price = Vehicle_Price.replace(",",".");
                Vehicle_Price = parseFloat(Vehicle_Price).toFixed(2);



                Sales_Tax = Sales_Tax.replace(",", ".");
                InterestRate = InterestRate.replace(",",".");

                Sales_Tax = parseFloat(Sales_Tax).toFixed(2);
                InterestRate = parseFloat(InterestRate).toFixed(2);


                Sales_Tax = Sales_Tax / 100;



                if(includeTaxes == "yes"){
                    var ValNoTax = parseFloat(Vehicle_Price).toFixed(2) - DownPayment - TradeValue ;
                    ValNoTax = parseFloat(ValNoTax) + parseFloat(otherFeers);
                    var capital = (ValNoTax * Sales_Tax) + ValNoTax;

                }else{
                    var ValNoTax = parseFloat(Vehicle_Price).toFixed(2) - DownPayment - TradeValue;
                    var capital =  ValNoTax;

                }


                var parcela_float = calcularParcela(capital, InterestRate, LoanTerm);



               // var parcela_float = (capital * InterestRate) / (1 -( Math.pow(1 / (1 + InterestRate), LoanTerm)))
               // parcela_float = Math.round(parcela_float * 100) / 100
                capital = (Math.round(capital.toFixed(2)*100)/100).toFixed(2);

              //console.log(capital)


                $('#CreditApp_MonthlyPayment').val("$ "+parcela_float);
                $('#CreditApp_AmountFinanced').val("$ "+capital);



                var tabela = '<table id="customers"><tr><th>Payment date</th><th>Principal</th><th>Interest</th><th>Monthly payment</th><th>Principal balance</th></tr>'
                tabela+= '<tr><td></td><td></td><td></td><td></td><td>$'+capital+'</td></tr>'


                var montante = capital;
                var jurosParcela = 0;
                var pago = 0;

                const horas = new Date();

                var ano = horas.getFullYear();
                var mes = horas.getMonth()+2;


                var totaljuros = Number(0).toFixed(2);
                var valorpago = Number(0).toFixed(2);



                InterestRate = InterestRate / 100 / 12;

                for(i = 1; i<= LoanTerm;i++){

                    jurosParcela = montante * InterestRate;
                    pago = parcela_float - jurosParcela;


                    jurosParcela = (Math.round(jurosParcela.toFixed(2)*100)/100).toFixed(2);
                    pago = (Math.round(pago.toFixed(2)*100)/100).toFixed(2);

                    montante = montante - pago ;

                    montante = (Math.round(montante.toFixed(2)*100)/100).toFixed(2);

                    totaljuros = parseFloat(jurosParcela) + parseFloat(totaljuros) ;
                    valorpago = parseFloat(parcela_float) + parseFloat(valorpago);



                    if(i==LoanTerm){
                        montante = 0;
                    }

                    if(mes==1){

                        tabela += '<tr><td>#January / '+ ano+'</td><td>$'+pago+'</td><td>$'+jurosParcela+'</td><td>$'+parcela_float+'</td><td>$'+montante+'</td></tr>';
                    }
                    if(mes==2){
                        tabela += '<tr><td>#February / '+ ano+'</td><td>$'+pago+'</td><td>$'+jurosParcela+'</td><td>$'+parcela_float+'</td><td>$'+montante+'</td></tr>';
                    }
                    if(mes==3){
                        tabela += '<tr><td>#March / '+ ano+'</td><td>$'+pago+'</td><td>$'+jurosParcela+'</td><td>$'+parcela_float+'</td><td>$'+montante+'</td></tr>';
                    }
                    if(mes==4){
                        tabela += '<tr><td>#April / '+ ano+'</td><td>$'+pago+'</td><td>$'+jurosParcela+'</td><td>$'+parcela_float+'</td><td>$'+montante+'</td></tr>';
                    }
                    if(mes==5){
                        tabela += '<tr><td>#May / '+ ano+'</td><td>$'+pago+'</td><td>$'+jurosParcela+'</td><td>$'+parcela_float+'</td><td>$'+montante+'</td></tr>';
                    }
                    if(mes==6){
                        tabela += '<tr><td>#June / '+ ano+'</td><td>$'+pago+'</td><td>$'+jurosParcela+'</td><td>$'+parcela_float+'</td><td>$'+montante+'</td></tr>';
                    }
                    if(mes==7){
                        tabela += '<tr><td>#July / '+ ano+'</td><td>$'+pago+'</td><td>$'+jurosParcela+'</td><td>$'+parcela_float+'</td><td>$'+montante+'</td></tr>';
                    }
                    if(mes==8){
                        tabela += '<tr><td>#August / '+ ano+'</td><td>$'+pago+'</td><td>$'+jurosParcela+'</td><td>$'+parcela_float+'</td><td>$'+montante+'</td></tr>';
                    }
                    if(mes==9){
                        tabela += '<tr><td>#September / '+ ano+'</td><td>$'+pago+'</td><td>$'+jurosParcela+'</td><td>$'+parcela_float+'</td><td>$'+montante+'</td></tr>';
                    }
                    if(mes==10){
                        tabela += '<tr><td>#October / '+ ano+'</td><td>$'+pago+'</td><td>$'+jurosParcela+'</td><td>$'+parcela_float+'</td><td>$'+montante+'</td></tr>';
                    }
                    if(mes==11){
                        tabela += '<tr><td>#November / '+ ano+'</td><td>$'+pago+'</td><td>$'+jurosParcela+'</td><td>$'+parcela_float+'</td><td>$'+montante+'</td></tr>';
                    }
                    if(mes==12){
                        tabela += '<tr><td>#December / '+ ano+'</td><td>$'+pago+'</td><td>$'+jurosParcela+'</td><td>$'+parcela_float+'</td><td>$'+montante+'</td></tr>';
                    }






                    //tabela += '<tr><td>#'+mes+'/'+ ano+'</td><td>$'+pago+'</td><td>$'+jurosParcela+'</td><td>$'+parcela_float+'</td><td>$'+montante+'</td></tr>';




                    mes += 1;
                    if(mes>12){
                        mes=1
                        ano += 1;
                    }



                }


                tabela+='</table>'


                totaljuros = (Math.round(totaljuros.toFixed(2)*100)/100).toFixed(2);
                valorpago = (Math.round(valorpago.toFixed(2)*100)/100).toFixed(2);




                tabela+= '<br><br>Total interest cost:&nbsp; $ '+totaljuros+'<br>Total loan payments:&nbsp; $ '+valorpago+'<br><br>';




                details.innerHTML = tabela;




            }else{
                alert("Vehicle Price is required")

            }


        }




        function showDetails(){

            var details = document.getElementById('details');
            var span = document.getElementById('mySpan');



            if (details.style.display === 'none') {
                details.style.display = 'block';
                span.textContent="Hide Details"

            } else {
                details.style.display = 'none';
                span.textContent="Show Details"
            }



        }

        function DisplayPercentage($valorEntrada){

            var vehiclePrice = $('#CreditApp_VehiclePrice').val();

            vehiclePrice = vehiclePrice.replace("$","");
            vehiclePrice = vehiclePrice.replace(".","");
            vehiclePrice = vehiclePrice.replace(",",".");
            vehiclePrice = parseFloat(vehiclePrice);



            $valorEntrada = $valorEntrada.replace(".","");
            $valorEntrada = $valorEntrada.replace(",",".");
            $valorEntrada = parseFloat($valorEntrada);


            if(Number.isNaN($valorEntrada)){
                $('#DownPaymentPercentage').val('0%');
            }else{
                if(vehiclePrice != 0){
                    if($valorEntrada != 0){
                        var porcentagem = ($valorEntrada/vehiclePrice)*100;

                        porcentagem = Math.round(porcentagem.toFixed(2)*100)/100;

                        porcentagem += '%'

                        $('#DownPaymentPercentage').val(porcentagem);
                    }else{
                        $('#DownPaymentPercentage').val('0%');
                    }

                }
            }

        }


    </script>




    <div class="container">

        <div class="row">
            <div class="col-sm-12">
                <h3 class="accent-color1" style="display: inline-block">
                    Loan Simulation

                </h3>

            </div>
        </div>
        <div class="row">
            <div class="col-sm-6 col-md-4">
                <div class="form">

                    <div class="form-group">
                        <label for="CreditApp_VehiclePrice">Vehicle Price </label>
                        <div class="input-group">

                            <input type="text"  class="form-control calc-vehicle-price input-money money"
                                   id="CreditApp_VehiclePrice" name="CreditApp.VehiclePrice"  maxlength="14" value=""
                                    data-thousands="," data-decimal="." data-prefix="$ ">
                        </div>
                    </div>
                    <div class="form-group">
                        <label for="CreditApp_DownPayment">Down Payment </label>
                        <div class="input-group">

                            <input type="text" class="form-control calc-down-payment input-money " min="0"
                                   id="CreditApp_DownPayment" name="CreditApp.DownPayment" maxlength="10" value="" data-thousands="," data-decimal="."
                                   onchange="DisplayPercentage(this.value)" >
                            <span class="input-group-addon"></span>
                            <input type="text" class="form-control input-data" id="DownPaymentPercentage"
                                   readonly="readonly" origvalue="0" placeholder="0%">
                        </div>
                    </div>
                    <div class="form-group">
                        <label for="CreditApp_TradeInValue">Trade-In Value</label>
                        <div class="input-group">

                            <input type="tel" class="form-control calc-trade-in-value input-money"
                                   id="CreditApp_TradeInValue" name="CreditApp.TradeInValue" maxlength="12" value=""
                                   data-thousands="," data-decimal="." data-prefix="$ ">
                        </div>
                        <input type="hidden" id="hdnSubtractTradeInBefore" value="0">
                    </div>
                    <div class="form-group">
                        <label for="CreditApp_TradeInValue">Title, registration & other fees</label>
                        <div class="input-group">

                            <input type="tel" class="form-control calc-trade-in-value input-money"
                                   id="CreditApp_otherFeers" name="CreditApp.TradeInValue" maxlength="12" value=""
                                   data-thousands="," data-decimal="." data-prefix="$ ">
                        </div>
                        <input type="hidden" id="hdnSubtractTradeInBefore" value="0">
                    </div>

                </div>
            </div>
            <div class="col-sm-6 col-md-4">
                <div class="form">

                    <div class="form-group">
                        <label for="CreditApp_SalesTax">Sales Tax</label>
                        <div class="input-group">
                            <div class="input-group-prepend">
                                <span class="input-group-text"><b>%</b></span>
                            </div>
                            <input type="tel" class="form-control calc-sales-tax input-pct" id="CreditApp_SalesTax"
                                   name="CreditApp.SalesTax" maxlength="5" value="9.00" origvalue="9.00">
                        </div>
                    </div>

                    <div class="form-group">
                        <label for="CreditApp_InterestRate">Interest Rate</label>
                        <div class="input-group">
                            <div class="input-group-prepend">
                                <span class="input-group-text"><b>%</b></span>
                            </div>
                            <input type="tel" class="form-control calc-interest-rate input-pct"
                                   id="CreditApp_InterestRate" name="CreditApp.InterestRate" maxlength="5" value="4.90"
                                   origvalue="4.90">
                        </div>
                    </div>

                    <div class="form-group">
                        <label for="CreditApp_LoanTerm">Loan Term (Months)</label>
                        <select class="form-control calc-loan-term" id="CreditApp_LoanTerm" name="CreditApp.LoanTerm"
                                origvalue="48">
                            <option value="12">12</option>
                            <option value="18">18</option>
                            <option value="24">24</option>
                            <option value="30">30</option>
                            <option value="36">36</option>
                            <option value="42">42</option>
                            <option value="48" selected="selected">48</option>
                            <option value="54">54</option>
                            <option value="60">60</option>
                            <option value="66">66</option>
                            <option value="72">72</option>
                            <option value="84">84</option>
                            <option value="96">96</option>
                            <option value="108">108</option>
                            <option value="120">120</option>
                            <option value="132">132</option>
                            <option value="144">144</option>
                            <option value="156">156</option>
                            <option value="168">168</option>
                            <option value="180">180</option>

                        </select>
                    </div>

                    <div class="form-group">
                        <label for="CreditApp_TradeInValue">Include taxes & fees in loan?</label>

                            <select class="form-control calc-loan-term" id="includeTaxes" name="CreditApp.LoanTerm" origvalue="48">
                                <option value="yes" selected>Yes</option>
                                <option value="no">No</option>

                        <input type="hidden" id="hdnSubtractTradeInBefore" value="0">
                    </div>



                </div>
            </div>
            <div class="col-sm-6 col-md-4">
                <div class="form">
                    <div class="form-group">
                        <br>

                        <div class="form-group">
                            <a id="FilterReset" onclick="PreviewLoan(); return false;" class="btn btn-default">
                                <span class="wpcf7-form-control has-spinner wpcf7-submit btn  btn-primary btn-submit">&nbsp; Preview Loan Details </span>
                            </a>
                        </div>

                    </div>
                    <div class="form-group">
                        <label for="CreditApp_AmountFinanced">Amount Financed</label>
                        <div class="input-group">

                            <input type="text" class="form-control calc-loan-amount input-money input-data"
                                   id="CreditApp_AmountFinanced" name="CreditApp.AmountFinanced" readonly="readonly"
                                   origvalue="">
                        </div>
                    </div>
                    <div class="form-group">
                        <label for="CreditApp_MonthlyPayment">Monthly Payment</label>
                        <div class="input-group">

                            <input type="text" class="form-control calc-monthly-payment input-money input-data"
                                   id="CreditApp_MonthlyPayment" name="CreditApp.MonthlyPayment" readonly="readonly"
                                   origvalue="">
                        </div>
                    </div>



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

        <div class="row">
            <div class="col-sm-12">
                <div class="form-group">
                    <a onclick="showDetails(); return false;" class="btn btn-default"><span
                            id="mySpan" class="wpcf7-form-control has-spinner wpcf7-submit btn btn-block btn-primary btn-submit">&nbsp; Show Details</span>
                    </a>
                </div>
            </div>
        </div>
        <br>
        <div class="row" style="display: block">
            <div class="col-sm-12">

                <div id="details" style="display: block">





                </div>

            </div>
        </div>




    </div>


@endsection