@if(auth()->user()->hasRole('admin') || auth()->user()->can('Can Launch One-Off Review'))
<style>
    .multiselect-container.dropdown-menu.show {

        -webkit-box-shadow: 0px -2px 5px 0px rgba(0,0,0,0.75);
        -moz-box-shadow: 0px -2px 5px 0px rgba(0,0,0,0.75);
        box-shadow: 0px -2px 5px 0px rgba(0,0,0,0.75);
    }
    .multiselect-container span input {
        display: none;
    }
    .modal-fullscreen {
        width: 100vw !important;
        max-width: none !important;
        height: 100% !important;
        margin: 0 !important;
    }
    .modal-fullscreen .modal-content {
        height: 100% !important;
        border: 0 !important;
        border-radius: 0 !important;
        padding: 0 45px;
    }
    .modal-fullscreen .modal-body {
        overflow-y: auto !important;
    }
</style>

<button type="button" class="btn btn-sm btn-primary m-1 float-right" data-toggle="modal" data-target=".create_new_modal" id="createOneOffReviewBtn"> <i class="fa-solid fa-plus"></i> Launch one-off review</button>


<div class="modal fade create_new_modal" id="one_modal" tabindex="-1" role="dialog" aria-hidden="true">
    <div class="modal-dialog modal-md">

        <div class="modal-content">
            <form action="{{route('reviews.store_cycle')}}" method="post" name="frmOne" class="create-items needs-validation ajaxSubmitRSC" novalidate>
                @csrf
                <input type="hidden" name="action" id="action" value="launch_review_form">
                <div class="modal-body">
                    <div class="row">
                        <div class="col-md-12 form-group mb-3">
                            <h5 for="staffs" class="font-weight-bold">Who are you reviewing?</h5>
                            <select name="staffs" class="form-control mutiselect-staffs search_init" style="display: none" id="staffs">
                                <option value="">-- Select --</option>
                                @if(isset($deptUsers))
                                @foreach($deptUsers as $userGroup=>$userArr)
                                <optgroup label="Everyone in the {{$userGroup}} dept" class="font-weight-bold">
                                    @foreach($userArr as $userID=>$userName)
                                    <option value="{{$userID}}" >{{$userName}}</option>
                                    @endforeach
                                </optgroup>
                                @endforeach
                                @endif
                            </select>
                        </div>
                        <div class="col-md-12 form-group mb-3">
                            <h5 for="staffs" class="font-weight-bold">Which review template would you like to select</h5>
                            <select name="review" class="form-control" id="reviews_id" required="required">
                                <option value="">-- Select Template --</option>
                                @if(isset($reviewList))
                                @foreach($reviewList as $reviewID=>$review)
                                <option value="{{$reviewID}}" >{{$review}}</option>
                                @endforeach
                                @endif
                            </select>
                        </div>

                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>
                    <button type="submit" class="btn btn-primary btn-success">Launch review form</button>
                </div>
            </form>
                        <button style="display:none;" type="button"  class="" id='quizForm' data-toggle="modal" data-target="#reviewModal" data-whoreviewid="0" data-route="{{route('reviews.review',"whoreviewid")}}?add=y&profile={{$profile}}"">Start Review</button>
        </div>
    </div>
</div>
<div class="modal fade" tabindex="-1" id="reviewModal">
    <div class="modal-dialog modal-fullscreen">
        <!-- The form will load here --> 
    </div>
</div>
@section('bottom-js')

<script>
    $(document).ready(function () {
        $selectMulti=$('.mutiselect-staffs').multiselect({maxHeight: 200, dropUp: true, widthSynchronizationMode: 'always', buttonWidth: '100%', enableCaseInsensitiveFiltering: true, enableClickableOptGroups: true, filterPlaceholder: 'Search...',

        });
        var selectProfile="0";
        $selectMulti.multiselect('select', [selectProfile]);
        
        $(document).on('submit', '.ajaxSubmitRSC', function (event) {
            event.preventDefault();
            $(this).find('button[type=submit]').prop('disabled', true);
            var form = $(this);
            var url = form.attr('action');
            var form_data = form.serialize();
            $.ajax({
                url: url,
                type: 'POST',
                data: form_data,
                success: function (data) {
                    var currentVal = "{{route('reviews.review',"whoreviewid")}}?add=y&profile={{$profile}}";
                    
                    var newURL = currentVal.replace("whoreviewid", parseInt(data.success));
                    
                    $("#quizForm").attr('data-route', newURL);
                    $("#quizForm").attr('data-whoreviewid', data.success);
                    $('.create_new_modal').modal('hide');
                    $('#quizForm').trigger('click');
                    $("button").prop("disabled", false);
                },
                error: function (jqXHR, textStatus, errorThrown) {
                    var err = eval("(" + jqXHR.responseText + ")");
                    var showError = '';
                    for (var x in err.errors) {
                        showError += err.errors[x] + "<br/>";
                    }
                    toastr.error(showError, "Error", {
                        closeButton: !0
                    });
                    $("button").prop("disabled", false);
                }
            });
        });
        
    });
</script>
@endsection
@endif