1. Pastekan dan sesuaikan ini di dalam Model :

use HasFactory;

protected $table = 'nama_table';
protected $primaryKey = 'primary_key_table';
protected $fillable = [
'nama_kolom di databases'
];
// public $incrementing = false;
// public $timestamps = false;


/*
public function scopeFilterrole($query, $value){
if (!empty($value)) {$query->where('NAMA_FILTER_RELASI', $value);}
}

*/
/*
public function scopeRangeTanggal($query, $value1, $value2)
{
if ($value1 && $value2) {
$query->whereBetween('tanggal', [$value1, $value2]);
}
}
*/


2. Masuk Ke component pastekan ini :

use WithPagination;
use WithFileUploads;
use LivewireAlert;

public $search = '';
public $tglstart = '';
public $tglend = '';
public $perPage = 10;

public function mount()
{
$this->tglstart = now()->firstOfMonth()->format('Y-m-d');
$this->tglend = now()->format('Y-m-d');
}


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


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


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


public function render()
{

$namavariabel = Model::get();

return view('livewire.testing-component', [
'namavariabel' => $namavariabel,
]);
}


3. Masuk ke dalam blade :

<div>
<div class="container-fluid mb-5" style="margin-top: 40px">
<div class="fw-medium text-secondary" style="font-size:15px; margin-bottom:-5px;">Home <i
class="fa-solid fa-chevron-right mx-2" style="font-size: 12px"></i> @yield('title')</div>

<div class="container-fluid px-0 p-3 rounded-top">
<div class="d-lg-flex justify-content-between align-items-center mb-lg-1">
<div class="mb-3 mb-lg-0">
<p class="p-0 m-0 h3 fw-bold ">Nama Menu</p>
<div class="mt-2" style="color: #868686">
<i class="fa-regular fa-circle-question me-1 text-danger"></i>Menu ini digunakan untuk
mengelola data Nama Menu, termasuk menambahkan atau mengubah informasi.
</div>
</div>

</div>
</div>
<div class="py-2 mb-2">
<div class="d-lg-flex justify-content-between align-items-center">
<div>
<input type="text" class="form-control mb-1 mb-lg-0 " placeholder="Search"
wire:model.live.debounce.300ms="search">
</div>
<div class="d-lg-flex align-items-center gap-2">
{{-- <input type="date" class="form-control" wire:model.live.debounce.300ms="tglstart">
<input type="date" class="form-control" wire:model.live.debounce.300ms="tglend"> --}}
{{-- <div>
<select class="form-control" wire:model.live.debounce.300ms="nama_filter ">
<option value="" selected>-- Semua Filter --</option>
Masukan Option Filter disini
</select>
</div> --}}
<div class="d-flex justify-content-start align-items-center gap-1">
<button class="btn bg-success text-white d-flex align-items-center" style="background: #77e779"
wire:click="exportToExcel"> <i class="fa-solid fa-download me-2"></i>
Excel</button>
<button class="btn bg-danger text-white d-flex align-items-center" wire:click="exportToPdf"> <i
class="fa-solid fa-download me-2"></i>
PDF</button>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-12">

<div class="card mb-2 pb-0">
<div class="card-body p-0">



<div class="table-responsive">
<table class="table table-bordered table-striped " style="width:100%;white-space:nowrap">
<thead>
<tr>
<th class="text-center" style="width: 3%">No</th>
<th>Kolom tergantung</th>

</tr>
</thead>
<tbody>
@if ($namavariabel->count() > 0)
@foreach ($namavariabel as $key => $datas)
<tr class="px-4">
<td class="text-center">{{ $namavariabel->firstItem() + $key }} </td>
<td>isi kolom</td>
</tr>
@endforeach
@else
<tr>
<td colspan="8" style="text-align: center;"><small>Data Tidak ditemukan</small>
</td>
</tr>
@endif
</tbody>
</table>

</div>
</div>
</div>


<div class="row">
<div class=" col-lg-6 d-flex justify-content-between align-items-center">
{{-- <div>
Showing {{ $namavariabel->firstItem() }} to {{ $namavariabel->lastItem() }} of {{
$namavariabel->total()
}} results
</div> --}}
<div>
Per Page
<select name="form-control" wire:model.live='perPage'>
<option value="10">10</option>
<option value="50">50</option>
<option value="100">100</option>
<option value="{{ $namavariabel->total() }}">All</option>
</select>
</div>
</div>
<div class="mt-2 col-lg-6 d-flex justify-content-end align-items-center">
{{ $namavariabel->links() }}
</div>
</div>
</div>
</div>
</div>
</div>