@extends('reachassuree_agent/layouts.main')
@section('title', $data['title'])
@section('content')

<style>
    input[type="radio"][name="form_type"] {
        display: none;
    }

    button#btnSave {
        width: 150px;
        height: 39px;
        line-height: 14px;
    }

    input[type="radio"][name="form_type"]+label {
        display: inline-block;
        padding: 5px 10px;
        background-color: #f1f5fe;
        border-radius: 4px;
        cursor: pointer;
    }

    input[type="radio"][name="form_type"]:checked+label {
        background-color: #2762e4;
        color: #fff;
    }

    .wizard .steps ul li:first-child a{
        border-radius: 0.8rem 0 0 0.8rem;
    }
    .wizard .steps ul li:last-child a{
        border-radius: 0 0.8rem 0.8rem 0;
    }
</style>

<div class="page-content">
    <div class="container-fluid">
        @include('../reachassuree_agent/master/comman/header')

        <div class="row justify-content-end">
            <a href="javascript:void(0);" onclick="return learningVideo()" class="btn-youtube-pulse btn-youtube-pulse-border">
                <i class="mdi mdi-youtube"></i>
            </a>
        </div>

        <!-- Start Main Section -->
        <div class="row">
            <div class="col-lg-12">
                <div class="card">
                    <div class="card-body">
                        <form method="POST" id="formRenewLifePolicy" enctype='multipart/form-data' action="{{route('renew.life.policy.save')}}" class="needs-validation" novalidate>
                            @csrf
                            <input type="hidden" class="form-control" id="record_id" name="record_id">
                            <input type="hidden" class="form-control" id="life_client_id" name="life_client_id">
                            <input type="hidden" class="form-control" id="life_family_group_id" name="life_family_group_id">
                            <input type="hidden" class="form-control" id="life_insurance_id" name="life_insurance_id">
                            <input type="hidden" class="form-control" id="life_accident_risk_amount" name="life_accident_risk_amount">
                            <input type="hidden" class="form-control" id="life_policy_status_id" name="life_policy_status_id">
                            <input type="hidden" class="form-control" id="life_broker_id" name="life_broker_id">
                            <input type="hidden" class="form-control" id="life_agency_id" name="life_agency_id">
                            <input type="hidden" class="form-control" id="life_sub_agent_id" name="life_sub_agent_id">
                            <input type="hidden" class="form-control" id="policy_document_names" name="policy_document_names">
                            {{-- <input type="hidden" class="form-control" id="life_remark" name="life_remark"> --}}

                            <div id="basic-example">
                                <h3>Step 1</h3>
                                <section>
                                    <div class="row">
                                        <div class="col-md-6">
                                            <div class="mb-3">
                                                <label for="life_transaction_date" class="form-label">Renewal Transaction Date<span class="text-danger">*</span></label>
                                                <input type="text" class="form-control" name="life_transaction_date" id="life_transaction_date" placeholder="Select transaction date" value="{{date('d-m-Y')}}" required autocomplete="off">
                                            </div>
                                        </div>
                                        <div class="col-md-6">
                                            <div class="mb-3">
                                                <label for="life_document_number" class="form-label">Document Number<span class="text-danger">*</span></label>
                                                <input type="text" class="form-control" name="life_document_number" id="life_document_number" readonly value="@php echo date('dmy'); echo mt_rand(10000,99999); @endphp" required>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="row">
                                        <div class="col-md-6">
                                            <div class="mb-3">
                                                <label for="life_family_id" class="form-label">Family Group<span class="text-danger">*</span></label>
                                                <input class="form-control" id="life_family_id" name="life_family_id" placeholder="Family Group" disabled>
                                            </div>
                                        </div>
                                        <div class="col-md-6">
                                            <div class="mb-3">
                                                <label for="life_client_name" class="form-label">Policy Holder Name<span class="text-danger">*</span></label>
                                                <input class="form-control" id="life_client_name" name="life_client_name" placeholder="Policy Holder Name" disabled>
                                            </div>
                                        </div>
                                    </div>
                                    @if($data['data']['form_type'] == 2)
                                        <div class="row">
                                            <div class="col-md-12">
                                                <div class="mb-3">
                                                    <label for="head_first_name" class="form-label" id="">Full Name</label>
                                                    <input type="text" class="form-control" name="head_first_name" id="head_first_name" disabled placeholder="First name" value="">
                                                </div>
                                            </div>
                                        </div>
                                    @else
                                        <div class="row">
                                            <div class="col-md-4">
                                                <div class="mb-3">
                                                    <label for="head_first_name" class="form-label" id="">First Name</label>
                                                    <input type="text" class="form-control" name="head_first_name" id="head_first_name" disabled placeholder="First name" value="">
                                                </div>
                                            </div>
                                            <div class="col-md-4">
                                                <div class="mb-3">
                                                    <label for="head_middle_name" class="form-label">Middle Name</label>
                                                    <input type="text" class="form-control" name="head_middle_name" id="head_middle_name" disabled placeholder="Middle name" value="">
                                                </div>
                                            </div>
                                            <div class="col-md-4">
                                                <div class="mb-3">
                                                    <label for="head_last_name" class="form-label">Last Name</label>
                                                    <input type="text" class="form-control" name="head_last_name" id="head_last_name" disabled placeholder="Last name" value="">
                                                </div>
                                            </div>
                                        </div>
                                    @endif
                                    
                                    <div class="row">
                                        <div class="col-md-6">
                                            <div class="mb-3">
                                                <label for="life_insurance_company_id" class="form-label">Insurance Company<span class="text-danger">*</span></label>
                                                <select class="form-control select2-ajax" id="life_insurance_company_id" name="life_insurance_company_id" required></select>
                                            </div>
                                        </div>
                                        <div class="col-md-6">
                                            <div class="mb-3">
                                                <label for="life_branch_id" class="form-label">Branch</label>
                                                <select class="form-control select2-ajax" id="life_branch_id" name="life_branch_id" required>
                                                    <option value="" selected>Branch name</option>
                                                </select>
                                            </div>
                                        </div>
                                    </div>

                                    <div class="row">
                                        <div class="col-md-4">
                                            <div class="mb-3">
                                                <label for="life_policy_number" class="form-label">Policy Number<span class="text-danger">*</span></label>
                                                <input type="text" class="form-control" name="life_policy_number" id="life_policy_number" maxlength="30" value="" placeholder="Policy number" required autocomplete="off">
                                            </div>
                                        </div>
                                        <div class="col-md-4">
                                            <div class="mb-3">
                                                <label for="life_insurance_plan_id" class="form-label">Insurance Plan Name<span class="text-danger">*</span></label>
                                                <select class="form-control select2-ajax" id="life_insurance_plan_id" name="life_insurance_plan_id" required></select>
                                            </div>
                                        </div>
                                        <div class="col-md-4">
                                            <div class="mb-3">
                                                <label for="life_insurance_plan_type_id" class="form-label">Insurance Plan Type<span class="text-danger">*</span></label>
                                                <select class="form-control select2-ajax" id="life_insurance_plan_type_id" name="life_insurance_plan_type_id" required></select>
                                            </div>
                                        </div>
                                    </div>
                                </section>
                                
                                <h3>Step 2</h3>
                                <section>
                                    <div class="row">
                                        <div class="col-md-4">
                                            <div class="mb-3">
                                                <label for="life_mode_id" class="form-label">Mode<span class="text-danger">*</span></label>
                                                <select class="form-control select2-ajax" id="life_mode_id" name="life_mode_id" required></select>
                                            </div>
                                        </div>
                                        <div class="col-md-4">
                                            <div class="mb-3">
                                                <label for="life_risk_term" class="form-label">Risk Term<span class="text-danger">*</span></label>
                                                <input type="text" id="life_risk_term" name="life_risk_term" class="form-control" placeholder="Enter risk term" value="" required autocomplete="off">
                                            </div>
                                        </div>
                                        <div class="col-md-4">
                                            <div class="mb-3">
                                                <label for="life_premium_paying_term" class="form-label">Premium Paying Term<span class="text-danger">*</span></label>
                                                <input type="text" id="life_premium_paying_term" name="life_premium_paying_term" class="form-control" placeholder="Enter premium paying term" value="" required autocomplete="off">
                                            </div>
                                        </div>
                                    </div>

                                    <div class="row">
                                        <div class="col-xl-6">
                                            <div class="row">
                                                <div class="col-md-6">
                                                    <div class="mb-3">
                                                        <label for="life_risk_from_date" class="form-label">Risk Start Date (Doc)<span class="text-danger">*</span></label>
                                                        <input type="text" id="life_risk_from_date" name="life_risk_from_date" class="form-control" placeholder="dd-mm-yyyy" value="" required autocomplete="off">
                                                    </div>
                                                </div>
                                                <div class="col-md-6">
                                                    <div class="mb-3">
                                                        <label for="life_maturity_date" class="form-label">Maturity Date</label>
                                                        <input type="text" id="life_maturity_date" name="life_maturity_date" class="form-control" placeholder="dd-mm-yyyy" value="" autocomplete="off">
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="col-xl-6">
                                            <div class="row">
                                                <div class="col-md-6">
                                                    <div class="mb-3">
                                                        <label for="life_last_payment_date" class="form-label">Last Premium Payment Date</label>
                                                        <input type="text" id="life_last_payment_date" name="life_last_payment_date" class="form-control" placeholder="dd-mm-yyyy" value="" autocomplete="off">
                                                    </div>
                                                </div>
                                                <div class="col-md-6">
                                                    <div class="mb-3">
                                                        <label for="life_risk_to_date" class="form-label">Next Premium Due Date</label>
                                                        <input type="text" id="life_risk_to_date" name="life_risk_to_date" class="form-control" placeholder="dd-mm-yyyy" value="" autocomplete="off">
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>

                                    <div class="row">
                                        <div class="col-xl-6">
                                            <div class="row">
                                                <div class="col-md-3">
                                                    <div class="mb-3">
                                                        <label for="life_sum_assured" class="form-label">Sum Assured<span class="text-danger">*</span></label>
                                                        <input type="text" class="form-control" onkeypress="return isNumber(event)" name="life_sum_assured" id="life_sum_assured" value="" placeholder="Sum assured" required autocomplete="off">
                                                    </div>
                                                </div>
                                                <div class="col-md-5">
                                                    <div class="mb-3">
                                                        <label for="life_basic_premium_amount" class="form-label">Basic Premium Amount<span class="text-danger">*</span></label>
                                                        <input type="text" class="form-control number digitLimit" name="life_basic_premium_amount" id="life_basic_premium_amount" value="" placeholder="Enter amount" required autocomplete="off">
                                                    </div>
                                                </div>
                                                <div class="col-md-4">
                                                    <div class="mb-3">
                                                        <label for="life_tax_amount" class="form-label">Tax Amount</label>
                                                        <input type="text" class="form-control number digitLimit" name="life_tax_amount" id="life_tax_amount" value="" placeholder="Enter amount" autocomplete="off" maxlength="10">
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        
                                        <div class="col-xl-6">
                                            <div class="row">
                                                <div class="col-md-6">
                                                    <div class="mb-3">
                                                        <label for="life_commisionable_amount" class="form-label">Commissionable Amount</label>
                                                        <input type="text" class="form-control number digitLimit" name="life_commisionable_amount" id="life_commisionable_amount" value="" placeholder="Enter Amount" autocomplete="off">
                                                    </div>
                                                </div>
                                                <div class="col-md-6">
                                                    <div class="mb-3">
                                                        <label for="life_total_premium_amount" class="form-label">Total Premium Amount<span class="text-danger">*</span></label>
                                                        <input type="text" class="form-control number digitLimit" name="life_total_premium_amount" id="life_total_premium_amount" value="" placeholder="Enter amount" required autocomplete="off">
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>

                                    <div class="row">
                                        <div class="col-xl-6">
                                            <div class="row">
                                                <div class="col-md-6">
                                                    <div class="mb-3">
                                                        <label for="life_paid_by_party_id" class="form-label">Paid By Client</label>
                                                        <select class="form-control select2-ajax" id="life_paid_by_party_id" name="life_paid_by_party_id"></select>
                                                    </div>
                                                </div>
                                                <div class="col-md-2">
                                                    <div class="mb-3">
                                                        <label  class="form-label spaceRemove">&nbsp;&nbsp;&nbsp;&nbsp;</label>
                                                        <button class="btn btn-primary px-4 form-control" onclick="return addPaymentModeParty();" type="button">Add</button>
                                                    </div>
                                                </div>
                                                <div class="col-md-4">
                                                    <div class="mb-3">
                                                        <label for="life_party_payout_amount" class="form-label">Amount</label>
                                                        <input type="text" class="form-control digitLimit" onkeypress="return isNumber(event)" name="life_party_payout_amount" id="life_party_payout_amount" value="" placeholder="Enter amount" autocomplete="off">
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                   
                                        <div class="col-xl-6">
                                            <div class="row">
                                                <div class="col-md-6">
                                                    <div class="mb-3">
                                                        <label for="life_paid_by_us_id" class="form-label">Paid By Agent</label>
                                                        <select class="form-control select2-ajax" id="life_paid_by_us_id" name="life_paid_by_us_id"></select>
                                                    </div>
                                                </div>
                                                <div class="col-md-2">
                                                    <div class="mb-3">
                                                        <label  class="form-label spaceRemove">&nbsp;&nbsp;&nbsp;&nbsp;</label>
                                                        <button class="btn btn-primary px-4 form-control" onclick="return addPaymentModeUs();" type="button">Add</button>
                                                    </div>
                                                </div>
                                                <div class="col-md-4">
                                                    <div class="mb-3">
                                                        <label for="life_byus_payout_amount" class="form-label">Amount</label>
                                                        <input type="text" class="form-control digitLimit" onkeypress="return isNumber(event)" name="life_byus_payout_amount" id="life_byus_payout_amount" value="" placeholder="Enter amount" autocomplete="off">
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>

                                    <div class="row">
                                        <div class="col-md-12">
                                            <div class="mb-3">
                                                {{-- <label for="policy_document" class="form-label">Upload policy receipt <span style="font-size: 12px;color: #808080bd;">(JPG, PNG, JPEG or PDF)</span></label>
                                                <input type="file" name="policy_document[]" multiple="multiple" id="policy_document" class="form-control" accept="image/jpeg,image/png,application/pdf"> --}}

                                                @if ($data['can_edit'] == 1)
                                                    @if ($data['data']['image'] == "Found")
                                                        <label for="policy_document" id="label_policy_document" class="form-label">Reset Policy Receipt<span style="font-size: 12px;color: #808080bd;">(Ex. jpg, png, jpeg, pdf)</span></label><a id="downloadZip" href="" class="text text-primary ms-2">Download</a>
                                                    @else
                                                        <label id="label_policy_document" for="policy_document" class="form-label">Upload policy receipt <span style="font-size: 12px;color: #808080bd;">(JPG, PNG, JPEG or PDF)</span></label>
                                                    @endif
                                                    <input type="file" name="policy_document[]" multiple="multiple" id="policy_document" class="form-control" accept="image/jpeg,image/png,application/pdf">
                                                @else
                                                    <label id="label_policy_document" for="policy_document" class="form-label">Upload policy receipt <span style="font-size: 12px;color: #808080bd;">(JPG, PNG, JPEG or PDF)</span></label>
                                                    <input type="file" name="policy_document[]" multiple="multiple" id="policy_document" class="form-control" accept="image/jpeg,image/png,application/pdf" required>
                                                @endif
                                            </div>
                                        </div>
                                    </div>

                                    <div class="row">
                                        <div class="col-md-12">
                                            <div class="mb-3">
                                                <label for="life_remark" class="form-label">Remarks</label>
                                                <input type="text" class="form-control" name="life_remark" id="life_remark" placeholder="Remarks" maxlength="160" autocomplete="off">
                                            </div>
                                        </div>
                                    </div>
                                </section>                                                               
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
        <!-- End Main Section -->
    </div>
</div>

<div class="modal fade" id="modalPaymentModeParty" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" role="dialog" aria-labelledby="modalPaymentModePartyLabel" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered modal-lg" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="modalPaymentModePartyLabel">Payment Mode</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>

            <form  id="formPaymentModeParty" action="{{route('master.payment.mode.save')}}" method="POST"  class="needs-validation" novalidate>
                @csrf
                <div class="modal-body">
                    <div class="row">
                        <div class="col-md-12">
                            <div class="mb-3">
                                <label for="payment_mode_name" class="form-label">Payment Mode Name</label>
                                <input type="text" class="form-control" id="payment_mode_name" name="payment_mode_name" placeholder="Mode name" value="" required autocomplete="off">
                            </div>
                        </div>
                    </div>
                </div>

                <div class="modal-footer">
                    <button type="button" class="btn btn-light" data-bs-dismiss="modal">Close</button>
                    <button type="submit" class="btn btn-primary px-3">Save</button>
                </div>
            </form>
        </div>
    </div>
</div>

<div class="modal fade" id="modalPaymentModeUs" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" role="dialog" aria-labelledby="modalPaymentModeUsLabel" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered modal-lg" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="modalPaymentModeUsLabel">Payment Mode</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>

            <form  id="formPaymentModeUs" action="{{route('master.payment.mode.save')}}" method="POST"  class="needs-validation" novalidate>
                @csrf
                <div class="modal-body">
                    <div class="row">
                        <div class="col-md-12">
                            <div class="mb-3">
                                <label for="payment_mode_name" class="form-label">Payment Mode Name</label>
                                <input type="text" class="form-control" id="payment_mode_name" name="payment_mode_name" placeholder="Mode name" value="" required autocomplete="off">
                            </div>
                        </div>
                    </div>
                </div>

                <div class="modal-footer">
                    <button type="button" class="btn btn-light" data-bs-dismiss="modal">Close</button>
                    <button type="submit" class="btn btn-primary px-3">Save</button>
                </div>
            </form>
        </div>
    </div>
</div>

@include('../reachassuree_agent/master/comman/expiry-popup')

@endsection

@section('custom-scripts')
<script src="{{ asset('assets/libs/parsleyjs/parsley.min.js') }}"></script>
<script src = "{{ asset('assets/js/pages/kendo.all.min.js') }}"></script>
<script src="{{ asset('assets/js/pages/form-validation.init.js') }}?v=2"></script>
<script src="{{ asset('assets/js/pages/jquery.form.js') }}"></script>
<script src="{{ asset('assets/libs/jquery-steps/build/jquery.steps.min.js') }}"></script>
<script src="{{ asset('assets/js/pages/form-wizard.init.js') }}"></script>

<script type="text/javascript">
    var ajaxRenewLifePolicies = "{{ route('renewal.life.policies') }}";
    var ajaxSearchPaymentMode = "{{ route('search.payment.mode') }}";
    var isActualExpired = "{{ $data['isActualExpired'] }}";
    var isRenewable = "{{ $data['is_renewable'] }}";
    var is_expired = "{{ $data['is_expired'] }}";
    var canEdit = "{{ $data['can_edit'] }}";
    var currentDate = new Date();
    var authType = "{{ Auth::user()->type }}";

    $(document).ready(function() {
        dateValidations($('#life_transaction_date, #life_risk_to_date'));
    
        $('#payment_mode_name').on('input', function() {
            var inputValue = $(this).val();
            var capitalizedValue = capitalizeString(inputValue);
            $(this).val(capitalizedValue);
        });   

        if(isActualExpired == 1){
            $('.actions ul').remove();

            $(".actions").append("<p class='text-center text-danger font-size-14 fw-bold m-0 p-3'>Your current plan has expired. To resume disabled operations, you have the option to renew your existing plan or upgrade to a new one. Simply visit our 'Renew' or 'Upgrade' tab to proceed.</p>");
        }

        $("#modalIsExpired").hide();

        if(is_expired == 1){
            $('#formAddLifePolicy').css("cursor", "not-allowed");
            $("#formAddLifePolicy :input").prop("disabled", true);
            
            $("#modalIsExpired").modal('show');
        }

        $('a').click(function() {
            if ($('.actions li:eq(1)').hasClass('disabled')) {
                disabledFinish();
            }

            if ($('.actions li:eq(1)').attr('class') == '') {
                $('.actions li:last-child').hide();
            }
        });
        
        $("#life_transaction_date").datepicker({
            format: "dd-mm-yyyy",
            autoclose:true,
            endDate: currentDate,
        }).on('changeDate', function(){
            $('.datepicker').hide();
        });

        $('#life_basic_premium_amount, #life_tax_amount').on('keyup blur',function(e){
            var value1 = parseFloat($('#life_basic_premium_amount').val()) || 0;
            var value2 = parseFloat($('#life_tax_amount').val()) || 0;

            var life_commisionable_amount = value1.toFixed(2)
            var life_total_premium_amount = (value1 + value2).toFixed(2);

            $('#life_commisionable_amount').val(life_commisionable_amount);
            $('#life_total_premium_amount').val(life_total_premium_amount);
        });

        $('.digitLimit').keyup(function() {
            var inputValue = $(this).val();

            if (inputValue.length > 12) {
                $(this).val(inputValue.slice(0, 8));
            }
        });
    });

    if(isRenewable == 1){

        $(document).ready(function(){
            if(canEdit == 1){
                $("#record_id").val("{{$data['data']['id']}}");  
                // $("#life_transaction_date").val("{{$data['data']['transaction_date']}}");
                $("#life_transaction_date").val("{{$data['data']['renewal_transaction_date']}}");
                $("#life_document_number").val("{{$data['data']['document_number']}}");
            }            

            $("#life_insurance_id").val("{{$data['data']['id']}}");
            $("#life_client_id").val("{{$data['data']['client_id']}}");
            $("#life_family_group_id").val("{{$data['data']['family_group_id']}}");
            $("#head_middle_name").val("{{$data['data']['middle_name']}}");
            $("#head_last_name").val("{{$data['data']['last_name']}}");
            $("#head_first_name").val("{{$data['data']['first_name']}}");
            $("#life_policy_number").val("{{$data['data']['policy_number']}}");
            $("#life_risk_term").val("{{$data['data']['risk_term']}}");
            $("#life_premium_paying_term").val("{{$data['data']['premium_paying_term']}}");
            $("#life_risk_from_date").val("{{$data['data']['risk_from_date']}}");
            $("#life_maturity_date").val("{{$data['data']['maturity_date']}}");
            $("#life_last_payment_date").val("{{$data['data']['last_payment_date']}}");
            $("#life_risk_to_date").val("{{$data['data']['risk_to_date']}}");
            $("#life_basic_premium_amount").val("{{ number_format($data['data']['basic_amount'], 2, '.', '') }}");
            $("#life_sum_assured").val("{{$data['data']['sum_assured']}}");
            $("#life_tax_amount").val("{{ number_format($data['data']['tax_amount'], 2, '.', '') }}");
            $("#life_commisionable_amount").val("{{ number_format($data['data']['commisionable_amount'], 2, '.', '') }}");
            $("#life_total_premium_amount").val("{{ number_format($data['data']['total_amount'], 2, '.', '') }}");
            $("#life_accident_risk_amount").val("{{$data['data']['accident_risk_amount']}}");
            $("#policy_document_names").val("{{$data['data']['policy_document_names']}}");
            $("#life_remark").val("{{$data['data']['remark']}}");
            $("#life_party_payout_amount").val("{{$data['data']['party_payout_amount']}}");
            $("#life_byus_payout_amount").val("{{$data['data']['byus_payout_amount']}}");
            $("#life_policy_status_id").val("{{$data['data']['life_policy_status_id']}}");
            $("#life_broker_id").val("{{$data['data']['broker_id']}}");
            $("#life_agency_id").val("{{$data['data']['agency_id']}}");
            $("#life_sub_agent_id").val("{{$data['data']['sub_agent_id']}}");    

            $("#life_family_id").val("{{$data['data']['family_name']}}");            
            $("#life_client_name").val("{{$data['data']['client_name']}}");            

            $("#life_transaction_date").datepicker({
                update: "{{$data['data']['transaction_date']}}",
                format: "dd-mm-yyyy",
                autoclose:true,
                endDate: currentDate,
            }).on('changeDate', function(){
                $('.datepicker').hide();
            });

            if ("{{$data['data']['insurance_company_id']}}" != 0) {
                var newOption = new Option("{{$data['data']['insurance_company']}}","{{$data['data']['insurance_company_id']}}", false, false);
                $('#life_insurance_company_id').append(newOption).trigger('change');
            }
                    
            // if ("{{$data['data']['life_insurance_plan_id']}}" != 0) {
            //     var newOption = new Option("{{$data['data']['life_insurance_plan']}}","{{$data['data']['life_insurance_plan_id']}}", false, false);
            //     $('#life_insurance_plan_id').append(newOption).trigger('change');
            // }

            if ("{{$data['data']['life_insurance_plan_id']}}" != 0) {
                if("{{$data['data']['insurance_company_id']}}" == 1){
                    var newOption = new Option("{{ $data['data']['life_insurance_plan'] }}", "{{ $data['data']['life_insurance_plan_id'] }}", false, false);
                }else{
                    var newOption = new Option("{{ $data['data']['life_insurance_plan_new'] }}", "{{ $data['data']['life_insurance_plan_id'] }}", false, false);
                }
                $('#life_insurance_plan_id').append(newOption).trigger('change');
            }

            if ("{{$data['data']['plan_type_id']}}" != 0) {
                var newOption = new Option("{{ $data['data']['plan_type_name'] }}", "{{ $data['data']['plan_type_id'] }}", false, false);
                $('#life_insurance_plan_type_id').append(newOption).trigger('change');
            }

            if ("{{$data['data']['mode_id']}}" != 0) {
                var newOption = new Option("{{$data['data']['mode']}}","{{ $data['data']['mode_id'] }}", false, false);
                $('#life_mode_id').append(newOption).trigger('change');
            }

            if("{{$data['data']['branch_id']}}" != 0) { 
                $('#life_branch_id').empty();

                var newOption = new Option("{{$data['data']['branch']}}","{{$data['data']['branch_id']}}", false, false);
                $('#life_branch_id').append(newOption).trigger('change');
            }

            if("{{$data['data']['party_payment_mode']}}" != 0) {
                var newOption = new Option("{{$data['data']['party_payment_mode_name']}}","{{$data['data']['party_payment_mode']}}", false, false);
                $('#life_paid_by_party_id').append(newOption).trigger('change');
            }

            if("{{$data['data']['byus_payment_mode']}}" != 0) {
                var newOption = new Option("{{$data['data']['byus_payment_mode_name']}}","{{$data['data']['byus_payment_mode']}}", false, false);
                $('#life_paid_by_us_id').append(newOption).trigger('change');
            }
            
            $('#head_first_name, #head_middle_name, #head_last_name, #life_insurance_company_id, #life_branch_id, #life_policy_number, #life_insurance_plan_id, #life_insurance_plan_type_id, #life_mode_id, #life_risk_term, #life_premium_paying_term, #life_risk_from_date, #life_maturity_date, #life_last_payment_date').attr('readonly',true);
            
            $("#life_risk_to_date").datepicker({
                format: "dd-mm-yyyy",
            }).on('changeDate', function(){
                $('.datepicker').hide();
            });

            $("#life_sum_assured").attr('readonly',true);
        
            var riskFromDate = $("#life_risk_to_date").val();
            riskFromDate = riskFromDate.split('-');

            var risk_from = new Date(riskFromDate[2], riskFromDate[1]-1, riskFromDate[0]);
            
            var modeId = "{{ $data['data']['mode_id'] }}";
            if(modeId != '' && modeId != null){
                $.ajax({
                    type: 'GET',
                    url: "{{ route('master.mode.detail') }}" + "?id=" + modeId,
                    success: function(resultData) {
                        if (resultData['status'] == 1) {
                            var name = resultData['data']['name'];
                            var type = resultData['data']['type'];
                            var duration = resultData['data']['duration'];
                          
                            // if (type == "Year") {
                            //     risk_from.setDate(risk_from.getDate());
                            //     risk_from.setFullYear(risk_from.getFullYear()+ parseInt(duration));
                            //     risk_from.setMonth(risk_from.getMonth());
                            // } else if (type == "Month") {
                            //     risk_from.setDate(risk_from.getDate());
                            //     risk_from.setFullYear(risk_from.getFullYear());
                            //     risk_from.setMonth(risk_from.getMonth() + parseInt(duration));
                            //     if(risk_from.getMonth() >= 12){
                            //         risk_from.setFullYear(risk_from.getFullYear() + 1);
                            //     }
                            // }else if (type == "Days"){
                            //     risk_from.setDate(risk_from.getDate());
                            //     risk_from.setMonth(risk_from.getMonth());
                            //     risk_from.setDate(risk_from.getDay() + parseInt(duration));
                            // }else{
                            //     risk_from = '';
                            // }

                            // if (type === "Year") {
                            //     risk_from.setFullYear(risk_from.getFullYear() + parseInt(duration));
                            // } else if (type === "Month") {
                            //     risk_from.setMonth(risk_from.getMonth() + parseInt(duration));
                            // } else if (type === "Days") {
                            //     risk_from.setDate(risk_from.getDate() + parseInt(duration));
                            // } else {
                            //     risk_from = '';
                            // }                            

                            let dateStr = "{{$data['data']['last_payment_date']}}";
                            let parts = dateStr.split('-');
                            let formattedDate = new Date(parts[2], parts[1] - 1, parts[0]); // Year, Month (0-indexed), Day 
                           
                            if(new Date(formattedDate) >= new Date(risk_from)){
                                // $('#life_risk_to_date').datepicker('setDate', risk_from);
                            }else{
                                $('#life_risk_to_date').val('').attr('disabled',true);
                            }
                        }
                    }
                });
            }
        });
    }

    $(document).on('click', '#downloadZip', function(event) {
        event.preventDefault(); // prevent default link behavior

        var ajaxURL = "{{ route('download.life.insurance.document') }}";
        var id = "{{ $data['data']['id'] }}";

        $.ajax({
            url: ajaxURL + "?id=" + id + "&type=renewal",
            dataType: 'json', // set response data type
            success: function(resultData) {
                if (resultData['status'] == 1) {
                    var downloadLink = document.createElement('a');
                    downloadLink.href = resultData['download_url'];
                    downloadLink.download = resultData['file_name'];
                    downloadLink.click();
                } else {
                    toastr["error"](resultData['msg']);
                }
            },
            error: function(xhr, status, error) {
                toastr["error"](xhr.responseJSON['message']);
            }
        });
    });

    $("#life_paid_by_party_id").select2({
        ajax: {
            url: ajaxSearchPaymentMode,
            dataType: 'json',
            delay: 0,
            data: function (params) {
                return {
                    search_value: params.term, // search term
                    page: params.page
                };
            },
            processResults: function (data, params) {
                params.page = params.page || 1;
                
                return {
                    results: data.results,
                    pagination: {
                        more: (params.page * 30) < data.total_count
                    },
                };
            },
            cache: false
        },
        placeholder: 'Search for payment mode',
        allowClear: true
    });

    $("#life_paid_by_us_id").select2({
        ajax: {
            url: ajaxSearchPaymentMode,
            dataType: 'json',
            delay: 0,
            data: function (params) {
                return {
                    search_value: params.term, // search term
                    page: params.page
                };
            },
            processResults: function (data, params) {
                params.page = params.page || 1;
                
                return {
                    results: data.results,
                    pagination: {
                        more: (params.page * 30) < data.total_count
                    },
                };
            },
            cache: false
        },
        placeholder: 'Search for payment mode',
        allowClear: true
    });   

    $(document).ready(function() {
        var options = {
            beforeSubmit: showRequest,
            success: showResponse
        };

        $('#formRenewLifePolicy, #formPaymentModeParty, #formPaymentModeUs').submit(function() {
            $(this).ajaxSubmit(options);
            return false;
        });
    });

    $(document).keydown(function(e) {
        var code = e.keyCode || e.which;
    
        if(code == 27){
            $("#modalPaymentModeParty, #modalPaymentModeUs").modal('hide');
        }
    });

    function resetInputForm(){
        $('#formRenewLifePolicy').trigger("reset");

        $("#life_client_id, #life_family_group_id, #life_insurance_company_id, #life_branch_id, #life_insurance_plan_id, #life_mode_id, #life_broker_id").empty().trigger("change");
        $("#life_agency_id, #life_sub_agent_id, #life_paid_by_party_id, #life_paid_by_us_id, #insurance_company_id, #agency_level_id, #city_id").empty().trigger("change");

        $("#life_document_number").val(""+ generateUniqueIdentifier() +"");
    }

    function addPaymentModeParty(){
        $('#formPaymentModeParty').trigger("reset").removeClass('was-validated');
        $("#modalPaymentModeParty").modal('show');
    }

    function addPaymentModeUs(){
        $('#formPaymentModeUs').trigger("reset").removeClass('was-validated');
        $("#modalPaymentModeUs").modal('show');
    }

    function downloadPDF(){
        var dn = $('#life_document_number').val();

        kendo.drawing.drawDOM($(".container-fluid")).then(function(group) {
            return kendo.drawing.exportPDF(group, {
                paperSize: "auto",
                margin: { left: "1cm", top: "1cm", right: "1cm", bottom: "1cm" }
            });
        }).done(function(data) {
            kendo.saveAs({
                dataURI: data,
                fileName: dn+".pdf",
                // proxyURL: "https://demos.telerik.com/kendo-ui/service/export"
            });
        });
    }
    
    function showRequest(formData, jqForm, options) {
        showLoader();

        var queryString = $.param(formData);
        return true;
    }

    function showResponse(responseText, statusText, xhr, $form) {
       hideLoader();

        if (responseText['status'] == 1) {
            toastr["success"](responseText['msg']);

            $("#"+$form[0].id+"").removeClass('was-validated');

            var modalName = $form[0].id.split('form');
            $("#modal"+modalName[1]+"").modal('hide');

            if("#"+$form[0].id+"" == "#formRenewLifePolicy"){
                resetInputForm();
                window.location = ajaxRenewLifePolicies;
            }else if("#"+$form[0].id+"" == "#formPaymentModeParty"){
                var newOption = new Option(""+responseText['data']['text']+"",""+responseText['data']['id']+"", false, false);
                $('#life_paid_by_party_id').append(newOption).trigger('change');
            }else if("#"+$form[0].id+"" == "#formPaymentModeUs"){
                var newOption = new Option(""+responseText['data']['text']+"",""+responseText['data']['id']+"", false, false);
                $('#life_paid_by_us_id').append(newOption).trigger('change');
            }else if("#"+$form[0].id+"" == "#formPolicyDocumentUpload"){
                console.log(responseText);
            }else{
                resetInputForm();
            }

        } else if (responseText['status'] == 0) {
            if (typeof responseText['data'] !== "undefined") {
                var size = Object.keys(responseText['data']).length;
                if (size > 0) {
                    for (var [key, value] of Object.entries(responseText['data'])) {
                        toastr["error"](value);

                        if (key === 'life_insurance_plan_type_id') {
                            $("#life_insurance_plan_type_id").addClass('is-invalid').removeClass('is-valid');
                        } else if (key === 'life_insurance_plan_id') {
                            $("#life_insurance_plan_id").addClass('is-invalid').removeClass('is-valid');
                        }
                    }
                }
            } else {
                toastr["error"](responseText['msg']);
            }

            if(authType == 1 && responseText['flag'] == "Document"){
                $('#modelPlanName').text('').text("Document");
                $('.forPlanUpgrade').hide();
                $('.forPlanPurchase').show();
                $('#upgradePurchaseModal').modal('show');
            }

            if(authType == 1 && responseText['flag'] == "Policy"){
                $('#modelPlanName').text('').text("Policy entery");
                $('.forPlanUpgrade').show();
                $('.forPlanPurchase').hide();
                $('#upgradePurchaseModal').modal('show');
            }
        }
    }

    function disabledFinish(){
        $('#btnSave').remove();
        $('.actions li:last-child').show();
        $('.actions li:last-child a').remove();

        if(is_expired != 1){
            if (canEdit == 0) {
                if(isRenewable == 0){
                    $(".actions li:last").append("<button type='submit' class='btn btn-primary form-control stepsForm' id='btnSave'>Save</button>");
                }else{
                    $(".actions li:last").append("<button type='submit' class='btn btn-primary form-control stepsForm' id='btnSave'>Renew</button>");
                }
            }else{
                if(isRenewable == 1){
                    $(".actions li:last").append("<button type='submit' class='btn btn-primary form-control stepsForm' id='btnSave'>Update</button>");
                }else{
                    $(".actions li:last").append("<button type='submit' class='btn btn-primary form-control stepsForm' id='btnSave'>Renew</button>");
                }
            }
        } else {
            $('.actions li:last').css('margin', 'unset');
        }
    }

    $('#life_tax_amount, #life_commisionable_amount, #life_total_premium_amount, #life_basic_premium_amount').on('input paste', function(e){
        
        let value = $(this).val();
        value = notAllZeroAmt(value);
        $(this).val(value);
    });

    $('.number').keypress(function(event) {
        var $this = $(this);

        if ((event.which != 46 || $this.val().indexOf('.') != -1) && ((event.which < 48 || event.which > 57) && (event.which != 0 && event.which != 8))) {
            event.preventDefault();
        }

        var text = $(this).val();

        if ((event.which == 46) && (text.indexOf('.') == -1)) {
            setTimeout(function() {
                if ($this.val().substring($this.val().indexOf('.')).length > 3) {
                    $this.val($this.val().substring(0, $this.val().indexOf('.') + 3));
                }
            }, 1);
        }

        if ((text.indexOf('.') != -1) && (text.substring(text.indexOf('.')).length > 2) && (event.which != 0 && event.which != 8) && ($(this)[0].selectionStart >= text.length - 2)) {
            event.preventDefault();
        }
    });

    $('.number').bind("paste", function(e) {
        var text = e.originalEvent.clipboardData.getData('Text');

        if ($.isNumeric(text)) {
            if ((text.substring(text.indexOf('.')).length > 3) && (text.indexOf('.') > -1)) {
                e.preventDefault();
                $(this).val(text.substring(0, text.indexOf('.') + 3));
            }
        } else {
            e.preventDefault();
        }
    });

    $('.digitLimit').keyup(function() {
        var inputValue = $(this).val();

        if (inputValue.length > 12) {
            $(this).val(inputValue.slice(0, 12));
        }
    });
    $(document).ready(function() {
        const selectors = [
            '#life_basic_premium_amount',
            '#life_tax_amount',
            '#life_commisionable_amount',
            '#life_total_premium_amount'
        ];
        selectors.forEach(function(selector) {
            $(selector).on('input', function () {
                let val = $(this).val();

                if (!/^\d*\.?\d{0,2}$/.test(val)) {
                    val = val.slice(0, -1);
                }

                val = val.replace(/^0{2,}/, '0');

                $(this).val(val);
            });

            $(selector).on('paste', function(e) {
                let pastedData = e.originalEvent.clipboardData.getData('text');
                if (!/^\d*\.?\d{0,2}$/.test(pastedData)) {
                    e.preventDefault();
                }
            });
        });
    });


    $('#formRenewLifePolicy').on('change', 'input[type="file"]', function() {
        const fileInput = $(this);

        const maxFiles = 5;

        if (fileInput[0].files.length > maxFiles) {
            toastr["error"](`You can only upload ${maxFiles} files.`);
            fileInput.val(''); // reset the file input
        }
    });

</script>
@endsection