Rapyd Livewire Widgets

Demo

id	title	author	body
20	At rerum reiciendis consequuntur consectetur.	Joanie	Veniam dolorum quia architecto. Voluptatum velit u...
19	Veritatis quibusdam placeat exercitationem magni nobis laboriosam.	Joanie	Dicta excepturi earum dolorem aut ducimus. Culpa e...
18	Quaerat reiciendis ad perferendis voluptate.	Vilma	Rerum ut id quis. Nobis nesciunt omnis est sed eum...
17	Suscipit rerum ut quasi nihil.	Vilma	Veniam et molestias nam nihil aut officia cumque....
16	Est et a doloremque ea.	Milan	Voluptatum neque nam voluptatem saepe quia. Facili...
15	Corporis eum voluptate commodi ipsa delectus fugit.	Milan	Nulla asperiores ea at quisquam et assumenda tempo...
14	Ea similique fugiat dolorem corporis.	Catherine	Sunt iste voluptatem incidunt est dolorem dolorem...
13	Ducimus possimus et eum doloremque omnis.	Catherine	Adipisci ut excepturi excepturi et dolor beatae. V...
12	Sed in aliquam animi deserunt.	Leanna	Delectus sit temporibus voluptatem sed. Ipsa sint...
11	In molestias est aut culpa eligendi quas.	Leanna	Nihil earum et soluta. Accusamus voluptatum possim...

tot.20

module structure


laravel/
├─ app/
│  ├─ Modules/
│  │  ├─ Demo/
│  │  │  ├─ Components/
│  │  │  │  ├─ Articles/
│  │  │  │  │  ├─ views/
│  │  │  │  │  │  ├─ articles_edit.blade.php
│  │  │  │  │  │  ├─ articles_table.blade.php
│  │  │  │  │  │  ├─ articles_view.blade.php
│  │  │  │  │  ├─ ArticlesEdit.php
│  │  │  │  │  ├─ ArticlesTable.php
│  │  │  │  │  ├─ ArticlesView.php
│  │  │  │  ├─ routes.php

route

Modules/Demo/Components/routes.php


Route::get('demo/articles', ArticlesTable::class)
    ->middleware(['web'])
    ->name('demo.articles')
    ->crumbs(fn ($crumbs) => $crumbs->parent('demo')->push('Articles', route('demo.articles')));

component

Modules/Demo/Components/Articles/ArticlesTable.php


<?php

namespace App\Modules\Demo\Components\Articles;

use App\Models\Author;
use Livewire\Component;
use App\Modules\Demo\Models\Article;
use Zofe\Rapyd\Traits\WithDataTable;

class ArticlesTable extends Component
{
    use WithDataTable;
    public $search;
    public $author_id;

    public function updatedAuthorId()
    {
        $this->resetPage();
    }

    public function updatedSearch()
    {
        $this->resetPage();
    }

    public function getDataSet()
    {
        $items = Article::ssearch($this->search);

        if ($this->author_id) {
            $items = $items->where('author_id','=',$this->author_id);
        }

        return $items = $items
            ->orderBy($this->sortField,$this->sortAsc ?'asc':'desc')
            ->paginate($this->perPage)
            ;
    }

    public function render()
    {
        $items = $this->getDataSet();
        $authors = Author::all()->pluck('firstname','id')->toArray();


        return view('demo::Articles.views.articles_table',
                    compact('items','authors')
        );
    }
}

view

Modules/Demo/Components/Articles/views/articles_table.blade.php


<div>
    <x-rpd::table
        title="Articles"
        :items="$items"
    >
        <x-slot name="filters">
            <div class="col">
                <x-rpd::input debounce="350" model="search"  placeholder="search..." />
            </div>
            <div class="col">
                <x-rpd::select lazy model="author_id" :options="$authors" placeholder="author..."
                               addempty />
            </div>
        </x-slot>

        <x-slot name="buttons">
            <a href="{{ route('demo.articles') }}" class="btn btn-outline-dark">reset</a>
            <a href="{{ route('demo.articles.edit') }}" class="btn btn-outline-primary">add</a>
        </x-slot>

        <table class="table">
            <thead>
            <tr>
                <th>
                    <x-rpd::sort model="id" label="id" />
                </th>
                <th>title</th>
                <th>author</th>
                <th>body</th>
            </tr>
            </thead>
            <tbody>
            @foreach ($items as $article)
            <tr>
                <td>
                    <a href="{{ route('demo.articles.view',$article->id) }}">{{ $article->id }}</a>
                </td>
                <td>{{ $article->title }}</td>
                <td>{{ $article->author->firstname }}</td>
                <td>{{ Str::limit($article->body,50) }}</td>
            </tr>
            @endforeach
            </tbody>
        </table>

    </x-rpd::table>
</div>