@extends('admin.layouts.netgescon')

@section('title', 'Gestione Stabili')
@section('page-title', 'Stabili')

@section('breadcrumb')
    <li class="text-gray-600">
        <i class="fas fa-building mr-2"></i>
        Stabili
    </li>
@endsection

@section('content')
<div class="space-y-6">
    <!-- Header con azioni -->
    <div class="flex justify-between items-center">
        <div>
            <h1 class="text-2xl font-bold text-gray-900">Gestione Stabili</h1>
            <p class="text-gray-600 mt-1">Panoramica di tutti i condomini gestiti</p>
        </div>
        <div class="flex space-x-3">
            <button class="bg-gray-100 hover:bg-gray-200 text-gray-700 px-4 py-2 rounded-lg border flex items-center space-x-2">
                <i class="fas fa-download"></i>
                <span>Esporta</span>
            </button>
            <a href="{{ route('admin.stabili.create') }}" 
               class="bg-blue-600 hover:bg-blue-700 text-white px-4 py-2 rounded-lg flex items-center space-x-2 transition-colors">
                <i class="fas fa-plus"></i>
                <span>Nuovo Stabile</span>
            </a>
        </div>
    </div>

    <!-- Filtri e ricerca -->
    <div class="bg-white rounded-lg shadow-sm border p-4">
        <div class="grid grid-cols-1 md:grid-cols-4 gap-4">
            <div>
                <label class="block text-sm font-medium text-gray-700 mb-2">Ricerca</label>
                <input type="text" 
                       placeholder="Cerca per denominazione..." 
                       class="w-full px-3 py-2 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500">
            </div>
            <div>
                <label class="block text-sm font-medium text-gray-700 mb-2">Stato</label>
                <select class="w-full px-3 py-2 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500">
                    <option value="">Tutti gli stati</option>
                    <option value="attivo">Attivo</option>
                    <option value="inattivo">Inattivo</option>
                    <option value="sospeso">Sospeso</option>
                </select>
            </div>
            <div>
                <label class="block text-sm font-medium text-gray-700 mb-2">Città</label>
                <select class="w-full px-3 py-2 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500">
                    <option value="">Tutte le città</option>
                    @foreach($cities ?? [] as $city)
                        <option value="{{ $city }}">{{ $city }}</option>
                    @endforeach
                </select>
            </div>
            <div class="flex items-end">
                <button class="w-full bg-blue-600 hover:bg-blue-700 text-white px-4 py-2 rounded-lg transition-colors">
                    <i class="fas fa-search mr-2"></i>
                    Filtra
                </button>
            </div>
        </div>
    </div>

    <!-- Statistiche rapide -->
    <div class="grid grid-cols-1 md:grid-cols-4 gap-4">
        <div class="bg-white p-4 rounded-lg shadow-sm border">
            <div class="flex items-center">
                <div class="w-10 h-10 bg-blue-100 rounded-lg flex items-center justify-center">
                    <i class="fas fa-building text-blue-600"></i>
                </div>
                <div class="ml-3">
                    <p class="text-sm font-medium text-gray-500">Totale Stabili</p>
                    <p class="text-xl font-bold text-gray-900">{{ $stabiliCount ?? $stabili->count() }}</p>
                </div>
            </div>
        </div>
        <div class="bg-white p-4 rounded-lg shadow-sm border">
            <div class="flex items-center">
                <div class="w-10 h-10 bg-green-100 rounded-lg flex items-center justify-center">
                    <i class="fas fa-check-circle text-green-600"></i>
                </div>
                <div class="ml-3">
                    <p class="text-sm font-medium text-gray-500">Stabili Attivi</p>
                    <p class="text-xl font-bold text-gray-900">{{ $stabiliAttivi ?? 0 }}</p>
                </div>
            </div>
        </div>
        <div class="bg-white p-4 rounded-lg shadow-sm border">
            <div class="flex items-center">
                <div class="w-10 h-10 bg-orange-100 rounded-lg flex items-center justify-center">
                    <i class="fas fa-home text-orange-600"></i>
                </div>
                <div class="ml-3">
                    <p class="text-sm font-medium text-gray-500">Unità Totali</p>
                    <p class="text-xl font-bold text-gray-900">{{ $unitaTotali ?? 0 }}</p>
                </div>
            </div>
        </div>
        <div class="bg-white p-4 rounded-lg shadow-sm border">
            <div class="flex items-center">
                <div class="w-10 h-10 bg-purple-100 rounded-lg flex items-center justify-center">
                    <i class="fas fa-euro-sign text-purple-600"></i>
                </div>
                <div class="ml-3">
                    <p class="text-sm font-medium text-gray-500">Valore Gestito</p>
                    <p class="text-xl font-bold text-gray-900">€ 2.4M</p>
                </div>
            </div>
        </div>
    </div>

    <!-- Tabella Stabili -->
    <div class="bg-white rounded-lg shadow-sm border overflow-hidden">
        <div class="px-6 py-4 border-b border-gray-200">
            <h3 class="text-lg font-semibold text-gray-900">Lista Stabili</h3>
        </div>
        
        <div class="overflow-x-auto">
            <table class="min-w-full divide-y divide-gray-200">
                <thead class="bg-gray-50">
                    <tr>
                        <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
                            Stabile
                        </th>
                        <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
                            Informazioni
                        </th>
                        <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
                            Unità
                        </th>
                        <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
                            Stato
                        </th>
                        <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
                            Ultimo Aggiornamento
                        </th>
                        <th class="px-6 py-3 text-right text-xs font-medium text-gray-500 uppercase tracking-wider">
                            Azioni
                        </th>
                    </tr>
                </thead>
                <tbody class="bg-white divide-y divide-gray-200">
                    @forelse($stabili as $stabile)
                                    <tr class="hover:bg-gray-50 transition-colors">
                            <td class="px-6 py-4">
                                <div class="flex items-center">
                                    <div class="w-10 h-10 bg-blue-100 rounded-lg flex items-center justify-center mr-3">
                                        <i class="fas fa-building text-blue-600"></i>
                                    </div>
                                    <div>
                                        <div class="text-sm font-medium text-gray-900">{{ $stabile->denominazione }}</div>
                                        <div class="text-sm text-gray-500">ID: {{ $stabile->id_stabile ?? 'N/A' }}</div>
                                    </div>
                                </div>
                            </td>
                            <td class="px-6 py-4">
                                <div class="text-sm text-gray-900">{{ $stabile->indirizzo }}</div>
                                <div class="text-sm text-gray-500">{{ $stabile->citta }} ({{ $stabile->provincia ?? 'N/A' }})</div>
                                <div class="text-xs text-gray-400">CF: {{ $stabile->codice_fiscale ?? 'Non disponibile' }}</div>
                            </td>
                            <td class="px-6 py-4">
                                <div class="text-sm font-medium text-gray-900">{{ $stabile->unita_immobiliari_count ?? 0 }}</div>
                                <div class="text-xs text-gray-500">unità</div>
                            </td>
                            <td class="px-6 py-4">
                                <span class="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium 
                                    {{ $stabile->stato === 'attivo' ? 'bg-green-100 text-green-800' : 'bg-red-100 text-red-800' }}">
                                    <i class="fas fa-circle mr-1 text-xs"></i>
                                    {{ ucfirst($stabile->stato ?? 'Non definito') }}
                                </span>
                            </td>
                            <td class="px-6 py-4 text-sm text-gray-500">
                                {{ $stabile->updated_at ? $stabile->updated_at->format('d/m/Y H:i') : 'N/A' }}
                            </td>
                            <td class="px-6 py-4 text-right">
                                <div class="flex items-center justify-end space-x-2">
                                    <a href="{{ route('admin.stabili.show', $stabile) }}" 
                                       class="text-gray-400 hover:text-blue-600 transition-colors" title="Visualizza">
                                        <i class="fas fa-eye"></i>
                                    </a>
                                    <a href="{{ route('admin.stabili.edit', $stabile) }}" 
                                       class="text-gray-400 hover:text-green-600 transition-colors" title="Modifica">
                                        <i class="fas fa-edit"></i>
                                    </a>
                                    <button onclick="confirmDelete('{{ $stabile->id ?? $stabile->id_stabile }}')" 
                                            class="text-gray-400 hover:text-red-600 transition-colors" title="Elimina">
                                        <i class="fas fa-trash"></i>
                                    </button>
                                </div>
                            </td>
                        </tr>
                    @empty
                        <tr>
                            <td colspan="6" class="px-6 py-12 text-center">
                                <div class="flex flex-col items-center">
                                    <i class="fas fa-building text-gray-300 text-4xl mb-4"></i>
                                    <h3 class="text-lg font-medium text-gray-900 mb-2">Nessuno stabile trovato</h3>
                                    <p class="text-gray-500 mb-4">Inizia aggiungendo il primo stabile.</p>
                                    <a href="{{ route('admin.stabili.create') }}" 
                                       class="bg-blue-600 hover:bg-blue-700 text-white px-4 py-2 rounded-lg transition-colors">
                                        <i class="fas fa-plus mr-2"></i>
                                        Aggiungi Stabile
                                    </a>
                                </div>
                            </td>
                        </tr>
                    @endforelse
                </tbody>
            </table>
        </div>
        
        <!-- Paginazione -->
        @if(isset($stabili) && method_exists($stabili, 'links'))
        <div class="px-6 py-4 border-t border-gray-200">
            {{ $stabili->links() }}
        </div>
        @endif
    </div>
</div>

<!-- Script per conferma eliminazione -->
<script>
function confirmDelete(id) {
    if (confirm('Sei sicuro di voler eliminare questo stabile? Questa azione non può essere annullata.')) {
        // Crea form per eliminazione
        const form = document.createElement('form');
        form.method = 'POST';
        form.action = `/admin/stabili/${id}`;
        
        const csrfToken = document.createElement('input');
        csrfToken.type = 'hidden';
        csrfToken.name = '_token';
        csrfToken.value = document.querySelector('meta[name="csrf-token"]').getAttribute('content');
        
        const methodField = document.createElement('input');
        methodField.type = 'hidden';
        methodField.name = '_method';
        methodField.value = 'DELETE';
        
        form.appendChild(csrfToken);
        form.appendChild(methodField);
        document.body.appendChild(form);
        form.submit();
    }
}
</script>
@endsection