@extends('layouts.admin')

@section('page-header', 'Adoptions (Pending Approval)')

@section('styles')
<style>
      div.dataTables_wrapper {
        width: 800px;
        margin: 0 auto;
    }
</style>
@endsection

@section('content')
    <div class="white-component">
    <table id="example" class="table table-striped table-bordered" style="width:100%">
     <thead>
     <th>First Name</th>
            <th>Surname</th>
            <th>Email</th>
            <th>Wreck</th>
            <th>Created At</th>
            <th>Action</th>
        </thead>
        <tbody>
        @forelse ($adoptations as $value)
            <tr>
                <td id="">{{ $value['fname'] }}</td>
                <td id="">{{ $value['sname'] }}</td>
                <td id="">{{ $value['email'] }}</td>
                <td id="">{{ $value['wreck'] }}</td>
                <td id="">{{ $value['created_at'] }}</td>
                <td class="text-right">
                    <button class="btn btn-outline-danger btn-sm" onclick="deletAdoptation({{$value['id']}}, {{$value['wreck_id']}}, {{ $value['user_id'] }});">Reject </button>
                    <button class="btn btn-outline-info btn-sm" onclick="approveFuntion({{$value['id']}}, {{$value['wreck_id']}}, {{ $value['user_id'] }});">Approve </button>
                </td>
            </tr>
        @empty
            <tr>
                <td><div class="no-data">No adoptation pending approval.</div></td>
            </tr>
        @endforelse
        </tbody>
        
    </table>
    <!-- <table class="table">
        <thead>
            <th>First Name</th>
            <th>Surname</th>
            <th>Email</th>
            <th>Wreck</th>
            <th>Created At</th>

            <th></th>
            <th class="text-right"></th>
        </thead>
        @forelse ($adoptations as $value)
        <tbody>
            <tr>
                <td id="">{{ $value['fname'] }}</td>
                <td id="">{{ $value['sname'] }}</td>
                <td id="">{{ $value['email'] }}</td>
                <td id="">{{ $value['wreck'] }}</td>
                <td id="">{{ $value['created_at'] }}</td>

                <td class="text-right">

                    <button class="btn btn-outline-danger btn-sm" onclick="deletAdoptation({{$value['id']}}, {{$value['wreck_id']}}, {{ $value['user_id'] }});">Reject </button>

                    <button class="btn btn-outline-info btn-sm" onclick="approveFuntion({{$value['id']}}, {{$value['wreck_id']}}, {{ $value['user_id'] }});">Approve </button>

                </td>
            </tr>
        </tbody>
        @empty
            <tr>
                <td><div class="no-data">No adoptation pending approval.</div></td>
            </tr>
        @endforelse
    </table> -->
    {{ $adoptations->links() }}

</div>
@endsection
@section('scripts')

<script>

    function approveFuntion(adoptation_id, wreck_id, user_id){

        swal({
          title: "Are you sure?",
          icon: "success",
          buttons: true,
          dangerMode: false,

      })
        .then((willDelete) => {
              if (willDelete) {
                $.ajax({
                    type: "POST",
                    url: '/admin/adopt_wrecks_approval',
                    data: {
                        wreck_id: wreck_id,
                        adoptation_id: adoptation_id,
                        user_id: user_id,
                    },
                    success: function( msg ) {
                        window.location.reload();
                    }
                });
            }
        });
    }



    function deletAdoptation(adoptation_id, wreck_id, user_id) {

        swal("Enter reason for the rejection :", {
          content: "input"
        }).then(function (value) {
          $.ajax({
            type: "POST",
            url: "/admin/adopt_wrecks/reject",
            data: {
              comment: value,
              wreck_id: wreck_id,
              adoptation_id: adoptation_id,
              user_id: user_id,
            },
            success: function success(msg) {
              window.location.reload();
            }
          });
        });
    }


    $(document).ready(function() {
  $('#example').DataTable({
    columnDefs: [
    {bSortable: false, targets: [0,2,4,5]} 
  ],
  "bPaginate": false
  });
 
} );

</script>
@endsection