<div class="d-flex justify-content-between align-items-center mb-4">
    <h4 class="mb-0"><i class="fas fa-envelope-open-text me-2"></i><?= lang('comm.templates') ?></h4>
    <?php if (Gate::can('notifications.send')): ?>
    <a href="/communications/templates/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="templates-table" class="table table-striped table-hover w-100"
               data-url="/communications/api/templates/datatable"
               data-columns='<?= json_encode([
                   ["data" => "id", "title" => "#", "width" => "50px"],
                   ["data" => "template_code", "title" => "Code"],
                   ["data" => "name_en", "title" => "Name (EN)"],
                   ["data" => "channel_name", "title" => "Channel"],
                   ["data" => "event_trigger", "title" => "Event Trigger"],
                   ["data" => "is_active", "title" => "Active", "orderable" => false],
                   ["data" => "created_at", "title" => "Created"],
                   ["data" => "id", "title" => "Actions", "orderable" => false, "searchable" => false]
               ]) ?>'>
            <thead><tr>
                <th>#</th><th>Code</th><th>Name</th><th>Channel</th><th>Trigger</th><th>Active</th><th>Created</th><th>Actions</th>
            </tr></thead>
        </table>
    </div>
</div>

<?php $__view->push('scripts') ?>
<script>
$(function(){
    DataTableHelper.init('templates-table', {
        columnDefs: [
            { targets: 5, render: function(d){ return d == 1 ? '<span class="badge bg-success">Active</span>' : '<span class="badge bg-secondary">Inactive</span>'; }},
            { targets: 6, render: function(d){ return d ? new Date(d).toLocaleDateString() : ''; }},
            { targets: 7, render: function(d, t, row){
                let html = '<div class="btn-group btn-group-sm">';
                html += '<a href="/communications/templates/'+d+'/edit" class="btn btn-outline-primary btn-sm" title="Edit"><i class="fas fa-edit"></i></a>';
                html += ' <button class="btn btn-outline-danger btn-sm" onclick="deleteTemplate('+d+')" title="Delete"><i class="fas fa-trash"></i></button>';
                html += '</div>';
                return html;
            }}
        ]
    });
});
function deleteTemplate(id){
    Swal.fire({title:'Delete Template?',text:'This may deactivate the template if in use.',icon:'warning',showCancelButton:true,confirmButtonColor:'#e53e3e',confirmButtonText:'Delete'}).then(r=>{
        if(r.isConfirmed){
            $.ajax({url:'/communications/templates/'+id+'/delete',type:'POST',data:{_token:'<?= csrf_token() ?>'},success:function(res){
                if(res.success){FormHelper.showToast('success',res.message);DataTableHelper.reload('templates-table');}
                else{FormHelper.showToast('error',res.message);}
            }});
        }
    });
}
</script>
<?php $__view->endPush() ?>