@extends('layout.app')

@section('content')
    {{-- Filters --}}
    <div class="card card-outline card-primary">
        <div class="card-header">
            <h3 class="card-title">{{ $page_title }}</h3>
        </div>
        <div class="card-body">
            <form method="GET" action="{{ route('api-bandwidth-usages') }}">
                <div class="row">
                    <div class="col-md-3">
                        <div class="form-group">
                            <label>Username</label>
                            <input type="text" name="username" class="form-control form-control-sm"
                                value="{{ request('username') }}" placeholder="Search username...">
                        </div>
                    </div>
                    <div class="col-md-2">
                        <div class="form-group">
                            <label>IP Address</label>
                            <input type="text" name="ip_address" class="form-control form-control-sm"
                                value="{{ request('ip_address') }}" placeholder="e.g. 10.0.0.1">
                        </div>
                    </div>
                    <div class="col-md-2">
                        <div class="form-group">
                            <label>From Date</label>
                            <input type="date" name="from_date" class="form-control form-control-sm"
                                value="{{ request('from_date') }}">
                        </div>
                    </div>
                    <div class="col-md-2">
                        <div class="form-group">
                            <label>To Date</label>
                            <input type="date" name="to_date" class="form-control form-control-sm"
                                value="{{ request('to_date') }}">
                        </div>
                    </div>
                    <div class="col-md-2">
                        <div class="form-group">
                            <label>Status</label>
                            <select name="status" class="form-control form-control-sm">
                                <option value="">All</option>
                                <option value="online"  {{ request('status') == 'online'  ? 'selected' : '' }}>Online</option>
                                <option value="offline" {{ request('status') == 'offline' ? 'selected' : '' }}>Offline</option>
                            </select>
                        </div>
                    </div>
                    <div class="col-md-1 d-flex align-items-end">
                        <div class="form-group w-100">
                            <button type="submit" class="btn btn-primary btn-sm btn-block">
                                <i class="fa fa-search"></i> Search
                            </button>
                        </div>
                    </div>
                </div>
                @if(request()->hasAny(['username','ip_address','from_date','to_date','status']))
                    <div class="row">
                        <div class="col-12">
                            <a href="{{ route('api-bandwidth-usages') }}" class="btn btn-secondary btn-sm">
                                <i class="fa fa-times"></i> Clear Filters
                            </a>
                            <span class="ml-2 text-muted small">
                                Showing {{ $list->firstItem() }}–{{ $list->lastItem() }} of {{ number_format($list->total()) }} results
                            </span>
                        </div>
                    </div>
                @endif
            </form>
        </div>
    </div>

    {{-- Table --}}
    <div class="card">
        <div class="card-body p-0">
            <div class="table-responsive">
                <table class="table table-bordered table-striped table-sm mb-0">
                    <thead class="thead-light">
                        <tr>
                            <th>Session ID</th>
                            <th>Username</th>
                            <th>IP Address</th>
                            <th>MAC Address</th>
                            <th class="text-right">Download</th>
                            <th class="text-right">Upload</th>
                            <th>Login</th>
                            <th>Logout</th>
                            <th>Disconnect Reason</th>
                            <th>Status</th>
                        </tr>
                    </thead>
                    <tbody>
                        @forelse ($list as $r)
                            <tr>
                                <td><small>{{ $r->session_id }}</small></td>
                                <td>{{ $r->username }}</td>
                                <td>{{ $r->ip_address ?? '—' }}</td>
                                <td><small>{{ $r->mac_address ?? '—' }}</small></td>
                                <td class="text-right">{{ number_format($r->downloaded, 2) }} MB</td>
                                <td class="text-right">{{ number_format($r->uploaded, 2) }} MB</td>
                                <td><small>{{ $r->session_start_time }}</small></td>
                                <td><small>{{ $r->session_end_time ?? '—' }}</small></td>
                                <td><small>{{ $r->last_disconnect_reason ?? '—' }}</small></td>
                                <td>
                                    @if(is_null($r->session_end_time))
                                        <span class="badge badge-success">Online</span>
                                    @else
                                        <span class="badge badge-secondary">Offline</span>
                                    @endif
                                </td>
                            </tr>
                        @empty
                            <tr>
                                <td colspan="10" class="text-center text-muted py-4">No records found.</td>
                            </tr>
                        @endforelse
                    </tbody>
                </table>
            </div>

            {{-- Pagination --}}
            @if($list->hasPages())
                <div class="d-flex justify-content-between align-items-center px-3 py-2 border-top">
                    <small class="text-muted">
                        Showing {{ $list->firstItem() }}–{{ $list->lastItem() }} of {{ number_format($list->total()) }} records
                        &nbsp;|&nbsp; Page {{ $list->currentPage() }} of {{ $list->lastPage() }}
                    </small>
                    {{ $list->links() }}
                </div>
            @endif
        </div>
    </div>
@endsection