@extends('backend.layouts.app')

@section('content')

<div class="p-3">
  <div class="card">
    <div class="card-header fw-bold">
      <span class="fw-bold">Messages</span>&emsp;
    </div>
    <div class="card-body">
      <table class="table table-striped" style="width:100%">
        <thead>
          <tr>
            <th>Subject</th>
            <th>Full Name</th>
            <th>Contact Details</th>
            <th>Email</th>
            <th>Message</th>
            <th>Date Sent</th>
            <th style="width:10%;">Action</th>
          </tr>
        </thead>

        <tbody>
          @foreach ($messages as $items)
          <tr>
            <td>{{ $items->subject }}</td>
            <td>{{ $items->name }}</td>
            <td>{{ $items->phone_num }}</td>
            <td>{{ $items->email }}</td>
            <td>{{ $items->message }}</td>
            <td>{{ date('F j, Y', strtotime($items->created_at)) }}</td>
            <td>
              <div>
                {{-- <button type="button" class="btn btn-success btn-block mb-1" data-toggle="modal" data-target="#exampleModal{{ $items->id }}"> View Application</button>
                <a href="">
                  <button class="btn btn-primary btn-block mb-1">Edit Status</button>
                </a> --}}
                <form action="{{ url('admin/messages/' . $items->id ) }}" method="POST"> @csrf @method('delete')
                  <button class="btn btn-danger btn-block" type="submit">Delete</button>
                </form>
                
              </div>
            </td>
          </tr>
          @endforeach
        </tbody>
      </table>
    </div>
  </div>
</div>


@endsection

@section('js')
<script src="https://cdn.datatables.net/1.13.4/js/jquery.dataTables.js"></script>
<script>
  $('.table').DataTable({
    "order": [
      [3, "desc"]
    ]
  });
</script>
@endsection