@extends('adminlte::page')

@section('title', 'Intitule Groups List')

@section('content_header')
    <h1>@lang('global.Intitule Groups') @lang('global.List') </h1>
@endsection

@section('content')

    <x-card>
        @can('intitules.create')
            <x-slot name="tools">
                <a class="btn btn-primary btn-sm" href="{{ route('intitule-groups.create') }}">@lang('global.Add New')</a>
            </x-slot>
        @endcan

        <x-table id="dataTable">
            <thead>
                <tr>
                    <th>@lang('global.Id')</th>
                    <th>@lang('global.Libelle')</th>
                    <th>@lang('global.Slug')</th>
                    <th>@lang('global.Description')</th>
                    <th>@lang('global.Created At')</th>
                    <th>@lang('global.Ordre')</th>
                    <th>@lang('global.Etat')</th>
                    <th>@lang('global.Action')</th>
                </tr>
            </thead>
        </x-table>
    </x-card>

@endsection

@section('js')

<script>
    $(function () {
        
        window.dataTable = $('#dataTable').DataTable({
            serverSide: true,
            processing: true,
            ajax: '{{ route('intitule-groups.index') }}',
            order: [[0, "desc"]],//LIFO
            columns: [
                {data: "id"},
                {data: "libelle"},
                {data: "slug"},
                {data: "description"},
                {data: "created_at"},
                {data: "ordre"},
                {data: "etat"},
                {data: "action"},
            ],
            columnDefs: [
                {targets: [-1,-2,-3], orderable: false, className: 'text-center'}
            ]
        });
    });
</script>

@endsection