@extends('admin.default')
@section('title', 'Admin | Models List')
@section('content')	
@php
$permissions= getPermissions();
@endphp
   <nav class="page-breadcrumb">
      <ol class="breadcrumb">
         <li class="breadcrumb-item"><a href="{{route('dashboard')}}">Dashboard</a> / Models</li>
         
      </ol>
   </nav>
   <div class="row">
        <div class="col-md-7">
            @if(isset($permissions) && isset($permissions['model_export_button']) && $permissions['model_export_button']==1)
               <form class="form-inline" method="post" action="{{route('modelExport')}}">
                  <div class="form-group">
                     <label class="mr-1">Select Columns</label>
                     <select class="js-example-basic-multiple w-100" name="columns[]" id="columns" multiple="multiple">
                        <option value="name">Model</option>
                        <option value="logo">Logo</option>
                        <option value="status">Status</option>
                        <option value="make->name">Make</option>
                     </select>
                  </div>

                  <div class="form-group mx-2">
                     <li class="type btn btn-sm btn-outline-primary mx-1" id="pdf" data-value="pdf">PDF</li>
                     <li class="type btn btn-sm btn-outline-primary mx-1" id="csv" data-value="csv">CSV</li>
                  </div>
                  <div class="form-group">
                     <input type="hidden" name="type" id="type">
                     <input type="submit" class="btn btn-primary" value="Export">
                  </div>
               </form>
            @endif
         </div>
         <div class="col">
            @if(isset($permissions) && isset($permissions['add_new_model']) && $permissions['add_new_model']==1)
               <a class="btn btn-primary btn-icon-text text-white float-right mb-2" href="{{route('modelShowForm')}}">
                  <i width="15" height="15" class="btn-icon-prepend" data-feather="plus"></i>Add Model
               </a>
            @endif
        </div>
    </div>
   <div class="row">
      <div class="col-md-12 grid-margin stretch-card">
         <div class="card">
            <div class="card-body">
               <h6 class="card-title"></h6>
                     <div class="d-inline">
                        @if(isset($permissions) && isset($permissions['model_clear_filter_button']) && $permissions['model_clear_filter_button']==1)
                           <a class="btn btn-sm btn-outline-primary" href="{{route('models')}}">Clear Filter</a>
                        @endif
                     </div>
                     <div class="form-inline float-right">
                        <input type="hidden" name="sort" id="sort" value="{{Request::get('sort')}}">
                        <input type="hidden" name="order" id="order" value="{{Request::get('order')}}">
                        <input type="hidden" name="page" id="page" value="1">
                        <select name="make" id="make" class="form-control m-2">
                           <option value="" selected>Select Make</option>
                        </select>
                        <select name="model" id="model" class="form-control mr-2" placeholder="Make Name">
                            <option value="" selected>Select Model</option>
                        </select>
                        <!-- <input type="text" name="model" id="model" value="{{Request::get('model')}}" class="form-control mr-2" placeholder="Model Name"> -->
                        <!-- <input type="text" name="make" id="make" value="{{Request::get('make')}}" class="form-control mr-2" placeholder="Make Name"> -->
                        <input type="submit" name="filter" id="filter" class="btn btn-outline-success" value="Filter">
                     </div>
                     
               <div class="table-responsive"> 
                  <table class="table">
                     <thead>
                        <tr>
                           <th>
                              Model Name 
                              <span class="float-right d-inline">
                                 <span class="sortingItem" data-id="asc" data-value="name"><i data-feather="arrow-up" width="15" height="15"></i></span>
                                 <span class="sortingItem" data-id="desc" data-value="name"><i data-feather="arrow-down" width="15" height="15"></i></span>
                              </span>
                           </th>
                           <th>
                              Make
                              <!-- <span class="float-right d-inline">
                                 <span class="sortingItem" data-id="asc" data-value="make"><i data-feather="arrow-up" width="15" height="15"></i></span>
                                 <span class="sortingItem" data-id="desc" data-value="make"><i data-feather="arrow-down" width="15" height="15"></i></span>
                              </span> -->
                           </th>
                           <th>
                              Date
                              <span class="float-right d-inline">
                                 <span class="sortingItem" data-id="asc" data-value="updated_at"><i data-feather="arrow-up" width="15" height="15"></i></span>
                                 <span class="sortingItem" data-id="desc" data-value="updated_at"><i data-feather="arrow-down" width="15" height="15"></i></span>
                              </span>
                           </th>
                           @if(
                              isset($permissions) && isset($permissions['model_review_button']) && $permissions['model_review_button']==1||
                              isset($permissions) && isset($permissions['model_edit_button']) && $permissions['model_edit_button']==1||
                              isset($permissions) && isset($permissions['model_delete_button']) && $permissions['model_delete_button']==1
                              )
                              <th><span class="float-right">Action</span></th>
                           @endif
                        </tr>
                     </thead>
                     <tbody>
                        @foreach($data as $key)
                        <tr>
                           <td>
                              <!-- <a href="" class="modelDetails" data-toggle="modal" data-id="{{$key->id}}" data-target="#modelDetails">
                                 {{$key->name}}
                              </a> -->
                              <!-- <a href="{{isset($key->modelDetail[0]->model_slug)?'https://www.autocoincars.com/m/'.$key->make->name.'/'.$key->modelDetail[0]:'#'}}">
                                 {{$key->name}}
                              </a> --> {{$key->name}}
                           </td>
                           <td>{{$key->make->name}}<a href="{{route('makesShowForm', $key->make->id)}}"><i class="mdi mdi-lead-pencil text-info"></i></a></td>
                           <td>{{date("d M, Y", strtotime($key->updated_at))}}</td>
                           <td>
                              <div class="float-right">
                              @if(isset($permissions) && isset($permissions['model_review_button']) && $permissions['model_review_button']==1)
                                 <a href="{{route('modelReviews',$key->id)}}" class="btn btn-sm btn-outline-info">Reviews</a>
                              @endif
                              @if(isset($permissions) && isset($permissions['model_edit_button']) && $permissions['model_edit_button']==1)
                                 <a href="{{route('modelShowForm',$key->id)}}" class="btn btn-sm btn-primary">Edit</a>
                              @endif
                              @if(isset($permissions) && isset($permissions['model_delete_button']) && $permissions['model_delete_button']==1)
                                 <form method="post" action="{{route('modelSetStatus', $key->id)}}" class="d-inline">
                                    @csrf
                                    <input type="hidden" name="status" value="delete">
                                    <input class="btn btn-sm btn-danger" type="submit" name="delete" value="Delete">
                                 </form>
                              @endif
                              </div>
                           </td>
                        </tr>
                        @endforeach
                     </tbody>
                  </table>
                  <span>Page No. <b>{{$data->currentPage()}}</b></span>
                  <span>Total <b>{{$data->total()}}</b> entries</span>
                  <span class="float-right">{{$data->links()}}<span>
                    
               </div>
            </div>
         </div>
      </div>
   </div>
<!-- Modal -->
<!-- <div class="modal modal-right fade" id="modelDetails" tabindex="-1" role="dialog" aria-labelledby="modelTitle" aria-hidden="true">
  <div class="modal-dialog" role="document" >
    <div class="modal-content">
      <div class="modal-header modal-model">
        <h5 class="modal-title" id="modelTitle"></h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
         <h4 id="make" class="text-center"></h4>
         <h5 class="my-3">Model Variation List</h5>
         <ul class="list-group list-group-flush opacity-25">
            <span class="model_list"></span>
         </ul>
      </div>

    </div>
  </div>
</div> -->

<script type="text/javascript">
   $(document).ready(function() {
      $.ajax({
         dataType: "json",
         url: "/administrator/get-makes",
         type: 'get',
         success: function(data){
               if(data){
                  $.each(data, function() {
                     // makes (makes name)
                     $("#make").append($("<option />").val(this.id).text(this.name));
                  });
                  // selected options
                // makes (makes name)
                $("#make").val("{{(Request::get('make') != null)?Request::get('make'):''}}");
               }               
         }
      });
      @if(Request::get('make') != null)
      $.ajax({
         dataType: "json",
         url: "/administrator/get-model/{{Request::get('make')}}",
         type: 'get',
         success: function(data){
               if(data){
                  $.each(data, function() {
                     // makes (makes name)
                     $("#model").append($("<option />").val(this.id).text(this.name));
                  });
                  // selected options
                // makes (makes name)
                $("#model").val("{{(Request::get('model') != null)?Request::get('model'):''}}");
               }               
         }
      });
      @endif
      $('#make').change(function(){
            let title;
            make_id = $('#make').val();
            $.ajax({
                dataType: "json",
                url: "/administrator/get-model/"+make_id,
                type: 'get',
                beforeSend: function(xhr){
                    $("#model").empty().append($("<option />").val('').text('Select Model'));
                    $("#model-msg").css("display", 'block');
                    $("#model").css("display", 'none');
                },
                success: function(data){
                    if(data){
                        console.log(data);
                        $.each(data, function() {
                            $("#model").append($("<option />").val(this.id).text(this.name));
                        });
                    }
                    $("#model-msg").css("display", 'none');
                    // $("#model").val("{{(Request::get('model') != null)?Request::get('model'):''}}");
                    $("#model").css("display", 'block');
                }
            });
        });
      $(document).on("click", "#filter" , function() {
         var order = $('#order').val();
         var sort = $('#sort').val();
         var model = $('#model').val();
         var make = $('#make').val();
         var page = $('#page').val();
         window.location = '/administrator/models-list?sort='+sort+'&order='+order+'&model='+model+'&make='+make+'&page='+page;
      });

      $(document).on("click", ".sortingItem" , function() {
         var order = $(this).data('id');
         var sort = $(this).data('value');
         var model = $('#model').val();
         var make = $('#make').val();
         var page = $('#page').val();
         window.location = '/administrator/models-list?sort='+sort+'&order='+order+'&model='+model+'&make='+make+'&page='+page;
      });

      $(document).on("click", ".type" , function() {
         $(".type").css('background-color','#ffffff');
         $(".type").css('color','#727cf5');
         $('#type').val($(this).data('value'));
         $(this).css('background-color','#2f3689');
         $(this).css('color','#ffffff');
      });

      // $('#csv').on('click',function() {
      // // $('#loading').show();
      //    $.ajax({				
      //       url: "{{route('modelExport')}}" ,
      //       type: "POST",
      //       headers: {'X-CSRF-TOKEN': '{{ csrf_token() }}' },
      //       xhrFields: {
      //                responseType: 'blob'
      //       },
      //       data:{
      //          type :'csv',
      //          columns : $('#columns').val(),
      //       },
      //       success: function(response){
      //          // $('#loading').hide();
      //          var blob = new Blob([response]);
      //          var link = document.createElement('a');
      //          link.href = window.URL.createObjectURL(blob);
      //          link.download = "model-report.csv";
      //          link.click();
      //          console.log(response);
      //          },
      //       error: function(blob){
      //             console.log(blob);
      //       }
               
      //    });
      // });
	});
</script>
@stop