@extends('admin.layouts.app')

@section('title', 'Detractors')

@section('content')
<!-- Bread crumb and right sidebar toggle -->
                <!-- ============================================================== -->
                <div class="row page-titles">
                    <div class="col-md-5 col-8 align-self-center">
                        <h3 class="text-themecolor">{{ __('Detractors') }}</h3>
                        <ol class="breadcrumb">
                            <li class="breadcrumb-item"><a href="{{ route('admin.dashboard.index') }}">Home</a></li>
                            <li class="breadcrumb-item active"><a href="{{ route('admin.dashboard.index') }}">Detractors</a></li>
                        </ol>
                    </div>
                    <div class="col-md-7 col-4 align-self-center">
                        <div class="d-flex m-t-10 justify-content-end">
                            <a href="{{route('admin.dashboard.detractors_mnth')}}" target="">
                            <div class="d-flex m-r-20 m-l-10">
                                <div class="chart-text m-r-10">
                                    <a href="{{ route('admin.dashboard.index') }}" class="btn btn-inverse float-right"><i class="fa fa-plus-circle"></i> Back</a>

                                </div>
                                
                            </div>
                            </a>
                          
                            <div class="">
                                <button class="right-side-toggle waves-effect waves-light btn-success btn btn-circle btn-sm pull-right m-l-10"><i class="ti-settings text-white"></i></button>
                            </div>
                        </div>
                    </div>
                </div>
                <!-- ============================================================== -->
                <!-- End Bread crumb and right sidebar toggle -->
    <div class="row">
        <div class="col-lg-12">
            <div class="card card-outline-info">
                
                <div class="card-body">
                 
                       <div class="form-group row">
                        <label for="month" class="col-md-4 col-form-label text-md-right">{{ __('Select Month') }}</label>

                        <div class="col-md-6">
                            
                            <select class="form-control" onchange="monthly_detractors(this.value)">
                                            <option value='' @if($current_month) @if($current_month == '') selected @endif @endif>None</option>
                                            <option value="1" @if($current_month) @if($current_month == 1) selected @endif @endif>January</option>
                                            <option value="2" @if($current_month) @if($current_month == 2) selected @endif @endif>February</option>
                                            <option value="3" @if($current_month) @if($current_month == 3) selected @endif @endif>March</option>
                                            <option value="4" @if($current_month) @if($current_month == 4) selected @endif @endif>April</option>
                                            <option value="5" @if($current_month) @if($current_month == 5) selected @endif @endif>May</option>
                                            <option value="6" @if($current_month) @if($current_month == 6) selected @endif @endif>June</option>
                                            <option value="7" @if($current_month) @if($current_month == 7) selected @endif @endif>July</option>
                                            <option value="8" @if($current_month) @if($current_month == 8) selected @endif @endif>August</option>
                                            <option value="9" @if($current_month) @if($current_month == 9) selected @endif @endif>September</option>
                                            <option value="10" @if($current_month) @if($current_month == 10) selected @endif @endif>October</option>
                                            <option value="11" @if($current_month) @if($current_month == 11) selected @endif @endif>November</option>
                                            <option value="12" @if($current_month) @if($current_month == 12) selected @endif @endif>December</option>
                    </select>
                          
                        </div>
                        </div>
                     
                   
                   
        <div class="table-responsive">
      <table id="example1" class="table table-striped font-13" style="width:100%">
          
        <thead>
            <tr class="font-13">
                <th>Sr No</th>
                <th>Name</th>
                <th>Vehicle Model</th>
                <th>Vehicle No</th>
                <th>Service Date & Time</th>
                <th>Feedback Date & Time</th>
                <th>Ratings</th>
                <th></th>
                

            </tr>
        </thead>
        <tbody>
                        @if($detractors_of_mnth != null)
            @foreach($detractors_of_mnth as $d)
                                                        <tr>
                                                <td>{{$i++}}</td>
                                                <td>{{$d['name']}}</td>
                                                <td>{{$d['model']}}</td>
                                                <td>{{$d['vehicle_no']}}</td>
                                                <td>{{$d['servicing_date']}}</td>
                                                <td>{{$d['feedback_date']}}</td>
                                                <td>{{$d['rating']}}</td>
                                                <td><span class="label label-success"><a href="{{route('admin.feedback.feedback_details',[$feedback_id])}}" target="">View</a></span></td>
                                            </tr>
            @endforeach
            @endif
            
            
            

        </tbody>
        
    </table>    
    </div>
                </div>
            </div>
        </div>

    </div>
@endsection

@section('scripts')
    <script src="{{ asset('vendor/datatables/buttons.server-side.js') }}"></script>
    <script src="https://cdn.datatables.net/1.11.3/js/jquery.dataTables.min.js"></script>
    <script src="https://cdn.datatables.net/1.11.3/js/dataTables.bootstrap5.min.js"></script>
    <script type="text/javascript">
   
$(document).ready(function() {
      $('#example1').DataTable();

      } ); 
</script>

    <script type="text/javascript">
        let confirmDelete = function(title, msg, formId) {
            swal({
                title: title,
                text: msg,
                icon: "warning",
                buttons: true,
                dangerMode: true,
            })
            .then((willDelete) => {
                if (willDelete) {
                    jQuery('#' + formId).submit();
                }
            });
        }
    </script>
    <script type="text/javascript">
 function monthly_detractors(month){
         
           
            if(month > 0)
            {
            
            
               var url = '{{ route("admin.dashboard.detractors_by_month",[':month']) }}';
               url = url.replace(':month',month);
               //alert(url);
               $.ajax({
               
               
                    url: url,
                    type: "GET",
                    dataType: "json",
                    success:function(data) {

                    $('body').html(data.html);
                   

                   
                   }
                 
                });
             }
             else
             {
                 alert('Select Month');
             }
         
         }  
</script>
@endsection