@extends('backend.layouts.app')

@section('content')
<h1 class="page-header">
    @lang('messages.blog.blog_list') 
    @if(auth()->user()->hasRole('Super Admin') || auth()->user()->hasPermissionTo('Create Blog'))
    <div class="float-right">
        <a href="{{ route('blog.create')}}" class="btn btn-primary" ><i class="fa fa-plus"></i> @lang('messages.blog.create_new_blog')</a>
    </div>
    @endif
</h1>
<div class="panel panel-inverse">
    <div class="panel-heading">
        <h4 class="panel-title">@lang('messages.blog.blog_list')</h4>
        <div class="panel-heading-btn">
            <a href="javascript:;" class="btn btn-xs btn-icon btn-circle btn-default" data-click="panel-expand"><i class="fa fa-expand"></i></a>
            <a href="javascript:;" class="btn btn-xs btn-icon btn-circle btn-success reload" data-id="dataTableBlogList"><i class="fa fa-redo"></i></a>
            <a href="javascript:;" class="btn btn-xs btn-icon btn-circle btn-warning" data-click="panel-collapse"><i class="fa fa-minus"></i></a>
            <a href="javascript:;" class="btn btn-xs btn-icon btn-circle btn-danger" data-click="panel-remove"><i class="fa fa-times"></i></a>
        </div>
    </div>
    <div class="panel-body">
        <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