FilamentF
Filament15mo ago
Jessy

Livewire only works with wire:click

I've been facing the issue where for some reason I can not get wire:modal to work.

I've made work around for it now that uses a search button to force the query to run. But I want to use it live version for filtering.

I'm using a Livewire component in a custom filament page.

<?php

namespace App\Livewire;

use Livewire\Component;
use App\Models\Employee;

class EmployeeCards extends Component
{
    public $search = '';
    public $availabilityStart;
    public $availabilityEnd;
    public $age;
    public $language;
    public $sortBy = 'created_at';

    public $employees = [];
    public $availableLanguages = [];

    public function mount()
    {
        $this->filterEmployees(); // Initial data load
    }

    public function filterEmployees()
    {

        // Fetch available languages
        $this->availableLanguages = Employee::pluck('languages')->flatten(1)->pluck('language')->unique()->filter()->values();

        // Get filtered employees
        $query = Employee::query();

        $query->when($this->search, function ($q) {
            $q->where('firstName', 'like', '%' . $this->search . '%')
              ->orWhere('lastName', 'like', '%' . $this->search . '%');
        });

        $query->when($this->availabilityStart && $this->availabilityEnd, function ($q) {
            $q->where('availabilityStart', '<=', $this->availabilityEnd)
              ->where('availabilityEnd', '>=', $this->availabilityStart);
        });

        $query->when($this->age, function ($q) {
            $q->whereRaw('TIMESTAMPDIFF(YEAR, birthdate, CURDATE()) = ?', [$this->age]);
        });

        $query->when($this->language, function ($q) {
            $q->whereJsonContains('languages', [['language' => $this->language]]);
        });

        $this->employees = $query->orderBy($this->sortBy)->get();
    }

    public function render()
    {
        return view('livewire.employee-cards');
    }
}
Was this page helpful?