@extends('layouts.admin')

@section('title', 'Accounts')

@section('content')
<div class="page-header">
    <div>
        <h1 class="page-title">All Accounts <span class="page-title-count">({{ $accounts->total() ?? 0 }})</span></h1>
    </div>
</div>

<div class="card">
    <div class="card-header">
        <form method="GET" action="{{ route('admin.accounts') }}" class="filter-bar">
            <div class="filter-search">
                <svg width="18" height="18" viewBox="0 0 18 18" fill="none"><circle cx="8" cy="8" r="5.5" stroke="currentColor" stroke-width="1.5"/><path d="M12 12l4 4" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/></svg>
                <input type="text" name="search" value="{{ request('search') }}" placeholder="Search by account number, customer name..." class="filter-search-input">
            </div>
            <div class="filter-group">
                <select name="type" class="filter-select">
                    <option value="">All Types</option>
                    <option value="savings" {{ request('type') === 'savings' ? 'selected' : '' }}>Savings</option>
                    <option value="current" {{ request('type') === 'current' ? 'selected' : '' }}>Current</option>
                    <option value="fixed" {{ request('type') === 'fixed' ? 'selected' : '' }}>Fixed Deposit</option>
                </select>
            </div>
            <div class="filter-group">
                <select name="status" class="filter-select">
                    <option value="">All Status</option>
                    <option value="active" {{ request('status') === 'active' ? 'selected' : '' }}>Active</option>
                    <option value="suspended" {{ request('status') === 'suspended' ? 'selected' : '' }}>Suspended</option>
                    <option value="closed" {{ request('status') === 'closed' ? 'selected' : '' }}>Closed</option>
                </select>
            </div>
            <button type="submit" class="btn btn-primary btn-sm">Filter</button>
            @if(request('search') || request('type') || request('status'))
            <a href="{{ route('admin.accounts') }}" class="btn btn-outline btn-sm">Clear</a>
            @endif
        </form>
    </div>

    <x-data-table :emptyMessage="'No accounts found.'" :paginator="$accounts ?? null">
        <x-slot:thead>
            <th>Account Number</th>
            <th>Customer</th>
            <th>Type</th>
            <th>Balance</th>
            <th>Status</th>
            <th>Actions</th>
        </x-slot:thead>
        <x-slot:tbody>
            @forelse($accounts ?? [] as $account)
            <tr>
                <td><span class="text-mono">{{ $account->account_number }}</span></td>
                <td>
                    <div class="table-user">
                        <span class="text-semibold">{{ $account->user->name ?? 'N/A' }}</span>
                    </div>
                </td>
                <td><span class="badge badge-blue">{{ ucfirst($account->type) }}</span></td>
                <td class="text-semibold">{{ $currency ?? '₦' }}{{ number_format($account->balance, 2) }}</td>
                <td><span class="badge badge-{{ $account->status === 'active' ? 'green' : 'red' }}">{{ ucfirst($account->status) }}</span></td>
                <td>
                    <div class="table-actions">
                        <a href="{{ route('admin.accounts.show', $account->id) }}" class="btn btn-sm btn-outline" title="View">View</a>
                        @if($account->status === 'active')
                        <form method="POST" action="{{ route('admin.accounts.suspend', $account->id) }}" class="inline">
                            @csrf
                            @method('PATCH')
                            <button type="submit" class="btn btn-sm btn-outline btn-orange" title="Suspend" onclick="return confirm('Suspend this account?')">Suspend</button>
                        </form>
                        @else
                        <form method="POST" action="{{ route('admin.accounts.activate', $account->id) }}" class="inline">
                            @csrf
                            @method('PATCH')
                            <button type="submit" class="btn btn-sm btn-outline btn-green" title="Activate" onclick="return confirm('Activate this account?')">Activate</button>
                        </form>
                        @endif
                    </div>
                </td>
            </tr>
            @empty
            <tr>
                <td colspan="6">
                    <div class="data-table-empty-content">
                        <svg width="48" height="48" viewBox="0 0 48 48" fill="none"><circle cx="24" cy="24" r="24" fill="#F1F5F9"/><rect x="12" y="14" width="24" height="18" rx="3" stroke="#94A3B8" stroke-width="1.5"/><path d="M12 21h24" stroke="#94A3B8" stroke-width="1.5"/></svg>
                        <p>No accounts found.</p>
                    </div>
                </td>
            </tr>
            @endforelse
        </x-slot:tbody>
    </x-data-table>
</div>
@endsection