<?php $__env->startSection('title', __('trans.unit.title')); ?>


<?php $__env->startSection('datatableCSS'); ?>
    <?php echo $__env->make('layouts.admin.datatables-css', array_diff_key(get_defined_vars(), ['__data' => 1, '__path' => 1]))->render(); ?>
<?php $__env->stopSection(); ?>

<?php $__env->startSection('datatablesJS'); ?>
    <?php echo $__env->make('layouts.admin.datatables-js', array_diff_key(get_defined_vars(), ['__data' => 1, '__path' => 1]))->render(); ?>
<?php $__env->stopSection(); ?>

<?php $__env->startSection('content'); ?>

    <div class="card">
        <h5 class="card-header"><?php echo $__env->yieldContent('title'); ?></h5>
        <div class="card-datatable">
            <table class="dt-complex-header table table-bordered table-hover table-responsive">
                <thead>
                    <tr>
                        <th class="exp-col"><?php echo e(__('trans.id')); ?></th>
                        <th class="exp-col"><?php echo e(__('trans.unit.name')); ?></th>
                        <th class="exp-col"><?php echo e(__('trans.unit.chapter_id')); ?></th>
                        <th class="exp-col"><?php echo e(__('trans.unit.course_id')); ?></th>
                        <th class="exp-col"><?php echo e(__('trans.unit.category_id')); ?></th>
                        <th class="exp-col"><?php echo e(__('trans.created_at')); ?></th>
                        <th><?php echo e(__('trans.actions')); ?></th>
                    </tr>
                </thead>
                <tfoot>
                    <tr>
                        <th class="exp-col"><?php echo e(__('trans.id')); ?></th>
                        <th class="exp-col"><?php echo e(__('trans.unit.name')); ?></th>
                        <th class="exp-col"><?php echo e(__('trans.unit.chapter_id')); ?></th>
                        <th class="exp-col"><?php echo e(__('trans.unit.course_id')); ?></th>
                        <th class="exp-col"><?php echo e(__('trans.unit.category_id')); ?></th>
                        <th class="exp-col"><?php echo e(__('trans.created_at')); ?></th>
                        <th><?php echo e(__('trans.actions')); ?></th>
                    </tr>
                </tfoot>
            </table>
        </div>
    </div>


<?php $__env->stopSection(); ?>

<?php $__env->startSection('js'); ?>
    <script>
        $(document).ready(function() {

            const routeConfig = {
                lecturesIndex: "<?php echo e(url('admin/lectures')); ?>",
                unitsBaseURL: "<?php echo e(url('admin/units')); ?>",
                lecturesTitle: "<?php echo e(__('trans.lecture.title')); ?>",
                editText: "<?php echo e(__('trans.edit')); ?>",
                deleteText: "<?php echo e(__('trans.delete')); ?>",
                CSRFToken: "<?php echo e(csrf_token()); ?>",

            };

            var table = $('.table').DataTable({
                processing: true,
                serverSide: true,
                orderCellsTop: true,
                // scrollY: '400px',
                scrollCollapse: true,
                order: [
                    [0, 'desc']
                ],
                lengthMenu: lengthMenu("<?php echo e(__('trans.all')); ?>"),
                language: getlang(),
                dom: dom(),
                buttons: buttons("<?php echo e(__('trans.unit.add_new')); ?>",
                    "<?php echo e(url('admin/units/create')); ?>?chapter_id=<?php echo e(request('chapter_id')); ?>"),
                ajax: window.location.href,
                columns: [{
                        data: 'id'
                    },
                    {
                        data: 'title'
                    },
                    {
                        data: 'chapter.title',
                    },
                    {
                        data: 'course.title',
                    },
                    {
                        data: 'category.name',
                    },
                    {
                        data: 'created_at'
                    },
                ],
                columnDefs: [{
                    targets: 6,
                    render: function(data, type, row, meta) {
                        return `<div class="dropdown">
                                    <button class="btn btn-text-secondary rounded-pill text-muted border-0 p-2 me-n1" type="button"
                                        id="actionDropdown" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                                        <i class="ti ti-dots-vertical ti-md text-muted"></i>
                                    </button>
                                    <div class="dropdown-menu dropdown-menu-end" aria-labelledby="actionDropdown">

                                        <a class="dropdown-item" href="${routeConfig.lecturesIndex}?unit_id=${row.id}"><i class="fa-solid fa-arrow-right text-success me-2"></i>${routeConfig.lecturesTitle}</a>
                                        <a class="dropdown-item" href="${routeConfig.unitsBaseURL}/${row.id}/edit" class=""><i class="fa-solid fa-pen-to-square text-info me-2"></i><span>${routeConfig.editText}</span></a>

                                        <form action="${routeConfig.unitsBaseURL}/${row.id}" method="post">
                                            <input type="hidden" name="_token" value="${routeConfig.CSRFToken}">
                                            <input type="hidden" name="_method" value="DELETE">
                                            <button class="dropdown-item btn-delete"><i class="fa-solid fa-trash text-danger me-2"></i><span>${routeConfig.deleteText}</span></button>
                                        </form>
                                    </div>
                                </div>`;
                    }
                }, ],

                initComplete: function() {
                    this.api().columns().every(function() {
                        var that = this;
                        $('input', this.footer()).on('keyup change input clear', function() {
                            if (that.search() !== this.value) {
                                that.search(this.value).draw();
                            }
                        });
                    });
                },
            });

            $('.table tfoot th').each(function() {
                var title = $(this).text();
                var dataName = $(this).data('name');

                if ($(this).hasClass('exp-col')) {
                    $(this).html('<input type="text" class="form-control ' + dataName +
                        '" placeholder="<?php echo e(__('trans.search')); ?>: ' + title + '" />');
                }
            });
        });
    </script>
<?php $__env->stopSection(); ?>

<?php echo $__env->make('layouts.admin.app', array_diff_key(get_defined_vars(), ['__data' => 1, '__path' => 1]))->render(); ?><?php /**PATH E:\projects\doctorito\resources\views/admin/unit/index.blade.php ENDPATH**/ ?>