@extends('layouts.app')

@section('content')

    <div class="d-flex justify-content-between align-items-center mb-20 content-heading">
        <h2 class="h4 font-w300 mb-0">الشروحات</h2>

        @can('dashboard_add_explains_explains')
            <a class="btn btn-primary btn-sm btn-alt-primary btn-rounded" href="{{ route('dashboard.explains.explains.create') }}">
                <i class="fa fa-plus ml-1"></i> انشاء شرح جديد
            </a>
        @endcan

    </div>

    <div class="block">

        
        <div class="block-content">

            <div class="table-responsive">

                <table class="table table-vcenter">
                    <thead class="thead-light">
                        <tr>
                            <th style="width: 20px">#</th>
                            <th>العنوان</th>
                            <th>تاريخ الانشاء</th>
                            <th></th>
                        </tr>
                    </thead>
                    <tbody>

                        @foreach($explains as $explain)
                            <tr>
                                <td>{{ $explain->id }}</td>
                                <td>{{ $explain->title }}</td>
                                <td>{{ $explain->created_at->format('Y-m-d') }}</td>

                                <td class="text-center">

                                    @can('dashboard_delete_explains_explains')
                                        <a href="{{ route('dashboard.explains.explains.destroy', $explain) }}" class="btn btn-sm btn-danger delete-url-action">حذف</a>
                                    @endcan

                                </td>
                            </tr>
                        @endforeach

                        @if(!$explains->count())
                            <tr>
                                <td class="text-center" colspan="4">لا يوجد بيانات</td>
                            </tr>
                        @endif


                    </tbody>
                </table>

            </div>

        </div>

        <div class="block-content block-content-full block-content-sm bg-body-light font-size-sm">
            {{ $explains->onEachSide(1)->links('pagination.default') }}
        </div>

    </div>

@endsection