@extends('admin.layout.master')
@section('custom_css')

@endsection
@section('content')
    <div class="card sina-card">
        <div class="card-header">
            <h5 class="font-weight-bold mb-0">{{ __('obs.allotment_room_history') }}</h5>
        </div>
        <div class="card-body">
            <div class="container-fluid">
                <div class="row">
                    <div class="col-2">
                        <label for="">{{ __('obs.allotment') }}</label>
                        <select name="allotment_id" id="allotment_id" class="form-control fd_allotment_live_search" onchange="handleAllotmentChange()"></select>
                    </div>
                    <div class="col-2">
                        <label for="">{{ __('obs.room') }}</label>
                        <select name="room_id" id="room_id" class="form-control select_2"></select>
                    </div>
                    <div class="col-2">
                        <label for="">{{ __('obs.from') }}</label>
                        <input type="text" name="from" id="from" class="form-control date_picker" value="{{ date('d-m-Y') }}">
                    </div>
                    <div class="col-2">
                        <label for="">{{ __('obs.to') }}</label>
                        <input type="text" name="to" id="to" class="form-control date_picker" value="{{ date('d-m-Y') }}">
                    </div>
                    <div class="col-1">
                        <label for="">&nbsp;</label>
                        <button type="button" class="btn btn-primary w-100" onclick="search()">{{ __('obs.search') }}</button>
                    </div>
                </div>
            </div>
        </div>
    </div>
    @include('frontdesk.report.frontdesk_common_report_setup')
    <script src="{{ asset('frontdesk/shared/fd_settings.js' . getJsVersion()) }}"></script>
@endsection

@section('script')
    <script>
        function search() {
            
            let link = "{{ route('frontdesk.reports.allotment_room_history') }}";
            let data_param = {
                allotment_id: $('#allotment_id').val(),
                room_id: $('#room_id').val(),
                from: $('#from').val(),
                to: $('#to').val(),
            };
            if(!data_param.allotment_id){
                Swal.fire('Please select allotment');
                return false;
            } else if(!data_param.room_id){
                Swal.fire('Please select room');
                return false;
            }
            callLoader();
            ajaxCustom(function (res) {
                $('#divTableDataHolder').html("{!! includeAsJsString('frontdesk.report.report_header_custom_warehouse') !!}");
                $('#divTableDataHolder').append(res.data);
                $('.dynamic_report_title').text(res.report_title);
                reportHeaderset(res.custom_store_info);
            }, 'get', link, data_param);
        }
        function handleAllotmentChange(){
            let allotment_id = $('#allotment_id').val();
            if(allotment_id){
                showLoader();
                let url = "{{ route('frontdesk.allotment.get_info') }}";
                ajaxCustom(function(data) {
                    $('#room_id').html(data.html);
                    $('#from').val(data.start_date);
                    $('#to').val(data.end_date);
                    flatpickr('#from, #to', {
                        dateFormat: "d-m-Y",
                        minDate: data.start_date,
                        maxDate: data.end_date,
                    });
                    closeLoader();
                }, "GET", url, {type: 'get_rooms', allotment_id: allotment_id});
            }
        }
    </script>
@endsection