@extends('layouts.admin')

@section('title', 'Customers')
@section('page_title', 'Customers')

@section('toolbar')
    <a href="{{ route('admin.customers.create') }}" class="kt-btn kt-btn-primary">
        <i class="ki-filled ki-plus"></i>
        Add Customer
    </a>
@endsection

@section('content')
<div class="kt-card">
    <div class="kt-card-header">
        <h3 class="kt-card-title">Registered users</h3>
        <form method="GET" class="mw-admin-filters">
            <input class="kt-input" type="search" name="q" value="{{ request('q') }}" placeholder="Name, email, or phone">
            <select class="kt-select" name="role">
                <option value="">All roles</option>
                <option value="customer" @selected(request('role')==='customer')>Customer</option>
                <option value="admin" @selected(request('role')==='admin')>Admin</option>
            </select>
            <button class="kt-btn kt-btn-outline shrink-0" type="submit">Filter</button>
        </form>
    </div>
    <div class="kt-card-content p-0">
        <div class="kt-scrollable-x-auto">
            <table class="kt-table table-auto">
                <thead>
                    <tr>
                        <th>Customer</th>
                        <th>Phone</th>
                        <th>Role</th>
                        <th>Orders</th>
                        <th>Spent</th>
                        <th>Joined</th>
                        <th class="mw-cell-actions">Actions</th>
                    </tr>
                </thead>
                <tbody>
                    @forelse($customers as $customer)
                        <tr>
                            <td class="min-w-[220px]">
                                <a class="font-medium text-primary" href="{{ route('admin.customers.show', $customer) }}">{{ $customer->name }}</a>
                                <div class="text-xs text-secondary-foreground">{{ $customer->email }}</div>
                            </td>
                            <td>{{ $customer->phone ?: '—' }}</td>
                            <td><span class="kt-badge kt-badge-outline kt-badge-sm">{{ ucfirst($customer->role) }}</span></td>
                            <td>{{ $customer->orders_count }}</td>
                            <td>₹{{ number_format($customer->spent ?? 0, 0) }}</td>
                            <td>{{ $customer->created_at->format('d M Y') }}</td>
                            <td class="mw-cell-actions">
                                <div class="flex gap-2">
                                    <a class="kt-btn kt-btn-sm kt-btn-outline" href="{{ route('admin.customers.show', $customer) }}">View</a>
                                    <a class="kt-btn kt-btn-sm kt-btn-outline" href="{{ route('admin.customers.edit', $customer) }}">Edit</a>
                                </div>
                            </td>
                        </tr>
                    @empty
                        <tr><td colspan="7" class="text-center py-8 text-secondary-foreground">No registered users found</td></tr>
                    @endforelse
                </tbody>
            </table>
        </div>
    </div>
    <div class="kt-card-footer">{{ $customers->links('pagination::simple-default') }}</div>
</div>
@endsection