@extends('Layouts.hms_master_full_width')
@section('content')

<style>
    .authorize-button{
        background: #52BE80;
    }
    #ui-datepicker-div {
        z-index:11111;
    }
    
    .modal-lg {
        max-width: 70%;
    }
    .roomBox{
        border: 1px solid #a3afb7;
        padding: 5px 5px 5px 5px;
        margin: 5px 10px;
        background-color: #d1ebcf;
    }
</style>

{{-- <form enctype="multipart/form-data" method="post" id="filterFormId">
    @csrf
    @php
        $elementArray = array();
        $elementArray['building'] = ['label' => 'Building', 'type' => 'select', 'id' => 'building_id', 'name' => 'building_id', 'onload' => true];
        $elementArray['floor'] = ['label' => 'Floor', 'type' => 'select', 'id' => 'floor_id', 'name' => 'floor_id','default_option' => 'All'];
@endphp


    @include('elements.report.common_filter.filter_options', ['elements' => $elementArray])
</form> --}}

<div class="panel w-full">
    <div class="panel-body">
        @include('HMS.FloorWiseRoomView.filter')
        
    </div>
</div>

<div class="w-full show" style="display: none;">
    <div class="panel">
        <div class="panel-body panel-search pt-2">
            <div class="ExportDiv" id="reportingDiv">
            </div>
        </div>
    </div>
</div>


<script>
    $(document).ready(function() {
        $('.httpRequest').hide();
    });

    function loadData(){
        
        $("#reportingDiv").empty();
        $("#reportingDiv").load('{{ url()->current() }}/loadData' + '?' + $("#filterFormId").serialize());
    }

    // $("#filterFormId").submit(function (event) {
    //     event.preventDefault();

    //     if($('#building_id').val() == ''){
    //         swal({
    //             icon: 'warning',
    //             title: 'Warning',
    //             text: 'Please Select Building !!',
    //         });
    //     }

    //     else if($('#floor_id').val() == ''){
    //         swal({
    //             icon: 'warning',
    //             title: 'Warning',
    //             text: 'Please Select Floor !!'
    //         });
    //     }
    //     else{
                
    //         $("#reportingDiv").empty();
    //         $("#reportingDiv").load('{{ url()->current() }}/loadData' + '?' + $("#filterFormId").serialize());
    //     }
    $("#searchButton").click(function (event) {
        event.preventDefault();

        if($('#building_id').val() == ''){
            swal({
                icon: 'warning',
                title: 'Warning',
                text: 'Please Select Building !!',
            });
        }

        else if($('#floor_id').val() == ''){
            swal({
                icon: 'warning',
                title: 'Warning',
                text: 'Please Select Floor !!'
            });
        }
        else{
                
            $("#reportingDiv").empty();
            $("#reportingDiv").load('{{ url()->current() }}/loadData' + '?' + $("#filterFormId").serialize());
        }

        
    });
    // $('.httpRequest').hide(); //Hide new entry button
    //     $(document).ready(function(event){

    //         $('#searchButton').click(function () {
    //             $('#filterFormId').submit(function (event) {
    //                 event.preventDefault();
    //                 // $("#reportingDiv").empty();
    //                 var flag = true;

    //                 if(flag){
    //                     $('.show').show('slow');
    //                     $("#reportingDiv").load('{{ url()->current() }}/loadData' + '?' + $("#filterFormId").serialize());
    //                 }
    //             });
    //         })

            
            
    //     });
    function fnGetPassportFilter() {
        let messege = "";
        let floor = $('#floor_id').val();

        if(!floor){
            messege = "Floor ";
        }
    
        return messege;
        
    }
    
    $("#filterFormId").submit(function (event) {

        event.preventDefault();
        let messege = fnGetPassportFilter();
        if(messege){
            swal({
                icon: 'warning',
                title: 'Warning',
                text: 'Please Select ' + messege
            });
            return false;
        }
        loadData();
       
    });
</script>

@endsection