@extends('main')
@section('css')
    <!-- summernote -->
    <link rel="stylesheet" href="{{ url('/') }}/assets/plugins/summernote/summernote-bs4.min.css">
    <!-- CodeMirror -->
    <link rel="stylesheet" href="{{ url('/') }}/assets/plugins/codemirror/codemirror.css">
    <link rel="stylesheet" href="{{ url('/') }}/assets/plugins/codemirror/theme/monokai.css">
    <!-- SimpleMDE -->
    <link rel="stylesheet" href="{{ url('/') }}/assets/plugins/simplemde/simplemde.min.css">

    <style></style>
@endsection
@section('content')
    <!-- Content Header (Page header) -->
    <section class="content-header">
    </section>
    <section class="content" id="waiting-for-all">
        <div class="row">
            <div class="card card-primary card-outline">
                <div class="card-header">
                    <h3 class="card-title">
                        <i class="fas fa-dailymotion"></i>
                        Claim Process
                    </h3>
                    <h3 class="card-title float-right">
                        <i class="fas fa-dailymotion"></i>
                        CLNO : {{$vars['claim']->claim_no }}
                        <span class="mx-3"></span>
                        CLREF NO : <span class="text-green"
                                         id="replace_claim_reference_number">{{$vars['claim']->claim_reference_number}}</span>
                    </h3>
                </div>
                <div class="card-body">
                    <ul class="nav nav-tabs" id="custom-content-above-tab " role="tablist">
                        <li class="nav-item">
                            <a class="nav-link check_by_tab active" data-tab="detail"
                               id="custom-content-above-profile-tab" data-toggle="pill"
                               href="#custom-content-above-details" role="tab"
                               aria-controls="custom-content-above-details" aria-selected="true">Claim Details</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link check_by_tab" data-tab="claimant" id="custom-content-above-profile-tab"
                               data-toggle="pill"
                               href="#custom-content-above-profile" role="tab"
                               aria-controls="custom-content-above-profile" aria-selected="false"> Claimant Details</a>
                        </li>

                        <li class="nav-item">
                            <a class="nav-link check_by_tab " data-tab="intimation" id="custom-content-above-home-tab"
                               data-toggle="pill"
                               href="#custom-content-above-home" role="tab" aria-controls="custom-content-above-home"
                               aria-selected="false">Claim Intimation</a>
                        </li>

{{--                        <li class="nav-item">--}}
{{--                            <a class="nav-link  " id="custom-content-above-home-tab" data-toggle="pill"--}}
{{--                               href="#driver_and_contact_person" role="tab" aria-controls="custom-content-above-home"--}}
{{--                               aria-selected="false">Contact & Driver's Details</a>--}}
{{--                        </li>--}}

                        <li class="nav-item">
                            <a class="nav-link check_by_tab" data-tab="assessment"
                               id="custom-content-above-messages-tab" data-toggle="pill"
                               href="#custom-content-above-messages" role="tab"
                               aria-controls="custom-content-above-messages" aria-selected="false">Claim Assessment</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link check_by_tab" data-tab="discharge" id="custom-content-discharge-tab"
                               data-toggle="pill"
                               href="#custom-content-discharge" role="tab"
                               aria-controls="custom-content-discharge" aria-selected="false">Discharge Vourcher</a>
                        </li>

                        <li class="nav-item">
                            <a class="nav-link check_by_tab" data-tab="payment" id="custom-content-above-settings-tab"
                               data-toggle="pill"
                               href="#custom-content-above-settings" role="tab"
                               aria-controls="custom-content-above-settings" aria-selected="false">Payments</a>
                        </li>
                    </ul>

                    <div class="tab-content" id="custom-content-above-tabContent">
                        <div class="tab-pane fade " id="custom-content-above-home" role="tabpanel"
                             aria-labelledby="custom-content-above-home-tab">
                            @include('new-claims.renders._intimation')

                            @include('new-claims.renders._rejection')
                        </div>

                        <div class="tab-pane fade " id="driver_and_contact_person" role="tabpanel"
                             aria-labelledby="custom-content-above-details-tab">
                            @include('new-claims.renders._drivers',['policy'=>$vars['claim']->policy])
                            @include('new-claims.renders._contact_person',['policy'=>$vars['claim']->policy])
                        </div>

                        <div class="tab-pane fade active show" id="custom-content-above-details" role="tabpanel"
                             aria-labelledby="custom-content-above-details-tab">
                            @include('new-claims.renders._policy_detail',['policy'=>$vars['claim']->policy])
                        </div>

                        <div class="tab-pane fade" id="custom-content-above-profile" role="tabpanel"
                             aria-labelledby="custom-content-above-profile-tab">
                            @include('new-claims.renders._claimant')
                        </div>
                        <div class="tab-pane fade" id="custom-content-above-messages" role="tabpanel"
                             aria-labelledby="custom-content-above-messages-tab">

                            @include('new-claims.renders._assessment')

                            @include('new-claims.renders._rejection')
                        </div>

                        <div class="tab-pane fade" id="custom-content-discharge" role="tabpanel"
                             aria-labelledby="custom-content-discharge-tab">
                            @include('new-claims.renders._discharge')
                        </div>

                        <div class="tab-pane fade" id="custom-content-above-settings" role="tabpanel"
                             aria-labelledby="custom-content-above-settings-tab">
                            @include('new-claims.renders._payment')
                        </div>
                    </div>
                </div>
                <!-- /.card -->
            </div>
        </div>
        <div id="show_claim_detail_modal"></div>
        <div id="show_claim_detail_xml_modal"></div>
    </section>

@endsection
@section('js')
    <!-- overlayScrollbars -->
    <script src="{{ url('/') }}/assets/plugins/overlayScrollbars/js/jquery.overlayScrollbars.min.js"></script>

    <script src="{{ url('/') }}/assets/plugins/jquery-ui/jquery-ui.min.js"></script>
    <script src="{{ url('/') }}/assets/plugins/summernote/summernote-bs4.min.js"></script>
    <!-- CodeMirror -->
    <script src="{{ url('/') }}/assets/plugins/codemirror/codemirror.js"></script>
    <script src="{{ url('/') }}/assets/plugins/codemirror/mode/css/css.js"></script>
    <script src="{{ url('/') }}/assets/plugins/codemirror/mode/xml/xml.js"></script>
    <script src="{{ url('/') }}/assets/plugins/codemirror/mode/htmlmixed/htmlmixed.js"></script>
    <script>

        $(document).on('click', '.click_to_show_claim_detail', function (e) {
            e.preventDefault();
            let formdata = new FormData();
            formdata.append('model', $(this).data('model'));
            formdata.append('id', $(this).data('id'));
            asyncFetchAnyData(url = "fetching_request_response", formdata, 'waiting-for-all').then((response) => {
                if (response.view) {
                    $('#show_claim_detail_modal').replaceWith(response.view)
                    $('#show_claim_detail_modal').modal('show');
                }
            });
        })

        $(document).on('click', '.coordinate_model', function (e) {
            e.preventDefault();

            let formdata = new FormData();
            formdata.append('status', $(this).data('status'));
            formdata.append('id', $(this).data('id'));
            asyncFetchAnyData(url = "fetching_the_xml_claim", formdata, 'waiting-for-all').then((response) => {
                if (response.view) {
                    $('#show_claim_detail_xml_modal').replaceWith(response.view)
                    $('#show_claim_detail_xml_modal').modal('show');
                    // CodeMirror
                    CodeMirror.fromTextArea(
                        document.getElementById("codeMirrorDemo"), {
                        mode: "htmlmixed",
                        theme: "monokai"
                    });
                }
            });

        })


        $(document).on('change', '#for_the_stolen_data', function () {
            let value = $(this).val();
            if (value == "Theft") {
                $("#total_loss_full").val("Yes");
                $("#total_loss_full").attr("readonly");
            } else {
                $("#total_loss_full").val();
                $("#total_loss_full").removeAttr("readonly");
            }

        });


        $(document).on('click', '.check_by_tab', function (e) {
            e.preventDefault();
            let stage = $(this).data('tab');
            if (stage !== "detail" && stage !== "claimant") {
                var formdata = new FormData();
                formdata.append('stage', stage);
                formdata.append('id', "{{$vars['claim']->id}}");
                asyncFetchAnyData(url = "check-claim-stage", formdata).then((response) => {
                    $(`.add-${stage}`).show('slow');
                    if (response.status) {
                        // largeToastPanel('error',`${response.message}`)

                        let state = response.title ? response.title : "error"
                        $(`.add-${stage}`).hide('slow');
                        swalFunction(state, `${response.message}`, state)

                    }
                });
            }


        });

        /************************ for Intimation Portion ****************************/

        $(document).on('submit', '#create_claim_intimation_form', function (e) {
            e.preventDefault();
            var formdata = new FormData(this);
            asyncFetchAnyData(url = "store-claim-process", formdata, 'create_claim_intimation_form').then((response) => {
                $('.claim-process-button').fadeOut('slow');
            });
            run_waitMe('ios', `waiting-for-all`, 'loading please Wait......');
            setTimeout(function () {
                asyncFetchAnyData(url = "store-claim-process-intimation", formdata, 'create_claim_intimation_form').then((response) => {
                    $("#replace_claim_reference_number").text(response.claim_reference_number);
                    largeToastPanel('info', "Thank you.... Wait For The Response");
                    setTimeout(function () {
                        functionAutoLoad('intimation', 'intimation-detail-replace');
                    }, 3000);
                });
            }, 3000);
            $(`#waiting-for-all`).waitMe("hide");
        });

        /************************ for Intimation Portion ****************************/

        $(document).on('click', '#uploadDocument', function () {
            $('#claimDocumentModal').modal('show');
        });

        $(document).on('submit', '#create_document_form', function (e) {
            e.preventDefault();
            var formdata = new FormData(this);
            asyncFetchAnyData(url = "create_document_for_model", formdata, 'create_document_form').then((response) => {

            });
        });


        /************************ for Submission Portion ****************************/
        $(document).on('submit', '#create_claim_assessment_form', function (e) {
            e.preventDefault();
            var formdata = new FormData(this);
            asyncFetchAnyData(url = "claim_assessments", formdata, 'create_claim_assessment_form').then((response) => {
                $('#create_claim_assessment_form > button').fadeOut('slow');
                largeToastPanel('info', "Thank you Wait For The Response");
                setTimeout(function () {
                    functionAutoLoad('assessment', 'assessment-detail-replace');
                }, 3000);
            });
        });

        $(document).on('submit', '#create_claim_discharge_voucher_form', function (e) {
            e.preventDefault();
            var formdata = new FormData(this);
            asyncFetchAnyData(url = "discharge_vouchers", formdata, 'create_claim_discharge_voucher_form').then((response) => {
                $('#create_claim_discharge_voucher_form > button').fadeOut('slow');
                largeToastPanel('info', "Thank you Wait For The Response");
                setTimeout(function () {
                    functionAutoLoad('discharge', 'discharge-detail-replace');
                }, 3000);
            });
        });

        $(document).on('submit', '#create_claim_payment_form', function (e) {
            e.preventDefault();
            var formdata = new FormData(this);
            asyncFetchAnyData(url = "claim_payment", formdata, 'create_claim_payment_form').then((response) => {
                $('#create_claim_payment_form > button').fadeOut('slow');
                largeToastPanel('info', "Thank you Wait For The Response");
                setTimeout(function () {
                    functionAutoLoad('payment', 'payment-detail-replace');
                }, 3000);
            });
        });
        /************************ End Submission Portion ****************************/

        /************************ for Claimant Portion ****************************/

        $(document).on('submit', '#submit_customer_details_modal', function (e) {
            e.preventDefault();
            var formdata = new FormData(this);
            asyncFetchAnyData(url = "store-claimant", formdata, 'submit_customer_details_modal').then((response) => {
                $(".service_detail_customer").append(`<option value="${response.row.id}" selected>${response.row.claimant_name}</option>`);
                $(`#claimant_${response.row.uuid}`).length ? $(`#claimant_${response.row.uuid}`).replaceWith(response.view) : $(".prepend-claimant").prepend(response.view);
            });
        });
        $(document).on('change', '.claimant_category', function (e) {
            e.preventDefault();
            let value = Number($(this).val());
            if (value === 1) {
                let formService = new FormData();
                formService.append('id', '{{$vars['claim']->id}}');
                asyncFetchAnyData("find_customer_from_claim", formService).then((response) => {
                    if (response.status) {
                        $(`#submit_customer_details_modal input[name="claimant_name"]`).val(response.customer.PolicyHolderName);
                        $(`#submit_customer_details_modal select[name="claimant_id_type"]`).val(response.customer.PolicyHolderIdType).trigger('change.select2');
                        $(`#submit_customer_details_modal input[name="date_birth"]`).val(response.customer.PolicyHolderBirthDate);
                        $(`#submit_customer_details_modal select[name="gender"]`).val(response.customer.Gender).trigger('change');
                        $(`#submit_customer_details_modal input[name="phone_number"]`).val(response.customer.PolicyHolderPhoneNumber);
                        $(`#submit_customer_details_modal input[name="postal_address"]`).val(response.customer.PostalAddress);
                        $(`#submit_customer_details_modal input[name="region"]`).val(response.customer.Region);
                        $(`#submit_customer_details_modal input[name="district"]`).val(response.customer.District);
                        $(`#submit_customer_details_modal input[name="claimant_id_number"]`).val(response.customer.PolicyHolderIdNumber);
                    } else {
                        console.log(response.message);
                    }
                });
            } else {
                $(`#submit_customer_details_modal input[name="claimant_name"]`).val("");
                $(`#submit_customer_details_modal select[name="claimant_id_type"]`).val("").trigger('change.select2');
                $(`#submit_customer_details_modal input[name="date_birth"]`).val("");
                $(`#submit_customer_details_modal select[name="gender"]`).val("").trigger('change');
                $(`#submit_customer_details_modal input[name="phone_number"]`).val("");
                $(`#submit_customer_details_modal input[name="postal_address"]`).val("");
                $(`#submit_customer_details_modal input[name="region"]`).val("");
                $(`#submit_customer_details_modal input[name="district"]`).val("");
                $(`#submit_customer_details_modal input[name="claimant_id_number"]`).val("");
            }
        });


        $(document).on('submit', '#create_claim_rejection_form', function (e) {
            e.preventDefault();
            let formdata = new FormData(this);
            asyncFetchAnyData("claim_rejections", formdata, "create_claim_rejection_form").then((response) => {
                $('#create_claim_rejection_form > .modal-footer> button').fadeOut('slow');
            });
        });


        let functionAutoLoad = (tab = null, classView = null) => {
            let formService = new FormData();
            formService.append('id', '{{$vars['claim']->id}}');
            formService.append('tab', tab);
            asyncFetchAnyData("find-response-claim-real", formService, classView).then((response) => {
                $(`#${classView}`).replaceWith(response.view)
            });
        }

        /************************ for Claimant Portion ****************************/
    </script>

@endsection