@extends('layouts.master')

@section('title')
    @lang('translation.Chat')
@endsection

@section('content')
    <style>
        .active-user {
            background: #eef0fc;
            border-radius: 8px;
        }
    </style>
@section('css')
    <!--datatable  css-->
    <link rel="stylesheet" href="https://cdn.datatables.net/1.11.5/css/dataTables.bootstrap5.min.css" />
    <link rel="stylesheet" href="https://cdn.datatables.net/buttons/2.2.2/css/buttons.dataTables.min.css">
@endsection
<div class="row ">
    <div class="col-md-12 bg-white">
        <form id='searchform' action="{{ route('all_report') }}" method="post">
            @csrf
            <div class="row p-3 p-4">
                <h4 class='px-2 p-2 font-weight-bold'>@lang('translation.Visitor_History')</h4>

                <div class="col-md-6">
                    <div class="mb-3 row">
                        <label for="fdate" class="col-md-4 col-form-label">@lang('translation.From_Date')</label>
                        <div class="col-md-8">
                            <input type="date" class="form-control" name="from_date" id="from_date"
                            value="{{ request('from_date', date('Y-m-d')) }}">
                        </div>
                    </div>
                </div>
                <div class="col-md-6">
                    <div class="mb-3 row">
                        <label for="tdate" class="col-md-4 col-form-label">@lang('translation.To_Date')</label>
                        <div class="col-md-8">
                            <input type="date" class="form-control" name="to_date" id="to_date"
                            value="{{ request('to_date', date('Y-m-d')) }}">
                        </div>
                    </div>
                </div>
                <div class="col-md-12">
                    <div class="bg-white rounded">
                        <h4 class=" py-3">
                            {{-- @lang('translation.Visitor_History') --}}
                        </h4>
                        <div class="d-flex justify-content-end pb-3 expert-btn-div">
                            <button type="button" class="btn btn-primary " onclick="downloadExcel()"><i
                                    class="fa-solid fa-table-cells"></i></button>
                            <button type="button" class="btn btn-warning mx-2" onclick="downloadPDF()"><i
                                    class="fa-solid fa-file-pdf"></i>
                            </button>
                        </div>
                        {{-- <table class="table table-bordered yajra-datatable"> --}}
                        <table id='exportTable' class="table table-bordered yajra-datatable">
                            <thead>
                                <tr>
                                    <th>@lang('translation.No')</th>
                                    <th>@lang('translation.Store')</th>
                                    <th>@lang('translation.Location')</th>
                                    <th>@lang('translation.Services')</th>
                                    <th>@lang('translation.Visitor_Count')</th>
                                    <th>@lang('translation.Completed')</th>
                                    <th>@lang('translation.Waiting')</th>
                                    <th>@lang('translation.Serving')</th>
                                    <th>@lang('translation.Canceled')</th>
                                    <!-- <th>@lang('translation.Add_member')</th> -->
                                    <th>@lang('translation.No_show')</th>
                                    <!-- <th>@lang('translation.status')</th> -->
                                    <!-- <th class='d-none'>@lang('translation.Label')</th> -->
                                </tr>
                            </thead>
                            <tbody id='tablevalue'>
                                @foreach ($data as $key=>$d)
                                <tr>
                                    <td>{{$key+1}}</td>
                                    <td>{{$d->company}}</td>
                                    <td>{{$d->location}}</td>
                                    <td>{{$d->services}}</td>
                                    <td>{{$d->vis_count}}</td>
                                    <td>{{$d->servcom}}</td>
                                    <td>{{$d->serving}}</td>
                                    <td>{{$d->startser}}</td>
                                    <td>{{$d->cancl}}</td>
                                    <td>{{$d->noshow}}</td>
                                    
                                    <th class='d-none'>@lang('translation.Label')</th>
                                </tr>
                                @endforeach
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </form>
    </div>
</div>

<script src="https://cdn.datatables.net/1.10.24/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/1.10.24/js/dataTables.bootstrap5.min.js"></script>
<script>
     $('#from_date, #to_date').on('change', function() {
        $('#searchform').submit();
    });
</script>
<script>
    $('.yajra-datatable').DataTable({
        "lengthMenu": [
            [10, 25, 50, 100, -1],
            [10, 25, 50, 100, "All"]
        ],
    });

   
</script>
@endsection