@extends('layouts.app')

@section('title', 'Modelos de Contratos')

@section('content')
<div class="content pt-3">
    <nav class="mb-3" aria-label="breadcrumb">
        <ol class="breadcrumb mb-0">
            <li class="breadcrumb-item"><a href="{{ route('dashboard') }}">Dashboard</a></li>
            <li class="breadcrumb-item active" aria-current="page">Modelos de Contratos</li>
        </ol>
    </nav>

    <div class="mb-4">
        <div class="row g-3 mb-4">
            <div class="col-auto">
                <h2 class="mb-0">Modelos de Contratos</h2>
            </div>
            <div class="col-auto">
                <button class="btn btn-primary" onclick="window.location='{{ route('modelos_contratos.create') }}'">
                    <i class="fas fa-plus me-2"></i>Adicionar Modelo de Contrato
                </button>
            </div>
        </div>

        <div class="table-responsive">
            <table class="table table-sm fs-9 mb-0">
                <thead>
                    <tr>
                        <th scope="col">Nome</th>
                        <th scope="col">Criado em</th>
                        <th scope="col" class="text-end">&nbsp;</th>
                    </tr>
                </thead>
                <tbody>
                    @forelse($modelos as $modelo)
                        <tr>
                            <td>{{ $modelo->nome }}</td>
                            <td>{{ $modelo->created_at->format('d/m/Y') }}</td>
                            <td class="text-end">
                                <div class="btn-reveal-trigger position-static">
                                    <button class="btn btn-sm dropdown-toggle dropdown-caret-none transition-none btn-reveal fs-10" type="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                                        <i class="fas fa-ellipsis-h"></i>
                                    </button>
                                    <div class="dropdown-menu dropdown-menu-end py-2">
                                        <a class="dropdown-item" href="{{ route('modelos_contratos.edit', $modelo) }}">Editar</a>
                                        <button class="dropdown-item text-danger" type="button" data-bs-toggle="modal" data-bs-target="#deleteModal">
                                            Excluir
                                        </button>
                                    </div>
                                </div>
                            </td>
                        </tr>
                    @empty
                        <tr>
                            <td colspan="3" class="text-center">Nenhum modelo de contrato encontrado.</td>
                        </tr>
                    @endforelse
                </tbody>
            </table>
        </div>
        <div class="d-flex justify-content-between align-items-center mb-3">
            <form method="GET" action="{{ route('modelos_contratos.index') }}" class="d-flex align-items-center">
                <label for="perPage" class="form-label mb-0 me-2">Registros por página:</label>
                <select name="per_page" id="perPage" class="form-select form-select-sm" style="width: auto;" onchange="this.form.submit()">
                    <option value="10" {{ request('per_page', 10) == 10 ? 'selected' : '' }}>10</option>
                    <option value="25" {{ request('per_page', 10) == 25 ? 'selected' : '' }}>25</option>
                    <option value="50" {{ request('per_page', 10) == 50 ? 'selected' : '' }}>50</option>
                    <option value="100" {{ request('per_page', 10) == 100 ? 'selected' : '' }}>100</option>
                </select>
            </form>

            <div>
                {{ $modelos->appends(['per_page' => request('per_page', 10)])->links('vendor.pagination.bootstrap-5') }}
            </div>
        </div>
    </div>
</div>
@endsection