@extends('client.layouts.app')

@section('page_title', 'Administrators')

@section('body_class', 'administrators')

@section('content_header_title')

@endsection

@section('content')
<div class="administrators">
    <div class="container-fluid">
        <h1 class="page-title">{{ __('client.navigation.administrators') }}</h1>
        <div class="table-responsive">
            <table id="administrators" class="table table--administrators">
                <thead>
                <tr class="table__header">
                    <th data-name="name">{{__('client.global.name')}}</th>
                    <th data-name="email">{{__('client.global.email')}}</th>
                    <th data-name="role">{{__('client.global.role')}}</th>
                    <th data-name="status">{{__('client.global.status')}}</th>
                    <th data-name="language">{{__('client.global.language')}}</th>
                    <th class="text-right">
                        <a href="{{ route('client.administrators.create') }}" class="table__add-cta d-inline-block">
                            <img src="{{ asset('img/create_table_entry_icon.svg')}}" alt="" />
                        </a>
                    </th>
                </tr>
                </thead>
                <tbody>
                </tbody>
            </table>
        </div>
    </div>
</div>
@endsection
@section('custom_scripts')
    <script type="text/javascript" charset="utf8" src="{{ asset('vendor/data-tables/js/jquery.dataTables.min.js') }}"></script>
    <script>
        var administratorsTable;
            $(function() {
                var i = 0;
                var columnDefs = [
                    {
                        targets: i++,
                        data: 'name',
                        name: 'name',
                        searchable: false,
                    },
                    {
                        targets: i++,
                        data: 'email',
                        name: 'email',
                        searchable: false,
                    },
                    {
                        targets: i++,
                        data: 'role',
                        name: 'role',
                        searchable: false,
                    },
                    {
                        targets: i++,
                        data: 'status',
                        name: 'status',
                        searchable: false,
                    },
                    {
                        targets: i++,
                        data: 'language',
                        name: 'language',
                        searchable: false,
                    },
                    {
                        targets: i++,
                        data: 'actions',
                        orderable: false,
                        searchable: false,
                    },
                ];
                var options = {
                    searching: false,
                    info: false,
                    lengthChange: false,
                    paging: false,
                    processing: true,
                    serverSide: true,
                    sDom: 'lrtip',
                    ajax: "{{ route('client.administrators.datatable') }}",
                    columnDefs: columnDefs,
                };

                administratorsTable = $('#administrators').DataTable(options);
        });
    </script>
@endsection