@extends('layouts.app')

@section('title', 'Painel Admin - Pontos Turísticos')

@section('content')
<div class="mb-6 flex justify-between items-center">
    <h1 class="text-2xl font-bold text-gray-800">Gerenciar Pontos Turísticos</h1>
    <a href="{{ route('admin.pontos-turisticos.create') }}" class="bg-emerald-600 text-white px-4 py-2 rounded-md hover:bg-emerald-700">
        + Novo Ponto
    </a>
</div>

<form method="GET" action="{{ route('admin.pontos-turisticos.index') }}" class="mb-6 bg-white p-4 rounded-lg shadow">
    <div class="flex flex-wrap gap-4">
        <div class="flex-1 min-w-[200px]">
            <input type="text" name="search" placeholder="Buscar por nome..." 
                value="{{ request('search') }}"
                class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-emerald-500">
        </div>
        <div class="w-48">
            <select name="tipo_id" class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-emerald-500">
                <option value="">Todos os Tipos</option>
                @foreach($tipos as $tipo)
                    <option value="{{ $tipo->id }}" {{ request('tipo_id') == $tipo->id ? 'selected' : '' }}>
                        {{ $tipo->icone }} {{ $tipo->nome }}
                    </option>
                @endforeach
            </select>
        </div>
        <div class="w-40">
            <select name="status" class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-emerald-500">
                <option value="">Todos Status</option>
                <option value="ativo" {{ request('status') === 'ativo' ? 'selected' : '' }}>Ativo</option>
                <option value="inativo" {{ request('status') === 'inativo' ? 'selected' : '' }}>Inativo</option>
            </select>
        </div>
        <button type="submit" class="bg-emerald-600 text-white px-4 py-2 rounded-md hover:bg-emerald-700">
            Buscar
        </button>
        <a href="{{ route('admin.pontos-turisticos.index') }}" class="px-4 py-2 border border-gray-300 rounded-md hover:bg-gray-50">
            Limpar
        </a>
    </div>
</form>

<div class="bg-white rounded-lg shadow overflow-hidden">
    @if($pontos->isEmpty())
        <div class="p-8 text-center text-gray-500">
            Nenhum ponto turístico encontrado.
        </div>
    @else
        <table class="w-full">
            <thead class="bg-gray-50">
                <tr>
                    <th class="px-4 py-3 text-left text-sm font-semibold text-gray-600">Nome</th>
                    <th class="px-4 py-3 text-left text-sm font-semibold text-gray-600">Tipo</th>
                    <th class="px-4 py-3 text-left text-sm font-semibold text-gray-600">Cidade</th>
                    <th class="px-4 py-3 text-left text-sm font-semibold text-gray-600">Status</th>
                    <th class="px-4 py-3 text-left text-sm font-semibold text-gray-600">Ações</th>
                </tr>
            </thead>
            <tbody class="divide-y divide-gray-200">
                @foreach($pontos as $ponto)
                    <tr class="hover:bg-gray-50">
                        <td class="px-4 py-3">
                            <a href="{{ route('admin.pontos-turisticos.show', $ponto) }}" class="text-emerald-600 hover:underline font-medium">
                                {{ $ponto->nome }}
                            </a>
                        </td>
                        <td class="px-4 py-3">
                            @if($ponto->tipo)
                                <span class="text-gray-600">{{ $ponto->tipo->icone }} {{ $ponto->tipo->nome }}</span>
                            @else
                                <span class="text-gray-400">-</span>
                            @endif
                        </td>
                        <td class="px-4 py-3 text-gray-600">{{ $ponto->cidade }}/{{ $ponto->estado }}</td>
                        <td class="px-4 py-3">
                            <span class="px-2 py-1 rounded text-sm {{ $ponto->status === 'ativo' ? 'bg-green-100 text-green-700' : ($ponto->status === 'inativo' ? 'bg-red-100 text-red-700' : 'bg-yellow-100 text-yellow-700') }}">
                                {{ str_replace('_', ' ', ucfirst($ponto->status)) }}
                            </span>
                        </td>
                        <td class="px-4 py-3">
                            <a href="{{ route('admin.pontos-turisticos.show', $ponto) }}" class="text-gray-600 hover:text-gray-800 mr-2" title="Ver">
                                👁️
                            </a>
                            <a href="{{ route('admin.pontos-turisticos.edit', $ponto) }}" class="text-blue-600 hover:text-blue-800 mr-2" title="Editar">
                                ✏️
                            </a>
                            <form action="{{ route('admin.pontos-turisticos.destroy', $ponto) }}" method="POST" class="inline">
                                @csrf
                                @method('DELETE')
                                <button type="submit" onclick="return confirm('Tem certeza que deseja excluir?')" class="text-red-600 hover:text-red-800" title="Excluir">
                                    🗑️
                                </button>
                            </form>
                        </td>
                    </tr>
                @endforeach
            </tbody>
        </table>

        <div class="p-4 border-t border-gray-200">
            {{ $pontos->withQueryString()->links() }}
        </div>
    @endif
</div>
@endsection
