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

<div class="page-content">
    <div class="container-fluid">
        <!-- start page title -->
        <div class="page-title-box d-sm-flex align-items-center justify-content-between">
            @include('../reachassuree_agent/master/comman/header')
            <a href="javascript:void(0);" onclick="return DownloadPDF();" class="btn btn-primary px-4 w-md">Export PDF</a>
        </div>

        <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="card">
                <div class="card-body">
                    <div class="row" style="background-color: #F1F5FE;padding: inherit;">
                        <div class="col-xl-2">
                            <div class="mb-3">
                                <label for="date_type" class="form-label">Date Type</label>
                                <select class="form-control select2-ajax" name="date_type" id="date_type">
                                    <option value="Intimation Date">Intimation Date</option>
                                    <option value="Admission Date">Admission Date</option>
                                    <option value="Claim Lodged Date">Claim Lodged Date</option>
                                    <option value="Rejected Claim Date">Rejected Claim Date</option>
                                    <option value="Settled Date">Settled Date</option>
                                    <option value="Created Date">Created Date</option>
                                    <option value="Modified Date">Modified Date</option>
                                </select>
                            </div>
                        </div>

                        <div class="col-xl-2">
                            <div class="mb-3">
                                <label for="from_date" class="form-label">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">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-3">
                            <div class="mb-3">
                                <label for="policy_holder" class="form-label">Policy Holder</label>
                                <select name="policy_holder" id="policy_holder" class="form-control select2-ajax"></select>
                            </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 mt-4">
                        <table id="datatable" class="table align-middle table-nowrap table-striped display nowrap w-100">
                            <thead class="table-light">
                                <tr>
                                    <th>Sr. No.</th>
                                    <th>Intimation Date</th>
                                    <th>Intimation Type</th>
                                    <th>Claim Type</th>
                                    <th>Lodged Type</th>
                                    <th>Payment Pathway</th>
                                    <th>Policy Holder Name</th>
                                    <th>Patient / Benificier Name</th>
                                    <th>Policy Number</th>                        
                                    <th>Claim Count</th>
                                    <th>Insurance Comp. Name</th>
                                    <th>Hospital <br> Admission Date</th>
                                    <th>Hospital <br> Discharge Date</th>
                                    <th>Reason Of Claim</th>
                                    <th>Claim Tr. Date</th>
                                    <th>Claim Lodged Amt.</th>
                                    <th>Query Date</th>
                                    <th>Query Submited Date</th>
                                    <th>Query Count</th>
                                    <th>Settled Tr. Date</th>
                                    <th>Settled Amt.</th>
                                    <th>Diffrence Amt.</th>
                                    <th>Pre-Post Claim Date</th>
                                    <th>Pre-Post Claim Amt.</th>
                                    <th>Deduction Claim Date</th>
                                    <th>Deduction Claim Amt.</th>
                                    <th>Reject Reason</th>
                                    <th>Re-Open Tr. Date</th>
                                    <th>Going To Court Tr. Date</th>
                                    <th>Court Settled Tr. Date</th>
                                    <th>Court Settled Amt.</th>
                                    <th>Cashless Tr. Date</th>
                                    <th>Cashless Settled Amt.</th>
                                </tr>
                            </thead>
                            <tbody></tbody>
                        </table>
                        @csrf
                    </div>

                    <div class="col-md-12 mt-5 amount_hide">
                        <div class="row">
                            <div class="col-xl col-md-6">
                                <div class="card text-white bg-secondary mb-3">
                                    <div class="card-header text-center font-size-13">Total Claim Lodged Amount<br>
                                        <div id="total_lodged_amt"></div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-xl col-md-6">
                                <div class="card text-white bg-dark mb-3">
                                    <div class="card-header text-center font-size-13">Total Settled Amount<br>
                                        <div id="total_settled_amt"></div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-xl">
                                <div class="card text-white bg-secondary mb-3">
                                    <div class="card-header text-center font-size-13">Total Difference Amount<br>
                                        <div id="total_diff_amt"></div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-xl col-md-6">
                                <div class="card text-white bg-dark mb-3">
                                    <div class="card-header text-center font-size-13">Total Pre-Post Claim Amount<br>
                                        <div id="total_pre_post_amt"></div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-xl col-md-6">
                                <div class="card text-white bg-secondary mb-3">
                                    <div class="card-header text-center font-size-13">Total Deduction Claim Amount<br>
                                        <div id="total_deduction_amt"></div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-xl col-md-6">
                                <div class="card text-white bg-secondary mb-3">
                                    <div class="card-header text-center font-size-13">Total Court Settled Amount<br>
                                        <div id="total_court_settled_amt"></div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-xl col-md-6">
                                <div class="card text-white bg-dark mb-3">
                                    <div class="card-header text-center font-size-13">Total Cashless Settled Amount<br>
                                        <div id="total_cashless_settled_amt"></div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>                        
                </div>
            </div>
        </div>
    </div>
</div>
@endsection

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

<script type="text/javascript">
    var ajaxURLGetAllClaimData = "{{route('all.claim.data.ajax')}}";
    var ajaxSearchPolicyHolderName="{{route('search.all.clients')}}";
    var downloadPdf = "{{ route('download.all.claim.pdf') }}";
    var csrfToken = $("[name=_token").val();

    $("#date_type").select2();
    $(".search-value").fadeOut();

    $('#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() {        
        $('.datepicker').hide();
    });

    dateValidations($('#from_date, #end_date'));    

    $("#policy_holder").select2({
        ajax: {
            url: ajaxSearchPolicyHolderName,
            dataType: 'json',
            delay: 0,
            data: function(params) {
                return {                        
                    search_value: params.term, // search term
                    page: params.page
                };
            },
            error: function(xhr, status, error) {
                console.error(error);
            },
            processResults: function(data, params) {
                params.page = params.page || 1;

                return {
                    results: data.results,
                    pagination: {
                        more: (params.page * 30) < data.total_count
                    },
                };
            },
            cache: false
        },
        placeholder: 'Search policy holder name',
        allowClear:true,
    });

    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, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30, 31, 32]}],
        "order": [[4, 'asc']],
        "ordering": false,
        "processing": true,
        "serverSide": true,
        "scrollX": true,
        "scrollY": function() { return $(window).height() - 450; },
        "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": ajaxURLGetAllClaimData,
            "type": "POST",
            "data": {
                "_token": csrfToken,
                "date_type": function() { return $("#date_type").val()},
                "from_date":function(){return $("#from_date").val();},
                "end_date":function(){return $("#end_date").val();},
                "policy_holder":function(){return $("#policy_holder").val();},
            }          
        },
        "aoColumns": [
            {"mData": "sr_no","bSortable": false,},
            {"mData": "intimation_date"},
            {"mData": "intimation_type"},
            {"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": "lodged_type"},
            {"mData": "payment_pathway"},
            {"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": "patient_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": "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": "claim_count", "bSortable":false,},
            {"mData": "insurance_company_name","bSortable": false,},
            {"mData": "hospital_admission_date"},
            {"mData": "hospital_discharge_date"},
            {"mData": "reason_of_claim",
                    "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": "claim_transaction_date"},
            {"mData": "claim_lodged_amt"},
            {"mData": "query_date"},
            {"mData": "query_submited_date"},
            {"mData": "query_count", "bSortable":false},
            {"mData": "settled_transaction_date"},
            {"mData": "settled_amt"},
            {"mData": "difference_amt"},
            {"mData": "pre_post_claim_date"},
            {"mData": "pre_post_claim_amt"},
            {"mData": "deduction_claim_date"},
            {"mData": "deduction_claim_amt"},
            {"mData": "reject_reason", "bSortable":false},
            {"mData": "re_open_transaction_date"},
            {"mData": "going_to_court_transaction_date"},
            {"mData": "court_settled_transaction_date"},
            {"mData": "court_settled_amt"},
            {"mData": "cashless_transaction_date", "bSortable":false},
            {"mData": "cashless_settled_amt", "bSortable":false},
        ]
    });

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

        $("#total_lodged_amt").html(responseData['totalAmounts'].total_claim_lodged_amt);
        $("#total_settled_amt").html(responseData['totalAmounts'].total_settled_amt);
        $("#total_diff_amt").html(responseData['totalAmounts'].total_diff_amt);
        $("#total_pre_post_amt").html(responseData['totalAmounts'].total_pre_post_amt);
        $("#total_deduction_amt").html(responseData['totalAmounts'].total_deduction_amt);
        $("#total_court_settled_amt").html(responseData['totalAmounts'].total_court_settled_amt);
        $("#total_cashless_settled_amt").html(responseData['totalAmounts'].total_cashless_settled_amt);
    });

       // 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;
    
    var filterStatusVal ='Intimation Date';
    var fromDateVal = '';
    var endDateVal = '';
    var policyHolderVal = null;
   
    $("#date_type, #from_date, #end_date, #policy_holder").on('change',function(){
        var filterStatusVal = $("#date_type").val();
        var fromDateVal = $("#from_date").val();
        var endDateVal = $("#end_date").val();
        var policyHolderVal = $("#policy_holder").val();

        if ((fromDateVal !== '' || endDateVal !== '' || policyHolderVal !== null) || filterStatusVal !== 'Intimation Date') {
            $(".search-value").fadeIn();
        } else {
            $(".search-value").fadeOut();
        }

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

        handleInputChange();
    });
   
    function handleInputChange() {
        var selectPolicyHolderName = null;
        if(policyHolderVal > 0 && policyHolderVal != null){
            selectPolicyHolderName = $('#select2-policy_holder-container').attr("title");
        }

        const pageData = {
            record: filterStatusVal,
            from_date: fromDateVal,
            end_date: endDateVal,
            policy_holder_name: policyHolderVal,
            full_name: selectPolicyHolderName,
        };

        // 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-all-claims-data"){
            if(parsedData.record != ''){
                $('#date_type').val(parsedData.record).change();
                if(parsedData.record != "Intimation Date"){
                    $(".search-value").fadeIn();
                }
            }else{
                $('#date_type').val("Intimation Date").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();
            }
              
            if(parsedData.policy_holder_name != '' && parsedData.full_name != null){
                var newOption = new Option(parsedData.full_name, parsedData.policy_holder_name, false, false);
                $('#policy_holder').append(newOption).trigger('change');
                $(".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);
    }

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

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

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

        // for date_type, 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();
        });

        $('#date_type').val("Intimation Date").change();
        $("#policy_holder").val(null).change();
        $('#datatable').DataTable().ajax.reload(null, false);

        handleInputChange();
    }

    function DownloadPDF(){
        var ids = [];
        var length = 0;
        var sDate = $("#from_date").val();
        var eDate = $("#end_date").val();
        var pName = $("#policy_holder").val();

        var objectS = table.ajax.json();
        ids = objectS.recordIds;
        length = objectS.recordsFiltered;
        var totalRecords = objectS.totalAmounts;
        
        if (length != 0) {
            $.ajax({
                type: 'POST',
                url: downloadPdf,
                "data": {
                    "_token": csrfToken,
                    "ids": ids,
                    "total": totalRecords,
                    "date_type": function() { return $("#date_type").val(); },
                    "start_date": function() { return $("#from_date").val(); },
                    "end_date": function() { return $("#end_date").val(); },
                    "policy_holder":function(){return $("#policy_holder").val();},
                },
                beforeSend: function() {
                    showLoader();
                },
                success: function(resultData) {
                    hideLoader();
                    path = resultData['path'];
                    window.open(path, '_blank');
                }
            });
        } else {
            toastr["error"]("There are no policy yet.");
        }
    }
</script>
@endsection