@extends('User/layout/app')
@section('content')
    <div class="container-fluid">
        <!--  Row 1 -->
        <div class="row justify-content-end mb-4">
            <div class="row justify-content-end mb-4">
{{--                 <div class="col-lg-auto  col-md-6 col-sm-6">
                    <select class="form-select js-example-basic-single" aria-label="Default select example" id="selectTLM"
                        name="selectTLM" onchange="getSLMDAta();">
                        <option value="" selected Default>Select TLM</option>
                        @foreach ($tlmList as $TLM)
                            <option value="{{ $TLM->position_code }}">{{ $TLM->employee_name }}</option>
                        @endforeach
                    </select>
                </div>
                <div class="col-lg-auto  col-md-6 col-sm-6">
                    <select class="form-select js-example-basic-single" aria-label="Default select example" id="selectSLM"
                        name="selectSLM" onchange="getFLMDAta();">
                        <option value="" selected Default>Select SLM</option>
                    </select>
                </div>
                <div class="col-lg-auto  col-md-6 col-sm-6">
                    <select class="form-select js-example-basic-single" aria-label="Default select example" id="selectFLM"
                        name="selectFLM">
                        <option value="" selected Default>Select PS</option>
                    </select>
                </div> --}}

                {{-- <div class="col-lg-auto  col-md-6 col-sm-6">
                    <select class="form-select js-example-basic-single" aria-label="Default select example" id="selectSO"
                        name="selectSO">
                        <option value="" selected Default>Select SO</option>
                    </select>
                </div> --}}

               {{--  <div class="col-lg-auto  col-md-auto col-sm-auto">
                    <div class="d-flex align-items-center">
                        <button type="submit" id="applyfilter"><a href="#" class="btn btn-primary ms-2"><i
                                    class="fa fa-search"></i></a></button>
                        <button type="submit" id="clearfilter"><a href="#" class="btn btn-danger ms-2"><i
                                    class="fa fa-times"></i></a></button>
                    </div>
                </div> --}}
                <!-- <div class="col-lg-auto  col-md-4 col-sm-4 my-auto">
                                                                                                                                                                                                                                                                        <button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#show_dtails"><i class="fa-solid fa-plus me-2"></i>Add New Doctor</button>
                                                                                                                                                                                                                                                                      </div> -->
            </div>

            <div class="row m-0">
                <div class="col-12 p-0">
                    <div class="white_table">
                        <table class="table table-striped datatable" style="width:100%">
                            <thead>
                                <tr>
                                    <th>Sr No</th>
                                    <th>Parent Position Code</th>
                                    <th>Parent Name</th>
                                    <th>Position Code</th>
                                    <th>Employee Code</th>
                                    <th>Employee Name</th>
                                    <th>Designation</th>
                                    <th>Mobile Number</th>
                                    <th>Email ID</th>
                                    <th>Region</th>
                                    <th>HQ Name</th>
                                    <th>HQ Code</th>
                                    <th>Date And Time</th>
                                    <th>Action</th>
                                    {{-- <th>Time Entered By SO</th>
                                    <th>Time (RF Google Map)</th>
                                    <th>Estimated Time</th> --}}
                                    <th>Status</th>

                                </tr>
                            </thead>
                            <tbody class="newTable">
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>

        <div class="modal fade" id="track_hours" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
            <div class="modal-dialog modal-lg modal-dialog-centered">
                <div class="modal-content">
                    <div class="modal-header">
                        <h4 class="modal-title fs-5" id="exampleModalLabel">Track Hours Details</h4>
                        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"><i
                                class="fa-solid fa-xmark"></i></button>
                    </div>
                    <div class="modal-body">
                        <div class="row">
                            <div class="col-lg-12">
                                <div class="track_houre_row" id="trackCartridgeDetails">
                                    <div class="table-responsive">
                                        <table class="table NewTable">
                                            <thead>
                                                <tr>
                                                    <th>Sr No </th>
                                                    <th>Total Cartridges </th>
                                                    <th>Patient Name</th>
                                                    <th>Doctor Name</th>
                                                    <th>Requested by</th>
                                                    <th>Colleague</th>
                                                    <th>Date And Time</th>
                                                    <th>Total Hours</th>
                                                </tr>
                                            </thead>
                                            <tbody>

                                            </tbody>
                                        </table>
                                    </div>

                                </div>
                            </div>
                        </div>

                    </div>
                </div>
            </div>
        </div>

        <div class="modal fade" id="show_dtails" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
            <div class="modal-dialog modal-lg modal-dialog-centered">
                <div class="modal-content">
                    <div class="modal-header">
                        <h4 class="modal-title fs-5" id="exampleModalLabel">Edit User</h4>
                        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"><i
                                class="fa-solid fa-xmark"></i></button>
                    </div>
                    <div class="modal-body">
                        {{ Form::open(['url' => '#', 'name' => 'EditUserForm', 'id' => 'EditUserForm', 'enctype' => 'multipart/form-data', 'class' => 'pt-0']) }}

                        <div class="row">

                            <div class="col-lg-6 col-md-6 col-sm-12 col-12">
                                <div class="mb-3">
                                    <label for="position_code" class="form-label">Position Code <span
                                            class="red_star">*</span></label>
                                    <input type="text" class="form-control " id="position_code" name="position_code"
                                        placeholder="Enter Position Code" readonly>
                                </div>
                            </div>
                            <div class="col-lg-6 col-md-6 col-sm-12 col-12">
                                <div class="mb-3">
                                    <label for="employee_code" class="form-label">Employee Code <span
                                            class="red_star">*</span></label>
                                    <input type="text" class="form-control " id="employee_code" name="employee_code"
                                        placeholder="Enter Employee Code" readonly>
                                </div>
                            </div>
                            <div class="col-lg-6 col-md-6 col-sm-12 col-12">
                                <div class="mb-3">
                                    <label for="employee_name" class="form-label">Employee Name <span
                                            class="red_star">*</span></label>
                                    <input type="text" class="form-control br_from" id="employee_name"
                                        name="employee_name" placeholder="Enter Employee Name">
                                </div>
                            </div>
                            <div class="col-lg-6 col-md-6 col-sm-12 col-12">
                                <div class="mb-3">
                                    <label for="designation" class="form-label">Designation <span
                                            class="red_star">*</span></label>
                                    <input type="text" class="form-control " id="designation" name="designation"
                                        placeholder="Enter Designation" readonly>
                                </div>
                            </div>
                            <div class="col-lg-6 col-md-6 col-sm-12 col-12">
                                <div class="mb-3">
                                    <label for="mobile_no" class="form-label">Mobile Number <span
                                            class="red_star">*</span></label>
                                    <div class="flag_icon">
                                        <select class="form-select js-example-basic-single only_br"
                                            aria-label="Default select example">
                                            <option selected Default>+ 91</option>
                                            <!-- <option value="1">+ 91</option>
                                                                                                                                                                                              <option value="2">+ 92</option>
                                                                                                                                                                                              <option value="3">+ 93</option> -->
                                        </select>
                                        <input type="number" class="form-control br_from" id="mobile_no"
                                            name="mobile_no" placeholder="Enter Mobile Number">
                                    </div>
                                    <label id="mobile_no-error" class="error" for="mobile_no"></label>
                                </div>
                            </div>
                            <div class="col-lg-6 col-md-6 col-sm-12 col-12">
                                <div class="mb-3">
                                    <label for="email" class="form-label">Email ID <span
                                            class="red_star">*</span></label>
                                    <input type="email" class="form-control br_from" id="email" name="email"
                                        placeholder="Enter Email ID">
                                </div>
                            </div>
                            <div class="col-lg-6 col-md-6 col-sm-12 col-12">
                                <div class="mb-3">
                                    <label for="region" class="form-label">Region <span
                                            class="red_star">*</span></label>
                                    <input type="text" class="form-control br_from" id="region" name="region"
                                        placeholder="Enter Region">
                                </div>
                            </div>
                            <div class="col-lg-6 col-md-6 col-sm-12 col-12">
                                <div class="mb-3">
                                    <label for="hq_name" class="form-label">HQ Name <span
                                            class="red_star">*</span></label>
                                    <input type="text" class="form-control br_from" id="hq_name" name="hq_name"
                                        placeholder="Enter HQ Name">
                                </div>
                            </div>
                            <div class="col-lg-6 col-md-6 col-sm-12 col-12">
                                <div class="mb-3">
                                    <label for="hq_code" class="form-label">HQ Code <span
                                            class="red_star">*</span></label>
                                    <input type="text" class="form-control br_from" id="hq_code" name="hq_code"
                                        placeholder="Enter HQ Code">
                                </div>
                            </div>
                            <input type="hidden" name="edit_user_id" id="edit_user_id">

                            <div class="col-lg-12 text-center">
                                <div class="mb-3">
                                    <button type="submit" id="EditUserSubmit"
                                        class=" btn btn-primary mt-4">Submit</button>
                                </div>
                            </div>

                        </div>
                        {{ Form::close() }}
                    </div>
                </div>
            </div>
        </div>
    @endsection


    @section('js')
        <script>
            $('#show_dtails').on('hidden.bs.modal', function() {
                // Reset the form
                $('#EditUserForm')[0].reset();
                var validator = $('#EditUserForm').validate();
                validator.resetForm();
            });


            function delivery_time_taken(id) {
                var id = id;
                $.ajax({
                    url: "{{ route('CartridgeLogs') }}",
                    type: 'POST',
                    data: {
                        'id': id,
                        '_token': "{{ csrf_token() }}"
                    },
                    dataType: "json",
                    success: function(response, textStatus, xhr) {
                        if (response.status == 1) {
                            $('#track_hours').modal('show');
                            var trackCartridgeDetails = $('#trackCartridgeDetails');

                            if ($.fn.DataTable.isDataTable('.NewTable')) {
                                $('.NewTable').DataTable().destroy();
                            }

                            // Clear existing content in the table
                            trackCartridgeDetails.find('tbody').empty();

                            // Loop through the data and append rows to the table
                            response.data.forEach(function(log, index) {
                                var date = log.date;
                                var time = log.time;
                                var delivery_time_taken = log.delivery_time_taken;
                                var delivery_type = log.delivery_type;
                                var doctor_name = log.doctor_name;
                                var employee_name = log.employee_name;
                                var google_duration = log.google_duration;
                                var patient_name = log.patient_name;
                                var total_cartridges = log.total_cartridges;
                                var user_duration = log.user_duration;
                                if (delivery_type == 'self') {
                                    delivery_type = 'Self';
                                    var name = '-';
                                } else if (delivery_type == 'colleague_name') {
                                    delivery_type = 'Colleague';
                                    var name = employee_name;
                                } else if (delivery_type == 'stockist_name') {
                                    delivery_type = 'Stockist';
                                    var name = '-';
                                }

                                // Create a new row
                                var row = '<tr>' +
                                    '<td>' + (index + 1) + '</td>' +
                                    '<td>' + total_cartridges + ' Cartridges</td>' +
                                    '<td>' + patient_name + '</td>' +
                                    '<td>' + doctor_name + '</td>' +
                                    '<td>' + delivery_type + '</td>' +
                                    '<td>' + name + '</td>' +
                                    '<td>' +
                                    '<p class="mb-0">' +
                                    '<span class="d-flex justify-content-center align-items-center"><i class="fa fa-calendar-alt me-2"></i>' +
                                    date + '<br></span>' +
                                    '<span class="d-flex justify-content-center align-items-center time_span"><i class="fa fa-clock me-2"></i>' +
                                    time + '</span>' +
                                    '</p>' +
                                    '</td>' +
                                    '<td>' +
                                    (function() {
                                        if (delivery_time_taken !== null && delivery_time_taken !== 0) {
                                            if (delivery_time_taken < 60) {
                                                return '<span class="badge rounded-pill text-bg-primary"><i class="fa-regular fa-clock me-2"></i>' +
                                                    delivery_time_taken + ' Min</span>';
                                            } else {
                                                var hours = Math.floor(delivery_time_taken / 60);
                                                var remainingMinutes = delivery_time_taken % 60;
                                                return '<span class="badge rounded-pill text-bg-primary"><i class="fa-regular fa-clock me-2"></i>' +
                                                    hours + ' Hr ' + remainingMinutes + ' Min</span>';
                                            }
                                        } else {
                                            return '-';
                                        }
                                    })() +
                                    '</td>' +
                                    '</tr>';

                                // Append the row to the table
                                trackCartridgeDetails.find('tbody').append(row);
                            });

                            // Reinitialize DataTable instance outside the loop
                            $('.NewTable').DataTable({
                                "paging": true,
                                "info": true,
                                "searching": true,
                                "responsive": true,
                                "language": {
                                    "searchPlaceholder": "Search"
                                },
                            });

                        } else {
                            $.notify(response.msg, "error");
                        }
                    },
                    error: function(jqXHR, textStatus, errorThrown) {
                        $.notify(jqXHR.responseJSON.message, "error");
                    }
                });
            }


            function user_duration(id) {
                var id = id;
                $.ajax({
                    url: "{{ route('CartridgeLogs') }}",
                    type: 'POST',
                    data: {
                        'id': id,
                        '_token': "{{ csrf_token() }}"
                    },
                    dataType: "json",
                    success: function(response, textStatus, xhr) {
                        if (response.status == 1) {
                            $('#track_hours').modal('show');
                            var trackCartridgeDetails = $('#trackCartridgeDetails');

                            if ($.fn.DataTable.isDataTable('.NewTable')) {
                                $('.NewTable').DataTable().destroy();
                            }

                            // Clear existing content in the table
                            trackCartridgeDetails.find('tbody').empty();

                            // Loop through the data and append rows to the table
                            response.data.forEach(function(log, index) {
                                var date = log.date;
                                var time = log.time;
                                var delivery_time_taken = log.delivery_time_taken;
                                var delivery_type = log.delivery_type;
                                var doctor_name = log.doctor_name;
                                var employee_name = log.employee_name;
                                var google_duration = log.google_duration;
                                var patient_name = log.patient_name;
                                var total_cartridges = log.total_cartridges;
                                var user_duration = log.user_duration;
                                if (delivery_type == 'self') {
                                    delivery_type = 'Self';
                                    var name = '-';
                                } else if (delivery_type == 'colleague_name') {
                                    delivery_type = 'Colleague';
                                    var name = employee_name;
                                } else if (delivery_type == 'stockist_name') {
                                    delivery_type = 'Stockist';
                                    var name = '-';
                                }

                                // Create a new row
                                var row = '<tr>' +
                                    '<td>' + (index + 1) + '</td>' +
                                    '<td>' + total_cartridges + ' Cartridges</td>' +
                                    '<td>' + patient_name + '</td>' +
                                    '<td>' + doctor_name + '</td>' +
                                    '<td>' + delivery_type + '</td>' +
                                    '<td>' + name + '</td>' +
                                    '<td>' +
                                    '<p class="mb-0">' +
                                    '<span class="d-flex justify-content-center align-items-center"><i class="fa fa-calendar-alt me-2"></i>' +
                                    date + '<br></span>' +
                                    '<span class="d-flex justify-content-center align-items-center time_span"><i class="fa fa-clock me-2"></i>' +
                                    time + '</span>' +
                                    '</p>' +
                                    '</td>' +
                                    '<td>' +
                                    (function() {
                                        if (user_duration !== null && user_duration !== 0) {
                                            if (user_duration < 60) {
                                                return '<span class="badge rounded-pill text-bg-dark"><i class="fa-regular fa-clock me-2"></i>' +
                                                    user_duration + ' Min</span>';
                                            } else {
                                                var hours = Math.floor(user_duration / 60);
                                                var remainingMinutes = user_duration % 60;
                                                return '<span class="badge rounded-pill text-bg-dark"><i class="fa-regular fa-clock me-2"></i>' +
                                                    hours + ' Hr ' + remainingMinutes + ' Min</span>';
                                            }
                                        } else {
                                            return '-';
                                        }
                                    })() +
                                    '</td>' +
                                    '</tr>';

                                // Append the row to the table
                                trackCartridgeDetails.find('tbody').append(row);
                            });

                            $('.NewTable').DataTable({
                                "paging": true,
                                "info": true,
                                "searching": true,
                                "responsive": true,
                                "language": {
                                    "searchPlaceholder": "Search"
                                },
                            });

                        } else
                            $.notify(response.msg, "error");
                    },
                    error: function(jqXHR, textStatus, errorThrown) {
                        $.notify(jqXHR.responseJSON.message, "error");
                    }
                });
            }

            function google_duration(id) {
                var id = id;
                $.ajax({
                    url: "{{ route('CartridgeLogs') }}",
                    type: 'POST',
                    data: {
                        'id': id,
                        '_token': "{{ csrf_token() }}"
                    },
                    dataType: "json",
                    success: function(response, textStatus, xhr) {
                        if (response.status == 1) {
                            $('#track_hours').modal('show');
                            var trackCartridgeDetails = $('#trackCartridgeDetails');

                            if ($.fn.DataTable.isDataTable('.NewTable')) {
                                $('.NewTable').DataTable().destroy();
                            }

                            // Clear existing content in the table
                            trackCartridgeDetails.find('tbody').empty();

                            // Loop through the data and append rows to the table
                            response.data.forEach(function(log, index) {
                                var date = log.date;
                                var time = log.time;
                                var delivery_time_taken = log.delivery_time_taken;
                                var delivery_type = log.delivery_type;
                                var doctor_name = log.doctor_name;
                                var employee_name = log.employee_name;
                                var google_duration = log.google_duration;
                                var patient_name = log.patient_name;
                                var total_cartridges = log.total_cartridges;
                                var user_duration = log.user_duration;
                                if (delivery_type == 'self') {
                                    delivery_type = 'Self';
                                    var name = '-';
                                } else if (delivery_type == 'colleague_name') {
                                    delivery_type = 'Colleague';
                                    var name = employee_name;
                                } else if (delivery_type == 'stockist_name') {
                                    delivery_type = 'Stockist';
                                    var name = '-';
                                }

                                // Create a new row
                                var row = '<tr>' +
                                    '<td>' + (index + 1) + '</td>' +
                                    '<td>' + total_cartridges + ' Cartridges</td>' +
                                    '<td>' + patient_name + '</td>' +
                                    '<td>' + doctor_name + '</td>' +
                                    '<td>' + delivery_type + '</td>' +
                                    '<td>' + name + '</td>' +
                                    '<td>' +
                                    '<p class="mb-0">' +
                                    '<span class="d-flex justify-content-center align-items-center"><i class="fa fa-calendar-alt me-2"></i>' +
                                    date + '<br></span>' +
                                    '<span class="d-flex justify-content-center align-items-center time_span"><i class="fa fa-clock me-2"></i>' +
                                    time + '</span>' +
                                    '</p>' +
                                    '</td>' +

                                    '<td>' +
                                    (function() {
                                        if (google_duration !== null && google_duration !== 0) {
                                            if (google_duration < 60) {
                                                return '<span class="badge rounded-pill text-bg-secondary"><i class="fa-regular fa-clock me-2"></i>' +
                                                    google_duration + ' Min</span>';
                                            } else {
                                                var hours = Math.floor(google_duration / 60);
                                                var remainingMinutes = google_duration % 60;
                                                return '<span class="badge rounded-pill text-bg-secondary"><i class="fa-regular fa-clock me-2"></i>' +
                                                    hours + ' Hr ' + remainingMinutes + ' Min</span>';
                                            }
                                        } else {
                                            return '-';
                                        }
                                    })() +
                                    '</td>' +
                                    '</tr>';

                                // Append the row to the table
                                trackCartridgeDetails.find('tbody').append(row);
                            });

                            $('.NewTable').DataTable({
                                "paging": true,
                                "info": true,
                                "searching": true,
                                "responsive": true,
                                "language": {
                                    "searchPlaceholder": "Search"
                                },
                            });

                        } else
                            $.notify(response.msg, "error");
                    },
                    error: function(jqXHR, textStatus, errorThrown) {
                        $.notify(jqXHR.responseJSON.message, "error");
                    }
                });
            }



            function status(id) {
                $.ajax({
                    url: "{{ route('ChangeUserStatus') }}",
                    type: 'POST',
                    data: {
                        'id': id,
                        '_token': "{{ csrf_token() }}"
                    },
                    dataType: "json",
                    success: function(response, textStatus, xhr) {
                        if (response.status == 1) {
                            $.notify(response.msg, "success");
                        } else
                            $.notify(response.msg, "error");
                    },
                    error: function(jqXHR, textStatus, errorThrown) {
                        $.notify(jqXHR.responseJSON.message, "error");
                    }
                });
            }


            function refreshDataTable() {
                $('.table').DataTable().ajax.reload();
            }

            $('#EditUserForm').validate({
                ignore: ".ignore",
                rules: {
                    employee_name: {
                        required: true,
                        maxlength: 45
                    },
                    mobile_no: {
                        required: true,
                        maxlength: 10,
                        minlength: 10
                    },
                    email: {
                        required: true,
                    },
                    region: {
                        required: true,
                        maxlength: 30,

                    },
                    hq_name: {
                        required: true,
                        maxlength: 30,

                    },
                    hq_code: {
                        required: true,
                        maxlength: 12,
                    },
                },
                messages: {},
                submitHandler: function(form) {
                    $("#EditUserSubmit").attr('disabled', true);

                    var formData = new FormData($("#EditUserForm")[0]);
                    $.ajax({
                        url: "{{ route('EditUser') }}",
                        type: 'POST',
                        data: formData,
                        processData: false,
                        contentType: false,
                        dataType: "json",
                        success: function(response) {
                            // console.log(response);
                            if (response.status == 1) {
                                // Success message
                                $("#EditUserSubmit").attr('disabled', false);
                                $.notify(response.msg, "success");
                                $('#show_dtails').modal('hide');
                                refreshDataTable();
                            } else {
                                // Error message
                                $("#EditUserSubmit").attr('disabled', false);
                                $.notify(response.msg, "error");
                            }
                        },
                        error: function(jqXHR, textStatus, errorThrown) {
                            // Error in request
                            $("#EditUserSubmit").attr('disabled', false);
                            $.notify("An error occurred", "error");
                        }
                    })
                }

            });

            function editUser(id) {
                $.ajax({
                    url: "{{ route('getUser') }}",
                    type: 'POST',
                    data: {
                        'user_id_encrypt': id,
                        '_token': "{{ csrf_token() }}"
                    },
                    dataType: "json",
                    success: function(response, textStatus, xhr) {
                        if (response.status == 1) {
                            $('#edit_user_id').val(response.data.user.id);
                            $('#position_code').val(response.data.user.position_code);
                            $('#employee_code').val(response.data.user.employee_code);
                            $('#employee_name').val(response.data.user.employee_name);
                            let role = response.data.user.user_role;
                            $('#designation').val(role === 'FLM' ? 'PS' : role);
                            $('#mobile_no').val(response.data.user.mobile_no);
                            $('#email').val(response.data.user.email);
                            $('#region').val(response.data.user.region);
                            $('#hq_name').val(response.data.user.hq_name);
                            $('#hq_code').val(response.data.user.hq_code);

                            $('#show_dtails').modal('show');
                        } else
                            $.notify(response.msg, "error");
                    },
                    error: function(jqXHR, textStatus, errorThrown) {
                        $.notify(jqXHR.responseJSON.message, "error");
                    }
                }); //ajax
            }
            $('#track_hours').on('shown.bs.modal', function(e) {
                $.fn.dataTable.tables({
                    visible: true,
                    api: true
                }).columns.adjust();
            });

            $(document).ready(function() {


                filterData();

                $('#applyfilter').click(function() {
                    filterData();
                });

                $('#clearfilter').click(function() {
                    window.location.reload();
                });

                function filterData() {
                    var i = 1;
                    var table = $('.table').DataTable({
                        scrollX: true,
                        destroy: true,
                        processing: true,
                        serverSide: true,
                        responsive: true,
                        autoWidth: false,
                        language: {
                            searchPlaceholder: "Search"
                        },
                        ajax: {
                            url: "{{ route('ManageUserPaginate') }}",
                            data: function(d) {
                                d._token = "{{ csrf_token() }}";
                                /*                                 d.selectTLM = $('#selectTLM option:selected').val();
                                                                d.selectSLM = $('#selectSLM option:selected').val();
                                                                d.selectFLM = $('#selectFLM option:selected').val();
                                                                d.selectSO = $('#selectSO option:selected').val(); */
                            },
                        },
                        "drawCallback": function(settings) {
                            new VenoBox({
                                selector: ".venobox_img",
                                numeration: true,
                                infinigall: true,
                                share: true,
                                spinner: 'plane'
                            });
                        },
                        columns: [{
                                data: 'DT_RowIndex',
                                name: 'DT_RowIndex',
                                orderable: false,
                                searchable: false
                            },
                            {
                                data: 'parent_position_code',
                                orderable: false,
                                searchable: true
                            },
                            {
                                data: 'parent_user_name',
                                orderable: false,
                                searchable: true
                            },
                            {
                                data: 'position_code',
                                orderable: false,
                                searchable: true
                            },

                            {
                                data: 'employee_code',
                                orderable: false,
                                searchable: true
                            },
                            {
                                data: 'employee_name',
                                orderable: false,
                                searchable: true
                            },
                            {
                                data: 'user_role',
                                orderable: false,
                                searchable: false
                            },
                            {
                                data: 'mobile_no',
                                orderable: false,
                                searchable: false
                            },
                            {
                                data: 'email',
                                orderable: false,
                                searchable: false

                            },
                            {
                                data: 'region',
                                orderable: false,
                                searchable: false

                            },
                            {
                                data: 'hq_name',
                                orderable: false,
                                searchable: false

                            },
                            {
                                data: 'hq_code',
                                orderable: false,
                                searchable: false

                            },
                            {
                                data: 'created_at',
                                orderable: false,
                                searchable: false

                            },
                            {
                                data: 'action',
                                orderable: false,
                                searchable: true
                            },
                            // {
                            //     data: 'delivery_time_taken',
                            //     orderable: false,
                            //     searchable: false
                            // },

                            // {
                            //     data: 'google_duration',
                            //     orderable: false,
                            //     searchable: true
                            // },
                            // {
                            //     data: 'user_duration',
                            //     orderable: false,
                            //     searchable: false
                            // },
                            {
                                data: 'user_status',
                                orderable: false,
                                searchable: false

                            },
                        ],
                        columnDefs: [{
                            "aTargets": [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14],
                            "mRender": function(data, type, full) {
                                if (data != null) {
                                    return data;
                                } else {
                                    return '-';
                                }
                            },
                        }, ],

                    });
                };
            });

            function getSLMDAta() {
                $.ajax({
                    url: "{{ url('/get-parent-data') }}",
                    type: "POST",
                    data: {
                        ParentPossionCode: $('#selectTLM option:selected').val(),
                        _token: '{{ csrf_token() }}'
                    },
                    success: function(result) {
                        $('#selectSLM').html('<option value="">Select SLM</option>');
                        $.each(result.parent, function(key, value) {
                            $("#selectSLM").append('<option value="' + value.position_code + '">' + value
                                .employee_name + '</option>');
                        });
                        $('#selectFLM').html('<option value="">Select PS</option>');
                        $('#selectSO').html('<option value="">Select SO</option>');
                    }
                })
            }

            function getFLMDAta() {
                $.ajax({
                    url: "{{ url('/get-parent-data') }}",
                    type: "POST",
                    data: {
                        ParentPossionCode: $('#selectSLM option:selected').val(),
                        _token: '{{ csrf_token() }}'
                    },
                    success: function(result) {
                        $('#selectFLM').html('<option value="">Select PS</option>');
                        $.each(result.parent, function(key, value) {
                            $("#selectFLM").append('<option value="' + value.position_code + '">' + value
                                .employee_name + '</option>');
                        });
                        $('#selectSO').html('<option value="">Select SO</option>');
                    }
                })
            }

            function getSODAta() {
                $.ajax({
                    url: "{{ url('/get-parent-data') }}",
                    type: "POST",
                    data: {
                        ParentPossionCode: $('#selectFLM option:selected').val(),
                        _token: '{{ csrf_token() }}'
                    },
                    success: function(result) {
                        $('#selectSO').html('<option value="">Select SO</option>');
                        $.each(result.parent, function(key, value) {
                            $("#selectSO").append('<option value="' + value.position_code + '">' + value
                                .employee_name + '</option>');
                        });
                    }
                })
            }
        </script>
    @endsection