<div class="container-fluid fade-in">
    <div class="d-flex justify-content-between align-items-center mb-3">
        <h4><?= lang('applications.periods') ?></h4>
        <?php if (Gate::can('applications.review')): ?>
        <a href="/application-periods/create" class="btn btn-primary"><i class="fas fa-plus me-1"></i><?= lang('common.create') ?></a>
        <?php endif; ?>
    </div>

    <div class="card">
        <div class="card-body">
            <table id="periods-table" class="table table-striped w-100">
                <thead><tr><th>#</th><th>Name</th><th>Start</th><th>End</th><th>Max</th><th>Current</th><th>Status</th><th>Actions</th></tr></thead>
            </table>
        </div>
    </div>
</div>

<?php $__view->push('scripts') ?>
<script>
$(document).ready(function() {
    $('#periods-table').DataTable({
        processing: true, serverSide: true,
        ajax: { url: '/api/application-periods/datatable', type: 'GET' },
        columns: [
            { data: 'id' }, { data: 'name' }, { data: 'start_date' }, { data: 'end_date' },
            { data: 'max' }, { data: 'current' }, { data: 'status' }, { data: 'actions', orderable: false }
        ],
        order: [[0, 'desc']], pageLength: 25
    });
});
</script>
<?php $__view->endPush() ?>