@extends('admin.layouts.master')
@section('title', USERS_TITLE_ADMIN)
@section('content')
@include('admin.layouts.flash_message')
<style>

</style>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/lightbox2/2.8.2/css/lightbox.min.css">

<script src="https://cdnjs.cloudflare.com/ajax/libs/lightbox2/2.8.2/js/lightbox.min.js"></script>
<h4 class="fw-bold py-3 mb-4">
    <span class="text-muted fw-light">
        <ol class="breadcrumb float-end">
            <li> <a class="bread-item" href="{{ route('admin.dashboard') }}"> Dashboard </a></li>
            <li> <span class="inactive-bread">{{ USERS_TITLE_ADMIN }}</span></li>
        </ol>
    </span>
    {{ USERS_TITLE_ADMIN }}
</h4>

<!-- Bootstrap Table with Caption -->
<div class="card">
    <h5 class="card-header">{{ USERS_TITLE_ADMIN }}
        {!! addButton('admins',USERS_TITLE_ADMIN) !!}
    </h5>
    <div class="card-body">
        <div class="table-responsive text-nowrap">
            <table class="table data-table hover stripe stripe">
                <thead>
                    <tr>
                        <th>Id</th>
                        <th>Profile Picture</th>
                        <th>Username</th>
                        <th>Email</th>
                        <th>User Devices</th>
                        <th>Posts List</th>
                        <th>Followers List</th>
                        <th>Blocked List</th>
                        <th>Reported List</th>
                        <th>Status</th>
                        <th>Action</th>
                    </tr>
                </thead>
                <tbody>

                </tbody>
            </table>
        </div>
    </div>
</div>
<script type="text/javascript">
    var table = $('.data-table').DataTable({
        processing: true,
        serverSide: true,
        scrollY: '600px',
        "bStateSave": true,
        "fnStateSave": function (oSettings, oData) {
            localStorage.setItem('offersDataTables', JSON.stringify(oData));
        },
        "fnStateLoad": function (oSettings) {
            return JSON.parse(localStorage.getItem('offersDataTables'));
        },
        fixedHeader: true,
        ajax:{
            url: "{{ route('users.index')}}",
            data: function(d){
                d.user_id = '{{ $id }}';
            },
        },
        columns: [
            {data: 'DT_RowIndex', name: 'DT_RowIndex'},
            {data: 'profilepic', name: 'profilepic'},
            {data: 'username', name: 'username'},
            {data: 'email', name: 'email'},
            {data: 'user_devices', name: 'user_devices'},
            {data: 'user_posts', name: 'user_posts'},
            {data: 'user_followers', name: 'user_followers'},
            {data: 'user_blocked', name: 'user_blocked'},
            {data: 'user_reported', name: 'user_reported'},
            {data: 'status', name: 'status'},
            {data: 'action', name: 'action', orderable: false, searchable: false},
        ]
    });
</script>

@endsection