@extends('admin.layout.master')
@section('title', __('obs.housekeeping_task_report'))
@section('custom_style')
    <style>
        .open {
            right: 0 !important;
        }
        .dataTables_filter {
            display: none;
        }
    </style>
@endsection
@section('content')
    <div class="card sina-card">
        @include('admin.layout.title_header', ['title'=>__('obs.house_keeping').' '.__('obs.task').' '.__('obs.report')])
        <div class="card-body" style="padding-bottom:0">
                <div class="row justify-content-end m-0 pt-2"  style="">
                    @php
                        $status_types=[1=>'Ready',2=>'In Use',3=>'Dirty',4=>'Task Asigned'];
                    @endphp
                    @if($report_info['type']==1)
                    <div class="col-md-3 col-12 d-flex flex-wrap pr-0 mb-1">
                        <label for="status_type">{{__('obs.status_type')}}</label>
                        <select class="select_2" name="status_type" id="status_type" style="min-width: 100%;">
                            <option value="0">{{ __('obs.all') }}</option>
                            @forelse ($status_types as $k=>$v)   
                                <option value="{{$k}}">{{ $v }}</option>
                            @empty
                            @endforelse
                        </select>
                    </div>
                    @endif
                    <div class="col-md-3 col-12 d-flex flex-wrap pr-0 mb-1">
                        <label for="admin_id">{{__('obs.assign_to')}}</label>
                        <select name="admin_id" id="admin_id" style="width: 100%" class="form-control select_2">
                            <option value="0">{{ __('obs.all') }}</option>
                            @forelse ($admins as $admin)
                                <option value="{{$admin->id}}">{{$admin->name}}</option>
                            @empty
                            @endforelse
                        </select>
                    </div>
                    @if($report_info['type']==1)
                    <div class="col-md-3 col-12 d-flex flex-wrap pr-0 mb-1">
                        <label for="task_type">{{__('obs.task_type')}}</label>
                        <select class="select_2" name="task_type" id="task_type" style="min-width: 100%;">
                            <option value="0">{{ __('obs.all') }}</option>
                            <option value="3">{{ __('obs.a') }}</option>
                            <option value="2">{{ __('obs.b') }}</option>
                            <option value="1">{{ __('obs.c') }}</option>
                        </select>
                    </div>
                    <div class="col-md-3 col-12 d-flex flex-wrap pr-0 mb-1">
                        <label for="unit_type">{{__('obs.unit_type')}}</label>
                        <select class="select_2" name="unit_type" id="unit_type" style="min-width: 100%;">
                            <option value="0">{{ __('obs.all') }}</option>
                            <option value="3">{{ __('obs.q') }}</option>
                            <option value="2">{{ __('obs.r') }}</option>
                            <option value="1">{{ __('obs.t') }}</option>
                        </select>
                    </div>
                    <div class="col-md-3 col-12 d-flex flex-wrap pr-0 mb-1">
                        <label for="priority">{{__('obs.priority')}}</label>
                        <select class="select_2" name="priority" id="priority" style="min-width: 100%;">
                            <option value="0">{{ __('obs.all') }}</option>
                            <option value="3">{{ __('obs.high') }}</option>
                            <option value="2">{{ __('obs.medium') }}</option>
                            <option value="1">{{ __('obs.low') }}</option>
                        </select>
                    </div>
                    @endif
                    <div class="col-md-6 col-12 d-flex flex-wrap pr-0 mb-1">
                            <label for="cost_id">{{__('obs.date').' '.__('obs.range')}}</label>
                            <div class="input-group-append d-flex">
                                {!!getDateInput('start_date','start_date',Request()->start_date)!!}
                                <label class="input-group-text" style="width:30px;height: 24px; margin-left: -2px; margin-right: -2px">{{__('obs.date_to')}}</label>
                                {!!getDateInput('end_date','end_date',Request()->end_date)!!}
                                <div class="input-group-append">
                                    <button type="button" onclick="filterReportData()" style="max-height: 30px;" class="btn btn-sm btn-danger">
                                    <span class="fa fa-search"></span>
                                    </button>
                                </div>
                            </div>
                    </div>
                    
                </div>
        </div>
        <div class="card-body">
            <div class="table-responsive cl-table-container" style="height: 450px"  id="print">
                <table id="apply_data_table" class="table cl-table table-hover table-bordered">
                    <thead>
                        <tr>
                            
                            <th>#</th>
                            @if($report_info['type']==1)
                                <th>{{__('obs.task')}} {{__('obs.no')}}</th>
                                <th>{{__('obs.unit_type')}}</th>
                                <th>{{__('obs.assign')}} {{__('obs.date')}}</th>
                                <th>{{__('obs.priority')}}</th>
                                <th>{{__('obs.task_type')}}</th>
                                <th>{{__('obs.note')}}</th>
                                <th>{{__('obs.house_keeping')}}</th>
                                <th>{{__('obs.task')}} {{__('obs.status')}}</th>
                            @else
                                <th>{{__('obs.house_keeping')}}</th>
                                <th>{{__('obs.task')}} {{__('obs.no')}}</th>
                                <th>{{__('obs.assign')}} {{__('obs.date')}}</th>
                                <th>{{__('obs.unit_type')}}</th>
                                <th>{{__('obs.task_type')}}</th>
                                <th>{{__('obs.start')}} {{__('obs.date')}}</th>
                                <th>{{__('obs.end')}} {{__('obs.date')}}</th>
                                <th>{{__('obs.duration')}}</th>
                            @endif
                        </tr>
                    </thead>
                    <tbody id="list_body">

                    </tbody>
                </table>
            </div>
        </div>
    </div>
      
    @include('admin.global.loader')    
@endsection
@section('script')
<script>
    
    let warehouse_id=@json(current_warehouse());
    let route_name=@json(route($report_info['route_name']));
    let type=@json($report_info['type']);
    $('#apply_data_table').dataTable({
            "paging": false,
    });
    $('.select_2').select2();


    const filterReportData=()=>{
        let int_data_param = {
            status_type:$('#status_type').val(),
            admin_id:$('#admin_id').val(),
            task_type:$('#task_type').val(),
            unit_type:$('#unit_type').val(),
            priority:$('#priority').val(),
            start_date:$('#start_date').val(),
            end_date:$('#end_date').val(),
            type:type,
        }
        loadListData(int_data_param);
    }
    const loadListData=(int_data_param)=>{
        const setFormData = data => {
            $('#loader').hide();
            $('#apply_data_table').dataTable().fnDestroy();
            $('#list_body').html(data);
            $('#apply_data_table').DataTable({
                destroy: true,
                paging: false,
                info: false,
                searchable:false,
            });
        }
        let link = route_name;
        ajaxCall(link, 'GET', int_data_param, setFormData);
    }

</script>

@endsection