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

<style>
    #datatable_1_wrapper .row:first-child .col-sm-12,
    #datatable_1_wrapper .row:last-child .col-sm-12,
    #datatable_2_wrapper .row:first-child .col-sm-12,
    #datatable_2_wrapper .row:last-child .col-sm-12,
    #datatable_3_wrapper .row:first-child .col-sm-12,
    #datatable_3_wrapper .row:last-child .col-sm-12,
    #datatable_4_wrapper .row:first-child .col-sm-12,
    #datatable_4_wrapper .row:last-child .col-sm-12 {
        
        -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
        width: 50%;
    }

</style>

<div class="page-content">
    <div class="container-fluid">
        <!-- start page title -->
        @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 row -->
        <div class="row">
            <div class="col-md-12 d-flex justify-content-center">
                <ul class="nav nav-tabs mb-3" id="myTab" role="tablist">
                    <li class="nav-item" role="presentation">
                        <button class="nav-link waves-effect active " id="medi-claim" data-bs-toggle="tab" data-bs-target="#mediClaim" type="button" role="tab" aria-controls="profile" aria-selected="false">Mediclaim</button>
                    </li>
                    <li class="nav-item" role="presentation">
                        <button class="nav-link waves-effect" id="vehicle-claim" data-bs-toggle="tab" data-bs-target="#vehicleClaim" type="button" role="tab" aria-controls="contact" aria-selected="false">Vehicle Claim</button>
                    </li>
                    <li class="nav-item" role="presentation">
                        <button class="nav-link waves-effect" id="death-claim" data-bs-toggle="tab" data-bs-target="#deathClaim" type="button" role="tab" aria-controls="intellectual-property-policy-tab" aria-selected="false">Death Claim</button>
                    </li>
                    <li class="nav-item" role="presentation">
                        <button class="nav-link waves-effect" id="disability-claim" data-bs-toggle="tab" data-bs-target="#disabilityClaim" type="button" role="tab" aria-controls="intellectual-property-policy-tab" aria-selected="false">Disability Claim</button>
                    </li>
                    <li class="nav-item" role="presentation">
                        <button class="nav-link waves-effect" id="other-claim" data-bs-toggle="tab" data-bs-target="#otherClaim" type="button" role="tab" aria-controls="intellectual-property-policy-tab" aria-selected="false">Other Claim</button>
                    </li>
                </ul>
            </div>
        </div>

        <div class="row">
            <div class="card">
                <div class="card-body">
                    <div class="tab-content" id="myTabContent">
                        <!-- mediclaim -->
                        <div class="tab-pane fade show active" id="mediClaim" role="tabpanel" aria-labelledby="medi-claim">
                            <div class="row">
                                <div class="col-xl-2">
                                    <div class="mb-3">
                                        <label for="filter_status" class="form-label">Record Status</label>
                                        <select class="form-control select2-ajax" name="filter_status" id="filter_status">
                                            <option value="-1">All</option>
                                            <option value="0">Query Pending</option>
                                            <option value="1">Settlement Pending</option>
                                            <option value="2">Query Complete</option>
                                            <option value="3">Settlement Complete</option>
                                            <option value="4">Rejected Claim</option>
                                        </select>
                                    </div>
                                </div>
        
                                <div class="col-xl-2">
                                    <div class="mb-3">
                                        <label for="from_date" class="form-label">Transaction From Date</label>
                                        <input type="text" name="from_date" id="from_date" class="form-control" placeholder="dd-mm-yyyy" autocomplete="off">
                                    </div>
                                </div>
        
                                <div class="col-xl-2">
                                    <div class="mb-3">
                                        <label for="end_date" class="form-label">Transaction End Date</label>
                                        <input type="text" name="end_date" id="end_date" class="form-control" placeholder="dd-mm-yyyy" autocomplete="off">
                                    </div>
                                </div>
        
                                <div class="col-xl-2">
                                    <div class="mb-3">
                                      <label  class="form-label extra_space" for="btnClear">&nbsp;&nbsp;&nbsp;&nbsp;</label>
                                      <button type="button" onclick="return clearSearch();" class="form-control btn btn-primary" id="btnClear">Clear</button>
                                    </div>
                                  </div>
                            </div>
                            
                            <div class="row mt-3 search-value">
                                <div class="text-center">
                                  <span class="alert-warning alert-animation px-3 py-1 rounded-3">Filter is applied...</span>              
                                </div>
                            </div>
                        
                            <br>

                            <div class="table-responsive">
                                <table id="datatable" class="table align-middle table-nowrap table-striped display nowrap w-100">
                                    <thead class="table-light">
                                        <tr>
                                            <th>Action</th>
                                            <th>Status</th>
                                            <th>Form Fill Continue</th>
                                            <th>Policy Number<br><input type="text" class="form-control" name="policy_number" placeholder="Search" autocomplete="off" style="width: 100px; height: 25px" disabled></th>                        
                                            <th>Policy Holder Name<br><input type="text" class="form-control" name="policy_holder_name" placeholder="Search" autocomplete="off" style="width: 100px; height: 25px" disabled></th>
                                            <th>Insurance Comp. Name<br><input type="text" class="form-control" name="ins_comp_name" placeholder="Search" autocomplete="off" style="width: 100px; height: 25px" disabled></th>
                                            <th>Transaction Date<br><input type="text" class="form-control" name="transaction_date" placeholder="Search" autocomplete="off" maxlength="10" style="width: 100px; height: 25px"></th>
                                            <th>Claim Type<br><input type="text" class="form-control" name="claim_type" placeholder="Search" autocomplete="off" style="width: 100px; height: 25px"></th>
                                            <th>Claim Lodged Type<br><input type="text" class="form-control" name="claim_lodged_type" placeholder="Search" autocomplete="off" style="width: 100px; height: 25px"></th>
                                            <th>Name Of Patient<br><input type="text" class="form-control" name="name_of_patient" placeholder="Search" autocomplete="off" style="width: 100px; height: 25px" disabled></th>
                                            <th>Admission Date<br><input type="text" class="form-control" name="admission_date" placeholder="Search" autocomplete="off" maxlength="10" style="width: 100px; height: 25px"></th>
                                            <th>Discharged Date<br><input type="text" class="form-control" name="discharged_date" placeholder="Search" autocomplete="off" maxlength="10" style="width: 100px; height: 25px"></th>
                                            <th>File Received <br> Date<br><input type="text" class="form-control" name="file_received_date" placeholder="Search" autocomplete="off" maxlength="10" style="width: 100px; height: 25px"></th>
                                            <th>File Submited <br> Date<br><input type="text" class="form-control" name="file_submited_date" placeholder="Search" autocomplete="off" maxlength="10" style="width: 100px; height: 25px"></th>                        
                                            <th>File Online <br> Upload Date<br><input type="text" class="form-control" name="fil_online_upload_date" placeholder="Search" autocomplete="off" maxlength="10" style="width: 100px; height: 25px"></th>
                                            <th>Bills Grand <br> Total Amt.<br><input type="text" class="form-control" name="grand_total_amt" placeholder="Search" autocomplete="off" style="width: 100px; height: 25px"></th>
                                            <th>Email Note<br><input type="text" class="form-control" name="email_note" placeholder="Search" autocomplete="off" style="width: 100px; height: 25px"></th>
                                        </tr>
                                    </thead>
                                    <tbody></tbody>
                                </table>
                                @csrf
                            </div>
                        </div>

                        <!-- vehicle claim -->
                        <div class="tab-pane fade show" id="vehicleClaim" role="tabpanel" aria-labelledby="vehicle-claim">
                            <div class="row">
                                <div class="col-xl-2">
                                    <div class="mb-3">
                                        <label for="filter_status_1" class="form-label">Record Status</label>
                                        <select class="form-control select2-ajax" name="filter_status" id="filter_status_1">
                                            <option value="-1">All</option>
                                            <option value="0">Query Pending</option>
                                            <option value="1">Settlement Pending</option>
                                            <option value="2">Query Complete</option>
                                            <option value="3">Settlement Complete</option>
                                            <option value="4">Rejected Claim</option>
                                        </select>
                                    </div>
                                </div>
        
                                <div class="col-xl-2">
                                    <div class="mb-3">
                                        <label for="from_date_1" class="form-label">Transaction From Date</label>
                                        <input type="text" name="from_date" id="from_date_1" class="form-control" placeholder="dd-mm-yyyy" autocomplete="off">
                                    </div>
                                </div>
        
                                <div class="col-xl-2">
                                    <div class="mb-3">
                                        <label for="end_date_1" class="form-label">Transaction End Date</label>
                                        <input type="text" name="end_date" id="end_date_1" class="form-control" placeholder="dd-mm-yyyy" autocomplete="off">
                                    </div>
                                </div>
        
                                <div class="col-xl-2">
                                    <div class="mb-3">
                                      <label  class="form-label extra_space" for="btnClear_1">&nbsp;&nbsp;&nbsp;&nbsp;</label>
                                      <button type="button" onclick="return clearSearch_1();" class="form-control btn btn-primary" id="btnClear_1">Clear</button>
                                    </div>
                                  </div>
                            </div>
                            
                            <div class="row mt-3 search-value-1">
                                <div class="text-center">
                                  <span class="alert-warning alert-animation px-3 py-1 rounded-3">Filter is applied...</span>              
                                </div>
                            </div>
                        
                            <br>

                            <div class="table-responsive">
                                <table id="datatable_1" class="table align-middle table-nowrap table-striped display nowrap w-100">
                                    <thead class="table-light">
                                        <tr>
                                            <th>Action</th>
                                            <th>Status</th>
                                            <th>Form Fill Continue</th>
                                            <th>Policy Number<br><input type="text" class="form-control" name="policy_number_1" placeholder="Search" autocomplete="off" style="width: 100px; height: 25px"></th>                        
                                            <th>Policy Holder Name<br><input type="text" class="form-control" name="policy_holder_name_1" placeholder="Search" autocomplete="off" style="width: 100px; height: 25px"></th>
                                            <th>Insurance Comp. Name<br><input type="text" class="form-control" name="ins_comp_name_1" placeholder="Search" autocomplete="off" style="width: 100px; height: 25px"></th>
                                            <th>Transaction Date<br><input type="text" class="form-control" name="transaction_date_1" placeholder="Search" autocomplete="off" maxlength="10" style="width: 100px; height: 25px"></th>
                                            <th>Claim Type<br><input type="text" class="form-control" name="claim_type_1" placeholder="Search" autocomplete="off" style="width: 100px; height: 25px"></th>
                                            <th>Claim Lodged Type<br><input type="text" class="form-control" name="claim_lodged_type_1" placeholder="Search" autocomplete="off" style="width: 100px; height: 25px"></th>
                                            <th>TP Person Name<br><input type="text" class="form-control" name="tp_person_name" placeholder="Search" autocomplete="off" style="width: 100px; height: 25px"></th>
                                            <th>Garage Name<br><input type="text" class="form-control" name="garage_name" placeholder="Search" autocomplete="off" maxlength="10" style="width: 100px; height: 25px"></th>
                                            <th>Discharged Date<br><input type="text" class="form-control" name="discharged_date_1" placeholder="Search" autocomplete="off" maxlength="10" style="width: 100px; height: 25px"></th>
                                            <th>File Received <br> Date<br><input type="text" class="form-control" name="file_received_date_1" placeholder="Search" autocomplete="off" maxlength="10" style="width: 100px; height: 25px"></th>
                                            <th>File Submited <br> Date<br><input type="text" class="form-control" name="file_submited_date_1" placeholder="Search" autocomplete="off" maxlength="10" style="width: 100px; height: 25px"></th>                        
                                            <th>File Online <br> Upload Date<br><input type="text" class="form-control" name="fil_online_upload_date_1" placeholder="Search" autocomplete="off" maxlength="10" style="width: 100px; height: 25px"></th>
                                            <th>Bills Grand <br> Total Amt.<br><input type="text" class="form-control" name="grand_total_amt_1" placeholder="Search" autocomplete="off" style="width: 100px; height: 25px"></th>
                                        </tr>
                                    </thead>
                                    <tbody></tbody>
                                </table>
                                @csrf
                            </div>
                        </div>

                         <!-- death claim -->
                        <div class="tab-pane fade show" id="deathClaim" role="tabpanel" aria-labelledby="death-claim">
                            <div class="row">
                                <div class="col-xl-2">
                                    <div class="mb-3">
                                        <label for="filter_status_2" class="form-label">Record Status</label>
                                        <select class="form-control select2-ajax" name="filter_status" id="filter_status_2">
                                            <option value="-1">All</option>
                                            <option value="0">Query Pending</option>
                                            <option value="1">Settlement Pending</option>
                                            <option value="2">Query Complete</option>
                                            <option value="3">Settlement Complete</option>
                                            <option value="4">Rejected Claim</option>
                                        </select>
                                    </div>
                                </div>
        
                                <div class="col-xl-2">
                                    <div class="mb-3">
                                        <label for="from_date_2" class="form-label">Transaction From Date</label>
                                        <input type="text" name="from_date" id="from_date_2" class="form-control" placeholder="dd-mm-yyyy" autocomplete="off">
                                    </div>
                                </div>
        
                                <div class="col-xl-2">
                                    <div class="mb-3">
                                        <label for="end_date_2" class="form-label">Transaction End Date</label>
                                        <input type="text" name="end_date" id="end_date_2" class="form-control" placeholder="dd-mm-yyyy" autocomplete="off">
                                    </div>
                                </div>
        
                                <div class="col-xl-2">
                                    <div class="mb-3">
                                      <label  class="form-label extra_space" for="btnClear_2">&nbsp;&nbsp;&nbsp;&nbsp;</label>
                                      <button type="button" onclick="return clearSearch_2();" class="form-control btn btn-primary" id="btnClear_2">Clear</button>
                                    </div>
                                  </div>
                            </div>
                            
                            <div class="row mt-3 search-value-2">
                                <div class="text-center">
                                  <span class="alert-warning alert-animation px-3 py-1 rounded-3">Filter is applied...</span>              
                                </div>
                            </div>
                        
                            <br>

                            <div class="table-responsive">
                                <table id="datatable_2" class="table align-middle table-nowrap table-striped display nowrap w-100">
                                    <thead class="table-light">
                                        <tr>
                                            <th>Action</th>
                                            <th>Status</th>
                                            <th>Form Fill Continue</th>
                                            <th>Policy Number<br><input type="text" class="form-control" name="policy_number_2" placeholder="Search" autocomplete="off" style="width: 100px; height: 25px" disabled></th>
                                            <th>Policy Holder Name<br><input type="text" class="form-control" name="policy_holder_name_2" placeholder="Search" autocomplete="off" style="width: 100px; height: 25px" disabled></th>
                                            <th>Insurance Comp. Name<br><input type="text" class="form-control" name="ins_comp_name_2" placeholder="Search" autocomplete="off" style="width: 100px; height: 25px" disabled></th>
                                            <th>Transaction Date<br><input type="text" class="form-control" name="transaction_date_2" placeholder="Search" maxlength="10" autocomplete="off" style="width: 100px; height: 25px"></th>
                                            <th>Claim Type<br><input type="text" class="form-control" name="claim_type_2" placeholder="Search" autocomplete="off" style="width: 100px; height: 25px"></th>
                                            <th>Death Claim Type<br><input type="text" class="form-control" name="death_claim_type" placeholder="Search" autocomplete="off" style="width: 100px; height: 25px"></th>
                                            <th>Death Person Name<br><input type="text" class="form-control" name="death_person_name" placeholder="Search" autocomplete="off" style="width: 100px; height: 25px"></th>
                                            <th>Nominee Name<br><input type="text" class="form-control" name="nominee_name" placeholder="Search" autocomplete="off" style="width: 100px; height: 25px"></th>
                                            <th>Contact No.<br><input type="text" class="form-control" name="contact_num" placeholder="Search" autocomplete="off" style="width: 100px; height: 25px"></th>
                                            <th>Death Date<br><input type="text" class="form-control" name="death_date" placeholder="Search" autocomplete="off" style="width: 100px; height: 25px"></th>
                                            <th>Death Type<br><input type="text" class="form-control" name="death_type" placeholder="Search" maxlength="10" autocomplete="off" style="width: 100px; height: 25px"></th>
                                            <th>Reason Of Death<br><input type="text" class="form-control" name="reason_for_death" placeholder="Search" autocomplete="off"style="width: 100px; height: 25px"></th>
                                            <th>Intimated Through<br><input type="text" class="form-control" name="intimated_through" placeholder="Search" autocomplete="off"style="width: 100px; height: 25px"></th>                                            
                                            <th>Direct Company Name<br><input type="text" class="form-control" name="direct_comp_name_2" placeholder="Search" autocomplete="off"style="width: 100px; height: 25px"></th>
                                            <th>TPA Company Name<br><input type="text" class="form-control" name="tpa_comp_name_2" placeholder="Search" autocomplete="off"style="width: 100px; height: 25px"></th>
                                            <th>Intimated To<br><input type="text" class="form-control" name="intimated_to_2" placeholder="Search" autocomplete="off"style="width: 100px; height: 25px"></th>
                                            <th>Total Sum Assured<br><input type="text" class="form-control" name="total_sum_assu_2" placeholder="Search" autocomplete="off"style="width: 100px; height: 25px"></th>
                                            <th>Total Term Rider <br>Sum Assured<br><input type="text" class="form-control" name="total_term_rider_sum_assu_2" placeholder="Search" autocomplete="off"style="width: 100px; height: 25px"></th>
                                            <th>Total Accident <br> Sum Assured<br><input type="text" class="form-control" name="total_acci_sum_assu_2" placeholder="Search" autocomplete="off"style="width: 100px; height: 25px"></th>
                                            <th>Total Double <br> Accident Rider <br> Sum Assured<br><input type="text" class="form-control" name="total_double_acci_rider_sum_assu_2" placeholder="Search" autocomplete="off"style="width: 100px; height: 25px"></th>
                                            <th>Notes<br><input type="text" class="form-control" name="notes" placeholder="Search" autocomplete="off"style="width: 100px; height: 25px" disabled></th>
                                        </tr>
                                    </thead>
                                    <tbody></tbody>
                                </table>
                                @csrf
                            </div>
                        </div>

                         <!-- disability claim -->
                        <div class="tab-pane fade show" id="disabilityClaim" role="tabpanel" aria-labelledby="disability-claim">
                            <div class="row">
                                <div class="card-body">
                                    <div class="row">
                                        <div class="text-center">
                                            <div class="row justify-content-center mt-1">
                                                <div class="col-sm-3">
                                                    <div class="maintenance-img">
                                                        <img src="{{ asset('assets/images/coming-soon.svg') }}" alt="" class="img-fluid mx-auto d-block">
                                                    </div>
                                                </div>
                                            </div>
                                            
                                            <div class="row justify-content-center">
                                                <div class="col-md-8">
                                                    <h4>Coming Soon...!</h4>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        
                        <!-- other claim -->
                        <div class="tab-pane fade show" id="otherClaim" role="tabpanel" aria-labelledby="other-claim">
                            <div class="row">
                                <div class="col-xl-2">
                                    <div class="mb-3">
                                        <label for="filter_status_4" class="form-label">Record Status</label>
                                        <select class="form-control select2-ajax" name="filter_status" id="filter_status_4">
                                            <option value="-1">All</option>
                                            <option value="0">Query Pending</option>
                                            <option value="1">Settlement Pending</option>
                                            <option value="2">Query Complete</option>
                                            <option value="3">Settlement Complete</option>
                                            <option value="4">Rejected Claim</option>
                                        </select>
                                    </div>
                                </div>
        
                                <div class="col-xl-2">
                                    <div class="mb-3">
                                        <label for="from_date_4" class="form-label">Transaction From Date</label>
                                        <input type="text" name="from_date" id="from_date_4" class="form-control" placeholder="dd-mm-yyyy" autocomplete="off">
                                    </div>
                                </div>
        
                                <div class="col-xl-2">
                                    <div class="mb-3">
                                        <label for="end_date_4" class="form-label">Transaction End Date</label>
                                        <input type="text" name="end_date" id="end_date_4" class="form-control" placeholder="dd-mm-yyyy" autocomplete="off">
                                    </div>
                                </div>
        
                                <div class="col-xl-2">
                                    <div class="mb-3">
                                      <label  class="form-label extra_space" for="btnClear_4">&nbsp;&nbsp;&nbsp;&nbsp;</label>
                                      <button type="button" onclick="return clearSearch_4();" class="form-control btn btn-primary" id="btnClear_4">Clear</button>
                                    </div>
                                  </div>
                            </div>
                            
                            <div class="row mt-3 search-value-4">
                                <div class="text-center">
                                  <span class="alert-warning alert-animation px-3 py-1 rounded-3">Filter is applied...</span>              
                                </div>
                            </div>
                        
                            <br>
                            
                            <div class="table-responsive">
                                <table id="datatable_4" class="table align-middle table-nowrap table-striped display nowrap w-100">
                                    <thead class="table-light">
                                        <tr>
                                            <th>Action</th>
                                            <th>Status</th>
                                            <th>Form Fill Continue</th>
                                            <th>Policy Number<br><input type="text" class="form-control" name="policy_number_4" placeholder="Search" autocomplete="off" style="width: 100px; height: 25px"></th>                        
                                            <th>Policy Holder Name<br><input type="text" class="form-control" name="policy_holder_name_4" placeholder="Search" autocomplete="off" style="width: 100px; height: 25px"></th>
                                            <th>Insurance Comp. Name<br><input type="text" class="form-control" name="ins_comp_name_4" placeholder="Search" autocomplete="off" style="width: 100px; height: 25px"></th>
                                            <th>Transaction Date<br><input type="text" class="form-control" name="transaction_date_4" placeholder="Search" autocomplete="off" maxlength="10" style="width: 100px; height: 25px"></th>
                                            <th>Claim Type<br><input type="text" class="form-control" name="claim_type_4" placeholder="Search" autocomplete="off" style="width: 100px; height: 25px"></th>
                                            <th>Claim Lodged Type<br><input type="text" class="form-control" name="claim_lodged_type_4" placeholder="Search" autocomplete="off" style="width: 100px; height: 25px"></th>
                                            <th>Total Claim Amt.<br><input type="text" class="form-control" name="total_claim_amt" placeholder="Search" autocomplete="off" style="width: 100px; height: 25px"></th>
                                            <th>Submited <br> Surveyer Report<br><input type="text" class="form-control" name="submited_surveyer" placeholder="Search" autocomplete="off" style="width: 100px; height: 25px"></th>
                                            <th>Submited <br> Fire Station Docs.<br><input type="text" class="form-control" name="submited_fire" placeholder="Search" autocomplete="off" maxlength="10" style="width: 100px; height: 25px"></th>
                                            <th>Submited <br> Police Station Docs.<br><input type="text" class="form-control" name="submited_police" placeholder="Search" autocomplete="off" maxlength="10" style="width: 100px; height: 25px"></th>
                                            <th>Submited <br> Expence Annu-A<br><input type="text" class="form-control" name="submited_expense" placeholder="Search" autocomplete="off" maxlength="10" style="width: 100px; height: 25px"></th>
                                            <th>File Received <br> Date<br><input type="text" class="form-control" name="file_received_date_4" placeholder="Search" autocomplete="off" maxlength="10" style="width: 100px; height: 25px"></th>
                                            <th>File Submited <br> Date<br><input type="text" class="form-control" name="file_submited_date_4" placeholder="Search" autocomplete="off" maxlength="10" style="width: 100px; height: 25px"></th>                        
                                            <th>File Online <br> Upload Date<br><input type="text" class="form-control" name="fil_online_upload_date_4" placeholder="Search" autocomplete="off" maxlength="10" style="width: 100px; height: 25px"></th>
                                            <th>Email Note<br><input type="text" class="form-control" name="email_note_4" placeholder="Search" autocomplete="off" style="width: 100px; height: 25px"></th>
                                        </tr>
                                    </thead>
                                    <tbody></tbody>
                                </table>
                                @csrf
                            </div>
                        </div>

                        <div class="col-md-12 mt-5 amount_hide">
                            <div class="row">
                                <div class="col-xl"></div>
                                <div class="col-xl">
                                    <div class="card text-white bg-dark mb-3">
                                        <div class="card-header text-center font-size-13">Total Claim Lodged Amount<br>
                                            <div id="claim_lodged_amt"></div>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-xl"></div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<div class="modal fade" id="modalViewNotes" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" role="dialog" aria-labelledby="modalViewNotesLabel" 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="modalViewNotesLabel">Notes</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>

            <div class="modal-body">
                <div class="row">
                    <div class="col-md-12">                                                
                        <div class="form-check-inline">
                            <input class="form-check-inline form-check-input" type="checkbox" name="notes[]" id="note_1" value="1" disabled>
                            <p class="form-check-inline">[1] All Required  Claim Forms of The Compny was Fully Filluped , Signed and Stamped are enclosed here with</p>
                        </div>                                                
                    </div>
                </div>
                
                <div class="row">
                    <div class="col-md-12">                                                
                        <div class="form-check-inline">
                            <input class="form-check-inline form-check-input" type="checkbox" name="notes[]" id="note_2" value="2" disabled>
                            <p class="form-check-inline">[2] All Required Docs. Of Death Person are Enclosed Here with</p>
                        </div>                                                
                    </div> 
                </div>

                <div class="row">
                    <div class="col-md-12">                                                
                        <div class="form-check-inline">
                            <input class="form-check-inline form-check-input" type="checkbox" name="notes[]" id="note_3" value="3" disabled>
                            <p class="form-check-inline">[3] All Required Docs. Of Nominee Person are Enclosed Here with</p>
                        </div>                                                
                    </div> 
                </div>

                <div class="row">
                    <div class="col-md-12">                                                
                        <div class="form-check-inline">
                            <input class="form-check-inline form-check-input" type="checkbox" name="notes[]" id="note_4" value="4" disabled>
                            <p class="form-check-inline">[4] All Docs are enclosed here with which are regarding of Incident</p>
                        </div>                                                
                    </div> 
                </div>

                <div class="row">
                    <div class="col-md-12">                                                
                        <div class="form-check-inline">
                            <input class="form-check-inline form-check-input" type="checkbox" name="notes[]" id="note_5" value="5" disabled>
                            <p class="form-check-inline">[5] All Docs are enclosed here with which are regarding of Hospitals</p>
                        </div>                                                
                    </div> 
                </div>

                <div class="row">
                    <div class="col-md-12">                                                
                        <div class="form-check-inline">
                            <input class="form-check-inline form-check-input" type="checkbox" name="notes[]" id="note_6" value="6" disabled>
                            <p class="form-check-inline">[6] All Docs are enclosed here with which are regarding of Police /Fire and Other Govt.Depts</p>
                        </div>                                                
                    </div> 
                </div>

                <div class="row">
                    <div class="col-md-12">                                                
                        <div class="form-check-inline">
                            <input class="form-check-inline form-check-input" type="checkbox" name="notes[]" id="note_7" value="7" disabled>
                            <p class="form-check-inline">[7] All Original Policy Documents are enclosed here with as per Policy list</p>
                        </div>                                                
                    </div>
                </div>
                
                <div class="row">
                    <div class="col-md-12">                                                
                        <div class="form-check-inline">
                            <input class="form-check-inline form-check-input" type="checkbox" name="notes[]" id="note_8" value="8" disabled>
                            <p class="form-check-inline">[8] Claimed  Policy List is enclosed Here with</p>
                        </div>                                                
                    </div> 
                </div>
            </div>

            <div class="modal-footer">
                <button type="button" id="closebtn" class="btn btn-light" data-bs-dismiss="modal">Close</button>
            </div>            
        </div>
    </div>
</div>

<div class="modal fade" id="modalAddFollowUp" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" role="dialog" aria-labelledby="modalAddFollowUpLabel" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered modal-xl" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="modalAddFollowUpLabel">Follow Up</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>

            <div class="modal-body pb-1">
                <form id="formAddFollowUps" method="POST"  class="needs-validation" novalidate>
                    <input type="hidden" class="form-control" name="follow_up_id" id="follow_up_id">
                    <input type="hidden" class="form-control" name="data_id" id="data_id">   
                    <input type="hidden" class="form-control" name="follow_up_type" id="follow_up_type" value="Lodged">
                    <input type="hidden" class="form-control" name="current_tab" id="current_tab" value="Lodged">
                    @csrf

                    <div class="row">
                        <div class="col-xxl-5">
                            <div class="mb-3">
                                <label for="follow_up_date" class="form-label">Follow Up Date</label>
                                <input type="text" class="form-control" name="follow_up_date" id="follow_up_date" placeholder="dd-mm-yyyy" autocomplete="off" required>
                            </div>
                        </div>
                        <div class="col-xxl-5">
                            <div class="mb-3">
                                <label for="follow_up_remarks" class="form-label">Follow Up Remarks</label>
                                <input type="text" class="form-control" name="follow_up_remarks" id="follow_up_remarks" value="" placeholder="Enter remarks" maxlength="255" autocomplete="off" required>
                            </div>
                        </div>
                        <div class="col-xxl-2">
                            <div class="mb-3">
                                <label for="saveFolloUpsBtn" class="form-label">&nbsp;&nbsp;&nbsp;&nbsp;</label>
                                <button type="button" class="btn btn-primary form-control px-5 float-end" id="saveFolloUpsBtn" onclick="return saveFollowUp();">Save</button>
                            </div>
                        </div>
                    </div>
                </form>

                <hr>

                <div class="table-responsive">
                    <table id="followupDatatable" class="table align-middle table-nowrap table-striped display nowrap w-100">   
                        <thead class="table-light">
                            <tr>
                                <th>Action</th>
                                <th>Tab</th>
                                <th>Date</th>
                                <th>Remarks</th>
                            </tr>
                        </thead>
                        <tbody></tbody>
                    </table>
                    @csrf
                </div>
            </div>

            <div class="modal-footer">
                <button type="button" class="btn btn-light" data-bs-dismiss="modal">Close</button>                    
            </div>
        </div>
    </div>
</div>

@endsection

@section('custom-scripts')
<script src="{{ asset('assets/js/pages/sweet-alerts.init.js') }}"></script>

<script type="text/javascript">
    var ajaxURLGetMediClaimData = "{{route('medi.claim.lodged.data.ajax')}}";
    var ajaxURLGetVehicleClaimData = "{{route('vehicle.claim.lodged.data.ajax')}}";
    var ajaxURLGetDeathClaimData = "{{route('death.claim.lodged.data.ajax')}}";
    var ajaxURLGetOtherClaimData = "{{route('other.claim.lodged.data.ajax')}}";
    var deathClaimLodgedDetails = "{{route('death.claim.lodged.details')}}";
    var deleteLodgedClaim = "{{route('delete.claim.lodged')}}";
    var changeClaimLodgedStatusURL = "{{route('change.claim.lodged.status')}}";
    var csrfToken = $("[name=_token").val();

    function Settlement(id){
        swal.fire({
            title: "You want to continue this claim",
            showCancelButton: true,
            confirmButtonColor: "#556ee6",
            cancelButtonColor: "#f46a6a",
            confirmButtonText: "Settlement it!",
            cancelButtonText: "Reject it!",
        }).then((result) => {
            if (result.isConfirmed) {
                window.location = "{{route('add.claim.settlement.data')}}?id="+ id +"&type=lodged";

            } else {
                var claimDetails = "{{route('reverse.claim.details')}}";

                $.ajax({
                    type: 'GET',
                    url: claimDetails + "?id=" + id,
                    success: function(resultData) {
                        if (resultData['status'] == 1) {
                            window.location = "{{route('add.claim.lodged.data')}}?id=" + resultData.id + "&type=" + resultData.type + "-reject&parent_id=" + id;

                        }else{
                            toastr['error'](resultData['msg']);
                        }
                    }
                });
            }
        });
    }

    function Reject(id){
        var claimDetails = "{{route('reverse.claim.details')}}";

        $.ajax({
            type: 'GET',
            url: claimDetails + "?id=" + id,
            success: function(resultData) {
                if (resultData['status'] == 1) {
                    window.location = "{{route('add.claim.lodged.data')}}?id=" + resultData.id + "&type=" + resultData.type + "-reject&parent_id=" + id;

                }else{
                    toastr['error'](resultData['msg']);
                }
            }
        });
    }

    // delete
    function lodgedDelete(id,claim_intimation_id){
        swal.fire({
            title: "Are you sure want to delete this?",
            text: "You won't be able to revert this!",
            showCancelButton: true,
            confirmButtonColor: "#526BDF",
            cancelButtonColor: "#EC6767",
            confirmButtonText: "Yes, delete it!",
            cancelButtonText: "No, cancel it!",
        }).then((result) => {
            if (result.isConfirmed) {
                remove(id,claim_intimation_id);
            }
        });
    }

    function remove(id,claim_intimation_id) {
        $.ajax({
            type: 'GET',
            url: deleteLodgedClaim + "?id=" + id + "&claim_intimation_id=" + claim_intimation_id,
            success: function(resultData) {
                if (resultData['status'] == 1) {
                    toastr["success"](resultData['msg']);
                    $('#datatable , #datatable_1 , #datatable_2 , #datatable_4').DataTable().ajax.reload(null, false);
                    // $('#datatable_3').DataTable().ajax.reload(null, false);
                }else{
                    toastr["error"](resultData['msg']);
                    swal.fire({
                        title: "Delete Linked Record First",
                        text: "Unable to delete the record. Please delete the linked record with its ID first.",
                        showCancelButton: false,
                        confirmButtonColor: "#526BDF",
                        confirmButtonText: "Okay",
                    });
                }
            }
        });
    }

    // status change
    function changeStatus(id) {
        var lodged_status = document.getElementById("lodged_status" + id);
        
        if (lodged_status.checked) {
            lodged_status = 1;
        } else {
            lodged_status = 0;
        }

        $.ajax({
            type: 'GET',
            url: changeClaimLodgedStatusURL + "?id=" + id + "&lodged_status=" + lodged_status,
            success: function(resultData) {
                if (resultData['status'] == 1) {
                    toastr["success"](resultData['msg']);
                    $('#datatable , #datatable_1 , #datatable_2 , #datatable_4').DataTable().ajax.reload(null, false);
                    // $('#datatable_3').DataTable().ajax.reload(null, false);
                }
            }
        });
    }

    function errorMsg(){
        toastr["error"]("Query Are Pending");
    }

    function successMsg(id){
        if(id == 0){
            toastr["info"]("You Can Add Settlement Of This Claim Lodged From Query Manage Tab");
        }

        if(id == 1) {
            toastr["success"]("Already Added Settlement Of This Claim Lodged");
        }

        if(id == 2){
            toastr["info"]("No Query For This Claim Lodged Due To Settlement Added");
        }
    }
    
    function comingSoonMsg(){
        toastr["info"]("Coming Soon..!!");
    }

    $("#filter_status, #filter_status_1, #filter_status_2, #filter_status_4").select2({placeholder:"Select Filter"});
    $(".search-value, .search-value-1, .search-value-2, .search-value-4").fadeOut();

    $('#from_date, #from_date_1, #from_date_2, #from_date_4').datepicker({
        format: "dd-mm-yyyy",
        orientation: "bottom auto"
    }).on('changeDate', function() {
        $('.datepicker').hide();
    });

    $('#end_date, #end_date_1, #end_date_2, #end_date_4').datepicker({
        format: "dd-mm-yyyy",
        orientation: "bottom auto"
    }).on('changeDate', function() {        
        $('.datepicker').hide();
    });

    dateValidations($('#from_date, #end_date, #from_date_1, #end_date_1, #from_date_2, #end_date_2, #from_date_4, #end_date_4'));      
</script>

<!-- for mediclaim -->
<script type="text/javascript">
    var table = $('#datatable').DataTable({
        "aoColumnDefs": [{"bSortable": true,"aTargets": [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16]}],
         "order": [[0, 'desc']],
        "ordering": true,
        "processing": true,
        "serverSide": true,
        "scrollX": true,
        "scrollY": function() { return $(window).height() - 300; },
        "lengthMenu": [[10, 50, 100, 150],[10, 50, 100, 150]],
        "language": {"processing": '<button type="button" class="btn btn-dark waves-effect waves-light"><i class="bx bx-loader bx-spin font-size-16 align-middle me-2"></i> Processing...</button>'},
        "ajax": {
            "url": ajaxURLGetMediClaimData,
            "type": "GET",
            "data": {
                // "_token": csrfToken,
                "status": function() { return $("#filter_status").val()},
                "from_date":function(){return $("#from_date").val();},
                "end_date":function(){return $("#end_date").val();},
            }          
        },
        "aoColumns": [
            {"mData": "action","bSortable": false,},
            {"mData": "status"},
            {"mData":"form_fill_continue","bSortable": false,},
            {"mData": "policy_number","bSortable": false,
                    "render": function(data, type, full, meta) {
                        if (type === 'display' && data != null && data.length > 20) {
                            return '<span title="' + data + '">' + data.substr(0, 20) + '...</span>';
                        } else {
                            return data;
                        }
                    }
            },
            {"mData": "policy_holder_name","bSortable": false,
                    "render": function(data, type, full, meta) {
                        if (type === 'display' && data != null && data.length > 20) {
                            return '<span title="' + data + '">' + data.substr(0, 20) + '...</span>';
                        } else {
                            return data;
                        }
                    }
            },
            {"mData": "insurance_company_name","bSortable": false,},
            {"mData": "transaction_date"},
            {"mData": "claim_type",
                "render": function(data, type, full, meta) {
                    if (type === 'display' && data != null && data.length > 10) {
                        return '<span title="' + data + '">' + data.substr(0, 10) + '...</span>';
                    } else {
                        return data;
                    }
                }
            },
            {"mData": "claim_lodged_type",
                "render": function(data, type, full, meta) {
                    if (type === 'display' && data != null && data.length > 20) {
                        return '<span title="' + data + '">' + data.substr(0, 20) + '...</span>';
                    } else {
                        return data;
                    }
                }
            },
            {"mData": "name_of_patient","bSortable": false,  
                    "render": function(data, type, full, meta) {
                        if (type === 'display' && data != null && data.length > 15) {
                            return '<span title="' + data + '">' + data.substr(0, 15) + '...</span>';
                        } else {
                            return data;
                        }
                    }
            },
            {"mData": "admission_date"},
            {"mData": "discharge_date"},
            {"mData": "file_recieved_date"},
            {"mData": "file_submitted_date"},
            {"mData": "file_online_upload_date"},
            {"mData": "grand_total"},
            {"mData": "email_note",
                "render": function(data, type, full, meta) {
                    if (type === 'display' && data != null && data.length > 15) {
                        return '<span title="' + data + '">' + data.substr(0, 15) + '...</span>';
                    } else {
                        return data;
                    }
                }
            },
        ]
    });

    table.on('xhr', function() {
        var responseData = table.ajax.json();

        $("#claim_lodged_amt").html(responseData['claimLodgedAmt']);
    });

    // column search
    var columnsMapping = [
        'transaction_date', 'claim_type', 'claim_lodged_type', 'name_of_patient', 'admission_date', 'discharged_date', 'file_received_date', 'file_submited_date',
        'fil_online_upload_date', 'grand_total_amt', 'email_note'
    ];

    columnsMapping.forEach(function(columnName, columnIndex) {
        $('input[name="' + columnName + '"]').click(function (event) {
            event.stopPropagation();
        });

        $('input[name="' + columnName + '"]').on('keyup input', debounce(function () {
            // table.columns(columnIndex).search(this.value).draw();

            table.columns(columnIndex).search($('input[name="' + columnName + '"]').val()).draw();
            handleInputChange();
                    
            if($('input[name="' + columnName + '"]').val() != ''){
                $(".search-value").fadeIn();
            }else{
                $(".search-value").fadeOut();
            }

        }, 500));
    });

    const currentPage = window.location.pathname + "?mediclaim";

    const selectFilterStatus = $('#filter_status');
    selectFilterStatus.on('change ready', handleInputChange);

    const startInputDates = $('#from_date');
    startInputDates.on('change', handleInputChange);

    const endInputDates = $('#end_date');
    endInputDates.on('change', handleInputChange);

    function handleInputChange() {
        const FilterStatus = selectFilterStatus.val();
        const startInputDate = startInputDates.val();
        const endInputDate = endInputDates.val();

        const pageData = {
            record: FilterStatus,
            from_date: startInputDate,
            end_date: endInputDate,
        };

        columnsMapping.forEach(function(columnName, columnIndex) {
            const inputValue = $('input[name="' + columnName + '"]').val();
            pageData[columnName] = inputValue;
        });

        const jsonPageData = JSON.stringify(pageData);
        localStorage.setItem(currentPage, jsonPageData);
    }   

    const storedData = localStorage.getItem(currentPage);
    const parsedData = JSON.parse(storedData);

    if(parsedData != null){
        // for mediclaim
        if(currentPage == "/admin/manage-claim-lodged-data?mediclaim"){
            if(parsedData.record != ''){
                $('#filter_status').val(parsedData.record).change();
                if(parsedData.record != -1){
                    $(".search-value").fadeIn();
                }
            }else{
                $('#filter_status').val(-1).change();
            }

            if(parsedData.from_date != ''){
                $('#from_date').val(parsedData.from_date).datepicker("setDate", parsedData.from_date);
                $(".search-value").fadeIn();
            }

            if(parsedData.end_date != ''){
                $('#end_date').val(parsedData.end_date).datepicker("setDate", parsedData.end_date);
                $(".search-value").fadeIn();
            }
            
            columnsMapping.forEach(function(columnName, columnIndex) {
                if (parsedData && parsedData.hasOwnProperty(columnName)) {
                    $('input[name="' + columnName + '"]').val(parsedData[columnName]); // Set the value of the input field
                    table.columns(columnIndex).search(parsedData[columnName]);
                    handleInputChange();
                    
                    if(parsedData[columnName] != ''){
                        $(".search-value").fadeIn();
                    }
                }
            });
        }       
        
        setTimeout(function() {
            $('#datatable').DataTable().draw();
        }, 300);
    }

    $("#filter_status, #from_date, #end_date").on('change',function(){
        var fromDateVal = $("#from_date").val();
        var endDateVal = $("#end_date").val();
        var filterStatusVal = $("#filter_status").val();
        
        if ((fromDateVal !== '' || endDateVal !== '') || filterStatusVal !== '-1') {
            $(".search-value").fadeIn();
        } else {
            $(".search-value").fadeOut();
        }

        $('#datatable').DataTable().draw();
    });

    function clearSearch(){
        for (var i = 0; i < columnsMapping.length; i++) {
            $('[name="' + columnsMapping[i] + '"]').val('');
        }

        $(".search-value").fadeOut();

        table.columns().search('').draw();

        // for filter_status, from_date, end_date

        $('#from_date, #end_date').datepicker("destroy").val("");

        localStorage.removeItem(currentPage);

        $('#from_date').datepicker({
            format: "dd-mm-yyyy",
            orientation: "bottom auto"
        }).on('changeDate', function() {
            $('.datepicker').hide();
        });

        $('#end_date').datepicker({
            format: "dd-mm-yyyy",
            orientation: "bottom auto"
        }).on('changeDate', function() {
            $(".search-value").fadeIn();
            $('.datepicker').hide();
        });

        $('#filter_status').val(-1).change();
        $('#datatable').DataTable().ajax.reload(null, false);

        handleInputChange();
    }

    $('#medi-claim').click(function() {
        setTimeout(function() {
            table.columns.adjust().draw();
        }, 200);
        
        table.on('xhr', function() {
            var responseData = table.ajax.json();
            
            $("#claim_lodged_amt").html(responseData['claimLodgedAmt']);
        });

        $(".amount_hide").show();
    });
</script>

<!-- for vehicle claim -->
<script type="text/javascript">
    var table_1 = $('#datatable_1').DataTable({
        "aoColumnDefs": [{"bSortable": true,"aTargets": [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15]}],
         "order": [[0, 'desc']],
        "ordering": true,
        "processing": true,
        "serverSide": true,
        "scrollX": true,
        "scrollY": function() { return $(window).height() - 300; },
        "lengthMenu": [[10, 50, 100, 150],[10, 50, 100, 150]],
        "language": {"processing": '<button type="button" class="btn btn-dark waves-effect waves-light"><i class="bx bx-loader bx-spin font-size-16 align-middle me-2"></i> Processing...</button>'},
        "ajax": {
            "url": ajaxURLGetVehicleClaimData,
            "type": "GET",
            "data": {
                // "_token": csrfToken,
                "status": function() { return $("#filter_status_1").val()},
                "from_date":function(){return $("#from_date_1").val();},
                "end_date":function(){return $("#end_date_1").val();},
            } 
        },
        "aoColumns": [
            {"mData": "action","bSortable": false,},
            {"mData": "status"},
            {"mData":"form_fill_continue","bSortable": false,},
            {"mData": "policy_number",
                    "render": function(data, type, full, meta) {
                        if (type === 'display' && data != null && data.length > 20) {
                            return '<span title="' + data + '">' + data.substr(0, 20) + '...</span>';
                        } else {
                            return data;
                        }
                    }
            },
            {"mData": "policy_holder_name",
                    "render": function(data, type, full, meta) {
                        if (type === 'display' && data != null && data.length > 20) {
                            return '<span title="' + data + '">' + data.substr(0, 20) + '...</span>';
                        } else {
                            return data;
                        }
                    }
            },
            {"mData": "insurance_company_name"},
            {"mData": "transaction_date"},
            {"mData": "claim_type",
                "render": function(data, type, full, meta) {
                    if (type === 'display' && data != null && data.length > 15) {
                        return '<span title="' + data + '">' + data.substr(0, 15) + '...</span>';
                    } else {
                        return data;
                    }
                }
            },
            {"mData": "claim_lodged_type",
                "render": function(data, type, full, meta) {
                    if (type === 'display' && data != null && data.length > 15) {
                        return '<span title="' + data + '">' + data.substr(0, 15) + '...</span>';
                    } else {
                        return data;
                    }
                }
            },
            {"mData": "tp_person_name",
                    "render": function(data, type, full, meta) {
                        if (type === 'display' && data != null && data.length > 15) {
                            return '<span title="' + data + '">' + data.substr(0, 15) + '...</span>';
                        } else {
                            return data;
                        }
                    }
            },
            {"mData": "garage_name",
                    "render": function(data, type, full, meta) {
                        if (type === 'display' && data != null && data.length > 10) {
                            return '<span title="' + data + '">' + data.substr(0, 10) + '...</span>';
                        } else {
                            return data;
                        }
                    }
            },
            {"mData": "discharge_date","bVisible": false,},
            {"mData": "file_recieved_date"},
            {"mData": "file_submitted_date"},
            {"mData": "file_online_upload_date"},
            {"mData": "grand_total"},
        ]
    });

    var columnsMapping_1 = [
        'policy_number_1', 'policy_holder_name_1', 'ins_comp_name_1', 'transaction_date_1', 'claim_type_1', 'claim_lodged_type_1', 'tp_person_name', 'garage_name',
        'discharged_date_1', 'file_received_date_1', 'file_submited_date_1', 'fil_online_upload_date_1', 'grand_total_amt_1'
    ];

    columnsMapping_1.forEach(function(columnName_1, columnIndex_1) {
        $('input[name="' + columnName_1 + '"]').click(function (event) {
            event.stopPropagation();
        });

        $('input[name="' + columnName_1 + '"]').on('keyup input', debounce(function () {
            // table_1.columns(columnIndex).search(this.value).draw();

            table_1.columns(columnIndex_1).search($('input[name="' + columnName_1 + '"]').val()).draw();
            handleInputChange_1();
                    
            if($('input[name="' + columnName_1 + '"]').val() != ''){
                $(".search-value-1").fadeIn();
            }else{
                $(".search-value-1").fadeOut();
            }
        }, 500));
    });

    const currentPage_1 = window.location.pathname + "?vehicle_claim";

    const selectFilterStatus_1 = $('#filter_status_1');
    selectFilterStatus_1.on('change ready', handleInputChange_1);

    const startInputDates_1 = $('#from_date_1');
    startInputDates_1.on('change', handleInputChange_1);

    const endInputDates_1 = $('#end_date_1');
    endInputDates_1.on('change', handleInputChange_1);

    function handleInputChange_1(){
        const FilterStatus_1 = selectFilterStatus_1.val();
        const startInputDate_1 = startInputDates_1.val();
        const endInputDate_1 = endInputDates_1.val();

        const pageData_1 = {
            record_1: FilterStatus_1,
            from_date_1: startInputDate_1,
            end_date_1: endInputDate_1,
        };

        columnsMapping_1.forEach(function(columnName_1, columnIndex_1) {
            const inputValue_1 = $('input[name="' + columnName_1 + '"]').val();
            pageData_1[columnName_1] = inputValue_1;
        });

        const jsonPageData_1 = JSON.stringify(pageData_1);
        localStorage.setItem(currentPage_1, jsonPageData_1);
    }

    const storedData_1 = localStorage.getItem(currentPage_1);
    const parsedData_1 = JSON.parse(storedData_1);

    if(parsedData_1 != null){
        // for vehicle claim
        if(currentPage_1 == "/admin/manage-claim-lodged-data?vehicle_claim"){
            if(parsedData_1.record_1 != ''){
                $('#filter_status_1').val(parsedData_1.record_1).change();
                if(parsedData_1.record_1 != -1){
                    $(".search-value-1").fadeIn();
                }
            }else{
                $('#filter_status_1').val(-1).change();
            }

            if(parsedData_1.from_date_1 != ''){
                $('#from_date_1').val(parsedData_1.from_date_1).datepicker("setDate", parsedData_1.from_date_1);
                $(".search-value-1").fadeIn();
            }

            if(parsedData_1.end_date_1 != ''){
                $('#end_date').val(parsedData_1.end_date_1).datepicker("setDate", parsedData_1.end_date_1);
                $(".search-value-1").fadeIn();
            }

            columnsMapping_1.forEach(function(columnName_1, columnIndex_1) {
                if (parsedData_1 && parsedData_1.hasOwnProperty(columnName_1)) {
                    $('input[name="' + columnName_1 + '"]').val(parsedData_1[columnName_1]); // Set the value of the input field
                    table_1.columns(columnIndex_1).search(parsedData_1[columnName_1]);
                    handleInputChange_1();

                    if(parsedData_1[columnName_1] != ''){
                        $(".search-value-1").fadeIn();
                    }
                }
            });
        }

        setTimeout(function() {
            $('#datatable_1').DataTable().draw();
        }, 300);
    }

    $("#filter_status_1, #from_date_1, #end_date_1").on('change',function(){
        var fromDateVal = $("#from_date_1").val();
        var endDateVal = $("#end_date_1").val();
        var filterStatusVal = $("#filter_status_1").val();
        
        if ((fromDateVal !== '' || endDateVal !== '') || filterStatusVal !== '-1') {
            $(".search-value-1").fadeIn();
        } else {
            $(".search-value-1").fadeOut();
        }
        
        $('#datatable_1').DataTable().draw();
    });

    function clearSearch_1(){
        for (var i = 0; i < columnsMapping_1.length; i++) {
            $('[name="' + columnsMapping_1[i] + '"]').val('');
        }

        $(".search-value-1").fadeOut();

        table_1.columns().search('').draw();

        // for filter_status, from_date, end_date

        $('#from_date_1, #end_date_1').datepicker("destroy").val("");

        localStorage.removeItem(currentPage_1);

        $('#from_date_1').datepicker({
            format: "dd-mm-yyyy",
            orientation: "bottom auto"
        }).on('changeDate', function() {
            $('.datepicker').hide();
        });

        $('#end_date_1').datepicker({
            format: "dd-mm-yyyy",
            orientation: "bottom auto"
        }).on('changeDate', function() {
            $(".search-value-1").fadeIn();
            $('.datepicker').hide();
        });

        $('#filter_status_1').val(-1).change();
        $('#datatable_1').DataTable().ajax.reload(null, false);

        handleInputChange_1();
    }

    $('#vehicle-claim').click(function() {
        setTimeout(function() {
            table_1.columns.adjust().draw();
        }, 200);

        table_1.on('xhr', function() {
            var responseData = table_1.ajax.json();

            $("#claim_lodged_amt").html(responseData['claimLodgedAmt']);
        });

        $(".amount_hide").show();
    });
</script>

<!-- for death claim -->
<script type="text/javascript">
    var table_2 = $('#datatable_2').DataTable({
        "aoColumnDefs": [{"bSortable": true,"aTargets": [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23]}],
         "order": [[0, 'desc']],
        "ordering": true,
        "processing": true,
        "serverSide": true,
        "scrollX": true,
        "scrollY": function() {return $(window).height() - 350;},
        "lengthMenu": [[10, 50, 100, 150],[10, 50, 100, 150]],
        "language": {"processing": '<button type="button" class="btn btn-dark waves-effect waves-light"><i class="bx bx-loader bx-spin font-size-16 align-middle me-2"></i> Processing...</button>'},
        "ajax": {
            "url": ajaxURLGetDeathClaimData,
            "type": "GET",
            "data": {
                // "_token": csrfToken,
                "status": function() { return $("#filter_status_2").val()},
                "from_date":function(){return $("#from_date_2").val();},
                "end_date":function(){return $("#end_date_2").val();},
            } 
        },
        "aoColumns": [
            {"mData": "action","bSortable": false,},
            {"mData": "status"},
            {"mData": "form_fill_continue","bSortable": false,},
            {"mData": "policy_number","bSortable": false,
                "render": function(data, type, full, meta) {
                    if (type === 'display') {
                        return renderPolicyNumber(data);
                    } else {
                        return data;
                    }
                }
            },
            {"mData": "policy_holder_name","bSortable": false,
                    "render": function(data, type, full, meta) {
                        if (type === 'display' && data != null && data.length > 20) {
                            return '<span title="' + data + '">' + data.substr(0, 20) + '...</span>';
                        } else {
                            return data;
                        }
                    }
            },
            {"mData": "insurance_company_name","bSortable": false,},
            {"mData": "transaction_date"},
            {"mData": "claim_type_2",
                    "render": function(data, type, full, meta) {
                        if (type === 'display' && data != null && data.length > 15) {
                            return '<span title="' + data + '">' + data.substr(0, 15) + '...</span>';
                        } else {
                            return data;
                        }
                    }
            },
            {"mData": "death_claim_type",
                    "render": function(data, type, full, meta) {
                        if (type === 'display' && data != null && data.length > 15) {
                            return '<span title="' + data + '">' + data.substr(0, 15) + '...</span>';
                        } else {
                            return data;
                        }
                    }
            },
            {"mData": "death_person_name",
                    "render": function(data, type, full, meta) {
                        if (type === 'display' && data != null && data.length > 15) {
                            return '<span title="' + data + '">' + data.substr(0, 15) + '...</span>';
                        } else {
                            return data;
                        }
                    }
             },
            {"mData": "nominee_name",
                    "render": function(data, type, full, meta) {
                        if (type === 'display' && data != null && data.length > 15) {
                            return '<span title="' + data + '">' + data.substr(0, 15) + '...</span>';
                        } else {
                            return data;
                        }
                    }
            },
            {"mData": "contact_num"},
            {"mData": "death_date"},            
            {"mData": "death_type",
                "render": function(data, type, full, meta) {
                    if (type === 'display' && data != null && data.length > 12) {
                        return '<span title="' + data + '">' + data.substr(0, 12) + '...</span>';
                    } else {
                        return data;
                    }
                }
            },
            {"mData": "death_reason",
                    "render": function(data, type, full, meta) {
                        if (type === 'display' && data != null && data.length > 15) {
                            return '<span title="' + data + '">' + data.substr(0, 15) + '...</span>';
                        } else {
                            return data;
                        }
                    }
            },
            {"mData": "intimation_through",
                "render": function(data, type, full, meta) {
                    if (type === 'display' && data != null && data.length > 15) {
                        return '<span title="' + data + '">' + data.substr(0, 15) + '...</span>';
                    } else {
                        return data;
                    }
                }
            },
            {"mData": "direct_company_name"},
            {"mData": "tpa_company_name"},
            {"mData": "intimated_to"},
            {"mData": "total_sum_assured"},
            {"mData": "total_term_rider_sum_assured"},
            {"mData": "total_accident_sum_assured"},
            {"mData": "total_double_acci_rider_sum_assured"},
            {"mData": "notes","bSortable": false,},
        ]
    });

    function viewNotes(id){
        $("#modalViewNotes").modal('show');

        $.ajax({
            type: 'GET',
            url: deathClaimLodgedDetails + "?id=" + id,
            success: function(resultData) {
                if (resultData['msg']['status'] == 1) {
                  var notes_for_death_claim = resultData['data']['notes_for_death_claim'];
                    notes_for_death_claim = notes_for_death_claim.split(',');

                    var checkboxes = {
                        'note_1': '1',
                        'note_2': '2',
                        'note_3': '3',
                        'note_4': '4',
                        'note_5': '5',
                        'note_6': '6',
                        'note_7': '7',
                        'note_8': '8',
                    };

                    for (var checkbox in checkboxes) {
                        var isChecked = notes_for_death_claim.includes(checkboxes[checkbox]);
                        $('#' + checkbox).attr('checked', isChecked);
                    }                           
                } else {
                    toastr["error"](resultData['msg']);
                }
            }
        });
    }

    var columnsMapping_2 = [
        'transaction_date_2', 'claim_type_2', 'death_claim_type', 'death_person_name', 'nominee_name', 'contact_num', 'death_date', 'death_type', 'reason_for_death', 'intimated_through',
        'direct_comp_name_2', 'tpa_comp_name_2', 'intimated_to_2', 'total_sum_assu_2', 'total_term_rider_sum_assu_2', 'total_acci_sum_assu_2', 'total_double_acci_rider_sum_assu_2'
    ];

    columnsMapping_2.forEach(function(columnName_2, columnIndex_2) {
        $('input[name="' + columnName_2 + '"]').click(function (event) {
            event.stopPropagation();
        });

        $('input[name="' + columnName_2 + '"]').on('keyup input', debounce(function () {
            // table_2.columns(columnIndex).search(this.value).draw();

            table_2.columns(columnIndex_2).search($('input[name="' + columnName_2 + '"]').val()).draw();
            handleInputChange_2();
                    
            if($('input[name="' + columnName_2 + '"]').val() != ''){
                $(".search-value-2").fadeIn();
            }else{
                $(".search-value-2").fadeOut();
            }
        }, 500));
    });

    const currentPage_2 = window.location.pathname + "?death_claim";

    const selectFilterStatus_2 = $('#filter_status_2');
    selectFilterStatus_2.on('change ready', handleInputChange_2);

    const startInputDates_2 = $('#from_date_2');
    startInputDates_2.on('change', handleInputChange_2);

    const endInputDates_2 = $('#end_date_2');
    endInputDates_2.on('change', handleInputChange_2);

    function handleInputChange_2(){
        const FilterStatus_2 = selectFilterStatus_2.val();
        const startInputDate_2 = startInputDates_2.val();
        const endInputDate_2 = endInputDates_2.val();

        const pageData_2 = {
            record_2: FilterStatus_2,
            from_date_2: startInputDate_2,
            end_date_2: endInputDate_2,
        };

        columnsMapping_2.forEach(function(columnName_2, columnIndex_2) {
            const inputValue_2 = $('input[name="' + columnName_2 + '"]').val();
            pageData_2[columnName_2] = inputValue_2;
        });

        const jsonPageData_2 = JSON.stringify(pageData_2);
        localStorage.setItem(currentPage_2, jsonPageData_2);
    }

    const storedData_2 = localStorage.getItem(currentPage_2);
    const parsedData_2 = JSON.parse(storedData_2);

    if(parsedData_2 != null){
        // for death claim
        if(currentPage_2 == "/admin/manage-claim-lodged-data?death_claim"){
            if(parsedData_2.record_2 != ''){
                $('#filter_status_2').val(parsedData_2.record_2).change();
                if(parsedData_2.record_2 != -1){
                    $(".search-value-2").fadeIn();
                }
            }else{
                $('#filter_status_2').val(-1).change();
            }

            if(parsedData_2.from_date_2 != ''){
                $('#from_date_2').val(parsedData_2.from_date_2).datepicker("setDate", parsedData_2.from_date_2);
            }

            if(parsedData_2.end_date_2 != ''){
                $('#end_date_2').val(parsedData_2.end_date_2).datepicker("setDate", parsedData_2.end_date_2);
            }

            columnsMapping_2.forEach(function(columnName_2, columnIndex_2) {
                if (parsedData_2 && parsedData_2.hasOwnProperty(columnName_2)) {
                    $('input[name="' + columnName_2 + '"]').val(parsedData_2[columnName_2]); // Set the value of the input field
                    table_2.columns(columnIndex_2).search(parsedData_2[columnName_2]);
                    handleInputChange_2();

                    if(parsedData_2[columnName_2] != ''){
                        $(".search-value-2").fadeIn();
                    }
                }
            });
        }

        setTimeout(function() {
            $('#datatable_2').DataTable().draw();
        }, 300);
    }

    $("#filter_status_2, #from_date_2, #end_date_2").on('change',function(){
        var fromDateVal = $("#from_date_2").val();
        var endDateVal = $("#end_date_2").val();
        var filterStatusVal = $("#filter_status_2").val();
        
        if ((fromDateVal !== '' || endDateVal !== '') || filterStatusVal !== '-1') {
            $(".search-value-2").fadeIn();
        } else {
            $(".search-value-2").fadeOut();
        }

        $('#datatable_2').DataTable().draw();
    });

    function clearSearch_2(){
        for (var i = 0; i < columnsMapping_2.length; i++) {
            $('[name="' + columnsMapping_2[i] + '"]').val('');
        }

        $(".search-value-2").fadeOut();

        table_2.columns().search('').draw();

        // for filter_status, from_date, end_date

        $('#from_date_2, #end_date_2').datepicker("destroy").val("");

        localStorage.removeItem(currentPage_2);

        $('#from_date_2').datepicker({
            format: "dd-mm-yyyy",
            orientation: "bottom auto"
        }).on('changeDate', function() {
            $('.datepicker').hide();
        });

        $('#end_date_2').datepicker({
            format: "dd-mm-yyyy",
            orientation: "bottom auto"
        }).on('changeDate', function() {
            $(".search-value-2").fadeIn();
            $('.datepicker').hide();
        });

        $('#filter_status_2').val(-1).change();
        $('#datatable_2').DataTable().ajax.reload(null, false);

        handleInputChange_2();
    }

    $('#death-claim , #disability-claim').click(function() {
        setTimeout(function() {
            table_2.columns.adjust().draw();
        }, 200);

        $(".amount_hide").hide();
    });
</script>

<!-- for other claim -->
<script type="text/javascript">
    var table_4 = $('#datatable_4').DataTable({
        "aoColumnDefs": [{"bSortable": true,"aTargets": [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17]}],
         "order": [[0, 'desc']],
        "ordering": true,
        "processing": true,
        "serverSide": true,
        "scrollX": true,
        "scrollY": function() { return $(window).height() - 300; },
        "lengthMenu": [[10, 50, 100, 150],[10, 50, 100, 150]],
        "language": {"processing": '<button type="button" class="btn btn-dark waves-effect waves-light"><i class="bx bx-loader bx-spin font-size-16 align-middle me-2"></i> Processing...</button>'},
        "ajax": {
            "url": ajaxURLGetOtherClaimData,
            "type": "GET",
            "data": {
                // "_token": csrfToken,
                "status": function() { return $("#filter_status").val()},
                "from_date":function(){return $("#from_date_4").val();},
                "end_date":function(){return $("#end_date_4").val();},
            } 
        },
        "aoColumns": [
            {"mData": "action","bSortable": false,},
            {"mData": "status"},
            {"mData":"form_fill_continue","bSortable": false,},
            {"mData": "policy_number",
                    "render": function(data, type, full, meta) {
                        if (type === 'display' && data != null && data.length > 20) {
                            return '<span title="' + data + '">' + data.substr(0, 20) + '...</span>';
                        } else {
                            return data;
                        }
                    }
            },
            {"mData": "policy_holder_name",
                    "render": function(data, type, full, meta) {
                        if (type === 'display' && data != null && data.length > 20) {
                            return '<span title="' + data + '">' + data.substr(0, 20) + '...</span>';
                        } else {
                            return data;
                        }
                    }
            },
            {"mData": "insurance_company_name"},
            {"mData": "transaction_date"},
            {"mData": "claim_type",
                "render": function(data, type, full, meta) {
                    if (type === 'display' && data != null && data.length > 15) {
                        return '<span title="' + data + '">' + data.substr(0, 15) + '...</span>';
                    } else {
                        return data;
                    }
                }
            },
            {"mData": "claim_lodged_type",
                "render": function(data, type, full, meta) {
                    if (type === 'display' && data != null && data.length > 20) {
                        return '<span title="' + data + '">' + data.substr(0, 20) + '...</span>';
                    } else {
                        return data;
                    }
                }
            },
            {"mData": "total_claim_amt"},
            {"mData": "surveyer_report"},
            {"mData": "fire_station_docs"},
            {"mData": "police_station_docs"},
            {"mData": "expense_annu_report"},
            {"mData": "file_recieved_date"},
            {"mData": "file_submitted_date"},
            {"mData": "file_online_upload_date"},
            {"mData": "email_note",
                "render": function(data, type, full, meta) {
                    if (type === 'display' && data != null && data.length > 10) {
                        return '<span title="' + data + '">' + data.substr(0, 10) + '...</span>';
                    } else {
                        return data;
                    }
                }
            },
        ]
    });

    var columnsMapping_4 = [
        'policy_number_4', 'policy_holder_name_4', 'ins_comp_name_4', 'transaction_date_4', 'claim_type_4', 'claim_lodged_type_4', 'total_claim_amt', 'submited_surveyer', 'submited_fire',
        'submited_police', 'submited_expense', 'file_received_date_4', 'file_submited_date_4', 'fil_online_upload_date_4', 'email_note_4'
    ];

    columnsMapping_4.forEach(function(columnName_4, columnIndex_4) {
        $('input[name="' + columnName_4 + '"]').click(function (event) {
            event.stopPropagation();
        });
 
        $('input[name="' + columnName_4 + '"]').on('keyup input', debounce(function () {
            // table_4.columns(columnIndex).search(this.value).draw();
           
            table_4.columns(columnIndex_4).search($('input[name="' + columnName_4 + '"]').val()).draw();
            handleInputChange_4();
                    
            if($('input[name="' + columnName_4 + '"]').val() != ''){
                $(".search-value-4").fadeIn();
            }else{
                $(".search-value-4").fadeOut();
            }
        }, 500));
    });

    const currentPage_4 = window.location.pathname + "?other_claim";

    const selectFilterStatus_4 = $('#filter_status_4');
    selectFilterStatus_4.on('change ready', handleInputChange_4);

    const startInputDates_4 = $('#from_date_4');
    startInputDates_4.on('change', handleInputChange_4);

    const endInputDates_4 = $('#end_date_4');
    endInputDates_4.on('change', handleInputChange_4);

    function handleInputChange_4(){
        const FilterStatus_4 = selectFilterStatus_4.val();
        const startInputDate_4 = startInputDates_4.val();
        const endInputDate_4 = endInputDates_4.val();

        const pageData_4 = {
            record_4: FilterStatus_4,
            from_date_4: startInputDate_4,
            end_date_4: endInputDate_4,
        };

        columnsMapping_4.forEach(function(columnName_4, columnIndex_4) {
            const inputValue_4 = $('input[name="' + columnName_4 + '"]').val();
            pageData_4[columnName_4] = inputValue_4;
        });

        const jsonPageData_4 = JSON.stringify(pageData_4);
        localStorage.setItem(currentPage_4, jsonPageData_4);
    }

    const storedData_4 = localStorage.getItem(currentPage_4);
    const parsedData_4 = JSON.parse(storedData_4);

    if(parsedData_4 != null){
        //  for other claim
        if(currentPage_4 == "/admin/manage-claim-lodged-data?other_claim"){
            if(parsedData_4.record_4 != ''){
                $('#filter_status_4').val(parsedData_4.record_4).change();
                if(parsedData_4.record_4 != -1){
                    $(".search-value-4").fadeIn();
                }
            }else{
                $('#filter_status_4').val(-1).change();
            }

            if(parsedData_4.from_date_4 != ''){
                $('#from_date_4').val(parsedData_4.from_date_4).datepicker("setDate", parsedData_4.from_date_4);
                $(".search-value-4").fadeIn();
            }

            if(parsedData_4.end_date_4 != ''){
                $('#end_date_4').val(parsedData_4.end_date_4).datepicker("setDate", parsedData_4.end_date_4);
                $(".search-value-4").fadeIn();
            }

            columnsMapping_4.forEach(function(columnName_4, columnIndex_4) {
                if (parsedData_4 && parsedData_4.hasOwnProperty(columnName_4)) {
                    $('input[name="' + columnName_4 + '"]').val(parsedData_4[columnName_4]); // Set the value of the input field
                    table_4.columns(columnIndex_4).search(parsedData_4[columnName_4]);
                    handleInputChange_4();

                    if(parsedData_4[columnName_4] != ''){
                        $(".search-value-4").fadeIn();
                    }
                }
            });
        }

        setTimeout(function() {
            $('#datatable_4').DataTable().draw();
        }, 300);
    }

    $("#filter_status_4, #from_date_4, #end_date_4").on('change',function(){
        var fromDateVal = $("#from_date_4").val();
        var endDateVal = $("#end_date_4").val();
        var filterStatusVal = $("#filter_status_4").val();
        
        if ((fromDateVal !== '' || endDateVal !== '') || filterStatusVal !== '-1') {
            $(".search-value-4").fadeIn();
        } else {
            $(".search-value-4").fadeOut();
        }

        $('#datatable_4').DataTable().draw();
    });

    function clearSearch_4(){       
        for (var i = 0; i < columnsMapping_4.length; i++) {
            $('[name="' + columnsMapping_4[i] + '"]').val('');
        }

        $(".search-value-4").fadeOut();

        table_4.columns().search('').draw();

        // for filter_status, from_date, end_date

        $('#from_date_4, #end_date_4').datepicker("destroy").val("");

        localStorage.removeItem(currentPage_4);

        $('#from_date_4').datepicker({
            format: "dd-mm-yyyy",
            orientation: "bottom auto"
        }).on('changeDate', function() {
            $('.datepicker').hide();
        });

        $('#end_date_4').datepicker({
            format: "dd-mm-yyyy",
            orientation: "bottom auto"
        }).on('changeDate', function() {
            $(".search-value-4").fadeIn();
            $('.datepicker').hide();
        });

        $('#filter_status_4').val(-1).change();
        $('#datatable_4').DataTable().ajax.reload(null, false);

        handleInputChange_4();
    }

    $('#other-claim').click(function() {
        setTimeout(function() {
            table_4.columns.adjust().draw();
        }, 200);

        $(".amount_hide").hide();
    });
</script>

<!-- for tab selection -->
<script type="text/javascript">
   $(document).ready(function () {
       updateURLWithActiveTabId();

       $('#medi-claim').click(function() {
           handleTabClick('#medi-claim', '#mediClaim', 'mediclaim');
       });

       $('#vehicle-claim').click(function() {
           handleTabClick('#vehicle-claim', '#vehicleClaim', 'vehicle-claim');
       });

       $('#death-claim').click(function() {
           handleTabClick('#death-claim', '#deathClaim', 'death-claim');
       });

       $('#disability-claim').click(function() {
           handleTabClick('#disability-claim', '#disabilityClaim', 'disability-claim');
       });

       $('#other-claim').click(function() {
           handleTabClick('#other-claim', '#otherClaim', 'other-claim');
       });
   });

   function clearActiveTabClass(){
       $('.nav-link.waves-effect').removeClass('active');
       $('.tab-pane').removeClass('active show');
   }

   function updateURLWithActiveTabId() {
       const currentUrl = window.location.href;
       const url = new URL(currentUrl);
       var typeValue = url.searchParams.get('type');
       
       if(typeValue == null || typeValue == "mediclaim"){
           handleTabClick('#medi-claim', '#mediClaim', 'mediclaim');
           $(".amount_hide").show();
           $('#medi-claim').trigger('click');
       }else if(typeValue == "vehicle-claim"){
           handleTabClick('#vehicle-claim', '#vehicleClaim', 'vehicle-claim');
           $(".amount_hide").show();
           $('#vehicle-claim').trigger('click');
       }else if(typeValue == "death-claim"){
           handleTabClick('#death-claim', '#deathClaim', 'death-claim');
       }else if(typeValue == "disability-claim"){
           handleTabClick('#disability-claim', '#disabilityClaim', 'disability-claim');
           $(".amount_hide").hide();
       }else if(typeValue == "other-claim"){
           handleTabClick('#other-claim', '#otherClaim', 'other-claim');
           $(".amount_hide").show();
           $('#other-claim').trigger('click');
       }
   }

   function handleTabClick(tabId, contentId, urlType) {
       clearActiveTabClass();
       $(tabId).addClass('active');
       $(contentId).addClass('active show');
       const currentUrl = window.location.href;
       const url = new URL(currentUrl);
       url.searchParams.set('type', urlType);
       history.replaceState(null, null, url.toString());
   }
</script>
@endsection