{{-- resources/views/accounting/budgets/index.blade.php --}}
@extends('admin.admin_dashboard')
@section('admin')

<div class="page-content">
    <!-- Breadcrumb -->
    <div class="page-breadcrumb d-flex flex-column flex-sm-row align-items-center justify-content-between mb-3 p-3 bg-primary text-white rounded shadow-sm">
        <nav aria-label="breadcrumb">
            <ol class="breadcrumb mb-0 p-0">
                <li class="breadcrumb-item">
                    <a href="{{ route('admin.dashboard') }}" class="text-white">
                        <i class="bx bx-home-alt"></i>
                    </a>
                </li>
                <li class="breadcrumb-item active text-white" aria-current="page">Budget Register</li>
            </ol>
        </nav>
        @can('budgets.add')
        <a href="{{ route('budgets.create') }}" class="btn btn-light d-flex align-items-center">
            <i class="bx bx-plus-circle me-2"></i> New Budget
        </a>
        @endcan
    </div>

    <!-- Budgets Table -->
    @can('budgets.view')
    <div class="card shadow border-0 rounded">
        <div class="card-body p-4">
            <div class="table-responsive">
                <table id="example" class="table table-hover table-striped table-bordered align-middle mb-0">
                    <thead class="table-dark">
                        <tr>
                            <th class="text-center" style="width:1%">#</th>
                            <th>Name</th>
                            <th>Start</th>
                            <th>End</th>
                            <th class="text-center" style="width:1%">Action</th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach ($budgets as $i => $b)
                        <tr>
                            <td class="fw-bold text-center">{{ $i + 1 + ($budgets->currentPage() - 1) * $budgets->perPage() }}</td>
                            <td>{{ $b->name }}</td>
                            <td>{{ \Carbon\Carbon::parse($b->start_date)->format('Y-m-d') }}</td>
                            <td>{{ \Carbon\Carbon::parse($b->end_date)->format('Y-m-d') }}</td>
                            <td class="text-center">
                                <div class="dropdown">
                                    <a href="#" class="btn btn-light btn-sm dropdown-toggle" data-bs-toggle="dropdown">
                                        <i class="bx bx-dots-vertical-rounded"></i>
                                    </a>
                                    <ul class="dropdown-menu dropdown-menu-end">
                                        @can('budgets.view')
                                        <li>
                                            <a class="dropdown-item" href="{{ route('budgets.show', $b->id) }}">
                                                <i class="bx bx-show me-2"></i> View
                                            </a>
                                        </li>
                                        <li>
                                            <a class="dropdown-item" href="{{ route('budgets.variance', $b->id) }}">
                                                <i class="bx bx-bar-chart-alt me-2"></i> Variance
                                            </a>
                                        </li>
                                        @endcan
                                        @can('budgets.edit')
                                        <li>
                                            <a class="dropdown-item" href="{{ route('budgets.edit', $b->id) }}">
                                                <i class="bx bx-edit-alt me-2"></i> Edit
                                            </a>
                                        </li>
                                        @endcan
                                        @can('budgets.delete')
                                        <li>
                                            <button type="button" class="dropdown-item text-danger delete-budget" data-url="{{ route('budgets.destroy', $b->id) }}">
                                                <i class="bx bx-trash me-2"></i> Delete
                                            </button>
                                        </li>
                                        @endcan
                                    </ul>
                                </div>
                            </td>
                        </tr>
                        @endforeach
                    </tbody>
                </table>
            </div>
            <!-- Pagination -->
            <div class="mt-3">{{ $budgets->links('vendor.pagination.bootstrap-5') }}</div>
        </div>
    </div>
    @endcan
</div>

{{-- SweetAlert2 for delete confirmation --}}
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
<script>
document.addEventListener('DOMContentLoaded', function () {
    document.querySelectorAll('.delete-budget').forEach(function(btn) {
        btn.addEventListener('click', function () {
            Swal.fire({
                title: 'Delete this budget?',
                text: "This action cannot be undone!",
                icon: 'warning',
                showCancelButton: true,
                confirmButtonColor: '#d33',
                cancelButtonColor: '#3085d6',
                confirmButtonText: 'Yes, delete it'
            }).then((result) => {
                if (result.isConfirmed) {
                    const form = document.createElement('form');
                    form.method = 'POST';
                    form.action = btn.dataset.url;
                    form.innerHTML = `
                        @csrf
                        @method('DELETE')
                    `;
                    document.body.appendChild(form);
                    form.submit();
                }
            });
        });
    });
});
</script>
@endsection