<div class="d-flex justify-content-between align-items-center mb-4">
    <h4 class="mb-0"><i class="fas fa-ban me-2"></i><?= lang('cards.guest_blacklist') ?></h4>
    <button class="btn btn-danger" data-bs-toggle="modal" data-bs-target="#addBlModal"><i class="fas fa-plus me-1"></i>Add to Blacklist</button>
</div>

<div class="card"><div class="card-body">
    <table id="blacklistTable" class="table table-striped table-hover w-100">
        <thead><tr><th>#</th><th>Name</th><th>National ID</th><th>Phone</th><th>Reason</th><th>Date</th><th>Expires</th><th>Actions</th></tr></thead>
    </table>
</div></div>

<div class="modal fade" id="addBlModal" tabindex="-1"><div class="modal-dialog"><div class="modal-content">
    <form id="addBlForm"><?= csrf_field() ?>
        <div class="modal-header"><h5 class="modal-title">Add to Blacklist</h5><button type="button" class="btn-close" data-bs-dismiss="modal"></button></div>
        <div class="modal-body">
            <div class="mb-3"><label class="form-label">Name *</label><input type="text" name="guest_name" class="form-control" required></div>
            <div class="mb-3"><label class="form-label">National ID</label><input type="text" name="guest_national_id" class="form-control"></div>
            <div class="mb-3"><label class="form-label">Phone</label><input type="text" name="guest_phone" class="form-control"></div>
            <div class="mb-3"><label class="form-label">Reason *</label><textarea name="reason" class="form-control" rows="3" required></textarea></div>
            <div class="mb-3"><label class="form-label">Expires On</label><input type="date" name="expires_at" class="form-control datepicker"><small class="text-muted">Leave blank for permanent</small></div>
        </div>
        <div class="modal-footer">
            <button type="button" class="btn btn-secondary" data-bs-dismiss="modal"><?= lang('common.cancel') ?></button>
            <button type="submit" class="btn btn-danger"><i class="fas fa-ban me-1"></i>Add to Blacklist</button>
        </div>
    </form>
</div></div></div>

<?php $__view->push('scripts') ?>
<script>
$(function(){
    const dt = $('#blacklistTable').DataTable({
        processing: true, serverSide: true,
        ajax: { url: '/api/guests/blacklist/datatable', type: 'GET' },
        columns: [
            { data: 'id' },
            { data: 'guest_name' },
            { data: 'guest_national_id', render: function(d){ return d||'-'; }},
            { data: 'guest_phone', render: function(d){ return d||'-'; }},
            { data: 'reason', render: function(d){ return d.length>60?d.substring(0,60)+'...':d; }},
            { data: 'blacklisted_date' },
            { data: 'expires_at', render: function(d){ return d||'<span class="badge bg-danger">Permanent</span>'; }},
            { data: 'id', orderable: false, render: function(d){ return `<button class="btn btn-sm btn-outline-success btn-remove-bl" data-id="${d}"><i class="fas fa-undo me-1"></i>Remove</button>`; }}
        ],
        order: [[0, 'desc']]
    });

    $('#addBlForm').on('submit', function(e){
        e.preventDefault();
        $.post('/guests/blacklist', $(this).serialize(), function(res){
            if(res.success){ bootstrap.Modal.getInstance('#addBlModal').hide(); Swal.fire({icon:'success',title:res.message,timer:1500,showConfirmButton:false}); dt.ajax.reload(); }
            else { Swal.fire({icon:'error',title:'Error',text:res.message}); }
        });
    });

    $(document).on('click', '.btn-remove-bl', function(){
        const id = $(this).data('id');
        Swal.fire({title:'Remove from blacklist?',input:'text',inputPlaceholder:'Removal reason',showCancelButton:true,confirmButtonText:'Remove'}).then(r=>{
            if(r.isConfirmed){
                $.post('/guests/blacklist/'+id+'/remove', {_token:$('meta[name="csrf-token"]').attr('content'),removal_reason:r.value}, function(res){
                    if(res.success){ Swal.fire({icon:'success',title:res.message,timer:1500,showConfirmButton:false}); dt.ajax.reload(); }
                });
            }
        });
    });
});
</script>
<?php $__view->endPush() ?>