@extends('adminlte::page')

@section('content_header')
    <h1>@lang('global.Technical Control') @lang('global.List')</h1>
@endsection

@section('content')

    <x-row>
        <x-col>
            <x-card>
                <x-slot name="tools">
                    <a href="{{ route('technical-controls.create') }}" class="btn btn-primary btn-xs">
                        <i class="fa fa-plus"></i> @lang('global.Add New')</a>
                </x-slot>
                <x-table id="technical-controls-table">
                    <thead>
                        <th>@lang('global.Annuaire')</th>
                        <th>@lang('global.Numberplate')</th>
                        <th>@lang('global.Technical Control No')</th>
                        <th>@lang('global.Validity Date')</th>
                        <th>@lang('global.Created At')</th>
                        <th>@lang('global.Action')</th>
                    </thead>
                    <tbody></tbody>
                </x-table>
            </x-card>
        </x-col>
    </x-row>

@endsection

@push('js')
    <script>
        $(function () {
            window.dataTable = $('#technical-controls-table').DataTable({
                serverSide: true,
                processing: true,
                ajax: {
                    url: '{{ route('technical-controls.index') }}',
                    data: d => {


                    }
                },
                order: [[4, "desc"]],
                columns: [
                    {data: 'annuaire_id'},
                    {data: 'immat_no'},
                    {data: 'tc_no'},
                    {data: 'validity_date'},
                    {data: 'created_at'},
                    {data: 'action', orderable: false, className: 'text-center'},
                ]
            });
        });
    </script>
@endpush