diff --git a/app/Livewire/Components/Table.php b/app/Livewire/Components/Table.php new file mode 100644 index 0000000..1675169 --- /dev/null +++ b/app/Livewire/Components/Table.php @@ -0,0 +1,69 @@ +sortField === $field) { + $this->sortDirection = $this->sortDirection === 'asc' ? 'desc' : 'asc'; + } else { + $this->sortField = $field; + $this->sortDirection = 'asc'; + } + } + + // Calculate total pages for pagination + public function calculateTotalPages() + { + return ceil(count($this->rows) / $this->perPage); + } + + // Get the paginated rows for the current page + public function getPaginatedRowsProperty() + { + $sorted = collect($this->rows); + + if ($this->sortField) { + $sorted = $this->sortDirection === 'asc' + ? $sorted->sortBy($this->sortField) + : $sorted->sortByDesc($this->sortField); + } + + return $sorted + ->slice(($this->currentPage - 1) * $this->perPage, $this->perPage) + ->values(); + } + + + // Set the current page for pagination + public function setPage($page) + { + $this->currentPage = max(1, min($this->calculateTotalPages(), $page)); + } + + public function render() + { + return view('livewire.components.table', [ + 'paginatedRows' => $this->paginatedRows, // 👈 explicitly pass computed property + ]); + } + +} \ No newline at end of file diff --git a/app/Livewire/UserManagement.php b/app/Livewire/UserManagement.php index 0aaae0b..b2e7728 100644 --- a/app/Livewire/UserManagement.php +++ b/app/Livewire/UserManagement.php @@ -7,82 +7,42 @@ use Livewire\Component; class UserManagement extends Component { public $search = ''; - public $sortField = 'username'; - public $sortDirection = 'asc'; - public $currentPage = 1; - public $perPage = 10; - public $expandEllipsis = false; + public $users = []; protected $queryString = ['search']; - protected $listeners = ['paginate-to' => 'setPage']; - + // Reset the current page when search is updated public function updatingSearch() { - $this->currentPage = 1; + $this->search = $this->search; } - public function sortBy($field) + public function mount() { - if ($this->sortField === $field) { - $this->sortDirection = $this->sortDirection === 'asc' ? 'desc' : 'asc'; - } else { - $this->sortField = $field; - $this->sortDirection = 'asc'; - } + $this->loadUsers(); } - public function searchEnter() - { - $this->currentPage = 1; - } - - public function getFilteredUsersProperty() + // Get filtered users based on the search input + public function loadUsers() { $users = collect(json_decode(file_get_contents(storage_path('app/users.json')), true)); - + if ($this->search) { - $users = $users->filter(function ($user) { + $this->users = $users->filter(function ($user) { return str_contains(strtolower($user['username']), strtolower($this->search)) || str_contains(strtolower($user['first_name']), strtolower($this->search)) || str_contains(strtolower($user['last_name']), strtolower($this->search)) || str_contains(strtolower($user['email']), strtolower($this->search)); }); + } else { + $this->users = $users; } - - return $users->sortBy([[$this->sortField, $this->sortDirection]])->values(); - } - - // Change this to a method instead of a property - public function calculateTotalPages() - { - return ceil($this->filteredUsers->count() / $this->perPage); - } - - public function getPaginatedUsersProperty() - { - return $this->filteredUsers - ->slice(($this->currentPage - 1) * $this->perPage, $this->perPage) - ->values(); - } - - public function setPage($page) - { - $this->currentPage = max(1, min($this->calculateTotalPages(), $page)); - $this->expandEllipsis = false; - } - public function toggleEllipsis() - { - $this->expandEllipsis = !$this->expandEllipsis; } public function render() { return view('livewire.user-management.user-management', [ - 'users' => $this->paginatedUsers, - 'totalPages' => $this->calculateTotalPages(), // Now using the method - 'currentPage' => $this->currentPage, - 'expandEllipsis' => $this->expandEllipsis, + 'users' => $this->users, // Pass filtered users here ]); } -} +} \ No newline at end of file diff --git a/resources/views/livewire/components/table.blade.php b/resources/views/livewire/components/table.blade.php new file mode 100644 index 0000000..c0aee1d --- /dev/null +++ b/resources/views/livewire/components/table.blade.php @@ -0,0 +1,112 @@ +
+
+
+ @if ($searchable) + + @endif + @if ($addButtonLabel) + + @endif +
+ + + + + @if ($checkboxes) + + @endif + + @foreach ($columns as $col) + + @endforeach + + {{-- Status Column --}} + + {{-- Actions Column --}} + + + @if ($showActions) + + @endif + + + + @forelse ($paginatedRows as $row) + + @if ($checkboxes) + + @endif + + @foreach ($columns as $col) + + @endforeach + + @if ($showActions) + + @endif + + @empty + + + + @endforelse + +
+
+ {{ $col['label'] }} + + {{-- Sort Icons --}} + @if ($sortField === $col['field']) + @if ($sortDirection === 'asc') + {{-- Ascending Icon --}} + + + + @else + {{-- Descending Icon --}} + + + + @endif + @else + {{-- Neutral Sort Icon --}} + + + + @endif +
+ 		Action
+ {{ $row[$col['field']] ?? '-' }} + + @foreach ($actions as $action) + + @endforeach +
+ No data found. +
+ + {{-- Pagination Controls --}} +
+ @for ($page = 1; $page <= $this->calculateTotalPages(); $page++) + + @endfor +
+
+
diff --git a/resources/views/livewire/notification/notification.blade.php b/resources/views/livewire/notification/notification.blade.php index 1fe53c4..8f06873 100644 --- a/resources/views/livewire/notification/notification.blade.php +++ b/resources/views/livewire/notification/notification.blade.php @@ -2,4 +2,5 @@ {{-- Top Nav --}} @include('livewire.notification.top-nav.notification')

This is notification page

- \ No newline at end of file + + diff --git a/resources/views/livewire/user-management/user-management.blade.php b/resources/views/livewire/user-management/user-management.blade.php index ec60e56..eba18cb 100644 --- a/resources/views/livewire/user-management/user-management.blade.php +++ b/resources/views/livewire/user-management/user-management.blade.php @@ -1,62 +1,24 @@
- {{-- Top Nav --}} - @include('livewire.user-management.top-nav.user-management') - -
-
- - -
- - - - - - @foreach(['username', 'first_name', 'last_name', 'role', 'email', 'status'] as $field) - - @endforeach - - - - - @forelse($users as $user) - - - - - - - - - - - @empty - - - - @endforelse - -
-
- {{ ucfirst(str_replace('_', ' ', $field)) }} - {{-- Use one consistent icon for all headers --}} - - - -
- 		Action
{{ $user['username'] }}{{ $user['first_name'] }}{{ $user['last_name'] }}{{ $user['role'] }}{{ $user['email'] }}{{ $user['status'] }} - - - -
No users found.
- - {{-- Pagination using component --}} - -
+@include('livewire.user-management.top-nav.user-management') +