@extends("front.layout")

@section("content")
<style>
.input-error {
    color: red !important;
}
</style>
<div class="px-4 px-lg-5 py-4">
    <div class="container-fluid">
        <div class="row g-4">
            <div class="col-lg-12 right-wrap">

                <div class="h-100">
                    <h4 class="display-4 pb-3">Edit Loan Info</a></h4>
                    <h5>Property:- {{$mortgage_info->property->address}}, {{$mortgage_info->property->city}} - {{$mortgage_info->property->zipcode}}</h5>
                    <form name="frmMortgageInfo" id="frmMortgageInfo" method="post">
                        @csrf
                        <input type="hidden" name="property_id" id="property_id" value="{{$mortgage_info->property_id}}">
                        <input type="hidden" name="id" id="id" value="{{$mortgage_info->id}}">
                        <div class="row g-3">
                            <div class="col-lg-6">
                                <label for="">Current Interest Rate</label>
                                <div class="input-group" id="cir">
                                    <input type="text" class="form-control input-money-format-prct property-mortage-fields balances" id="current_interest_rate" name="current_interest_rate" value="{{$mortgage_info->current_interest_rate}}" placeholder="Current Interest Rate" required>
                                    <span class="input-group-text current-icon-radious" id="basic-addon1">%</span>
                                </div>
                            </div>
                            <div class="col-lg-6">
                                <label for="">Current Loan Balance</label>
                                <div class="input-group" id="clb">
                                    <span class="input-group-text property-home-icon " id="basic-addon1">$</span>
                                    <input type="text" class="form-control property-mortage-fields input-money-format insurance" id="current_loan_balance" name="current_loan_balance" value="{{number_format(($mortgage_info->current_loan_balance ?? 0), 2)}}" placeholder="Current Loan Balance" required>
                                </div>

                            </div>
                            {{-- <div class="col-lg-6">
                                <input type="text" class="form-control property-mortage-fields" id="loan_term" name="loan_term" value="{{$mortgage_info->loan_term}}" placeholder="Loan Term" required>
                            </div>
                            <div class="col-lg-6">
                                <input type="text" class="form-control property-mortage-fields" id="loan_program" name="loan_program" value="{{$mortgage_info->loan_program}}" placeholder="Loan Program" required>
                            </div> --}}

                            <div class="col-lg-6">
                                <label for="">Initial Loan Term</label>
                                <select class="form-select add-property-form" name="loan_term" id="loan_term" aria-label="Default select example" required>
                                    <option value="">Loan Term</option>
                                    @foreach (getLoanTermOptions() as $loan_term)
                                    <option value="{{$loan_term}}" @if($mortgage_info->loan_term == $loan_term) selected @endif>{{monthToYear($loan_term)}}</option>
                                    @endforeach
                                </select>
                            </div>
                            <div class="col-lg-6">
                                <label for="">Loan Program</label>
                                <select class="form-select add-property-form" name="loan_program" id="loan_program" aria-label="Default select example" required>
                                    <option value="">Loan Program</option>
                                    @foreach (getLoanProgramOptions() as $loan_program)
                                    <option value="{{$loan_program}}" @if($mortgage_info->loan_program == $loan_program) selected @endif>{{$loan_program}}</option>
                                    @endforeach
                                </select>
                            </div>
                            <div class="col-lg-6">
                                <label for="">Loan Type</label>
                                <select class="form-select add-property-form" name="loan_type" id="loan_type" aria-label="Default select example" required>
                                    <option value="">Loan Type</option>
                                    @foreach (getLoanTypeOptions() as $loan_type)
                                    <option value="{{$loan_type}}" @if($mortgage_info->loan_type == $loan_type) selected @endif>{{$loan_type}}</option>
                                    @endforeach
                                </select>
                            </div>



                            <div class="col-lg-6">

                                <label for="">Original Loan Balance</label>
                                <div class="input-group" id="olb">
                                    <span class="input-group-text property-home-icon" id="basic-addon1">$</span>
                                    <input type="text" class="form-control property-mortage-fields input-money-format insurance" id="original_loan_balance" name="original_loan_balance" value="{{number_format(($mortgage_info->original_loan_balance ?? 0), 2)}}" placeholder="Original Loan Balance" required>

                                </div>


                            </div>
                            <div class="col-lg-6">
                                <label for="">PMI</label>
                                <select id="pmi" name="pmi" class="form-select add-property-form" required>
                                    <option value="">Select PMI</option>
                                    <option value="Y" @if($mortgage_info->pmi == "Y") selected @endif>Y</option>
                                    <option value="N" @if($mortgage_info->pmi == "N") selected @endif>N</option>
                                </select>
                            </div>
                            <div class="col-lg-6">
                                <label for="">Mortage Start Date</label>
                                <input type="text" class="form-control property-mortage-fields add-property-form" id="mortgage_start_date" name="mortgage_start_date" value="{{formatDateForUs($mortgage_info->mortgage_start_date)}}" placeholder="Mortage Start Date" required>

                            </div>
                            <div class="col-lg-6 mppbox"  style="<br />
<b>Warning</b>:  Undefined variable $mortgage_info in <b>/home/infoxlnc2022/public_html/loancamp/resources/views/front/myaccount/edit-loan-info.blade.php</b> on line <b>98</b><br />
<br />
<b>Warning</b>:  Attempt to read property "pmi" on null in <b>/home/infoxlnc2022/public_html/loancamp/resources/views/front/myaccount/edit-loan-info.blade.php</b> on line <b>98</b><br />
">
                                <label for="">Monthly PMI Payment</label>
                                <div class="input-group" id="mpp">
                                    <span class="input-group-text property-home-icon" id="basic-addon1">$</span>
                                    <input type="text" class="form-control property-mortage-fields input-money-format insurance" id="monthly_pmi_payment" name="monthly_pmi_payment" value="{{number_format(($mortgage_info->monthly_pmi_payment ?? 0), 2)}}" placeholder="Monthly PMI Payment" required>

                                </div>

                            </div>
                            <div class="col-lg-6">
                                <label for="">Estimated Credit Store</label>
                                <input type="text" class="form-control property-mortage-fields add-property-form" id="estimated_credit_score" name="estimated_credit_score" value="{{$mortgage_info->estimated_credit_score}}" placeholder="Estimated Credit Store" required>
                                {{-- <select name="current_credit_score" id="current_credit_score" class="form-control property-mortage-fields">
                                    <option value="">--Select Credit Score--</option>
                                    <option value="620-639" @if($mortgage_info->current_credit_score == "620-639") selected @endif>620-639</option>
                                    <option value="640-659" @if($mortgage_info->current_credit_score == "640-659") selected @endif>640-659</option>
                                    <option value="660-679" @if($mortgage_info->current_credit_score == "660-679") selected @endif>660-679</option>
                                    <option value="680-699" @if($mortgage_info->current_credit_score == "680-699") selected @endif>680-699</option>
                                    <option value="700-719" @if($mortgage_info->current_credit_score == "700-719") selected @endif>700-719</option>
                                    <option value="720-739" @if($mortgage_info->current_credit_score == "720-739") selected @endif>720-739</option>
                                    <option value="740+" @if($mortgage_info->current_credit_score == "740+") selected @endif>740+</option>
                                </select> --}}
                            </div>

                            <div>
                                <div class="d-grid gap-2 edit-loan-button">
                                    <div class="alert alert-info" style="display: none;" id="resmessage"></div>
                                    <div id="btnloader" class="text-center" style="display: none;"><i class="fa fa-spinner fa-spin fa-2x"></i></div>
                                    <button class="btn btn-primary" id="btnsave">Save</button>
                                </div>
                            </div>

                        </div>

                    </form>
                </div>
            </div>
        </div>
    </div>
</div><!-- About End -->
@endsection

@push("scripts")
<script src="https://cdn.jsdelivr.net/npm/jquery-validation@1.19.5/dist/jquery.validate.min.js"></script>
<script type="text/javascript" src="{{asset('assets/js/custom-validations.js')}}"></script>
<script>
$(document).ready(function(){
    $( "#mortgage_start_date" ).datepicker({ dateFormat: "mm-dd-yy"});

    let checkPMI0 = () => {
        if($("#pmi").val() == "Y") {
            $(".mppbox").show();
            $("#monthly_pmi_payment").prop("readonly", false);
        } else {
            $(".mppbox").hide();
            $("#monthly_pmi_payment").val("");
            $("#monthly_pmi_payment").prop("readonly", true);
        }
    };

    checkPMI0();

    $("#pmi").change(function(){
        checkPMI0();
    });

    $("#frmMortgageInfo").validate({
        errorClass: "input-error",
        errorPlacement: function(error, element) {
            if (element.attr("name") == "current_interest_rate" ) {
                error.insertAfter("#cir");
            } else if (element.attr("name") == "current_loan_balance" ) {
                error.insertAfter("#clb");
            } else if (element.attr("name") == "monthly_pmi_payment" ) {
                error.insertAfter("#mpp");
            } else if (element.attr("name") == "original_loan_balance" ) {
                error.insertAfter("#olb");
            } else {
                error.insertAfter(element);
            }
        },
        rules: {
            "current_interest_rate": {
                required: true,
                number: true
            },
            "current_loan_balance": {
                required: true,
                number: true
            },
            "loan_term": "required",
            "loan_program": "required",
            "loan_type": "required",
            "original_loan_balance": {
                required: true,
                number: true,
                // Applying the custom validation rule
                greaterThanEqualToCurrentLoan: "#current_loan_balance"
            },
            "pmi": "required",
            "mortgage_start_date": "required",
            "monthly_pmi_payment": {
                required: function () {
                    return $("#pmi").val() == "Y";
                }
            },
            "estimated_credit_score": {
                required: true,
                number: true
            },

        },
        submitHandler: function(){
            let formdata = $("#frmMortgageInfo").serialize();
            $.ajax({
                method: "post",
                url: "{{route('update-loan-info')}}",
                data: formdata,
                beforeSend() {
                    $("#btnloader").show();
                    $("#btnsave").hide();
                },
                success: function(response) {
                    $("#btnloader").hide();

                    if(response.success == 1) {
                        $("#resmessage").html(response.message).removeClass("alert-info").addClass("alert-success").removeClass("alert-danger").show();

                        setTimeout(function(){
                            location.href = "{{route('loan-info', ['property_id' => request('property_id')])}}";
                        }, 6000);


                    } else {
                        $("#btnsave").show();
                        $("#resmessage").html(response.message).removeClass("alert-info").removeClass("alert-success").addClass("alert-danger").show();
                    }


                },
                error: function (xhr, ajaxOptions, thrownError) {
                    $("#btnloader").hide();
                    $("#btnsave").show();
                    let jsonValue = jQuery.parseJSON( xhr.responseText );

                    let obj = jsonValue.errors;
                    let errHtml = ''
                    Object.keys(obj).forEach(key => {
                        // console.log(key, obj[key]);
                        errHtml = errHtml + obj[key] + "<br/>";
                    });

                    $("#resmessage").html(errHtml).removeClass("alert-info").removeClass("alert-success").addClass("alert-danger").show();

                }
            });
        }
    });

});
</script>
@endpush