@extends('layouts.admin')

@section('css')
    <link rel="stylesheet" type="text/css" href="{{asset('assets/styles/apps/crm/users-list.min.css')}}">
    <link rel="stylesheet" type="text/css" href="{{asset('libs/datatables-net/media/css/dataTables.bootstrap4.min.css')}}"> <!-- original -->
    <link rel="stylesheet" type="text/css" href="{{asset('assets/styles/libs/datatables-net/datatables.min.css')}}"> <!-- customization -->
    <link rel="stylesheet" type="text/css" href="{{asset('libs/select2/css/select2.min.css')}}"> <!-- Original -->
    <link rel="stylesheet" type="text/css" href="{{asset('assets/styles/libs/select2/select2.min.css')}}">
    <link rel="stylesheet" type="text/css" href="{{asset('css/custom.css')}}">
@endsection

@include('admin.partials.datatables')

@section('content')
    <div class="ks-column ks-page">
        <div class="ks-page-header">
            <section class="ks-title">
                <h3>{{$page_title}}</h3>
            </section>
        </div>
        <div class="ks-page-content">
            <div class="ks-page-content-body ks-content-nav ks-user-list-view">
                <div class="ks-nav-body">
                    <div class="ks-user-list-view-header-block">
                        <h4 class="ks-user-list-view-header-block-name">
                            {{$sub_title}}
                            <span class="ks-user-list-view-header-block-amount">
                                <span class="ks-icon la la-users"></span>
                                <span>{{$nbClients}} candidates</span>
                            </span>
                        </h4>

                        <div class="ks-user-list-view-header-control">
                            <div class=""><a class="addNew btn btn-success"data-url="{{route('clients.create')}}" style="color:white">Add New Client</a></div>
                        </div>
                    </div>
                    <div class="ks-user-list-view-table">
                        <div class="ks-full-table container-fluid">
                            <table id="data_tableClients" class="display table table-striped table-bordered" width="100%" data-url="{{$url}}">
                                <thead>
                                <tr>
                                    @foreach($columns as $col)
                                        <th class="text-center">{{$col['title']}}</th>
                                    @endforeach
                                </tr>
                                </thead>
                            </table>

                            <script>
								var myTable1;
								var columnOptions = [
                                        @foreach($columns as $col)
									{ "data": "{{$col['data']}}", "name": '{{$col['name']}}', "orderable": '{{$col['orderable']}}', "searchable": '{{$col['searchable']}}', "className": '{{$col['className']}}' },
                                    @endforeach
								];
								loadDataTable(myTable1,'data_tableClients', columnOptions);
                            </script>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection