@extends('layouts.app')

@section('content')
    <div class="container mx-auto p-4">
        @if (session('success'))
            <div class="text-green-500 mb-4">{{ session('success') }}</div>
        @endif
        <div class="flex justify-between mb-4">
            <form method="GET" action="{{ route('custom-table.index') }}" class="mb-4">
                <input type="text" name="search" value="{{ request()->input('search') }}" placeholder="Search..." class="border p-2 rounded" onkeyup="this.form.submit()">
            </form>
            <button onclick="window.location.href='{{ route('custom-table.index') }}?page=1'" class="bg-blue-500 text-white p-2 rounded">Clear Filters</button>
        </div>
        <table class="w-full border-collapse border">
            <thead>
                <tr>
                    @foreach ($columns as $column)
                        <th class="border p-2">
                            {{ $column['title'] }}
                            <a href="{{ route('custom-table.index') }}?sort_field={{ $column['dataIndex'] }}&sort_order={{ request()->input('sort_field') === $column['dataIndex'] && request()->input('sort_order') === 'asc' ? 'desc' : 'asc' }}" class="text-blue-500 ml-2">
                                {{ request()->input('sort_field') === $column['dataIndex'] && request()->input('sort_order') === 'asc' ? '↓' : '↑' }}
                            </a>
                        </th>
                    @endforeach
                    <th class="border p-2">Action</th>
                </tr>
            </thead>
            <tbody>
                @foreach ($paginatedData as $item)
                    <tr>
                        @foreach ($columns as $column)
                            <td class="border p-2">{{ $item[$column['dataIndex']] }}</td>
                        @endforeach
                        <td class="border p-2">
                            @foreach ($actions as $action)
                                @if ($action['access'])
                                    @if ($action['type'] === 'edit')
                                        <a href="{{ $action['path'] }}/{{ $item['id'] }}" class="text-blue-500 mr-2">Edit</a>
                                    @elseif ($action['type'] === 'delete')
                                        <form action="{{ route('custom-table.destroy', $item['id']) }}" method="POST" class="inline">
                                            @csrf
                                            @method('DELETE')
                                            <button type="submit" class="text-red-500" onclick="return confirm('Are you sure?')">Delete</button>
                                        </form>
                                    @endif
                                @endif
                            @endforeach
                        </td>
                    </tr>
                @endforeach
            </tbody>
        </table>
        {{ $paginatedData->links() }}
    </div>
@endsection