Table of Contents

1. About The Project
   • Built With
2. Getting Started
   • Installation
3. Credentials

About The Project

This project is created to learn and practice livewire; understand why it is created; and explore the power of LIVEWIRE with WireUI.

This project consists of Livewire table with sorting, search, and perPage functionalities.
Also, Roles and Permissions have been added with Policies.

Support Dark Mode :

Left-to-Right Language Support :

Right-to-Left Language Support :

(back to top)

Built With

• Livewire
• WireUI
• Laravel Jetstream
• Windmill Dashboard HTML

(back to top)

Getting Started

Follow these steps to try this out on your localhost.

Installation

1. Clone the repo

   git clone https://github.com/altwaireb/livewire-wireUi.git

2. Run composer install

   composer install

3. Create .env

   cp .env.example .env

4. Generate key

   php artisan key:generate

5. Run npm install

   npm install

6. Run npm run dev

   npm run dev

7. Run migration files

   php artisan migrate

8. Run seeders

   php artisan db:seed

9. Run on your localhost

   php artisan serve

(back to top)

How to use

To create Component inside admin

php artisan make:livewire admin.model.ModelIndex

You can use Trait to get all functionality for Sorting and Searching and Pagination.

use App\Traits\WithSorting;

class FooIndex extends Component
{
 
 use WithSorting;
 
 ...

The default sort is the id you can change to another column e.g:

use App\Traits\WithSorting;

class FooIndex extends Component
{
 
 use WithSorting;
 
 public function mount()
 {
     $this->sortBy = 'name';
     // same with sort Direction    
     $this->sortDirection = 'asc';          
     // same with Per Page    
     $this->perPage = 25;    
 }
 
 ...

(back to top)

Credentials

Admin
username: [email protected]
password: password

(back to top)