@extends('layouts.layout-2')

@section('content')
    <h4 class="font-weight-bold py-2 mb-2">
        {{ __('incentive.incentives') }}
        <a href="{{ route('admin_incentive_create') }}" class="btn btn-sm btn-success float-right">
            <span class="fa fa-plus"></span> {{ __('incentive.create') }}
        </a>
    </h4>
    <div class="card">
        <div class="card-datatable table-responsive">
            <table class="table table-striped table-bordered" id="datatable-incentives">
                <thead>
                <tr>
                    <th>#</th>
                    <th>{{ __('incentive.name') }}</th>
                    <th>{{ __('incentive.status') }}</th>
                    <th>{{ __('incentive.period') }}</th>
                    <th>{{ __('incentive.participants') }}</th>
                    <th>{{ __('incentive.actions') }}</th>
                </tr>
                </thead>
            </table>
        </div>
    </div>
    <script>
        $(document).ready(function() {
            $('#datatable-incentives').DataTable({
                "processing": true,
                "serverSide": true,
                ajax: {
                    url: '{!! route('admin_incentives_datatable') !!}'
                },
                "order": [[0, "desc"]],
                "columns": [
                    { data: 'id', name: 'id' },
                    { data: 'name', name: 'name' },
                    { data: 'status_label', name: 'status_label', searchable: false },
                    { data: 'period', name: 'period', searchable: false, orderable: false },
                    { data: 'participants_count', name: 'participants_count', searchable: false, orderable: false },
                    { data: 'action', name: 'action', searchable: false, orderable: false }
                ],
                "bLengthChange": false,
                "iDisplayLength": 50,
                "language": {
                    "url": "/js/datatables-{{ \App::getLocale() }}.json"
                }
            });
        });
    </script>
@endsection