@include('Template.header')
<meta name="csrf-token" content="{{ csrf_token() }}">
<div class="modal fade" id="edit_be" tabindex="-1" aria-labelledby="edit_doc" aria-hidden="true">
    <div class="modal-dialog  modal-dialog-centered modal-dialog-scrollable">
        <div class="modal-content">
            <div class="modal-header">
                <h3 class="modal-title">Edit BE</h3>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <div class="container">
                    <div class="row">
                        <div class="col-md-12">
                            <form class="forms-sample row" id="edit_be_data" method="POST">
                                @csrf
                                <input type="hidden" name="eRole" id="eRole" value="BE">
                                <input type="hidden" name="iUserID" id="iUserID">
                                <div class="form-group col-lg-6 px-2">
                                    <label for="doc_name">SM Name</label>
                                    <select class="js-example-basic-single" id="edit_SMPossionCode" name="SMPossionCode"
                                        onchange="geteditRBMDAta();" style="width: 100%;">
                                        <option value="">SM</option>
                                        @foreach ($SMList as $rw)
                                            <option value="{{ $rw->vPositionCode }}">{{ $rw->vUserName }}</option>
                                        @endforeach
                                    </select>
                                    <label id="edit_SMPossionCode-error" class="error"
                                        for="edit_SMPossionCode"></label>
                                </div>
                                <div class="form-group col-lg-6 px-2">
                                    <label for="doc_name">RBM Name</label>
                                    <select class="js-example-basic-single" id="edit_RBMPossionCode"
                                        name="RBMPossionCode" onchange="geteditABMList();" style="width: 100%;">
                                        <option value="">RBM</option>
                                        @foreach ($RBMList as $rw)
                                            <option value="{{ $rw->vPositionCode }}">{{ $rw->vUserName }}</option>
                                        @endforeach
                                    </select>
                                    <label id="edit_RBMPossionCode-error" class="error"
                                        for="edit_RBMPossionCode"></label>
                                </div>
                                <div class="form-group col-lg-6 px-2">
                                    <label for="doc_name">ABM Name</label>
                                    <select class="js-example-basic-single" id="edit_vPerentPositionCode"
                                        name="vPerentPositionCode" style="width: 100%;">
                                        <option value="">ABM</option>
                                        @foreach ($ABMList as $rw)
                                            <option value="{{ $rw->vPositionCode }}">{{ $rw->vUserName }}</option>
                                        @endforeach
                                    </select>
                                    <label id="edit_vPerentPositionCode-error" class="error"
                                        for="edit_vPerentPositionCode"></label>
                                </div>
                                <div class="form-group col-lg-6 px-2">
                                    <label for="vPositionCode">Position Code</label>
                                    <input type="text" class="form-control" id="edit_vPositionCode"
                                        name="vPositionCode" placeholder="Enter Position Code"
                                        oninput="this.value = this.value.replace(/[^0-9.]/g, '').replace(/(\..*?)\..*/g, '$1');"
                                        required />
                                </div>
                                <div class="form-group col-lg-6 px-2">
                                    <label for="vUserName">BE Name</label>
                                    <input type="text" class="form-control" id="edit_vUserName" name="vUserName"
                                        placeholder="Enter BE Name" />
                                </div>
                                <div class="form-group col-lg-6 px-2">
                                    <label for="vEmpCode">BE Emp Code</label>
                                    <input type="text" class="form-control" id="edit_vEmpCode" name="vEmpCode"
                                        placeholder="Enter BE Emp Code"
                                        oninput="this.value = this.value.replace(/[^0-9.]/g, '').replace(/(\..*?)\..*/g, '$1');" />
                                </div>

                                <div class="form-group col-lg-6 px-2">
                                    <label for="vHQ">Role (Headquarter)</label>
                                    <input type="text" class="form-control" id="edit_vHQ" name="vHQ"
                                        placeholder="Enter Role (Headquarter)" />
                                </div>
                                <div class="form-group col-lg-6 px-2">
                                    <label for="vEmail">Email ID</label>
                                    <input type="email" class="form-control" id="edit_vEmail" name="vEmail"
                                        placeholder="Enter Email ID" />
                                </div>
                                <div class="form-group col-lg-6 px-2">
                                    <label for="vMobile">Contact No.</label>
                                    <input type="text" class="form-control" id="edit_vMobile" name="vMobile"
                                        placeholder="Enter Contact No."
                                        oninput="this.value = this.value.replace(/[^0-9.]/g, '').replace(/(\..*?)\..*/g, '$1');" />
                                </div>

                                <div class="form-group col-lg-12 px-2 text-center">
                                    <button type="submit" class="btn btn-primary mr-2"> Submit
                                    </button>
                                    <a class="btn btn-light" onclick="$('#edit_be').modal('hide');">Cancel</a>
                                </div>
                            </form>

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

            </div>

        </div>
    </div>
</div>
<div class="modal fade" id="add_be" tabindex="-1" aria-labelledby="edit_doc" aria-hidden="true">
    <div class="modal-dialog  modal-dialog-centered modal-dialog-scrollable">
        <div class="modal-content">
            <div class="modal-header">
                <h3 class="modal-title">Add BE</h3>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <div class="container">
                    <div class="row">
                        <div class="col-md-12">

                            <form class="forms-sample row" id="add_BE_Data" method="Post">
                                @csrf

                                <input type="hidden" name="eRole" id="eRole" value="BE">
                                <div class="form-group col-lg-6 px-2">
                                    <label for="doc_name">SM Name<span style="color: red;">*</span></label>
                                    <select class="js-example-basic-single" id="SMPossionCode" name="SMPossionCode"
                                        onchange="getRBMDAta();" style="width: 100%;">
                                        <option value="">SM</option>
                                        @foreach ($SMList as $rw)
                                            <option value="{{ $rw->vPositionCode }}">{{ $rw->vUserName }}</option>
                                        @endforeach
                                    </select>
                                    <label id="SMPossionCode-error" class="error" for="SMPossionCode"></label>
                                </div>
                                <div class="form-group col-lg-6 px-2">
                                    <label for="doc_name">RBM Name<span style="color: red;">*</span></label>
                                    <select class="js-example-basic-single" id="RBMPossionCode" name="RBMPossionCode"
                                        onchange="getABMList();" style="width: 100%;">
                                        <option value="">RBM</option>
                                    </select>
                                    <label id="RBMPossionCode-error" class="error" for="RBMPossionCode"></label>
                                </div>
                                <div class="form-group col-lg-6 px-2">
                                    <label for="doc_name">ABM Name<span style="color: red;">*</span></label>
                                    <select class="js-example-basic-single" id="vPerentPositionCode"
                                        name="vPerentPositionCode" style="width: 100%;">
                                        <option value="">ABM</option>

                                    </select>
                                    <label id="vPerentPositionCode-error" class="error"
                                        for="vPerentPositionCode"></label>
                                </div>
                                <div class="form-group col-lg-6 px-2">
                                    <label for="vPositionCode">Position Code<span style="color: red;">*</span></label>
                                    <input type="text" class="form-control" id="vPositionCode"
                                        name="vPositionCode" placeholder="Enter Position Code"
                                        oninput="this.value = this.value.replace(/[^0-9.]/g, '').replace(/(\..*?)\..*/g, '$1');"
                                        required />
                                </div>
                                <div class="form-group col-lg-6 px-2">
                                    <label for="vUserName">BE Name<span style="color: red;">*</span></label>
                                    <input type="text" class="form-control" id="vUserName" name="vUserName"
                                        placeholder="Enter BE Name" />
                                </div>
                                <div class="form-group col-lg-6 px-2">
                                    <label for="vEmpCode">BE Emp Code<span style="color: red;">*</span></label>
                                    <input type="text" class="form-control" id="vEmpCode" name="vEmpCode"
                                        placeholder="Enter BE Emp Code"
                                        oninput="this.value = this.value.replace(/[^0-9.]/g, '').replace(/(\..*?)\..*/g, '$1');" />
                                </div>

                                <div class="form-group col-lg-6 px-2">
                                    <label for="vHQ">Role (Headquarter)<span style="color: red;">*</span></label>
                                    <input type="text" class="form-control" id="vHQ" name="vHQ"
                                        placeholder="Enter Role (Headquarter)" />
                                </div>
                                <div class="form-group col-lg-6 px-2">
                                    <label for="vEmail">Email ID<span style="color: red;">*</span></label>
                                    <input type="email" class="form-control" id="vEmail" name="vEmail"
                                        placeholder="Enter Email ID" />
                                </div>
                                <div class="form-group col-lg-6 px-2">
                                    <label for="vMobile">Contact No.<span style="color: red;">*</span></label>
                                    <input type="text" class="form-control" id="vMobile" name="vMobile"
                                        placeholder="Enter Contact No."
                                        oninput="this.value = this.value.replace(/[^0-9.]/g, '').replace(/(\..*?)\..*/g, '$1');" />
                                </div>

                                <div class="form-group col-lg-12 px-2 text-center">
                                    <button type="submit" id="addBEbtn" class="btn btn-primary mr-2"> Submit
                                    </button>
                                    <a class="btn btn-light" onclick="$('#add_be').modal('hide');">Cancel</a>
                                </div>
                            </form>

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

            </div>

        </div>
    </div>
</div>
<div class="main-panel">
    <div class="content-wrapper pb-0">
        <h4 class="">Manage BE </h4>

        <div class="card mt-3">
            <div class="row">
                <div class="col-xl-2 col-lg-2 my-1 ">
                    <select class="js-example-basic-single" id="SMFilter" name="SMFilter" style="width: 100%;"
                        onchange="getRBMfilterDAta();">
                        <option value="">SM</option>
                        @foreach ($SMList as $rw)
                            <option value="{{ $rw->vPositionCode }}">{{ $rw->vUserName }}</option>
                        @endforeach
                    </select>
                </div>
                <div class="col-xl-2 col-lg-2 my-1 ">
                    <select class="js-example-basic-single" id="RBMFilter" name="RBMFilter" style="width: 100%;"
                        onchange="getABMfilterDAta();">
                        <option value="">RBM</option>
                        {{-- @foreach ($RBMList as $rw)
                                        <option value="{{$rw->vPositionCode}}">{{$rw->vUserName}}</option>
                                        @endforeach --}}
                    </select>
                </div>
                <div class="col-xl-2 col-lg-2 my-1 ">
                    <select class="js-example-basic-single" id="Parent_Filter" name="Parent_Filter"
                        style="width: 100%;">
                        <option value="">ABM</option>

                    </select>
                </div>

                <!-- <div class="col-xl-auto col-lg-auto my-1 ">
                    <div id="reportrange" class="daterange">
                        <i class="fa fa-calendar"></i>&nbsp;
                        <span></span> <i class="fa fa-caret-down"></i>
                    </div>
                </div> -->
                <div class="col-xl-auto col-lg-auto px-2 text-left my-auto my-2">
                    <a href="#" id="applyfilter" type="submit" class="btn btn-primary  mx-auto">Apply</a>
                    <a href="#" id="clear" type="submit" class="btn btn-danger  mx-auto ml-3">Clear</a>
                </div>
                <div class="col-xl-auto col-lg-auto px-1 text-right ml-auto my-auto my-2">
                    <a href="#" data-target="#add_be" data-toggle="modal" class="btn btn-primary my-1"><i
                            class="fa fa-plus mr-1"></i>Add BE</a>
                    <a href="#" type="submit" class="btn btn-success  mx-auto" onclick="exportdata()"><i
                            class="fa fa-download"></i> Export</a>

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




        <div class="row mt-3">
            <div class="col-lg-12 grid-margin stretch-card">
                <div class="card">
                    <div class="card-body">

                        <div class="table-responsive">
                            <table class="table table-striped text-center w-100" id="user_datatable">
                                <thead class="thead-light">
                                    <tr>
                                        <th>Sr. No.</th>
                                        <th>Action</th>
                                        <th>SM Name</th>
                                        <th>RBM Name</th>
                                        <th>ABM Name</th>
                                        <th>BE Position Code</th>
                                        <th>BE Name</th>
                                        <th>BE Emp Code</th>
                                        <th>Role (Headquarter)</th>
                                        <th>Email ID</th>
                                        <th>Contact No.</th>
                                        <th>Date and Time </th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <tr>
                                        <th>1</th>
                                        <td class="text-center">
                                            <div class="d-flex align-items-center justify-content-center">
                                                <div class="switch">
                                                    <input type="checkbox" id="toggleAll" />
                                                    <label for="toggleAll" class="mb-0"></label>
                                                </div>
                                                <div>
                                                    <a href="#" data-target="#edit_be" data-toggle="modal"
                                                        tooltip="Edit" flow="right"><i
                                                            class="fa fa-pencil-alt"></i></a>
                                                </div>
                                            </div>
                                        </td>
                                        <td>Ajay Chopra</td>
                                        <td>Ajay Chopra</td>
                                        <td>Ajay Chopra</td>
                                        <td>123456</td>
                                        <td>Ajay Chopra</td>
                                        <td>123456</td>
                                        <td>Ranip</td>
                                        <td>abc@gmail.com</td>
                                        <td>+91 7268522652</td>
                                        <td>
                                            <p class="mb-0"><i class="fad fa-calendar-alt mr-1"></i> 07/07/2022</p>
                                            <p class="mb-0"> <span class="span2"><i class="fad fa-clock mr-1"></i>
                                                    02:00:00</span></p>
                                        </td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>

        </div>
    </div>

    @include('Template.footer')

    <script>
        $(document).ready(function() {
            $("#SMPossionCode").select2();
            $("#RBMPossionCode").select2();
            $("#vPerentPositionCode").select2();

            $('#add_be').on('hidden.bs.modal', function() {
                $("#SMPossionCode").val(null).trigger('change');

                $("#SMPossionCode-error").html('');
                $("#RBMPossionCode-error").html('');
                $("#vPerentPositionCode-error").html('');
                $("#vPositionCode-error").html('');
                $("#vUserName-error").html('');
                $("#vEmpCode-error").html('');
                $("#vHQ-error").html('');
                $("#vEmail-error").html('');
                $("#vMobile-error").html('');

                $("#vPositionCode").val('');
                $("#vUserName").val('');
                $("#vEmpCode").val('');
                $("#vHQ").val('');
                $("#vEmail").val('');
                $("#vMobile").val('');

            });
        });

        $(function() {
            var i = 1;
            var table = $('#user_datatable').DataTable({
                scrollX: true,
                destroy: true,
                processing: true,
                serverSide: true,
                responsive: true,
                autoWidth: false,
                ajax: {
                    url: "{{ url('be-datatable') }}",
                    data: function(d) {

                        // d.eRole = 'ABM';
                        d.Parent_Filter = $('#Parent_Filter').val();
                        d.SMFilter = $('#SMFilter option:selected').val();
                        d.RBMFilter = $('#RBMFilter option:selected').val();
                    },
                },
                columns: [{
                        data: 'DT_RowIndex',
                        name: 'DT_RowIndex',
                        orderable: false,
                        searchable: false

                    },
                    {
                        data: 'action',
                        name: 'action',
                        orderable: false,
                    },
                    {
                        data: 'SMUserName',
                        name: 'SMUserName'
                    },
                    {
                        data: 'RBMUserName',
                        name: 'RBMUserName'
                    },

                    {
                        data: 'ABMUserName',
                        name: 'ABMUserName'
                    },
                    {
                        data: 'vPositionCode',
                        name: 'vPositionCode'
                    },
                    {
                        data: 'vUserName',
                        name: 'vUserName'
                    },
                    {
                        data: 'vEmpCode',
                        name: 'vEmpCode'
                    },
                    {
                        data: 'vHQ',
                        name: 'vHQ'
                    },
                    {
                        data: 'vEmail',
                        name: 'vEmail'
                    },
                    {
                        data: 'vMobile',
                        name: 'vMobile'
                    },
                    {
                        data: 'created_at',
                        name: 'created_at'
                    },

                ]
            });

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

            $("#clear").click(function() {
                $('#Parent_Filter').val('').trigger('change');;
                $('#SMFilter').val('').trigger('change');;
                $('#RBMFilter').val('').trigger('change');;
                table.draw();
            });

        });
    </script>



    <script>
        function getRBMfilterDAta() {
            $.ajax({
                url: "{{ url('/get-parent-data') }}",
                type: "POST",
                data: {
                    ParentPossionCode: $('#SMFilter option:selected').val(),
                    _token: '{{ csrf_token() }}'
                },
                success: function(result) {
                    $('#Parent_Filter').html('<option value="">ABM</option>');
                    $('#RBMFilter').html('<option value="">RBM</option>');
                    $.each(result.parent, function(key, value) {
                        $("#RBMFilter").append('<option value="' + value.vPositionCode + '">' + value
                            .vUserName + '</option>');
                    });

                }
            })
        }




        function geteditRBMDAta() {

            $.ajax({
                url: "{{ url('/get-parent-data') }}",
                type: "POST",
                data: {
                    ParentPossionCode: $('#edit_SMPossionCode option:selected').val(),
                    _token: '{{ csrf_token() }}'
                },
                success: function(result) {
                    $('#edit_RBMPossionCode').html('<option value="">RBM</option>');
                    $.each(result.parent, function(key, value) {
                        $("#edit_RBMPossionCode").append('<option value="' + value.vPositionCode +
                            '">' +
                            value.vUserName + '</option>');
                    });
                }
            })
        }

        function geteditABMList() {
            $.ajax({
                url: "{{ url('/get-parent-data') }}",
                type: "POST",
                data: {
                    ParentPossionCode: $('#edit_RBMPossionCode option:selected').val(),
                    _token: '{{ csrf_token() }}'
                },
                success: function(result) {
                    $('#edit_vPerentPositionCode').html('<option value="">ABM</option>');
                    $.each(result.parent, function(key, value) {
                        $("#edit_vPerentPositionCode").append('<option value="' + value.vPositionCode +
                            '">' + value.vUserName + '</option>');
                    });
                }
            })
        }


        function getRBMDAta() {

            $.ajax({
                url: "{{ url('/get-parent-data') }}",
                type: "POST",
                data: {
                    ParentPossionCode: $('#SMPossionCode option:selected').val(),
                    _token: '{{ csrf_token() }}'
                },
                success: function(result) {
                    $('#vPerentPositionCode').html('<option value="">ABM</option>');
                    $('#RBMPossionCode').html('<option value="">RBM</option>');
                    $.each(result.parent, function(key, value) {
                        $("#RBMPossionCode").append('<option value="' + value.vPositionCode + '">' +
                            value.vUserName + '</option>');
                    });
                }
            })
        }

        function getABMList() {
            $.ajax({
                url: "{{ url('/get-parent-data') }}",
                type: "POST",
                data: {
                    ParentPossionCode: $('#RBMPossionCode option:selected').val(),
                    _token: '{{ csrf_token() }}'
                },
                success: function(result) {
                    $('#vPerentPositionCode').html('<option value="">ABM</option>');
                    $.each(result.parent, function(key, value) {
                        $("#vPerentPositionCode").append('<option value="' + value.vPositionCode +
                            '">' + value.vUserName + '</option>');
                    });
                }
            })
        }

        function getABMfilterDAta() {
            $.ajax({
                url: "{{ url('/get-parent-data') }}",
                type: "POST",
                data: {
                    ParentPossionCode: $('#RBMFilter option:selected').val(),
                    _token: '{{ csrf_token() }}'
                },
                success: function(result) {
                    $('#Parent_Filter').html('<option value="">ABM</option>');
                    $.each(result.parent, function(key, value) {
                        $("#Parent_Filter").append('<option value="' + value.vPositionCode + '">' +
                            value.vUserName + '</option>');
                    });
                }
            })
        }
    </script>


    <script>
        $('#add_BE_Data').validate({ // initialize the plugin
            ignore: ".ignore",
            rules: {
                SMPossionCode: {
                    required: true,


                },
                RBMPossionCode: {
                    required: true,


                },
                vPerentPositionCode: {
                    required: true,


                },
                vPositionCode: {
                    required: true,
                    number: true,

                },
                vEmpCode: {
                    required: true,
                    number: true,

                },
                vUserName: {
                    required: true,

                },
                vHQ: {
                    required: true,
                },
                vEmail: {
                    required: true,
                },
                vMobile: {
                    required: true,
                    number: true,
                    minlength: 10,
                    maxlength: 10,
                },


            },
            messages: {},
            errorPlacement: function(error, element) {
                var placement = $(element).data('error');
                if (placement) {
                    $(placement).append(error)
                } else {
                    error.insertAfter(element);
                }
            },

            submitHandler: function(form) {
                // return false;
                $("#addBEbtn").attr('disabled', true);

                var formData = new FormData($("#add_BE_Data")[0]);
                // $("#preloader").addClass('loaded');
                $.ajax({
                    url: "{{ url('add-user') }}",
                    type: 'POST',
                    data: formData,
                    processData: false,
                    contentType: false,
                    dataType: "json",
                    success: function(response) {
                        var flag = 0;

                        if (response.Status == 1) {
                            $.notify(response.msg, "success");
                            setTimeout(function() {
                                location.reload();
                            }, 300);
                        } else if (response.Status == 0) {
                            $.notify(response.msg, "error");
                            $("#addBEbtn").attr('disabled', false);
                        } else {
                            $.notify(response.msg, "error");
                        }
                    },
                    error: function(data) {
                        // Error...
                        var errors = $.parseJSON(data.responseText);
                        $.notify("The given data was invalid.", "error");
                        $("#addBEbtn").attr('disabled', false);
                    }
                }); //ajax
            }
        });
        $('#edit_be_data').validate({ // initialize the plugin
            ignore: ".ignore",
            rules: {
                SMPossionCode: {
                    required: true,


                },
                RBMPossionCode: {
                    required: true,


                },
                vPerentPositionCode: {
                    required: true,


                },
                vPositionCode: {
                    required: true,
                    number: true,

                },
                vEmpCode: {
                    required: true,
                    number: true,

                },
                vUserName: {
                    required: true,

                },
                vHQ: {
                    required: true,
                },
                vEmail: {
                    required: true,
                },
                vMobile: {
                    required: true,
                    number: true,
                    minlength: 10,
                    maxlength: 10,
                },


            },
            messages: {},
            errorPlacement: function(error, element) {
                var placement = $(element).data('error');
                if (placement) {
                    $(placement).append(error)
                } else {
                    error.insertAfter(element);
                }
            },

            submitHandler: function(form) {
                // return false;
                $("#addBEbtn").attr('disabled', true);

                var formData = new FormData($("#edit_be_data")[0]);
                // $("#preloader").addClass('loaded');
                $.ajax({
                    url: "{{ url('update-user') }}",
                    type: 'POST',
                    data: formData,
                    processData: false,
                    contentType: false,
                    dataType: "json",
                    success: function(response) {
                        var flag = 0;

                        if (response.Status == 1) {
                            $.notify(response.msg, "success");
                            setTimeout(function() {
                                location.reload();
                            }, 300);
                        } else if (response.Status == 0) {
                            $.notify(response.msg, "error");
                            $("#addBEbtn").attr('disabled', false);
                        } else {
                            $.notify(response.msg, "error");
                        }
                    },
                    error: function(data) {
                        // Error...
                        var errors = $.parseJSON(data.responseText);
                        $.notify("The given data was invalid.", "error");
                        $("#addBEbtn").attr('disabled', false);
                    }
                }); //ajax
            }
        });
    </script>

    <script type="text/javascript">
        $(function() {

            var start = moment().subtract('Year').startOf('Year');
            var end = moment().subtract('Year').endOf('Year');

            function cb(start, end) {
                $('#reportrange span').html(start.format('MMMM D, YYYY') + ' - ' + end.format('MMMM D, YYYY'));
            }

            $('#reportrange').daterangepicker({
                startDate: start,
                endDate: end,
                ranges: {
                    'Today': [moment(), moment()],
                    'Yesterday': [moment().subtract(1, 'days'), moment().subtract(1, 'days')],
                    'Last 7 Days': [moment().subtract(6, 'days'), moment()],
                    'Last 30 Days': [moment().subtract(29, 'days'), moment()],
                    'This Month': [moment().startOf('month'), moment().endOf('month')],
                    'Last Month': [moment().subtract(1, 'month').startOf('month'), moment().subtract(1,
                        'month').endOf('month')]
                }
            }, cb);

            cb(start, end);

        });
        $(document).ready(function() {
            $('#datatable').DataTable({
                "scrollX": true
            });
        });

        function readURL(input) {
            if (input.files && input.files[0]) {
                var reader = new FileReader();

                reader.onload = function(e) {
                    $('#file_upload')
                        .attr('src', e.target.result);
                };
                reader.readAsDataURL(input.files[0]);
            }
        }
    </script>


    <script>
        function changeStatus(id) {
            $.ajax({
                url: "{{ url('changeuserStatus') }}",
                type: 'POST',
                data: {
                    "_token": "{{ csrf_token() }}",
                    iUserID: id,
                },
                success: function(response) {

                    $.notify("Status updated Successfully", "success");

                    $('#user_datatable').DataTable().ajax.reload();
                }
            });
        }
    </script>


    <script>
        $(document).on("click", ".editdata", function() {
            var user_id = $(this).data('cid');
            $.ajax({
                url: "{{ url('/get-be-edit-data') }}",
                type: "POST",
                data: {
                    iUserID: user_id,
                    _token: '{{ csrf_token() }}'
                },
                success: function(result) {
                    $("#edit_SMPossionCode").val(result.user.SMPositionCode).trigger('change');
                    $("#edit_RBMPossionCode").val(result.user.RBMPositionCode).trigger('change');
                    $("#edit_vPerentPositionCode").val(result.user.vPerentPositionCode).trigger(
                        'change');
                    $("#edit_vPositionCode").val(result.user.vPositionCode);
                    $("#edit_vEmpCode").val(result.user.vEmpCode);
                    $("#edit_vUserName").val(result.user.vUserName);
                    $("#edit_vHQ").val(result.user.vHQ);
                    $("#edit_vEmail").val(result.user.vEmail);
                    $("#edit_vMobile").val(result.user.vMobile);
                    $("#iUserID").val(result.user.iUserID);
                }
            })
        });


        function exportdata() {
            $('#loader').show();
            $.ajax({
                type: "POST",
                url: '{{ url('be-export') }}',
                //  async: false,
                headers: {
                    "X-CSRF-TOKEN": $('meta[name="csrf-token"]').attr("content"),
                },
                data: {
                    Parent_Filter: $('#Parent_Filter option:selected').val(),
                    SMFilter: $('#SMFilter option:selected').val(),
                    RBMFilter: $('#RBMFilter option:selected').val(),

                },
                success: function(result, status, xhr) {
                    var disposition = xhr.getResponseHeader('content-disposition');
                    var matches = /"([^"]*)"/.exec(disposition);
                    var filename = (matches != null && matches[1] ? matches[1] : 'User_BE.csv');
                    // The actual download
                    var blob = new Blob([result], {
                        type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'
                    });
                    var link = document.createElement('a');
                    link.href = window.URL.createObjectURL(blob);
                    link.download = filename;
                    document.body.appendChild(link);
                    link.click();
                    document.body.removeChild(link);
                    $('#loader').hide();
                }
            });
        }
    </script>