@extends('layouts.app')

@section('content')
    <!-- Here you can add content specific to the 'mail_dashboard' page -->
    <h2>{{ $type }}</h2>
    <p>Welcome to your inbox Mail Dashboard</p>
    <!-- Add more content as needed -->
    <div class="container">
        <h2 class="mb-4">Emails ({{ $type }})</h2>
        @if ($mails->isEmpty())
            <h2 class="text-center text-danger">No mails available</h2>
        @else
        <table class="table table-bordered table-striped" id="mails-table">
            <thead>
                <tr>
                    <th>ID</th>
                    <th>Sender Name</th>
                    <th>Sender Email</th>
                    <th>Subject</th>
                    <th>Sent Date</th>
                    <th>Attachment</th>
                    <th>Message Status</th>
                    @if ($type == 'all')
                    @elseif ($type != 'Read')
                        <th>Spam Status</th>
                    @endif
                    <th>Actions</th>
                </tr>
            </thead>
            <tbody>
                @foreach ($mails as $mail)
                    <tr>
                        <td>{{ $mail->email_id }}</td>
                        <td>{{ $mail->sender_name }}</td>
                        <td>{{ $mail->sender_email }}</td>
                        <td>{{ $mail->subject }}</td>
                        <td>{{ $mail->sent_date }}</td>
                        <td>{{ $mail->attachment_status == 1 ? 'Yes' : 'No' }}</td>
                        <td>{{ $mail->message_status == 1 ? 'Read' : 'Unread' }}</td>
                        @if ($type == 'all')
                        @elseif ($type != 'Read')
                            <td>{{ $mail->is_spam == 1 ? 'Not Spam' : 'Spam' }}</td>
                        @endif
                        <td>
                            <a href="{{ route('mails.show', $mail->email_id) }}" class="btn btn-primary btn-sm">View</a>
                        </td>
                    </tr>
                @endforeach
            </tbody>
        </table>
        
            {{-- <table class="table table-bordered table-striped">
                <thead>
                    <tr>
                        <th>ID</th>
                        <th>Sender Name</th>
                        <th>Sender Email</th>
                        <th>Subject</th>
                        <th>Sent Date</th>
                        <th>Attachment</th>
                        <th>Message Status</th>
                        @if ($type == 'all')
                        @elseif ($type != 'Read')
                            <th>Spam Status</th>
                        @endif

                        <th>Actions</th>
                    </tr>
                </thead>
                <tbody>
                    @foreach ($mails as $mail)
                        <tr>
                            <td>{{ $mail->email_id }}</td>
                            <td>{{ $mail->sender_name }}</td>
                            <td>{{ $mail->sender_email }}</td>
                            <td>{{ $mail->subject }}</td>
                            <td>{{ $mail->sent_date }}</td>
                            <td>{{ $mail->attachment_status == 1 ? 'Yes' : 'No' }}</td>
                            <td>{{ $mail->message_status == 1 ? 'Read' : 'Unread' }}</td>
                            @if ($type == 'all')
                            @elseif ($type != 'Read')
                                <td>{{ $mail->is_spam == 1 ? 'Not Spam' : 'Spam' }}</td>
                            @endif
                            <td>
                                <a href="{{ route('mails.show', $mail->email_id) }}" class="btn btn-primary btn-sm">View</a>
                            </td>
                        </tr>
                    @endforeach
                </tbody>
            </table> --}}
        @endif
        <!-- Pagination Links -->
        {{-- <div class="mt-4">
            {{ $mails->links('pagination::bootstrap-5') }}
        </div> --}}
    </div>
   
@endsection

@push('scripts')
<!-- DataTables CSS -->
<link rel="stylesheet" href="https://cdn.datatables.net/1.13.6/css/jquery.dataTables.min.css" />

<!-- jQuery -->
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>

<!-- DataTables JS -->
<script src="https://cdn.datatables.net/1.13.6/js/jquery.dataTables.min.js"></script>

<script>
    $(document).ready(function() {
        $('#mails-table').DataTable();
        // $('#mails-table').DataTable({
        //     pageLength: 25,
        //     ordering: true,
        //     responsive: true
        // });
    });
</script>
@endpush