@extends('layouts.master')

@section('title', 'White Listed')
@section('css')
	<link href="{{ URL::asset('build/plugins/datatable/css/dataTables.bootstrap5.min.css') }}" rel="stylesheet" />
@endsection 
@section('content')
<x-page-title title="Contacts" pagetitle="Contacts listed to access specific ussd codes" />
		<h6 class="mb-0 text-uppercase">WHITELISTED CONTACTS</h6>
		<hr>
		<div class="card">
			<div class="card-body">
				<div class="table-responsive">
					<table id="example2" class="table table-striped table-bordered">
						<thead>
							<tr>
								<th>Mobile</th>
								
							</tr>
						</thead>
                        <tbody>
                            @forelse ($data as $user )
                                <tr>
                                    <td>{{$user->phone_number}}</td>
                                   
                                </tr>
                            @empty
                                
                            @endforelse
                        </tbody>
						
						<tfoot>
							<tr>
								<th>Mobile</th>
								
							</tr>
						</tfoot>
					</table>
				</div>
                {{-- <div>
                    {{$data->render()}}
                </div> --}}
                <a href="{{route("white-list")}}" class="btn btn-primary">Upload Contacts</a>
			</div>
		</div>
@endsection 
@section('scripts')  

  <script src="{{ URL::asset('build/plugins/datatable/js/jquery.dataTables.min.js') }}"></script>
	<script src="{{ URL::asset('build/plugins/datatable/js/dataTables.bootstrap5.min.js') }}"></script>
	<script>
		$(document).ready(function() {
			$('#example').DataTable();
		  } );
	</script>
	<script>
		$(document).ready(function() {
			var table = $('#example2').DataTable( {
				lengthChange: false,
				buttons: [ 'copy', 'excel', 'pdf']
			} );
		 
			table.buttons().container()
				.appendTo( '#example2_wrapper .col-md-6:eq(0)' );
		} );
	</script>
@endsection