@extends('layouts.app')

@section('title', 'Alertes IoT')

@section('breadcrumb')
    <li class="breadcrumb-item"><a href="{{ route('dashboard') }}">Tableau de bord</a></li>
    <li class="breadcrumb-item active">Alertes</li>
@endsection

@section('content')
<div class="row mb-4">
    <div class="col-md-3">
        <div class="card bg-danger text-white h-100">
            <div class="card-body text-center">
                <h1 class="display-4 fw-bold">{{ $activeAlerts ?? 0 }}</h1>
                <p class="mb-0">Alertes Actives</p>
            </div>
        </div>
    </div>
</div>

<div class="card">
    <div class="card-header bg-white">
        <h5 class="mb-0">Historique des incidents</h5>
    </div>
    <div class="card-body">
        <table class="table table-hover dt-table">
            <thead class="table-light">
                <tr>
                    <th>Date</th>
                    <th>Gravité</th>
                    <th>Capteur</th>
                    <th>Message</th>
                    <th>Statut</th>
                    <th>Action</th>
                </tr>
            </thead>
            <tbody>
                @forelse($alerts as $alert)
                <tr class="{{ $alert->status === 'active' ? 'table-danger' : '' }}">
                    <td>{{ $alert->triggered_at->format('d/m/Y H:i') }}</td>
                    <td>
                        @if($alert->severity === 'high')
                            <span class="badge bg-danger">Haute</span>
                        @elseif($alert->severity === 'medium')
                            <span class="badge bg-warning text-dark">Moyenne</span>
                        @else
                            <span class="badge bg-info">Basse</span>
                        @endif
                    </td>
                    <td>
                        <a href="{{ route('sensors.show', $alert->sensor) }}">
                            {{ $alert->sensor->name }}
                        </a>
                    </td>
                    <td>{{ Str::limit($alert->message, 50) }}</td>
                    <td>
                        @if($alert->status === 'active')
                            <span class="badge bg-danger">Active</span>
                        @elseif($alert->status === 'acknowledged')
                            <span class="badge bg-warning text-dark">Acquittée</span>
                        @else
                            <span class="badge bg-success">Résolue</span>
                        @endif
                    </td>
                    <td>
                        <a href="{{ route('alerts.show', $alert) }}" class="btn btn-sm btn-primary">
                            Gérer
                        </a>
                    </td>
                </tr>
                @empty
                <tr>
                    <td colspan="6" class="text-center text-muted">Aucune alerte enregistrée.</td>
                </tr>
                @endforelse
            </tbody>
        </table>
    </div>
</div>

@endsection