@extends('layouts.app')
@section('title','Customers')
@section('content')
<div class="d-flex flex-wrap justify-content-between gap-2 mb-3"><h1 class="h4 mb-0">Customers</h1><a href="{{ route('customers.create') }}" class="btn btn-primary">Add customer</a></div>
<form class="mb-3"><div class="input-group"><input name="q" value="{{ $q }}" class="form-control" placeholder="Search by name, phone or email"><button class="btn btn-outline-primary">Search</button></div></form>
<div class="panel table-responsive"><table class="table table-hover align-middle mb-0">
  <thead><tr><th>Name</th><th>Phone</th><th>Email</th><th>Jobs</th><th></th></tr></thead>
  <tbody>@forelse($customers as $c)
    <tr><td><a class="fw-semibold" href="{{ route('customers.show', $c) }}">{{ $c->name }}</a></td><td>{{ $c->phone }}</td><td>{{ $c->email }}</td><td>{{ $c->jobs_count }}</td>
    <td class="text-end"><a href="{{ route('jobs.create', ['customer_id'=>$c->id]) }}" class="btn btn-sm btn-outline-primary">New job</a></td></tr>
  @empty<tr><td colspan="5" class="p-4 text-muted">No customers found.</td></tr>@endforelse</tbody></table></div>
<div class="mt-3">{{ $customers->links() }}</div>
@endsection