@extends('adminLayouts.app')
@section('title') {{'NOT FOUND'}} @endsection

@section('css')
<!-- DataTables -->
<link rel="stylesheet" href="{{asset('auth/plugins/datatables-bs4/css/dataTables.bootstrap4.min.css')}}">
<link rel="stylesheet" href="{{asset('auth/plugins/datatables-responsive/css/responsive.bootstrap4.min.css')}}">
<link rel="stylesheet" href="{{asset('auth/plugins/datatables-buttons/css/buttons.bootstrap4.min.css')}}">
<style>
.hide{display:none;}
</style>
@append

@section('js')
<!-- DataTables  & Plugins -->
<script src="{{asset('auth/plugins/datatables/jquery.dataTables.min.js')}}"></script>
<script src="{{asset('auth/plugins/datatables-bs4/js/dataTables.bootstrap4.min.js')}}"></script>
<script src="{{asset('auth/plugins/datatables-responsive/js/dataTables.responsive.min.js')}}"></script>
<script src="{{asset('auth/plugins/datatables-responsive/js/responsive.bootstrap4.min.js')}}"></script>
<script src="{{asset('auth/plugins/datatables-buttons/js/dataTables.buttons.min.js')}}"></script>
<script src="{{asset('auth/plugins/datatables-buttons/js/buttons.bootstrap4.min.js')}}"></script>
<script src="{{asset('auth/plugins/jszip/jszip.min.js')}}"></script>
<script src="{{asset('auth/plugins/pdfmake/pdfmake.min.js')}}"></script>
<script src="{{asset('auth/plugins/pdfmake/vfs_fonts.js')}}"></script>
<script src="{{asset('auth/plugins/datatables-buttons/js/buttons.html5.min.js')}}"></script>
<script src="{{asset('auth/plugins/datatables-buttons/js/buttons.print.min.js')}}"></script>
<script src="{{asset('auth/plugins/datatables-buttons/js/buttons.colVis.min.js')}}"></script>
<script>
  $(function () {
    var d = new Date();
    var newDate = d.getDate()+ "-" + (d.getMonth()+1) + "-" +d.getFullYear();
    var filename='calik_'+newDate;

    $("#ximilarTable").DataTable({
      "responsive": true, "lengthChange": false, "autoWidth": false,
     /* "buttons": [
        {
                extend: 'csv',
                title: filename
        },
        {
                extend: 'excel',
                title: filename
        },
        {
                extend: 'print',
                title: filename
        },
        {
            extend: 'colvis',
            text: 'Show/hide columns'
        }

      ]*/
    }).buttons().container().appendTo('#ximilarTable_wrapper .col-md-6:eq(0)');
  });
</script>
@append

@section('content')

  <!-- Content Header (Page header) -->
  <section class="content-header">
    <div class="container-fluid">
      <div class="row mb-2">
        <div class="col-sm-6">
          <h1>Not Found Records</h1>
        </div>
        <div class="col-sm-6">
          <ol class="breadcrumb float-sm-right">
            <li class="breadcrumb-item"><a href="{{ url('/admin/dashboard') }}">Home</a></li>
            <li class="breadcrumb-item active">Not Found</li>
          </ol>
        </div>
      </div>
    </div><!-- /.container-fluid -->
  </section>

  <!-- Main content -->
  <section class="content">
    <div class="container-fluid">
      <div class="row">
        <div class="col-12">

           <div class="card">
            <div class="card-header">
              <h3 class="card-title"></h3>
            </div>
            <!-- /.card-header -->
            <div class="card-body">
            @if (isset($list))


              <table id="ximilarTable" class="table table-bordered table-striped">
                <thead>
                <tr>
                    <th> Url1 </th>
                    <th> Url2 </th>
                </tr>
                </thead>
                <tbody>
                    @foreach($list as $d)
                 <tr id="row_{{ $d->id }}">
                   <td>
                     <img src="{{asset('uploads/thumbnails_150/'.$d->url1)}}" class="user_upload_img1" style="width: 100px;">
                      <!--<img src="{{asset('img/placeholder_image.jpeg')}}" class="user_upload_img1" style="width: 100px;">-->
                    </td>
                  <td>
                    <img src="{{asset('uploads/thumbnails_150/'.$d->url2)}}" class="user_upload_img2" style="width: 100px;">
                      <!--<img src="{{asset('img/placeholder_image.jpeg')}}" class="user_upload_img2" style="width: 100px;">-->
                  </td>

                </tr>
                  @endforeach
               </tbody>
              </table>
            @endif
            </div>
            <!-- /.card-body -->
          </div>
          <!-- /.card -->
        </div>
        <!-- /.col -->
      </div>
      <!-- /.row -->
    </div>
    <!-- /.container-fluid -->
  </section>
  <!-- /.content -->

@endsection