unioil-cms-fe/resources/views/livewire/components/table.blade.php

73 lines
3.6 KiB
PHP

<div>
<div class="p-4 bg-white rounded-lg shadow-md">
<table class="table-auto w-full">
<thead class="bg-gray-100">
<tr>
<!-- Select All Checkbox -->
<th class="px-4 py-2 text-left">
<input type="checkbox" wire:model="selectAll" wire:change="selectAllRows" class="cursor-pointer">
</th>
@foreach ($columns as $column)
<th class="px-4 py-2 text-left cursor-pointer">
{{ $column['label'] }}
</th>
@endforeach
@if ($hasActions) <!-- Show the Actions column only if hasActions is true -->
<th class="px-4 py-2 text-left">Actions</th>
@endif
</tr>
</thead>
<tbody>
@forelse ($rows as $row)
<tr class="hover:bg-gray-50">
<!-- Row Checkbox -->
<td class="px-4 py-2">
<input type="checkbox" wire:click="selectRow('{{ $row['id'] }}')"
@if(in_array($row['id'], $selected)) checked @endif class="cursor-pointer">
</td>
@foreach ($columns as $column)
<td class="px-4 py-2">
{{ $row[$column['field']] ?? '' }}
</td>
@endforeach
@if ($hasActions) <!-- Show action icons only if hasActions is true -->
<td class="px-4 py-2 text-center">
@if($isViewPage) <!-- Check if it's the "View" page -->
<!-- Only Show View Button for View Page -->
<button wire:click="view({{ $row['id'] }})" class="text-green-500 hover:text-green-700">
<i class="fas fa-eye"></i> <!-- Font Awesome View Icon -->
</button>
@else
<!-- Show Edit, View, and Delete Icons for Non-View Pages -->
<!-- Edit Icon -->
<button wire:click="edit({{ $row['id'] }})" class="text-blue-500 hover:text-blue-700">
<i class="fas fa-edit"></i> <!-- Font Awesome Edit Icon -->
</button>
<!-- View Icon (only shown when it's NOT the View page) -->
<button wire:click="view({{ $row['id'] }})" class="text-green-500 hover:text-green-700">
<i class="fas fa-eye"></i> <!-- Font Awesome View Icon -->
</button>
<!-- Delete Icon -->
<button wire:click="delete({{ $row['id'] }})" class="text-red-500 hover:text-red-700">
<i class="fas fa-trash-alt"></i> <!-- Font Awesome Delete Icon -->
</button>
@endif
</td>
@endif
</tr>
@empty
<tr>
<td colspan="{{ count($columns) + 1 }}" class="text-center p-4">No data available</td>
</tr>
@endforelse
</tbody>
</table>
</div>
</div>