🍲dfcv🏰dd⋉(● ∸ ●)⋊@% PNG %k25u25%fgd5n! PNG %k25u25%fgd5n!# Reusable AJAX search pattern

This is the reusable pattern for customer, supplier, and item AJAX search components.

## 1) Controller pattern

### Customer report
```php
public function customerPaymentsReport(Request $request)
{
    $selectedCustomerId = $request->input('customer_id');
    $selectedCustomerName = null;

    if ($selectedCustomerId) {
        $selectedCustomerName = Customer::where('id', $selectedCustomerId)
            ->where('active', 1)
            ->value('company_name');
    }

    // build $data, $filters, $summary, etc.

    return view('reports.customer_payments', compact(
        'data',
        'filters',
        'summary',
        'selectedCustomerId',
        'selectedCustomerName',
        // ...
    ));
}
```

### Supplier report
```php
public function supplierReport(Request $request)
{
    $selectedSupplierId = $request->input('supplier_id');
    $selectedSupplierName = null;

    if ($selectedSupplierId) {
        $selectedSupplierName = Supplier::where('id', $selectedSupplierId)
            ->where('active', 1)
            ->value('company_name');
    }

    return view('reports.supplier_report', compact(
        'selectedSupplierId',
        'selectedSupplierName',
        // ...
    ));
}
```

### Item report
```php
public function itemFlow(Request $request)
{
    $selectedItemId = $request->input('item_id');
    $selectedItemName = null;

    if ($selectedItemId) {
        $selectedItemName = Item::where('id', $selectedItemId)
            ->where('active', 1)
            ->value('name');
    }

    return view('reports.item_flow', compact(
        'selectedItemId',
        'selectedItemName',
        // ...
    ));
}
```

## 2) View pattern

### Customer search include
```blade
@section('extra-filters')
    @include('components.ajax-customer-search')
    <div class="col-auto">
        <button type="submit" class="btn btn-primary">Generate</button>
    </div>
@endsection
```

### Supplier search include
```blade
@section('extra-filters')
    @include('components.ajax-supplier-search')
    <div class="col-auto">
        <button type="submit" class="btn btn-primary">Generate</button>
    </div>
@endsection
```

### Item search include
```blade
@section('extra-filters')
    @include('components.ajax-item-search')
    <div class="col-auto">
        <button type="submit" class="btn btn-primary">Generate</button>
    </div>
@endsection
```

## 3) Form usage

```blade
<form method="GET" action="{{ route('reports.customer_payments') }}">
    <div class="row gy-3">
        @include('components.ajax-customer-search')
        @include('components.ajax-supplier-search')
        @include('components.ajax-item-search')

        <div class="col-auto">
            <button type="submit" class="btn btn-primary">Generate</button>
        </div>
    </div>
</form>
```

## 4) How it works

- Each component renders a text input and a hidden input.
- The text input is used for searching and showing the selected label.
- The hidden input stores the selected ID.
- When the user selects an option, the hidden field is filled.
- On submit, the controller receives `customer_id`, `supplier_id`, or `item_id`.
- The controller looks up the name and passes it back so the search field remains filled.

## 5) Optional reusable helper

```php
protected function getSelectedName($modelClass, $id, $column = 'name')
{
    return $id
        ? $modelClass::where('id', $id)
            ->where('active', 1)
            ->value($column)
        : null;
}
```

Then use it like this:

```php
$selectedCustomerName = $this->getSelectedName(Customer::class, $selectedCustomerId, 'company_name');
```

## 6) Component names

- `@include('components.ajax-customer-search')`
- `@include('components.ajax-supplier-search')`
- `@include('components.ajax-item-search')`

Use these includes in your Blade views and the component script will initialize automatically.