@extends('layouts.app')
@section('title', __('Manage Clients'))

@section('content')
    <div class="mb-4 flex flex-wrap items-center justify-between gap-3">
        <form method="GET" class="flex items-center gap-2">
            <input type="text" name="q" value="{{ request('q') }}" class="input max-w-xs" placeholder="{{ __('Search name, phone, email') }}">
            <button class="btn-secondary"><x-icon name="search" class="h-4 w-4"/>{{ __('Search') }}</button>
        </form>
        <a href="{{ route('clients.create') }}" class="btn-primary"><x-icon name="plus" class="h-4 w-4"/>{{ __('New Client') }}</a>
    </div>

    <div class="table-wrap">
        <table class="min-w-full divide-y divide-slate-100">
            <thead class="bg-slate-50"><tr>
                <th class="th">{{ __('Name') }}</th><th class="th">{{ __('Phone') }}</th><th class="th">{{ __('Email') }}</th>
                <th class="th">{{ __('Sales') }}</th><th class="th">{{ __('Balance') }}</th><th class="th"></th>
            </tr></thead>
            <tbody class="divide-y divide-slate-100">
                @forelse ($clients as $client)
                    <tr class="hover:bg-slate-50">
                        <td class="td font-medium">{{ $client->name }}</td>
                        <td class="td">{{ $client->phone ?? '—' }}</td>
                        <td class="td">{{ $client->email ?? '—' }}</td>
                        <td class="td">{{ $client->sales_count }}</td>
                        <td class="td">{{ money($client->balance) }}</td>
                        <td class="td text-right">
                            <div class="flex justify-end gap-2">
                                <a href="{{ route('clients.show', $client) }}" class="text-slate-400 hover:text-slate-600"><x-icon name="search" class="h-4 w-4"/></a>
                                <a href="{{ route('clients.edit', $client) }}" class="text-brand-600"><x-icon name="pencil" class="h-4 w-4"/></a>
                                <form method="POST" action="{{ route('clients.destroy', $client) }}" onsubmit="return confirm('{{ __('Delete client?') }}')">@csrf @method('DELETE')
                                    <button class="text-red-500"><x-icon name="trash" class="h-4 w-4"/></button>
                                </form>
                            </div>
                        </td>
                    </tr>
                @empty
                    <tr><td colspan="6" class="td py-10 text-center text-slate-400">{{ __('No clients.') }}</td></tr>
                @endforelse
            </tbody>
        </table>
    </div>
    <div class="mt-4">{{ $clients->links() }}</div>
@endsection