@extends('backend.layouts.app')
@section('content')
<h4 class="py-3 mb-4">
    @lang('messages.blog.blog_list')
</h4>
<div class="card">
    <div class="card-datatable table-responsive datatable-roles">
        @if(auth()->user()->hasRole('Super Admin') || auth()->user()->hasPermissionTo('Create Blog'))
        <div class="text-end m-4">
            <a href="{{ route('blog.create')}}" class="btn btn-primary px-4" ><i class="ri-add-line"></i> @lang('messages.blog.create_new_blog')</a>
        </div>
        @endif
        <table class="datatables-menus table" id="dataTableBlogList">
            <thead>
                <tr>
                    <th>@lang('messages.blog.sr_no')</th>
                    <th>@lang('messages.blog.user')</th>
                    <th>@lang('messages.blog.featured_image')</th>
                    <th>@lang('messages.blog.title')</th>
                    <th>@lang('messages.blog.status')</th>
                    <th>@lang('messages.blog.date')</th>
                    <th width="120px">@lang('messages.blog.action')</th>
                </tr>
            </thead>
            <tbody>
                <!-- Table body content goes here -->
            </tbody>
        </table>
    </div>
</div>


<!-- / Content -->
@endsection

@section('footer_scripts')
<script>
    $(document).ready(function() {
        $.ajaxSetup({
            headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            }
        });

        var table = $("#dataTableBlogList").DataTable({
            processing: true,
            serverSide: true,
            order: [[5, 'desc']],
            ajax: "{{ route('blog.index') }}",
            columns: [
                {data: "DT_RowIndex", name: "id"},
                {data: "user"},
                {data: "featured_image"},
                {data: "title"},
                {data: "status"},
                {data: "created_at", type: 'date'},
                {data: "action", sortable:false},
            ],
            columnDefs: [
                {target:5, type:"date-eu"}
            ]
        });

    });
</script>
@endsection