@php use App\Services\Annunci\AnnunciService; @endphp
<div>
    @if(session('success'))
        <div class="alert alert-success alert-dismissible">
            <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
            {{ session('success') }}
        </div>
    @endif

    @if(session('error'))
        <div class="alert alert-danger alert-dismissible">
            <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
            {{ session('error') }}
        </div>
    @endif

    <div class="card">
        <div class="card-header d-flex align-items-center flex-wrap">
            <h3 class="card-title mb-2 mb-md-0">Elenco annunci</h3>
            <div class="ml-auto d-flex flex-wrap" style="gap: 0.5rem;">
                <input
                    type="text"
                    wire:model.live.debounce.300ms="search"
                    class="form-control form-control-sm"
                    style="min-width: 220px;"
                    placeholder="Cerca per titolo o descrizione"
                >
                <select wire:model.live="filtroStato" class="form-control form-control-sm" style="min-width: 140px;">
                    <option value="">Tutti gli stati</option>
                    <option value="attivo">Attivo</option>
                    <option value="inattivo">Inattivo</option>
                    <option value="bozza">Bozza</option>
                </select>
                @can(AnnunciService::PERMESSO_GESTIONE)
                    <button type="button" class="btn btn-sm btn-warning" data-toggle="modal" data-target="#creaAnnuncioGestioneModal">
                        <i class="fas fa-plus mr-1"></i>Nuovo annuncio
                    </button>
                @endcan
            </div>
        </div>
        <div class="card-body p-0">
            <div class="table-responsive">
                <table class="table table-striped table-hover mb-0">
                    <thead class="thead-dark">
                        <tr>
                            <th>Titolo</th>
                            <th>Descrizione</th>
                            <th>Data pubblicazione</th>
                            <th>Tipo</th>
                            <th>Stato</th>
                            <th style="width: 140px;">Azioni</th>
                        </tr>
                    </thead>
                    <tbody>
                        @forelse($annunci as $annuncio)
                            <tr>
                                <td>{{ Str::limit($annuncio->Titolo, 40) }}</td>
                                <td>{{ Str::limit(strip_tags($annuncio->Descrizione), 80) }}</td>
                                <td>{{ $annuncio->DataPubblicazione?->format('d/m/Y') ?? '-' }}</td>
                                <td>
                                    <span class="badge
                                        @switch($annuncio->Tipo)
                                            @case('BugFix') badge-danger @break
                                            @case('NewFeature') badge-success @break
                                            @case('Other') badge-primary @break
                                            @case('Articolo') badge-info @break
                                            @default badge-secondary
                                        @endswitch
                                    ">
                                        {{ ucfirst($annuncio->Tipo) }}
                                    </span>
                                </td>
                                <td>
                                    <span class="badge {{ $annuncio->Stato === 'attivo' ? 'badge-success' : ($annuncio->Stato === 'bozza' ? 'badge-warning' : 'badge-secondary') }}">
                                        {{ ucfirst($annuncio->Stato) }}
                                    </span>
                                </td>
                                <td>
                                    <div class="btn-group" role="group">
                                        <a href="{{ route('annunci.dettagli', $annuncio->id) }}" class="btn btn-sm btn-info" title="Visualizza">
                                            <i class="fas fa-eye"></i>
                                        </a>
                                        @if($this->puoEliminareAnnuncio($annuncio))
                                            <button
                                                type="button"
                                                class="btn btn-sm btn-danger"
                                                wire:click="eliminaAnnuncio({{ $annuncio->id }})"
                                                wire:confirm="Sei sicuro di voler eliminare questo annuncio?"
                                                title="Elimina"
                                            >
                                                <i class="fas fa-trash"></i>
                                            </button>
                                        @endif
                                    </div>
                                </td>
                            </tr>
                        @empty
                            <tr>
                                <td colspan="6" class="text-center py-4 text-muted">Nessun annuncio trovato.</td>
                            </tr>
                        @endforelse
                    </tbody>
                </table>
            </div>
        </div>
        @if($annunci->hasPages())
            <div class="card-footer">
                {{ $annunci->links() }}
            </div>
        @endif
    </div>

    @can(AnnunciService::PERMESSO_GESTIONE)
        <div class="modal fade" id="creaAnnuncioGestioneModal" tabindex="-1" role="dialog" aria-labelledby="creaAnnuncioGestioneModalLabel" aria-hidden="true" wire:ignore.self>
            <div class="modal-dialog modal-lg" role="document">
                <div class="modal-content">
                    <div class="modal-header bg-warning">
                        <h5 class="modal-title" id="creaAnnuncioGestioneModalLabel">
                            <i class="fas fa-plus-circle mr-2"></i>Crea nuovo annuncio
                        </h5>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true">&times;</span>
                        </button>
                    </div>
                    <div class="modal-body p-4">
                        @livewire('annunci.crea-annuncio')
                    </div>
                </div>
            </div>
        </div>
    @endcan
</div>

@script
<script>
    $wire.on('annuncio-creato', () => {
        $('#creaAnnuncioGestioneModal').modal('hide');
    });
</script>
@endscript