@extends('layouts.app')

@section('title', 'Logs de Actividad - ERP LOGÍSTICO')
@section('header_title', 'Informe de Logs de Auditoría')

@section('content')
<div class="row">
    <!-- Filter Card -->
    <div class="col-12 mb-4">
        <div class="card shadow-sm border-0">
            <div class="card-header bg-white">
                <h6 class="mb-0 text-dark fw-bold">
                    <i class="bi bi-funnel-fill text-danger me-2"></i>Filtrar Historial de Auditoría
                </h6>
            </div>
            <div class="card-body">
                <form action="{{ route('settings.logs') }}" method="GET" id="filterForm">
                    <div class="row g-3">
                        <!-- User Filter -->
                        <div class="col-md-3">
                            <label for="user_id" class="form-label small fw-semibold text-muted">Usuario</label>
                            <select class="form-select border-grey" id="user_id" name="user_id">
                                <option value="">-- Todos los Usuarios --</option>
                                @foreach($users as $u)
                                    <option value="{{ $u->id }}" {{ request('user_id') == $u->id ? 'selected' : '' }}>
                                        {{ $u->name_with_role }}
                                    </option>
                                @endforeach
                            </select>
                        </div>

                        <!-- Action Filter -->
                        <div class="col-md-3">
                            <label for="action" class="form-label small fw-semibold text-muted">Tipo de Acción</label>
                            <input type="text" class="form-control border-grey" id="action" name="action" value="{{ request('action') }}" placeholder="Ej: Inicio de Sesión, Ticket...">
                        </div>

                        <!-- Date From -->
                        <div class="col-md-2">
                            <label for="date_from" class="form-label small fw-semibold text-muted">Desde</label>
                            <input type="date" class="form-control border-grey" id="date_from" name="date_from" value="{{ request('date_from') }}">
                        </div>

                        <!-- Date To -->
                        <div class="col-md-2">
                            <label for="date_to" class="form-label small fw-semibold text-muted">Hasta</label>
                            <input type="date" class="form-control border-grey" id="date_to" name="date_to" value="{{ request('date_to') }}">
                        </div>

                        <!-- Search Button and Reset -->
                        <div class="col-md-2 d-flex align-items-end gap-2">
                            <button type="submit" class="btn btn-primary w-100 fw-semibold">
                                <i class="bi bi-search me-1"></i> Filtrar
                            </button>
                            <a href="{{ route('settings.logs') }}" class="btn btn-light border" title="Limpiar Filtros">
                                <i class="bi bi-arrow-counterclockwise"></i>
                            </a>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>

    <!-- Listings Card -->
    <div class="col-12">
        <div class="card shadow-sm border-0">
            <div class="card-header bg-white d-flex justify-content-between align-items-center">
                <h5 class="mb-0 text-dark fw-bold">
                    <i class="bi bi-journal-text text-danger me-2"></i>Registros de Actividad
                </h5>
                
                <!-- Export to Excel/CSV with the exact current query parameters -->
                <a href="{{ route('settings.logs.export', request()->query()) }}" class="btn btn-success btn-sm px-3 fw-semibold">
                    <i class="bi bi-file-earmark-excel-fill me-1"></i> Exportar a Excel
                </a>
            </div>

            <div class="card-body p-0">
                <div class="table-responsive">
                    <table class="table table-hover align-middle mb-0">
                        <thead class="table-light">
                            <tr>
                                <th class="ps-4" style="width: 80px;">ID</th>
                                <th style="width: 250px;">Usuario</th>
                                <th style="width: 200px;">Acción</th>
                                <th>Detalles del Evento</th>
                                <th style="width: 140px;">IP Address</th>
                                <th style="width: 180px;">Fecha y Hora</th>
                            </tr>
                        </thead>
                        <tbody>
                            @forelse($logs as $log)
                                <tr>
                                    <td class="ps-4 fw-semibold text-muted">#{{ $log->id }}</td>
                                    <td>
                                        @if($log->user)
                                            <div class="d-flex align-items-center gap-2">
                                                <div class="user-avatar" style="width: 28px; height: 28px; font-size: 0.75rem; border-width: 1.5px;">
                                                    {{ strtoupper(substr($log->user->name, 0, 2)) }}
                                                </div>
                                                <div>
                                                    <div class="fw-bold text-dark" style="font-size: 0.9rem;">{{ $log->user->name }}</div>
                                                    <div class="text-muted" style="font-size: 0.75rem;">{{ $log->user->email }}</div>
                                                </div>
                                            </div>
                                        @else
                                            <div class="text-muted small">
                                                <i class="bi bi-robot me-1 text-secondary"></i>Sistema / Invitado
                                            </div>
                                        @endif
                                    </td>
                                    <td>
                                        <span class="badge @if(str_contains(strtolower($log->action), 'fallo') || str_contains(strtolower($log->action), 'elimina')) bg-danger-subtle text-danger border border-danger-subtle @elseif(str_contains(strtolower($log->action), 'sesión') || str_contains(strtolower($log->action), 'inicio')) bg-primary-subtle text-primary border border-primary-subtle @elseif(str_contains(strtolower($log->action), 'crea') || str_contains(strtolower($log->action), 'alta')) bg-success-subtle text-success border border-success-subtle @else bg-warning-subtle text-warning border border-warning-subtle @endif px-2.5 py-1 fw-bold text-capitalize" style="font-size: 0.78rem;">
                                            {{ $log->action }}
                                        </span>
                                    </td>
                                    <td>
                                        <div class="text-dark fw-medium" style="font-size: 0.88rem; max-width: 450px; white-space: normal; word-break: break-all;">
                                            {{ $log->details ?: 'Sin detalles adicionales' }}
                                        </div>
                                    </td>
                                    <td>
                                        <code class="text-secondary small">{{ $log->ip_address ?: 'N/A' }}</code>
                                    </td>
                                    <td>
                                        <div class="text-dark small fw-semibold">
                                            {{ $log->created_at ? $log->created_at->timezone('America/Santiago')->format('d-m-Y H:i:s') : 'N/A' }}
                                        </div>
                                    </td>
                                </tr>
                            @empty
                                <tr>
                                    <td colspan="6" class="text-center py-5 text-muted">
                                        <i class="bi bi-journal-x display-4 d-block mb-3 text-secondary"></i>
                                        No se encontraron registros de actividad con los filtros seleccionados.
                                    </td>
                                </tr>
                            @endforelse
                        </tbody>
                    </table>
                </div>
            </div>
            
            @if($logs->hasPages())
                <div class="card-footer bg-white border-0 py-3 d-flex justify-content-center">
                    {{ $logs->links('pagination::bootstrap-5') }}
                </div>
            @endif
        </div>
    </div>
</div>
@endsection