@extends('layouts.adminapp')

@section('content')

{{-- Reports --}}

<div class="card mb-4">
    <div class="card-header">
        <div class="d-flex">
            <div class="mr-auto p-2 align-self-center"><h4>Reports</h4></div>
        </div>    
        <form method="POST" action="{{route('searchReports')}}">
        @csrf
        @method('post')
        <div class="border-top pt-3">
            <div class="row">
                <div class="col-lg-4 col-sm-4">
                    <div class="form-group w-30">
                        <select id="selectgrp" class="form-control @error('status_id')  @enderror" id="cbStatus" name="status_id">
                            @php
                                echo App\Http\Controllers\StatusController::StatusListForCombo(0);
                            @endphp
                        </select> 
                    </div>
                </div>

                <div class="col-lg-4 col-sm-4">             
                    <div class="form-group w-30">
                        <select id="selectgrp" class="form-control @error('datesort')  @enderror" id="cbDateSort" name="datesort" onchange="dmy_onchange(this.value)" >
                            <option value="" disabled selected>Sort by Day</option>
                            <option value="day">Day</option>
                            <option value="month">Month</option>
                            <option value="year">Year</option>
                            <option value="2">Between Two Dates</option>
                        </select> 
                    </div>
                </div> 

                <div class="col-lg-4 form-group" id="divdmy" style="display:none;">
                    <label for="txtSDate" id="lbltxtDate">Date</label>
                    <input class="form-control" type="date" name="txtSDate" id="txtSDate" oninput="view()" placeholder="dsate" />
                    <label for="txtSDate1" id="lbltxtSDate2" style="display:none;">Date2</label>
                    <input class="form-control" type="date" style="display: none;" name="txtSDate1" id="txtSDate1" oninput="view()" placeholder="dsate" />
                    <label id="lblnmbYear" for="nmbYear" style="display: none;">Year</label>
                    <input type="number" name="nmbYear" oninput="view()" id="nmbYear" value="2020" class="form-control" min="1900" max="3000" style="display: none;"/>
                </div>          
            </div>
        </div>
        <div class="d-flex justify-content-end font-weight-bold">
            <button type="submit" class="btn btn-primary"><i class="fas fa-search"></i> Search</button>
        </div>
        </form>
    </div>
    <div class="card-body">
        <div class="table-responsive" >
            <table class="table table-hover" id="search_tbl">
                <thead>
                    <tr>
                        <th>SLNO.</th>
                        <th>Order No.</th>
                        <th>Customer</th>
                        <th>Status</th>
                        <th>Duration</th>                    
                        <th colspan="">Actions</th>
                        <th></th>
                    </tr>
                </thead>
                <tbody>
                    @php $si=0; @endphp
                    @foreach($Results as $Result)
                    <tr>
                        <td>{{++$si}}</td>
                        <td>{{$Result->id}}</td>
                        <td>{{$Result->user->name}}</td>
                        <td>{{$Result->status->title}}</td>
                        <td>{{$Result->duration->title}}</td>
                        <td style="width: 150px;"><a href="{{route('detailsview',$Result->id)}}" class="btn btn-info"><i class="fa fa-edit"></i> View</a></td>   
                                             
                    </tr>
                    @endforeach
                </tbody>
            </table>
        </div>
    </div>
    <div class="card-footer">
        <div class="row">
            <div class="col-lg-6">
                <div class="d-flex justify-content-start font-weight-bold">
                <a href=""><button class="btn btn-danger">Save Pdf</button></a>     
                </div>
            </div> 
            <div class="col-lg-6">
                <div class="d-flex justify-content-end font-weight-bold">
                    <a href=""><button class="btn btn-primary">Print</button></a>    
                </div>
            </div>
        </div>            
    </div>
</div>

@endsection

<script>

function clicks() {

var items = document.getElementById("selectgrp").value;    

$.ajax({
  url: '{{ route('selectReports') }}',
  method: "get",
  data: {_token: '{{ csrf_token() }}',searchitems:items },
                          success: function (response){   

                            document.getElementById('search_tbl').innerHTML=response; 
                          
                                  }
                  });  

}




function dmy_onchange(dmy)
{
    //reset
    $('#divdmy').attr('style','display:block;');
    
    $('#lbltxtDate').attr('style','display:none;');
    $('#txtSDate').attr('style','display:none;');
    document.getElementById('lbltxtDate').innerHTML="Date";
    $('#txtSDate').attr('type','date');
    $('#lbltxtSDate2').attr('style','display:none;');    
    $('#txtSDate1').attr('style','display:none;');
    $('#lblnmbYear').attr('style','display:none;');
    $('#nmbYear').attr('style','display:none;');
    switch(dmy)
    {
        case '0':
             $('#divdmy').attr('style','display:none;');
            break;
        case 'day':
            $('#lbltxtDate').attr('style','display:block;');
            $('#txtSDate').attr('style','display:block;');
            break;
        case '2':
            $('#lbltxtDate').attr('style','display:block;');
            $('#txtSDate').attr('style','display:block;');
            $('#lbltxtSDate2').attr('style','display:block;');
            document.getElementById('lbltxtDate').innerHTML="From";
            document.getElementById('lbltxtSDate2').innerHTML="To";
            $('#txtSDate1').attr('style','display:block;');
            break;
        case 'month':
            $('#lbltxtDate').attr('style','display:block;');
            $('#txtSDate').attr('style','display:block;');
            document.getElementById('lbltxtDate').innerHTML="Month";
            $('#txtSDate').attr('type','month');
            break;
        case 'year':
            $('#lblnmbYear').attr('style','display:block;');
            $('#nmbYear').attr('style','display:block;');
            break;
    }
}


</script>