Sortable

Wire Sortable

Přeřaditelné řádky a sloupce pro wire-table. Řazení řádků se perzistuje do databázového sloupce. Řazení sloupců se perzistuje per uživatel, per model a per table komponenta do databáze.

Detail přeřazení

Bližší pohled na pořadí řádků a úchyty pro tažení.

Přeřaditelné řádky a sloupce pro wire-table. Řazení řádků se perzistuje do databázového sloupce. Řazení sloupců se perzistuje per uživatel, per model a per table komponenta do databáze.

Postaveno na SortableJS a Alpine.js.

Funkce

• Řazení řádků -- toggle tlačítko přepne tabulku do reorder režimu; táhněte řádky pro změnu jejich pozice, perzistováno do databázového sloupce
• Vždy zapnutý reorder režim -- volitelně přeskočte toggle a nechte drag handly viditelné neustále
• Řazení sloupců -- táhněte hlavičky sloupců pro přeuspořádání; pořadí je uloženo per uživatel, per model a per table komponenta v databázi
• Reorder režim -- v reorder režimu jsou stránkování, řazení, hledání a filtry vypnuté, aby uživatel mohl volně táhnout přes celý dataset
• Stránkované během reorderingu -- volitelně nechte stránkování zapnuté během reorder režimu
• Lifecycle hooky -- beforeReorder() / afterReorder() pro autorizaci, cachování, události
• Podpora více tabulek -- více table komponent nad stejným modelem dostane nezávislá pořadí sloupců
• Dark mode -- všechny drag indikátory podporují světlý a tmavý motiv
• Livewire 3 kompatibilní -- přežije morphy, stránkování a změny filtrů

Typické nastavení

Přidejte WithSortable vedle WithTable, pak zapněte řazení řádků nebo sloupců na tabulce.

use NyonCode\WireSortable\Concerns\WithSortable;
use NyonCode\WireTable\Concerns\WithTable;
use NyonCode\WireTable\Table;
 
class TaskTable extends Component
{
    use WithTable, WithSortable;
 
    public function table(Table $table): Table
    {
        return $table
            ->model(Task::class)
            ->reorderable('sort_order')
            ->columnReorderable()
            ->columns([
                // ...
            ]);
    }
}

Požadavky

Stránky