-
-
Notifications
You must be signed in to change notification settings - Fork 11
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
c17d9ca
commit a215fca
Showing
16 changed files
with
362 additions
and
26 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,23 @@ | ||
# Reordering | ||
|
||
Reordering records in the table can be implemented if your model has an order column to save its position. | ||
|
||
::: info | ||
If you have enabled reordering and no sorting is set by the user, the table will automatically sort its records using the order column. | ||
You don't need an additional column for this. | ||
::: | ||
|
||
By default, reordering records is disabled. It can be enabled by adding the following property to your class: | ||
|
||
```php | ||
protected bool $useReordering = true; | ||
``` | ||
|
||
It will use the column with the name of `order` by default but it can be overwitten like so: | ||
|
||
```php | ||
protected string $reorderingColumn = 'position'; | ||
``` | ||
|
||
If the reordering functionality has been enabled, a new button will show up. When reordering, the button will be activated | ||
and the rows in the table can be dragged and dropped. |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,16 @@ | ||
<button | ||
@class([ | ||
'flex items-center gap-1 px-3 py-2 bg-white border transition ease-in-out rounded-md shadow-sm h-full text-sm' => true, | ||
'active:bg-neutral-100 dark:bg-neutral-800 dark:active:bg-neutral-900' => true, | ||
'border-neutral-200 text-neutral-800 hover:text-neutral-500 focus:border-blue-300 active:text-neutral-800 dark:border-neutral-700 dark:focus:border-blue-600 dark:text-neutral-300 dark:hover:text-white dark:focus:border-blue-600 dark:active:text-white' => ! $this->reordering, | ||
'border-blue-300 text-blue-500 dark:border-blue-600 dark:text-blue-500' => $this->reordering, | ||
]) | ||
title="{{ __('Reordering') }}" | ||
aria-label="{{ __('Reordering') }}" | ||
x-on:click="$wire.set('reordering', ! $wire.reordering)" | ||
> | ||
<!-- Icon "queue-list" (outline) from https://heroicons.com --> | ||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6"> | ||
<path stroke-linecap="round" stroke-linejoin="round" d="M3.75 12h16.5m-16.5 3.75h16.5M3.75 19.5h16.5M5.625 4.5h12.75a1.875 1.875 0 010 3.75H5.625a1.875 1.875 0 010-3.75z" /> | ||
</svg> | ||
</button> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,93 @@ | ||
<?php | ||
|
||
namespace RamonRietdijk\LivewireTables\Concerns; | ||
|
||
use Illuminate\Database\Eloquent\Model; | ||
|
||
trait HasReordering | ||
{ | ||
public bool $reordering = false; | ||
|
||
protected bool $useReordering = false; | ||
|
||
protected string $reorderingColumn = 'order'; | ||
|
||
/** @return array<string, mixed> */ | ||
protected function queryStringHasReordering(): array | ||
{ | ||
if (! $this->useQueryString) { | ||
return []; | ||
} | ||
|
||
return [ | ||
'reordering' => [ | ||
'as' => $this->getQueryStringName('reordering'), | ||
], | ||
]; | ||
} | ||
|
||
public function updatedReordering(): void | ||
{ | ||
$this->selected = []; | ||
$this->selectedPage = false; | ||
} | ||
|
||
public function reorderItem(string $from, string $to, bool $above): void | ||
{ | ||
if ($from === $to) { | ||
return; | ||
} | ||
|
||
/** @var Model $from */ | ||
$from = $this->query()->findOrFail($from); | ||
|
||
/** @var Model $to */ | ||
$to = $this->query()->findOrFail($to); | ||
|
||
$column = $this->reorderingColumn; | ||
|
||
/** @var int $currentOrder */ | ||
$currentOrder = $from->getAttribute($column) ?? 0; | ||
|
||
/** @var int $toOrder */ | ||
$toOrder = $to->getAttribute($column) ?? 0; | ||
|
||
$up = $toOrder > $currentOrder; | ||
|
||
if ($above && $up) { | ||
$newOrder = $toOrder - 1; | ||
} elseif (! $above && ! $up) { | ||
$newOrder = $toOrder + 1; | ||
} else { | ||
$newOrder = $toOrder; | ||
} | ||
|
||
if ($newOrder === $currentOrder) { | ||
return; | ||
} | ||
|
||
if ($up) { | ||
// The new order is higher, meaning that everything between has to go down by one. | ||
$this | ||
->query() | ||
->where($column, '>', $currentOrder) | ||
->where($column, '<=', $newOrder) | ||
->decrement($column); | ||
} else { | ||
// The new order is lower, meaning that everything between has to go up by one. | ||
$this | ||
->query() | ||
->where($column, '<', $currentOrder) | ||
->where($column, '>=', $newOrder) | ||
->increment($column); | ||
} | ||
|
||
$from->setAttribute($column, $newOrder); | ||
$from->save(); | ||
} | ||
|
||
protected function isReordering(): bool | ||
{ | ||
return $this->useReordering && $this->reordering; | ||
} | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,23 @@ | ||
<?php | ||
|
||
namespace RamonRietdijk\LivewireTables\Tests\Fakes\Livewire; | ||
|
||
use RamonRietdijk\LivewireTables\Columns\Column; | ||
use RamonRietdijk\LivewireTables\Livewire\LivewireTable; | ||
use RamonRietdijk\LivewireTables\Tests\Fakes\Models\Blog; | ||
|
||
class ReorderingBlogLivewireTable extends LivewireTable | ||
{ | ||
protected string $model = Blog::class; | ||
|
||
protected bool $useReordering = true; | ||
|
||
protected function columns(): array | ||
{ | ||
return [ | ||
Column::make(__('Title'), 'title') | ||
->sortable() | ||
->searchable(), | ||
]; | ||
} | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.