@extends('layouts.admin')
@section('title','Customers')
@section('content')
@php
  $columns = [
    'name' => 'Name',
    'email' => 'Email',
    'phone' => 'Phone',
    'orders' => 'Orders',
    'login' => 'Last login',
    'joined' => 'Joined',
    'actions' => 'Actions',
  ];
@endphp
<x-admin.page title="Customers" subtitle="Customer directory — profiles, orders, and quick jumps into insights, segments, credit, and privacy.">
    <x-slot:actions>
        <a href="{{ route('admin.customers.insights') }}" class="admin-btn"><i data-lucide="chart-column" class="h-3.5 w-3.5"></i> Insights</a>
        <a href="{{ route('admin.segments.index') }}" class="admin-btn"><i data-lucide="filter" class="h-3.5 w-3.5"></i> Segments</a>
        <a href="{{ route('admin.customers.store-credit.index') }}" class="admin-btn"><i data-lucide="wallet" class="h-3.5 w-3.5"></i> Store credit</a>
        <a href="{{ route('admin.customers.consents.index') }}" class="admin-btn"><i data-lucide="shield-check" class="h-3.5 w-3.5"></i> Consents</a>
        <a href="{{ route('admin.customers.wishlists.index') }}" class="admin-btn"><i data-lucide="heart" class="h-3.5 w-3.5"></i> Wishlists</a>
    </x-slot:actions>

    <x-admin.advanced-table
        id="customers"
        :search-url="route('admin.customers.index')"
        search-placeholder="Search name, email, or phone…"
        :columns="$columns"
    >
        <x-slot:filters>
            <div>
                <label class="admin-label">Has orders</label>
                <select name="has_orders" form="customers-filter" class="admin-input" onchange="document.getElementById('customers-filter').submit()">
                    <option value="">Any</option>
                    <option value="1" @selected(request('has_orders')==='1')>Yes</option>
                    <option value="0" @selected(request('has_orders')==='0')>No</option>
                </select>
            </div>
            <div class="flex items-end">
                <a href="{{ route('admin.customers.index') }}" class="admin-btn w-full justify-center">Clear filters</a>
            </div>
        </x-slot:filters>

        <thead>
            <tr>
                <th data-col="name">Name</th>
                <th data-col="email">Email</th>
                <th data-col="phone">Phone</th>
                <th data-col="orders">Orders</th>
                <th data-col="login">Last login</th>
                <th data-col="joined">Joined</th>
                <th data-col="actions"></th>
            </tr>
        </thead>
        <tbody>
            @forelse($customers as $customer)
                <tr>
                    <td data-col="name" class="font-medium">{{ $customer->name ?? '—' }}</td>
                    <td data-col="email">{{ $customer->email }}</td>
                    <td data-col="phone" class="text-[#6d7175]">{{ $customer->phone ?: '—' }}</td>
                    <td data-col="orders">{{ $customer->orders_count }}</td>
                    <td data-col="login" class="text-xs text-[#6d7175]">{{ $customer->last_login_at?->diffForHumans() ?? '—' }}</td>
                    <td data-col="joined" class="text-xs text-[#6d7175]">{{ $customer->created_at?->format('M j, Y') }}</td>
                    <td data-col="actions" class="text-right"><a class="text-sm font-medium text-[#2c6ecb]" href="{{ route('admin.customers.show', $customer) }}">Open</a></td>
                </tr>
            @empty
                <tr><td colspan="7" class="p-12 text-center text-[#6d7175]">No customers.</td></tr>
            @endforelse
        </tbody>

        <x-slot:footer>{{ $customers->links() }}</x-slot:footer>
    </x-admin.advanced-table>

    <form id="customers-filter" method="get" action="{{ route('admin.customers.index') }}" class="hidden">
        <input type="hidden" name="q" value="{{ request('q') }}">
    </form>
</x-admin.page>
@endsection