@extends('layouts.user')

@section('content')
@push('css')
    <!-- DataTables -->
    <link href="{{ asset('') }}/assets/libs/datatables.net-bs4/css/dataTables.bootstrap4.min.css" rel="stylesheet" type="text/css" />
    <link href="{{ asset('') }}/assets/libs/datatables.net-buttons-bs4/css/buttons.bootstrap4.min.css" rel="stylesheet" type="text/css" />

    <!-- Responsive datatable examples -->
    <link href="{{ asset('') }}/assets/libs/datatables.net-responsive-bs4/css/responsive.bootstrap4.min.css" rel="stylesheet" type="text/css" />

    <link href="{{ asset('') }}/assets/libs/select2/css/select2.min.css" rel="stylesheet" type="text/css" />
@endpush
<div class="container-fluid">
    <div class="row">        
        <div class="col-md-12">
            <div class="card">
                <div class="card-header">
                    <div class="row">
                        <div class="col-md-12">
                            <h5 align="center">Joining Lists</h5>
                    </div>
                      <div class="card-body">
                    <div class="table-responsive">
                        <table id="datatable-buttons" class="table table-striped table-bordered w-100">
                            <thead>
                                <tr>
                                    <th>SL.</th>
                                    <th>Picture</th>
                                    <th>Name</th>
                                    <th>User ID</th>
                                    <th>Phone</th>
                                    <th>Gender</th>
                                    <th>Religion</th>
                                </tr>
                            </thead>
                            <tbody>
                                @if(count($users)>0)
                                @foreach($users as $key =>  $row)
                                <tr>
                                    <td>{{ ++$key }}</td>
                                    <td><img style="height:35px;border-radius: 50%;" src="{{ $row->picture ? asset('uploads/users/'.$row->picture) : default_image()}}"></td>
                                    <td>{{ $row->name }}</td>
                                    <td>{{ $row->user_id }}</td>
                                    <td>{{ $row->phone_number }}</td>
                                    <td>{{ $row->gender }}</td>
                                    <td>{{ $row->religion }}</td>
                                </tr>
                                @endforeach
                                @endif
                            </tbody>                            
                        </table>
                    </div>
                    
                </div>
              
                </div>
            </div>
        </div> <!-- end col -->                                                              
    </div><!--end row-->
    
</div> <!-- container-fluid -->
@push('alljs')
          <!-- Required datatable js -->
    <script src="{{ asset('') }}/assets/libs/datatables.net/js/jquery.dataTables.min.js"></script>
    <script src="{{ asset('') }}/assets/libs/datatables.net-bs4/js/dataTables.bootstrap4.min.js"></script>
    <!-- Buttons examples -->
    <script src="{{ asset('') }}/assets/libs/datatables.net-buttons/js/dataTables.buttons.min.js"></script>
    <script src="{{ asset('') }}/assets/libs/datatables.net-buttons-bs4/js/buttons.bootstrap4.min.js"></script>
    <script src="{{ asset('') }}/assets/libs/jszip/jszip.min.js"></script>
    <script src="{{ asset('') }}/assets/libs/pdfmake/build/pdfmake.min.js"></script>
    <script src="{{ asset('') }}/assets/libs/pdfmake/build/vfs_fonts.js"></script>
    <script src="{{ asset('') }}/assets/libs/datatables.net-buttons/js/buttons.html5.min.js"></script>
    <script src="{{ asset('') }}/assets/libs/datatables.net-buttons/js/buttons.print.min.js"></script>
    <script src="{{ asset('') }}/assets/libs/datatables.net-buttons/js/buttons.colVis.min.js"></script>
    <!-- Responsive examples -->
    <script src="{{ asset('') }}/assets/libs/datatables.net-responsive/js/dataTables.responsive.min.js"></script>
    <script src="{{ asset('') }}/assets/libs/datatables.net-responsive-bs4/js/responsive.bootstrap4.min.js"></script>

    <!-- Datatable init js -->
    <script src="{{ asset('') }}/assets/js/pages/datatables.init.js"></script>

    <script src="{{ asset('') }}/assets/libs/select2/js/select2.min.js"></script>
    <script src="{{ asset('') }}/assets/js/pages/form-advanced.init.js"></script>

    @if ($message = Session::get('error'))
    <script type="text/javascript">
        var msg = '{{$message}} ';   
        show_toast('error',msg);
    </script>
    @endif
    @if ($message = Session::get('success'))
    <script type="text/javascript">
        var msg = '{{$message}} ';   
        show_toast('success',msg);
    </script>
    @endif
@endpush
@endsection