@include('Template.header')
<link rel="stylesheet" href="{{ asset('assets/css/multiple-select.min.css') }}" />

<div class="modal fade" id="view_rbm_data" tabindex="-1" aria-labelledby="exampleModalLabel" 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">RBM Count</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="text-center mt-2" id="download_button">

                </div>
                <div class="table-responsive mt-0">
                    <table class="table table-striped text-center w-100 dataTable">
                        <thead>
                            <th>Sr. No.</th>
                            <th>RBM Name</th>
                            <th>Position Code</th>
                        </thead>
                        <tbody id="tabledataview">
                        </tbody>
                    </table>
                </div>
            </div>

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

<div class="modal fade" id="create_camp" tabindex="-1" aria-labelledby="create_camp" 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">Create Camp</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="create_camp_admin" method="POST">
                                @csrf
                                <div class="form-group col-lg-12 px-2">
                                    <label for="vCampName">Camp Name<span style="color: red;">*</span></label>
                                    <input type="text" class="form-control" id="vCampName" name="vCampName"
                                        placeholder="Enter Camp Name" />
                                </div>
                                <div class="form-group col-lg-12 px-2 new_drop_down_arrow">
                                    <label for="camp_name">RBM Name<span style="color: red;">*</span></label>

                                    <select class="js-example-basic-multiple" name="RBMiD[]" id="RBMiD" multiple
                                        style="width: 100%;">
                                        @foreach ($RBMList as $rw)
                                            <option value="{{ $rw->iUserID }}">{{ $rw->vUserName }}</option>
                                        @endforeach
                                    </select>

                                    <label id="RBMiD-error" class="error" for="RBMiD"></label>
                                </div>
                                <br><br>
                                {{-- <div class="form-group col-lg-6 px-2">
                                    <label for="lab_name">Service Provider<span style="color: red;">*</span></label>
                                    <select class="js-example-basic-single" name="iLabAssignID" id="iLabAssignID"
                                        style="width: 100%;">
                                        <option value="">Service Provider</option>
                                        @foreach ($LabList as $rw)
                                            <option value="{{ $rw->iUserID }}">{{ $rw->vUserName }}</option>
                                        @endforeach
                                    </select>
                                    <label id="iLabAssignID-error" class="error" for="iLabAssignID"></label>
                                </div>
                                <div class="form-group col-lg-6 px-2">
                                    <label for="lab_email">Lab Email ID<span style="color: red;">*</span></label>
                                    <input type="text" class="form-control" id="lab_email" name="lab_email"
                                        placeholder="Enter Email ID" />
                                </div> --}}

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

                            </form>

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

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


<div class="modal fade" id="edit_camp" tabindex="-1" aria-labelledby="edit_camp" 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 Camp</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_camp_admin" method="POST">
                                @csrf

                                <input name="edit_iCampID" id="edit_iCampID" type="hidden">
                                <div class="form-group col-lg-12 px-2">
                                    <label for="vCampName">Camp Name<span style="color: red;">*</span></label>
                                    <input type="text" class="form-control" id="edit_vCampName" name="vCampName"
                                        placeholder="Enter Camp Name" />
                                </div>
                                <div class="form-group col-lg-12 px-2 new_drop_down_arrow">
                                    <label for="camp_name">RBM Name<span style="color: red;">*</span></label>

                                    <select class="js-example-basic-multiple" name="RBMiD[]" id="edit_RBMiD" multiple
                                        style="width: 100%;">
                                        @foreach ($RBMList as $rw)
                                            <option value="{{ $rw->iUserID }}">{{ $rw->vUserName }}</option>
                                        @endforeach
                                    </select>

                                    <label id="edit_RBMiD-error" class="error" for="edit_RBMiD"></label>
                                </div>
                                {{-- <div class="form-group col-lg-6 px-2">
                                    <label for="lab_name">Service Provider<span style="color: red;">*</span></label>
                                    <select class="js-example-basic-single" name="iLabAssignID"
                                        id="edit_iLabAssignID" style="width: 100%;">
                                        <option value="">Service Provider</option>
                                        @foreach ($LabList as $rw)
                                            <option value="{{ $rw->iUserID }}">{{ $rw->vUserName }}</option>
                                        @endforeach
                                    </select>
                                    <label id="edit_iLabAssignID-error" class="error"
                                        for="edit_iLabAssignID"></label>
                                </div> --}}


                                <div class="form-group col-lg-12 px-2 text-center">
                                    <button type="submit" id="btnSubmit" class="btn btn-primary mr-2"> Submit
                                    </button>
                                    <a class="btn btn-light" onclick="$('#create_camp').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="">Create Camp </h4>

        <div class="card mt-3">
            <div class="row">
                <div class="col-xl-auto col-lg-auto text-right ml-auto my-auto my-2">
                    <a href="#" data-target="#create_camp" data-toggle="modal" class="btn btn-primary"><i
                            class="fa fa-plus mr-1"></i> Create Camp</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 display" id="camp_datatable">
                                <thead class="thead-light">
                                    <tr>
                                        <th>Sr. No.</th>
                                        <th>Action</th>
                                        <th>Camp Name</th>
                                        {{-- <th>Service Provider</th> --}}

                                        <th>RBM Count</th>
                                        <th>Date</th>

                                    </tr>
                                </thead>
                                <tbody>

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

        </div>
    </div>


    @include('Template.footer')
    <script src="{{ asset('assets/js/multiple-select.min.js') }}"></script>
    <script>
        $(document).ready(function() {
            $("#iLabAssignID").select2();
            // $("#RBMPossionCode").select2();
            // $("#ABMPossionCode").select2();
            // $("#vPerentPositionCode").select2();

            $('#create_camp').on('hidden.bs.modal', function() {
                // $("#iLabAssignID").val(null).trigger('change');
                // $("#iLabAssignID").val(null).trigger('change');

                // $("#iLabAssignID-error").html('');
                $("#vCampName-error").html('');
                $("#lab_email-error").html('');
                $("#RBMiD-error").html('');

                // $("#vPerentPositionCode-error").html('');
                // $("#vDoctorName-error").html('');
                // $("#vMslNo-error").html('');
                // $("#vEmpCode-error").html('');
                // $("#vHQ-error").html('');
                // $("#vEmail-error").html('');
                // $("#vMobile-error").html('');

                $("#vCampName").val('');
                $("#lab_email").val('');

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

            });
        });

        $('#edit_camp').on('hide.bs.modal', function() {
            var form = document.getElementById("edit_camp_admin");
            $(form).find('.form-control').removeClass('error');
            $(form).find('.error').remove();
        });




        $(".js-example-basic-multiple").multipleSelect({
            placeholder: 'RBM Name',
            filter: true
        });
        $(function() {
            var i = 1;

            var table = $('#camp_datatable').DataTable({
                scrollX: true,
                destroy: true,
                processing: true,
                serverSide: true,
                responsive: true,
                autoWidth: false,
                retrieve: true,
                ajax: {
                    url: "{{ url('create-camp-datatable') }}",
                    data: function(d) {

                        // d.eRole = 'SM';
                        // d.datefilter = $('#datefilter').val();
                        // d.webinarName = $('#webinarName option:selected').val();
                    },
                },
                columns: [{
                        data: 'DT_RowIndex',
                        name: 'DT_RowIndex',
                        orderable: false,
                        searchable: false
                    },

                    {
                        data: 'action',
                        name: 'action',
                        orderable: false,
                        searchable: false
                    },
                    {
                        data: 'vCampName',
                        name: 'vCampName'
                    },
                    // {
                    //     data: 'LABName',
                    //     name: 'LABName'
                    // },
                    {
                        data: 'count',
                        name: 'count',
                        orderable: false,
                        searchable: false
                    },

                    {
                        data: 'created_at',
                        name: 'created_at'
                    },

                ]
            });

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

            $("#clear").click(function() {
                var start = moment().subtract('Year').startOf('Year');
                var end = moment().subtract('Year').endOf('Year');
                cb(start, end);
                $('#status').val('').selectpicker("refresh");
                table.draw();
            });

        });






        function getDoctorList() {
            $.ajax({
                url: "{{ url('/get-doctor-list') }}",
                type: "POST",
                data: {
                    iBEID: $('#be_list option:selected').val(),
                    _token: '{{ csrf_token() }}'
                },
                success: function(result) {
                    $('#doctor_list').html('<option value="">Select Doctor</option>');
                    $.each(result.doctor, function(key, value) {
                        $("#doctor_list").append('<option value="' + value.iDoctorID + '">' + value
                            .vDoctorName + '(' + value.iBEPossitionCode + ')' + '</option>');
                    });
                }
            })
        }
    </script>

    <script>
        $('#create_camp_admin').validate({ // initialize the plugin
            ignore: ".ignore",
            rules: {
                vCampName: {
                    required: true,
                },
                'RBMiD[]': {
                    required: true,
                },
                // iLabAssignID: {
                //     required: true,
                // },
                // lab_email: {
                //     required: true,
                // },


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

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

                var formData = new FormData($("#create_camp_admin")[0]);
                // $("#preloader").addClass('loaded');
                $.ajax({
                    url: "{{ url('create-camp-by-admin') }}",
                    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 {
                            $.notify(response.msg, "error");
                            $("#btnSubmit").attr('disabled', false);
                        }
                    }
                }); //ajax
            }
        });
        $('#edit_camp_admin').validate({ // initialize the plugin
            ignore: ".ignore",
            rules: {
                vCampName: {
                    required: true,
                },
                'RBMiD[]': {
                    required: true,
                },
                // iLabAssignID: {
                //     required: true,
                // },



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

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

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

                        if (response == 1) {
                            $.notify("Camp Edited !", "success");
                            setTimeout(function() {
                                location.reload();
                            }, 300);
                        } else {
                            $.notify("Camp Edited !", "error");
                            $("#btnSubmit").attr('disabled', false);
                        }
                    }
                }); //ajax
            }
        });

        function changeStatus(id) {
            $.ajax({
                url: "{{ url('change-camp-Status') }}",
                type: 'POST',
                data: {
                    "_token": "{{ csrf_token() }}",
                    id: id,
                },
                success: function(data) {

                    $.notify("Status has been changed successfully !!", "success");

                    $('#camp_datatable').DataTable().ajax.reload();
                }
            });
        }
    </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
            });
        });


        $(document).on("click", ".view_rbm_data", function() {
            var user_id = $(this).data('cid');
            $.ajax({
                url: "{{ url('view-rbm-data') }}",
                type: 'POST',
                data: {
                    "_token": "{{ csrf_token() }}",
                    iCampID: user_id,
                },
                success: function(response) {
                    var tabledataview = '';
                    for (i = 0; i < response.camp.length; i++) {

                        tabledataview += "<tr>" + "<td>" + (i + 1) + "</td>" +


                            "<td>" + response.camp[i].vUserName + "</td>" +
                            "<td>" + response.camp[i].vPositionCode + "</td>" +
                            "</tr>"
                    }
                    document.getElementById("tabledataview").innerHTML = tabledataview;
                }
            });
        });
    </script>



    <script>
        $(document).on("click", ".editdata", function() {
            var iCampID = $(this).data('cid');
            $.ajax({
                url: "{{ url('/get-rbm-assigned-camp-data') }}",
                type: "POST",
                data: {
                    iCampID: iCampID,
                    _token: '{{ csrf_token() }}'
                },
                success: function(result) {
                    $("#edit_vCampName").val(result.campData.vCampName);
                    $("#edit_iCampID").val(iCampID);
                    // $("#edit_iLabAssignID").val(result.LabcampData.iLabID).trigger('change');
                    var data = result.RBMcampData;
                    //Make an array
                    var dataarray = data.split(",");
                    // Set the value
                    $("#edit_RBMiD").val(dataarray);
                    // Then refresh
                    $("#edit_RBMiD").multipleSelect("refresh");


                }
            })
        });
    </script>