Laravel views
Twitter Github
Examples

Grid view examples

Error!
Success!
https://laravelviews.com/storage/profile/58.png

jsmithhh

Jsmith@example.com

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/16.png

test

X@X.COl

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/12.png

cdcsdcb

Keykha asfd232323

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/69.png

Just for testt adsf

Test

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/13.png

test123

Dwadwad

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/13.png

sdsd22333

Test@test.test

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/32.png

tesdasda 33

Javonte.kutch@example.com

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/46.png

Bande de iok

Qcollier@example.uk

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/53.png

Brycen Schade

Celestinoprenner@example.net

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/23.png

Mrs. Kassandra Stiedemann

Griffin.aufderha00r@example.net

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/42.png

Lonie Koch

Aweissnat@example.net

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/16.png

Marietta Labadie

Alexandrea.sanford@example.org

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/30.png

Dr. Alessandra Schaefer

Submit ggggg

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/16.png

Oswaldo Lind

Tyshawn26@example.net

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/48.png

Mr. Jerrod Glover

Cjohnston@example.org

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/1.png

Creola Stracke

Maymie80@example.org

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/4.png

Ashlynn Mosciski

Krajcik.rhiannon@example.com

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/1.png

Arthur Oberbrunner

Sporer.salvatore@example.com

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/45.png

Tara Rodriguez

Asenger@example.net

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/37.png

Ransom Cronin

Zaria63@example.net

Lorem ipsum dolor sit amet consectetur adipisicing elit. 

  
<?php

namespace App\Http\Livewire;

use App\Models\User;
use Illuminate\Database\Eloquent\Builder;
use LaravelViews\Facades\UI;
use LaravelViews\Views\GridView;

class UsersGridView extends GridView
{
    public $maxCols = 3;

    /**
     * Sets a initial query with the data to fill the grid view
     *
     * @return Builder Eloquent query
     */
    public function repository(): Builder
    {
        return User::query();
    }

    /**
     * Sets the data to every card on the view
     *
     * @param $item Current model for each card
     */
    public function card($item)
    {
        return [
            'image' => asset('storage/' . $item->profile_picture),
            'title' => $item->name,
            'subtitle' => ucfirst($item->email),
            'description' => 'Lorem ipsum dolor sit amet consectetur adipisicing elit. '
        ];
    }
}
Error!
Success!
Users Active Filter
Users Type Filter
Users Created At Filter
https://laravelviews.com/storage/profile/58.png

jsmithhh

Jsmith@example.com

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/16.png

test

X@X.COl

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/12.png

cdcsdcb

Keykha asfd232323

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/69.png

Just for testt adsf

Test

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/13.png

test123

Dwadwad

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/13.png

sdsd22333

Test@test.test

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/32.png

tesdasda 33

Javonte.kutch@example.com

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/46.png

Bande de iok

Qcollier@example.uk

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/53.png

Brycen Schade

Celestinoprenner@example.net

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/23.png

Mrs. Kassandra Stiedemann

Griffin.aufderha00r@example.net

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/42.png

Lonie Koch

Aweissnat@example.net

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/16.png

Marietta Labadie

Alexandrea.sanford@example.org

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/30.png

Dr. Alessandra Schaefer

Submit ggggg

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/16.png

Oswaldo Lind

Tyshawn26@example.net

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/48.png

Mr. Jerrod Glover

Cjohnston@example.org

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/1.png

Creola Stracke

Maymie80@example.org

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/4.png

Ashlynn Mosciski

Krajcik.rhiannon@example.com

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/1.png

Arthur Oberbrunner

Sporer.salvatore@example.com

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/45.png

Tara Rodriguez

Asenger@example.net

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/37.png

Ransom Cronin

Zaria63@example.net

Lorem ipsum dolor sit amet consectetur adipisicing elit. 

  
<?php

namespace App\Http\Livewire;

use App\Filters\UsersActiveFilter;
use App\Filters\UsersCreatedAtFilter;
use App\Filters\UsersTypeFilter;

class UsersWithFiltersGridView extends UsersGridView
{
    public $searchBy = ['name', 'email'];

    protected function filters()
    {
        return [
            new UsersActiveFilter,
            new UsersTypeFilter,
            new UsersCreatedAtFilter
        ];
    }
}
Error!
Success!
Users Active Filter
Users Type Filter
Users Created At Filter
https://laravelviews.com/storage/profile/58.png

jsmithhh

Jsmith@example.com

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/16.png

test

X@X.COl

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/12.png

cdcsdcb

Keykha asfd232323

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/69.png

Just for testt adsf

Test

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/13.png

test123

Dwadwad

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/13.png

sdsd22333

Test@test.test

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/32.png

tesdasda 33

Javonte.kutch@example.com

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/46.png

Bande de iok

Qcollier@example.uk

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/53.png

Brycen Schade

Celestinoprenner@example.net

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/23.png

Mrs. Kassandra Stiedemann

Griffin.aufderha00r@example.net

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/42.png

Lonie Koch

Aweissnat@example.net

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/16.png

Marietta Labadie

Alexandrea.sanford@example.org

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/30.png

Dr. Alessandra Schaefer

Submit ggggg

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/16.png

Oswaldo Lind

Tyshawn26@example.net

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/48.png

Mr. Jerrod Glover

Cjohnston@example.org

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/1.png

Creola Stracke

Maymie80@example.org

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/4.png

Ashlynn Mosciski

Krajcik.rhiannon@example.com

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/1.png

Arthur Oberbrunner

Sporer.salvatore@example.com

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/45.png

Tara Rodriguez

Asenger@example.net

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/37.png

Ransom Cronin

Zaria63@example.net

Lorem ipsum dolor sit amet consectetur adipisicing elit. 

  
<?php

namespace App\Http\Livewire;

use App\Actions\ChangeUserAsAdmin;
use App\Actions\ChangeUserAsWriter;
use App\Actions\ToggleUserAction;

class UsersWithActionsGridView extends UsersWithFiltersGridView
{
    protected function actionsByRow()
    {
        return [
            new ChangeUserAsAdmin,
            new ChangeUserAsWriter,
            new ToggleUserAction,
        ];
    }
}
Error!
Success!
Users Active Filter
Users Type Filter
Users Created At Filter
https://laravelviews.com/storage/profile/58.png

jsmithhh

Jsmith@example.com

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/16.png

test

X@X.COl

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/12.png

cdcsdcb

Keykha asfd232323

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/69.png

Just for testt adsf

Test

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/13.png

test123

Dwadwad

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/13.png

sdsd22333

Test@test.test

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/32.png

tesdasda 33

Javonte.kutch@example.com

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/46.png

Bande de iok

Qcollier@example.uk

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/53.png

Brycen Schade

Celestinoprenner@example.net

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/23.png

Mrs. Kassandra Stiedemann

Griffin.aufderha00r@example.net

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/42.png

Lonie Koch

Aweissnat@example.net

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/16.png

Marietta Labadie

Alexandrea.sanford@example.org

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/30.png

Dr. Alessandra Schaefer

Submit ggggg

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/16.png

Oswaldo Lind

Tyshawn26@example.net

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/48.png

Mr. Jerrod Glover

Cjohnston@example.org

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/1.png

Creola Stracke

Maymie80@example.org

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/4.png

Ashlynn Mosciski

Krajcik.rhiannon@example.com

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/1.png

Arthur Oberbrunner

Sporer.salvatore@example.com

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/45.png

Tara Rodriguez

Asenger@example.net

Lorem ipsum dolor sit amet consectetur adipisicing elit.

https://laravelviews.com/storage/profile/37.png

Ransom Cronin

Zaria63@example.net

Lorem ipsum dolor sit amet consectetur adipisicing elit. 

  
<?php

namespace App\Http\Livewire\GridView;

use App\Actions\Bulk\ChangeUsersAsAdmin;
use App\Actions\Bulk\ChangeUsersAsWriter;
use App\Http\Livewire\UsersWithActionsGridView;

class UsersWithBulkActionsGridView extends UsersWithActionsGridView
{
    public function bulkActions()
    {
        return [
            new ChangeUsersAsAdmin,
            new ChangeUsersAsWriter
        ];
    }
}