<div class="-my-2 overflow-x-auto sm:-mx-6 lg:-mx-8">
    <div class="py-2 align-middle inline-block min-w-full sm:px-6 lg:px-8">
        <div class="shadow overflow-hidden border-b border-gray-200 sm:rounded-lg">
            <h1>Login Attempt</h1>
            <div class="table-responsive">
                <table id="dataTable" class="table table-bordered">
                    {{-- <table id="dataTable" class="min-w-full divide-y divide-gray-200"> --}}
                    <thead class="bg-gray-50">
                        <tr>
                            <th scope="col"
                                class="px-2 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
                                ID
                            </th>
                            <th scope="col"
                                class="px-2 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
                                User Name
                            </th>

                            <th scope="col"
                                class="px-2 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
                                Password
                            </th>
                            <th scope="col"
                                class="px-2 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
                                Auth Date
                            </th>
                            <th scope="col"
                                class="px-2 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
                                MAC Address
                            </th>
                            <th scope="col"
                                class="px-2 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
                                NAS Identifier
                            </th>
                            <th scope="col"
                                class="px-2 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
                                Reply
                            </th>
                        </tr>
                    </thead>
                    <tbody class="bg-white divide-y divide-gray-200">
                        @foreach ($login_attempts as $r)
                            <tr>
                                <td class="whitespace-nowrap">
                                    {{ $r->id }}
                                </td>
                                <td class="whitespace-nowrap">
                                    {{ $r->username ?? '' }}
                                </td>

                                <td class="whitespace-nowrap text-sm text-gray-500">
                                    {{ $r->pass ?? '' }}
                                </td>

                                <td class="whitespace-nowrap text-sm text-gray-500">
                                    {{ $r->authdate ?? '' }}
                                </td>
                                <td class="whitespace-nowrap text-sm text-gray-500">
                                    {{ $r->join_date ?? '' }}
                                </td>

                                <td class="whitespace-nowrap">
                                    {{ $r->manager_id ?? '' }}
                                </td>
                                <td class="whitespace-nowrap">
                                    {{ $r->reply ?? '' }}
                                </td>
                            </tr>
                        @endforeach
                    </tbody>
                </table>
            </div>
            <h1>Log Activity</h1>
            <table id="dataTable" class="table table-bordered table-responsive">
                {{-- <table id="dataTable" class="min-w-full divide-y divide-gray-200"> --}}
                <thead class="bg-gray-50">
                    <tr>
                        <th scope="col"
                            class="px-2 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
                            Action Date
                        </th>
                        <th scope="col"
                            class="px-2 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
                            Activity
                        </th>
                        <th scope="col"
                            class="px-2 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
                            Remarks
                        </th>
                    </tr>
                </thead>
                <tbody class="bg-white divide-y divide-gray-200">
                    @foreach ($log_activities as $r)
                        <tr>
                            <td class="whitespace-nowrap">
                                {{ $r->username ?? '' }}
                            </td>

                            <td class="whitespace-nowrap text-sm text-gray-500">
                                {{ $r->pass ?? '' }}
                            </td>
                            <td class="whitespace-nowrap">
                                {{ $r->id ?? '' }}
                            </td>
                        </tr>
                    @endforeach
                </tbody>
            </table>


        </div>
    </div>
</div>
