nodus-it/livewire-datatables

A awesome package for easy dynamic datatables with livewire

Maintainers

Details

github.com/nodus-it/livewire-datatables

Source

Issues

Installs: 1 814

Dependents: 0

Suggesters: 0

Security: 0

Stars: 4

Watchers: 3

Forks: 0

Open Issues: 0

v0.8 2024-03-22 10:15 UTC

Requires

Requires (Dev)

MIT a68e2ef39cac013419af09e917b7876a5f14cd1f

This package is auto-updated.

Last update: 2024-11-22 17:22:07 UTC

README

License Latest Stable Version Total Downloads Unit-Tests StyleCI codecov

An awesome package for easy dynamic datatables with Laravel Livewire and Bootstrap v4.

Installation

You can install the package via composer:

composer require nodus-it/livewire-datatables

You can publish the config file with:

php artisan vendor:publish --provider="Nodus\Packages\LivewireDatatables\LivewireDatatablesServiceProvider" --tag="livewire-datatables:config"

You can publish the blade views with:

php artisan vendor:publish --provider="Nodus\Packages\LivewireDatatables\LivewireDatatablesServiceProvider" --tag="livewire-datatables:views"

Now with the package installed we need to set up some things in order for things to properly work.

First of all, all prerequisites of the livewire library are of course required. For these steps consult: https://laravel-livewire.com/docs/2.x/installation

Second you should check the configs of the core package and this package and make sure all settings work for your project. Especially the blade stack names for styles and scripts could potentially differ from our defaults!

Additionally, we need to include the styles of the livewire datatable package.

@livewireDatatableStyles

Usage

General tooling

For information of the general tooling around this package (e.g. full component rendering, CSP support, ...) please consult the core package documentation under: https://github.com/nodus-it/livewire-core

The DataTable component

Todo

The ConfirmModal component

Add the confirm-modal component to your layout at entrance level of your documents body.

<body>
    <!-- Much content... -->
    
    <livewire:livewire-datatables.confirm-modal/>
</body>

Now you're already good to go for the confirmation buttons of your datatables.

Furthermore, it's possible to use the confirm-modal component from outside the datatable aswell. You simply need to emit the confirm:show event:

In livewire components:

wire:click="$emit('confirm:show', 'url')"

Out of livewire components:

onClick="Livewire.emit('confirm:show', 'url')"

With the third parameter it is possible to customize the modal texts and colors. For further details take a look inside the ConfirmModal class.

Roadmap

  • Support for search keys through multiple relations
  • Support for sort keys through relations
  • Advanced scopes
  • More themes (Tailwind3, Bootstrap5)
  • Fix the query rebuilding problem (currently using the IDs array) by using EloquentBuilder serialization

Testing

composer test

License

The MIT License (MIT). Please see License File for more information.