{{-- The whole future lies in uncertainty: live immediately. - Seneca --}}
@php
    $titulo = 'Emails - SW'
@endphp
@include('components.head')
<style>
    .card-header {
        color: #007bff !important;
        /* Azul aplicado com prioridade */
        font-family: 'Arial', sans-serif;
        /* Definindo fonte personalizada */
        font-weight: bold;

    }
</style>
<div class="container">
@if (session('success'))
<div aria-live="polite" aria-atomic="true" class="position-relative"  >
    <div class="toast-container position-fixed top-0 start-50 translate-middle-x mt-5 p-5" style="z-index: 11">
        <div id="successToast" class="toast hide show bg-success text-white" role="alert" aria-live="assertive" aria-atomic="true">
            <div class="toast-header">
                <strong class="me-auto">Sucesso</strong>
                <button type="button" class="btn-close" data-bs-dismiss="toast" aria-label="Fechar"></button>
            </div>
            <div class="toast-body">
                {{ session('success') }}
            </div>
        </div>
    </div>
</div>

{{-- Script para ativar o Toast --}}
<script>
    document.addEventListener("DOMContentLoaded", function () {
        let successToast = new bootstrap.Toast(document.getElementById('successToast'), {
                delay: 5000 // 5 segundos antes de fechar sozinho
            });
            successToast.show();
    });
</script>
@endif
    <h3>Emails importantes do sistema</h3>
    <h6>Lista de emails cadastrados, que são usados para notificar os moderadores de cada parte do sistema</h6>
    <div class="row align-items-center mb-3">
        <!-- Primeiro formulário -->
        <div class="col-lg-12">
            
            <form action="{{ route('ti.emails') }}" method="GET" class="d-flex">
                <!-- Campo de pesquisa -->
                <input
                    type="text"
                    name="search"
                    class="form-control me-2"
                    placeholder="Pesquisa de emails no sistema"
                    value="{{ request('search') }}">
                <!-- Botão para limpar a pesquisa -->
                @if(request('search'))
                    <a href="{{ route('ti.emails') }}" class="btn btn-danger me-2">Limpar</a>
                @endif
                <button type="submit" class="btn btn-primary">Pesquisar</button>
                <button type="button"  class="btn btn-success ml-2" onclick="openCadastraModal()" id='cadastraLimite'>Cadastrar</button>
                {{-- <button type="button" class="btn btn-warning shadow"
                            onclick="openEditModal({{ $tipodespesa->tip_id }}, '{{ $tipodespesa->tip_despesa }}', '{{ $tipodespesa->tip_valorlimite }}')">
                            Editar
                        </button> --}}
            </form>
            
        </div>
    
        
    </div>
    <div class="modal fade" id="cadastraModal" tabindex="-1" aria-labelledby="cadastraModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="cadastraModalLabel">Cadastrar Tipo de Despesa e Limite</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <form id="cadastroForm" method="POST" action="{{route('ti.emails.adiciona')}}">
                    @csrf
                    
                    <div class="modal-body">
                        
                        
                        <div class="form-group">
                            <label>Email</label>
                            <input type="email" class="form-control" name="email_nome" id="email_nome" required>
                        </div>
                        
                        <div class="form-group">
                            <label>Tipo do email</label>
                            <select class="custom-select" name="email_cat" id="email_cat" required>
                                <option value="">Selecione</option>
                                <option value="1">Financeiro</option>
                                <option value="2">TI</option>
                                <option value="3">Viagem</option>
                                <option value="4">Carro</option>
                                <option value="5">Estoque</option>
                                <option value="6">Facilities</option>
                                <option value="7">RH</option>
                            </select>
                        </div>
                        <div class="form-group">
                            <label>Descrição</label>
                            <textarea class="form-control" name="descricao" id="descricao" rows="5" ></textarea>
                            {{-- <input type="text" class="form-control" name="descricao" id="descricao" required> --}}
                        </div>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-danger" data-bs-dismiss="modal">Cancelar</button>
                        <button type="submit" class="btn btn-success">Cadastrar</button>
                    </div>
                </form>
            </div>
        </div>
    </div>
    <div class="row">
    @php
        $emails = $emails ?? collect();
    @endphp

    @if($emails->isEmpty())
        <div class="alert alert-warning">
            <span>Não há emails cadastrados</span>
        </div>
    @else
    <div class="table-responsive shadow">
        <table class="table">
            <thead>
                <th scope="col" class="text-center">ID</th>
                <th scope="col" class="text-center">Email</th>
                <th scope="col" class="text-center">Moderação</th>
                <th scope="col" class="text-center">Descrição</th>
                <th scope="col" class="text-center">Ações</th>
            </thead>
        <tbody>
    @foreach ($emails as $email)
        <tr>
            <td class="text-center">{{ $email->email_id }}</td>
            <td class="text-center">{{ $email->email_nome }}</td>
            <td class="text-center">{{ $email->email_cat == 1 ? 'Financeiro' : ($email->email_cat == 2 ? 'TI' : ($email->email_cat == 3 ? 'Viagem' : ($email->email_cat == 4 ? 'Carro' : ($email->email_cat == 5 ? 'Estoque' : ($email->email_cat == 6 ? 'Facilities' : ($email->email_cat == 7 ? 'RH' : ' '))))))  }}</td>
            <td class="text-center {{$email->email_descricao == null ? 'text-danger font-italic' : ''}}"> {{$email->email_descricao ?? 'Sem descrição' }} </td>
            <td class="text-center">
            <button type="button" class="btn btn-warning shadow"
            data-id="{{ $email->email_id }}"
            data-nome="{{ $email->email_nome }}"
            data-categoria="{{ $email->email_cat }}"
            data-descricao="{{ $email->email_descricao }}"
            onclick="openEditModal(this)"
            >
                Editar
            </button>
            <button type="button" class="btn btn-danger shadow"
                onclick="openDeleteModal({{ $email->email_id }}, '{{ $email->email_nome }}')">
                Remover
            </button>
            </td>
        </tr>
    @endforeach
            </tbody>
        </table>
    </div>

    @endif
    @if ($emails->count())
        <nav class="mt-3 d-flex justify-content-end" aria-label="Navegação de página">
            <ul class="pagination">
                {{-- Botão "Anterior" --}}
                <li class="page-item {{ $emails->onFirstPage() ? 'disabled' : '' }}">
                    <a class="page-link" href="{{ $emails->previousPageUrl() }}" aria-label="Anterior">
                        <span aria-hidden="true">&laquo;</span>
                    </a>
                </li>
    
                {{-- Números das páginas --}}
                @for ($i = 1; $i <= $emails->lastPage(); $i++)
                    <li class="page-item {{ $i == $emails->currentPage() ? 'active' : '' }}">
                        <a class="page-link" href="{{ $emails->url($i) }}">{{ $i }}</a>
                    </li>
                @endfor
    
                {{-- Botão "Próximo" --}}
                <li class="page-item {{ $emails->currentPage() == $emails->lastPage() ? 'disabled' : '' }}">
                    <a class="page-link" href="{{ $emails->nextPageUrl() }}" aria-label="Próximo">
                        <span aria-hidden="true">&raquo;</span>
                    </a>
                </li>
            </ul>
        </nav>
    @endif
    </div>
    @php
    if (!isset($email)) {
        $email = (object) [
            'email_cat' => null,
        ];
    }
@endphp
 <div class="modal fade" id="editModal" tabindex="-1" aria-labelledby="editModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="editModalLabel">Editar Tipo de Despesa</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <form id="editForm" method="POST"  data-route="{{ route('ti.emails.edita', ['email_id' => '__ID__']) }}">
                @csrf
                @method('PUT')
                <div class="modal-body">
                    <input type="hidden" name="email_id" id="edit_email_id">
                    
                    <div class="form-group">
                        <label>Email</label>
                        <input type="email" class="form-control" name="email_nome" id="edit_email_nome" required>
                    </div>

                    <div class="form-group">
                        <label>Tipo do email</label>
                        <select class="custom-select" name="email_cat" id="edit_email_cat">
                            <option value="1" {{ $email->email_cat == 1 ? 'selected': ''}} >Financeiro</option>
                            <option value="2" {{ $email->email_cat == 2 ? 'selected': ''}} >TI</option>
                            <option value="3" {{ $email->email_cat == 3 ? 'selected': ''}} >Viagem</option>
                            <option value="4" {{ $email->email_cat == 4 ? 'selected': ''}} >Carro</option>
                            <option value="5" {{ $email->email_cat == 5 ? 'selected': ''}} >Estoque</option>
                            <option value="6" {{ $email->email_cat == 6 ? 'selected': ''}} >Facilities</option>
                            <option value="7" {{ $email->email_cat == 7 ? 'selected': ''}} >RH</option>
                        </select>
                    </div>
                    <div class="form-group">
                        <label>Descrição</label>
                        <textarea rows='5' class="form-control" name="email_descricao" id="edit_email_descricao"> </textarea>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-danger" data-dismiss="modal">Cancelar</button>
                    <button type="submit" class="btn btn-success">Salvar Alterações</button>
                </div>
            </form>
        </div>
    </div>
</div>   
{{--  MODAL DE EXCLUSÃO  --}}

<div class="modal fade" id="deleteModal" tabindex="-1" aria-labelledby="deleteModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="deleteModalLabel">Confirmar Exclusão</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                Tem certeza que deseja excluir o email <strong id="delete_email_nome"></strong>?
            </div>
            <div class="modal-footer">
                <form id="deleteForm" method="POST" data-route="{{ route('ti.emails.deletar', ['email_id' => '__ID__']) }}">
                    @csrf
                    @method('DELETE')
                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cancelar</button>
                    <button type="submit" class="btn btn-danger">Excluir</button>
                </form>
            </div>
        </div>
    </div>
</div>
</div>
<script>
function openCadastraModal(){
    
    $('#cadastraModal').modal('show');
}

//     function openEditModal(id, nome, categoria, descricao) {
//     document.getElementById('edit_email_id').value = id;
//     document.getElementById('edit_email_nome').value = nome;
//     document.getElementById('edit_email_cat').value = categoria;
//     document.getElementById('edit_email_descricao').value = descricao;

//     // Define a URL da rota de atualização
//     // document.getElementById('editForm').action = `/tipodespesas/${id}`;
//     let form = document.getElementById('editForm');
//     let routeTemplate = form.getAttribute('data-route');
//     form.action = routeTemplate.replace('__ID__', id);

//     $('#editModal').modal('show');
// }
function openEditModal(button) {
        const id = button.getAttribute('data-id');
        const nome = button.getAttribute('data-nome');
        const categoria = button.getAttribute('data-categoria');
        const descricao = button.getAttribute('data-descricao');

        document.getElementById('edit_email_id').value = id;
        document.getElementById('edit_email_nome').value = nome;
        document.getElementById('edit_email_cat').value = categoria;
        document.getElementById('edit_email_descricao').value = descricao;

        // Atualiza a action do formulário
        const form = document.getElementById('editForm');
        const routeTemplate = form.getAttribute('data-route');
        form.action = routeTemplate.replace('__ID__', id);

        // Exibe a modal (modo compatível com Bootstrap 4)
        const modalElement = document.getElementById('editModal');
        const modal = new bootstrap.Modal(modalElement);
        modal.show();
    }
function openDeleteModal(id, nome) {
    document.getElementById('delete_email_nome').textContent = nome;

    // Define a URL da rota de exclusão
    // document.getElementById('deleteForm').action = `/tipodespesas/${id}`;
    let form = document.getElementById('deleteForm');
    let routeTemplate = form.getAttribute('data-route');
    form.action = routeTemplate.replace('__ID__', id);
    $('#deleteModal').modal('show');
}

</script>
 

@include('components.footer');