@extends('layouts.user')
@section('page-title', 'Aifola Express Report')
@section('page-title-body', 'Aifola Express Report')
@section('active-link-10', 'active-link')

@section('main-theme')
    <div id="dashboard-container-view">
        <h2>
            <span>Reports</span>

            <button type="button" class="btn-h2" id="btnaddstaff"><i class="far fa-plus-square" style="margin:0px 8px 0px 0px"></i>Filter</button>
            <button type="button" class="btn-h2 btn-h2-active" id="btnstafflist"><i class="far fa-list-alt" style="margin:0px 8px 0px 0px"></i>Report</button>

        </h2>
        <div class="block-cont"></div>
        <article class="display-block" id="staff-list">

            @if(isset($report))

                    <div class="table-responsive">
                        <table class="table table-hover align-middle" id="table-first">
                            <thead class="thead-light">
                                <tr><th>Depature Date</th><th>Time</th><th>Route</th><th>VIA</th><th>Bus Type</th><th>Vehicle Number</th>
                                    <th>Fare</th><th>Customer Name</th><th>Customer Phone</th>
                                    <th>Ticket Number</th><th>Seat Number</th><th>Boarding Point</th>
                                </tr>
                            </thead>
                            <tbody>
                                @foreach($report as $data)
                                @if($data->payment_mode == "Mobile" && $data->payment_status == "Paid" )
                                <tr>
                                    
                                    <td>{{$data->ddate}}</td><td>{{$data->dtime}}</td>
                                    <td>{{$data->rfrom}} {{$data->rend}}</td><td>{{$data->via}}</td>
                                    <td>{{$data->bus_type}}</td><td>{{$data->registration_number}}</td>
                                    <td>{{$data->fare}}</td><td>{{$data->cname}}</td>
                                    <td>{{$data->cphone}}</td><td>{{$data->ticket_number}}</td>
                                    <td>{{$data->sit_number}}</td><td>{{$data->boarding_point}}</td>
                                </tr>
                                @elseif($data->payment_mode != "Mobile")
                                <tr>
                                    
                                    <td>{{$data->ddate}}</td><td>{{$data->dtime}}</td>
                                    <td>{{$data->rfrom}} {{$data->rend}}</td><td>{{$data->via}}</td>
                                    <td>{{$data->bus_type}}</td><td>{{$data->registration_number}}</td>
                                    <td>{{$data->fare}}</td><td>{{$data->cname}}</td>
                                    <td>{{$data->cphone}}</td><td>{{$data->ticket_number}}</td>
                                    <td>{{$data->sit_number}}</td><td>{{$data->boarding_point}}</td>
                                </tr>
                                @endif
                                @endforeach
                            </tbody>
                        </table>
                    </div>

            @else

                    <div class="table-responsive">
                        <table class="table table-hover align-middle" id="table-first">
                            <thead class="thead-light">
                                <tr><th>Depature Date</th><th>Time</th><th>Route</th><th>VIA</th><th>Bus Type</th><th>Vehicle Number</th>
                                    <th>Fare</th><th>Customer Name</th><th>Customer Phone</th>
                                    <th>Ticket Number</th><th>Seat Number</th><th>Boarding Point</th>
                                </tr>
                            </thead>
                            <tbody>
                                @foreach($booking as $data)
                                @if($data->payment_mode == "Mobile" && $data->payment_status == "Paid" )
                                <tr>
                                    <td>{{$data->ddate}}</td><td>{{$data->dtime}}</td>
                                    <td>{{$data->rfrom}} {{$data->rend}}</td><td>{{$data->via}}</td>
                                    <td>{{$data->bus_type}}</td><td>{{$data->registration_number}}</td>
                                    <td>{{$data->fare}}</td><td>{{$data->cname}}</td>
                                    <td>{{$data->cphone}}</td><td>{{$data->ticket_number}}</td>
                                    <td>{{$data->sit_number}}</td><td>{{$data->boarding_point}}</td>
                                </tr>
                                @elseif($data->payment_mode != "Mobile")
                                <tr>
                                    <td>{{$data->ddate}}</td><td>{{$data->dtime}}</td>
                                    <td>{{$data->rfrom}} {{$data->rend}}</td><td>{{$data->via}}</td>
                                    <td>{{$data->bus_type}}</td><td>{{$data->registration_number}}</td>
                                    <td>{{$data->fare}}</td><td>{{$data->cname}}</td>
                                    <td>{{$data->cphone}}</td><td>{{$data->ticket_number}}</td>
                                    <td>{{$data->sit_number}}</td><td>{{$data->boarding_point}}</td>
                                </tr>
                                @endif
                                @endforeach
                            </tbody>
                        </table>
                    </div>

            @endif
        </article>

        <article class="display-none" id="add-staff">
            <div id="sales-reports">
            <form action="{{route('dashboard.reports')}}" method="GET" enctype="multipart/form-data">
                @csrf
                <section class="view-col-half-left">
                    <section class="view-col-half-left">
                        <h5>Filter by Route</h5>
                        <select name="routes" class="form-control" id="salespoint">
                            <option value="0">All</option>
                            @foreach($route as $data)
                            <option value="{{$data->id}}">{{$data->start_from}} {{$data->end_to}}</option>
                            @endforeach
                        </select>
                    </section>
                    <section class="view-col-half-right">
                        <h5>Filter by Passenger</h5>
                        <select name="customer" class="form-control" id="salespoint">
                            <option value="0">All</option>
                            @foreach($customers as $data)
                            <option value="{{$data->id}}">{{$data->name}}</option>
                            @endforeach
                        </select>
                    </section>
                </section>
                <section class="view-col-half-right">
                    <section class="view-col-half-left">
                        <h5>Filter by Buses</h5>
                        <select name="buses" class="form-control">
                            <option value="0">All</option>
                            @foreach($buses as $data)
                            <option value="{{$data->registration_number}}">{{$data->registration_number}}</option>
                            @endforeach
                        </select>
                    </section>
                    <section class="view-col-half-right">
                        <h5>Filter by staff</h5>
                        <select name="staff" class="form-control" id="salespoint">
                            <option value="0">All</option>
                            @foreach($staff as $data)
                            <option value="{{$data->id}}">{{$data->name}}</option>
                            @endforeach
                        </select>
                    </section>
                </section>
                <div class="filter">
                    <section class="view-col-half-left">
                        <section class="view-col-full">
                        <h5>Filter by date</h5>
                        <select name="bydate" class="form-control" id="selectdates">
                            <option value="date">Date</option>
                            <option value="range">Date Range</option>
                            <option value="year">Year</option>
                            <option value="month">Month</option>
                        </select>
                        </section>
                    </section>
                    <section class="view-col-half-right display-block" id="date">
                        <section class="view-col-full">
                            <h5 class="date-selected">Enter created date</h5>
                            <input type="date" name="singledate" class="form-control">
                        </section>
                    </section>
                    <section class="view-col-half-right display-none" id="daterange">
                        <section class="view-col-half-left">
                            <h5 class="date-selected">From date</h5>
                            <input type="date" name="min" class="form-control"></section>
                        <section class="view-col-half-right">
                            <h5 class="date-selected">To Date</h5>
                            <input type="date" name="max" class="form-control"></section>
                    </section>
            
                    <section class="view-col-half-right display-none" id="dateyear">
                        <section class="view-col-full">
                            <h5 class="date-selected">Select Year</h5>
                            <select name="year" class="form-control">
                                @php
                                    $year = date('Y');
                                    for($init = 2020; $year>=$init; $year--){
                                        echo "<option value='$year'>$year</option>";
                                    }
                                @endphp
                            </select>
                        </section>
                    </section>
                    
                    <section class="view-col-half-right display-none" id="month">
                        <section class="view-col-half-left">
                            <h5>Month</h5>
                            <select name="month" class="form-control">
                                <option value="01">January</option><option value="02">February</option><option value="03">March</option>
                                <option value="04">April</option><option value="05">May</option><option value="06">June</option>
                                <option value="07">July</option><option value="08">August</option><option value="09">September</option>
                                <option value="10">October</option><option value="11">November</option><option value="12">December</option>
                            </select>
                        </section>
                        <section class="view-col-half-right">
                            <h5 class="date-selected">Select Year</h5>
                            <select name="monthyear" class="form-control">
                                @php
                                    $year = date('Y');
                                    for($init = 2020; $year>=$init; $year--){
                                        echo "<option value='$year'>$year</option>";
                                    }
                                @endphp
                            </select>
                        </section>
                    </section>
            
                    <section class="view-col-full">
                        <button type="submit" class="btn bg-success w-25 text-white">Filter Report</button>
                    </section> 
                </div>
            </form>
        </div>
        <div id="customers-reports">

        </div>

        <div class="block-cont"></div>

        <div class="block-cont"></div>
        </article>

        
        <div class="block-cont"></div>
    </div>


@endsection

<!-- js script -->
@push('scripts')
<script>
    $(function(){

        //add-staff

        $(document).on('click', '#btnaddstaff', function(){
            $('#add-staff').css({"display":"block"});
            $('#staff-list').css({"display":"none"});

            $('h2 button').removeClass('btn-h2-active');
            $(this).addClass('btn-h2-active');

            $('h2 span').empty();
            $('h2 span').text("Filter Reports");
        });

        
        $(document).on('click', '#btnstafflist', function(){
            $('#add-staff').css({"display":"none"});
            $('#staff-list').css({"display":"block"});

            $('h2 button').removeClass('btn-h2-active');
            $(this).addClass('btn-h2-active');

            $('h2 span').empty();
            $('h2 span').text("Reports");
        });

        $(document).on('change', '#region', function(){

            let region_id = $(this).val();
            $.ajax({
                url:"../get-districts/"+region_id,
                method:"get",
                dataType:"text",
                success:function(data){
                    //console.log(data);
                    var json = $.parseJSON(data);
                    $('#district').empty();
                    $('#district').append("<option value='invalid-1'>Select district</option>");
                    for (var i = 0; i < json.length; ++i) {
                        $('#district').append("<option value=" + json[i].id + ">" + json[i].name + "</option>");
                    }
                }
            });

        });



        $(document).on('change', '#selectdates', function(){
                var selecteddate = $(this).val();

                if(selecteddate=='date'){
                   $("#daterange, #dateyear, #month").css({"display":"none"});
                   $("#date").css({"display":"block"});
                }else if(selecteddate=='range'){
                   $("#date, #dateyear, #month").css({"display":"none"});
                   $("#daterange").css({"display":"block"});
                }else if(selecteddate=='year'){
                   $("#date, #daterange, #month").css({"display":"none"});
                   $("#dateyear").css({"display":"block"});
                }else if(selecteddate=='month'){
                   $("#date, #daterange, #dateyear").css({"display":"none"});
                   $("#month").css({"display":"block"});
                }
            });

            $(document).on('change', '#salespoint', function(){
                var salespoint = $(this).val();
                if(salespoint == "singleagent"){
                    $("#agent-container-view").show();
                }else{
                    $("#agent-container-view").hide();
                }
            });



            $('#table-first').DataTable({
                "pageLength": 10,
                dom: 'Bfrtip',
                buttons: [
                    'csv',
                    'print',
                    'copy'
                ]
            });

            $('#regionselect, #branchselect, #agentselect').select2();
    });

</script>
@endpush