{% extends 'base.html.twig' %}

{% block title %}Activity Log - {{ entityType }} #{{ entityId }}{% endblock %}

{% block stylesheets %}
    {{ parent() }}
    <link rel="stylesheet" href="{{ asset('css/activity-log.css') }}">
{% endblock %}

{% block body %}
<div class="page-wrapper">
    <div class="page-header">
        <div class="header-content">
            <h1><i class="fas fa-history"></i> Activity Log</h1>
            <p class="header-subtitle">Aktivitäten für {{ entityType }} #{{ entityId }}</p>
        </div>
        <a href="{{ path('activity_log_index') }}" class="btn btn-secondary">
            <i class="fas fa-arrow-left"></i> Zurück zur Übersicht
        </a>
    </div>

    <!-- Log-Tabelle -->
    <div class="table-card">
        <table class="data-table">
            <thead>
                <tr>
                    <th>Zeitpunkt</th>
                    <th>Benutzer</th>
                    <th>Aktion</th>
                    <th>Beschreibung</th>
                    <th>Änderungen</th>
                    <th>IP-Adresse</th>
                </tr>
            </thead>
            <tbody>
                {% if logs is empty %}
                    <tr>
                        <td colspan="6" class="text-center">Keine Log-Einträge für diese Entity gefunden</td>
                    </tr>
                {% else %}
                    {% for log in logs %}
                        <tr>
                            <td>
                                <div class="timestamp-cell">
                                    <div class="timestamp-date">{{ log.createdAt|date('d.m.Y') }}</div>
                                    <div class="timestamp-time">{{ log.createdAt|date('H:i:s') }}</div>
                                </div>
                            </td>
                            <td>
                                {% if log.user %}
                                    <div class="user-cell">
                                        <div class="user-avatar-small">
                                            {{ log.user.firstName|first }}{{ log.user.lastName|first }}
                                        </div>
                                        <div class="user-info-small">
                                            <div class="user-name">{{ log.user.fullName }}</div>
                                            <div class="user-email">{{ log.user.email }}</div>
                                        </div>
                                    </div>
                                {% else %}
                                    <span class="text-muted">System</span>
                                {% endif %}
                            </td>
                            <td>
                                <span class="action-badge action-badge-{{ log.action|lower }}">
                                    <i class="fas fa-{{ log.action == 'CREATE' ? 'plus' : (log.action == 'UPDATE' ? 'edit' : (log.action == 'DELETE' ? 'trash' : (log.action == 'LOGIN' ? 'sign-in-alt' : (log.action == 'LOGOUT' ? 'sign-out-alt' : 'info-circle')))) }}"></i>
                                    {{ log.actionLabel }}
                                </span>
                            </td>
                            <td>
                                <div class="description-cell">
                                    {{ log.description ?? '-' }}
                                </div>
                            </td>
                            <td>
                                {% if log.changes %}
                                    <details class="changes-details">
                                        <summary class="changes-summary">
                                            <i class="fas fa-exchange-alt"></i> Änderungen anzeigen
                                        </summary>
                                        <div class="changes-content">
                                            {% for field, change in log.changes %}
                                                <div class="change-item">
                                                    <strong>{{ field }}:</strong>
                                                    <span class="change-old">{{ change.old ?? '-' }}</span>
                                                    <i class="fas fa-arrow-right"></i>
                                                    <span class="change-new">{{ change.new ?? '-' }}</span>
                                                </div>
                                            {% endfor %}
                                        </div>
                                    </details>
                                {% else %}
                                    <span class="text-muted">-</span>
                                {% endif %}
                            </td>
                            <td>
                                <span class="ip-address">{{ log.ipAddress ?? '-' }}</span>
                            </td>
                        </tr>
                    {% endfor %}
                {% endif %}
            </tbody>
        </table>
    </div>
</div>
{% endblock %}