@extends('setting.nav')

@section('title', 'Home Page')

@section('content')
    <h2>Sender Emails</h2>
    <div class="row mb-2">
        <div class="col-10">
            <div class="d-flex gap-3">
                <div class="position-relative">
                    <a href="#" class="btn btn-secondary rounded-pill px-4" data-bs-toggle="modal"
                        data-bs-target="#importantMailModal">Important Mail
                    </a>
                    <span id="countis_spam"
                        class="position-absolute top-0 start-100 translate-middle badge rounded-pill bg-danger">
                        {{ $total_impmail ?? 0 }}
                    </span>
                </div>
                <!-- Modal for Important Mail -->
                <div class="modal fade" id="importantMailModal" tabindex="-1" aria-labelledby="importantMailLabel"
                    aria-hidden="true">
                    <div class="modal-dialog modal-xl modal-dialog-scrollable">
                        <div class="modal-content">
                            <div class="modal-header">
                                <h5 class="modal-title" id="importantMailLabel">Important Mails</h5>
                                <button type="button" class="btn-close" data-bs-dismiss="modal"
                                    aria-label="Close"></button>
                            </div>
                            <div class="modal-body">
                                <!-- Display Important Mails Here -->
                                <div class="container">
                                    <h2>Important Mails</h2>
                                    <table id="importantMailsTable" class="table table-striped table-bordered">
                                        <thead>
                                            <tr>
                                                <th>ID</th>
                                                <th>Sender Name</th>
                                                <th>Sender Email</th>
                                                <th style="width: 150px;">Actions</th> <!-- New Column for Button -->
                                            </tr>
                                        </thead>
                                        <tbody>
                                            @foreach ($importantMails as $mail)
                                                <tr>
                                                    <td>{{ $mail->id }}</td>
                                                    <td>{{ $mail->sender_name }}</td>
                                                    <td>{{ $mail->sender_email }}</td>
                                                    <td>
                                                        <div class="d-flex flex-wrap gap-3">
                                                            <div class="position-relative">
                                                                {{-- <a href="#"
                                                                    class="btn btn-secondary rounded-pill px-4">All
                                                                    Mails</a>
                                                                <span
                                                                    class="position-absolute top-0 start-100 translate-middle badge rounded-pill bg-danger">
                                                                    {{ $mail->message_count }}
                                                                </span> --}}
                                                                <form action="{{ route('show_all_mail') }}" method="POST">
                                                                    @csrf
                                                                    <input type="hidden" name="user_id"
                                                                        value="{{ $mail->user_id }}">
                                                                    <input type="hidden" name="sender_email"
                                                                        value="{{ $mail->sender_email }}">
                                                                    <button type="submit"
                                                                        class="btn btn-secondary rounded-pill px-4">
                                                                        All Mails
                                                                    </button>
                                                                    <span
                                                                        class="position-absolute top-0 start-100 translate-middle badge rounded-pill bg-danger">
                                                                        {{ $mail->message_count }}
                                                                    </span>
                                                                </form>
                                                            </div>

                                                            {{-- <div class="position-relative">
                                                                <a href="#"
                                                                    class="btn btn-primary rounded-pill px-4"> Bad</a>
                                                                <span
                                                                    class="position-absolute top-0 start-100 translate-middle badge rounded-pill bg-danger">
                                                                    {{ $mail->is_spam_count }}
                                                                </span>
                                                            </div>

                                                            <div class="position-relative">
                                                                <a href="#"
                                                                    class="btn btn-success rounded-pill px-4">Good</a>
                                                                <span
                                                                    class="position-absolute top-0 start-100 translate-middle badge rounded-pill bg-danger">
                                                                    {{ $mail->is_not_spam_count }}
                                                                </span>
                                                            </div> --}}

                                                        </div>
                                                    </td>
                                                </tr>
                                            @endforeach
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                            <div class="modal-footer">
                                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="position-relative">
                    <a href="#" class="btn btn-warning rounded-pill px-4" data-bs-toggle="modal"
                        data-bs-target="#notImportantMailModal">Not Important Mail
                    </a>
                    <span id="countis_spam"
                        class="position-absolute top-0 start-100 translate-middle badge rounded-pill bg-danger">
                        {{ $total_not_impmail ?? 0 }}
                    </span>
                </div>

                <!-- Modal for Not Important Mail -->
                <div class="modal fade" id="notImportantMailModal" tabindex="-1" aria-labelledby="notImportantMailLabel"
                    aria-hidden="true">
                    <div class="modal-dialog modal-xl modal-dialog-scrollable">
                        <div class="modal-content">
                            <div class="modal-header">
                                <h5 class="modal-title" id="notImportantMailLabel">Not Important Mails</h5>
                                <button type="button" class="btn-close" data-bs-dismiss="modal"
                                    aria-label="Close"></button>
                            </div>
                            <div class="modal-body">
                                <!-- Display Not Important Mails Here -->
                                <div class="container">
                                    <h2>Non-Important Mails</h2>
                                    <table id="nonImportantMailsTable" class="table table-striped table-bordered">
                                        <thead>
                                            <tr>
                                                <th>ID</th>
                                                <th>Sender Name</th>
                                                <th>Sender Email</th>
                                                <th style="width: 150px;">Actions</th> <!-- New Column for Button -->
                                            </tr>
                                        </thead>
                                        <tbody>
                                            @foreach ($nonImportantMails as $mail)
                                                <tr>
                                                    <td>{{ $mail->id }}</td>
                                                    <td>{{ $mail->sender_name }}</td>
                                                    <td>{{ $mail->sender_email }}</td>
                                                    <td>
                                                        <div class="d-flex flex-wrap gap-3">
                                                            <div class="position-relative">
                                                                {{-- <a href="#"
                                                                    class="btn btn-secondary rounded-pill px-4">All
                                                                    Mails</a>
                                                                <span
                                                                    class="position-absolute top-0 start-100 translate-middle badge rounded-pill bg-danger">
                                                                    {{ $mail->message_count }}
                                                                </span> --}}
                                                                <form action="{{ route('show_all_mail') }}" method="POST">
                                                                    @csrf
                                                                    <input type="hidden" name="user_id"
                                                                        value="{{ $mail->user_id }}">
                                                                    <input type="hidden" name="sender_email"
                                                                        value="{{ $mail->sender_email }}">
                                                                    <button type="submit"
                                                                        class="btn btn-secondary rounded-pill px-4">
                                                                        All Mails
                                                                    </button>
                                                                    <span
                                                                        class="position-absolute top-0 start-100 translate-middle badge rounded-pill bg-danger">
                                                                        {{ $mail->message_count }}
                                                                    </span>
                                                                </form>
                                                            </div>

                                                            {{-- <div class="position-relative">
                                                                <a href="#"
                                                                    class="btn btn-primary rounded-pill px-4"> Bad</a>
                                                                <span
                                                                    class="position-absolute top-0 start-100 translate-middle badge rounded-pill bg-danger">
                                                                    {{ $mail->is_spam_count }}
                                                                </span>
                                                            </div>

                                                            <div class="position-relative">
                                                                <a href="#"
                                                                    class="btn btn-success rounded-pill px-4">Good</a>
                                                                <span
                                                                    class="position-absolute top-0 start-100 translate-middle badge rounded-pill bg-danger">
                                                                    {{ $mail->is_not_spam_count }}
                                                                </span>
                                                            </div> --}}

                                                        </div>
                                                    </td>
                                                </tr>
                                            @endforeach
                                        </tbody>
                                    </table>
                                </div>

                            </div>
                            <div class="modal-footer">
                                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-2">
            <span class="btn btn-primary" id="save-btn">Save Changes</span>

        </div>
    </div>
    <div class="container p-4 bg-light shadow rounded" style="max-height:400px; overflow-y: auto;">
        <table id="messagesTable" class="display table table-striped">
            <thead>
                <tr>
                    <th style="width: 15%;">Important Mail</th>
                    <th>ID</th>
                    <th>Sender Name</th>
                    <th>Sender Email</th>
                </tr>
            </thead>
            <tbody>
                @foreach ($emails as $index => $email)
                    <tr>
                        <td class="text-center">
                            <input type="checkbox" id="checkbox-{{ $index }}" class="important-checkbox"
                                data-email="{{ $email->id }}" {{ $email->important_mail == 0 ? 'checked' : '' }}>
                        </td>
                        {{-- <td>{{ $email->id }}</td> --}}
                        <td>{{ $loop->iteration }}</td>
                        <td>{{ $email->sender_name }}</td>
                        <td>{{ $email->sender_email }}</td>
                    </tr>
                @endforeach
            </tbody>
        </table>
    </div>

    <script>
        $(document).ready(function() {
            $('#importantMailsTable').DataTable({
                "paging": true,
                "searching": true,
                "ordering": true,
                "info": true,
            });
            $('#nonImportantMailsTable').DataTable({
                "paging": true,
                "searching": true,
                "ordering": true,
                "info": true
            });
            let table = $('#messagesTable').DataTable();

            document.getElementById("save-btn").addEventListener("click", function() {
                let checkedEmails = [];
                let importantMailValue = 0; //important
                table.rows().nodes().toArray().forEach(function(row) {
                    let checkbox = row.querySelector(".important-checkbox:checked");
                    if (checkbox) {
                        let importantMailValue = 0; //important
                        checkedEmails.push(checkbox.dataset.email);
                    }
                });


                if (checkedEmails.length > 0) {
                    $.ajax({
                        url: "update_set_email",
                        type: "GET", // Or "POST" if required
                        data: {
                            emails: checkedEmails, // Automatically converts to `emails[]=1&emails[]=2`
                            important_mail: importantMailValue,
                            user_id: "{{ Auth::id() }}"
                        },
                        dataType: "json",
                        success: function(response) {
                            console.log(response);
                            alert(response.message);
                            location.reload();
                        },
                        error: function(xhr) {
                            console.log(xhr);
                            alert("Error in updating emails: ");
                        }
                    });
                } else {
                    alert("No emails selected.");
                }
            });
        });
    </script>
@endsection