{% extends "base.html" %}

{% block title %}System Logs{% endblock %}

{% block content %}
<div class="d-flex justify-content-between flex-wrap flex-md-nowrap align-items-center pt-2 pb-3 mb-4 border-bottom">
    <h1 class="h2"><i class="fa-solid fa-list-check text-info me-2"></i>System Execution Logs</h1>
    <form action="{{ url_for('clear_logs') }}" method="POST" onsubmit="return confirm('Clear all system logs?');">
        <button type="submit" class="btn btn-sm btn-outline-danger">
            <i class="fa-solid fa-trash me-1"></i>Clear Logs
        </button>
    </form>
</div>

<div class="card">
    <div class="card-header bg-white py-3">
        <h5 class="mb-0 fw-bold"><i class="fa-solid fa-terminal me-2"></i>Realtime Activity Log Entries</h5>
    </div>
    <div class="card-body p-0">
        <div class="table-responsive">
            <table class="table table-hover mb-0">
                <thead class="table-light">
                    <tr>
                        <th style="width: 80px;">ID</th>
                        <th style="width: 180px;">Timestamp</th>
                        <th style="width: 100px;">Level</th>
                        <th>Message Content</th>
                    </tr>
                </thead>
                <tbody>
                    {% for log in logs %}
                    <tr>
                        <td><strong>#{{ log.id }}</strong></td>
                        <td class="text-muted"><small>{% if log.timestamp and log.timestamp.strftime %}{{ log.timestamp.strftime('%Y-%m-%d %H:%M:%S') }}{% else %}{{ log.timestamp or 'N/A' }}{% endif %}</small></td>
                        <td>
                            {% if log.level == 'ERROR' %}
                                <span class="badge bg-danger">ERROR</span>
                            {% elif log.level == 'WARNING' %}
                                <span class="badge bg-warning text-dark">WARNING</span>
                            {% else %}
                                <span class="badge bg-info text-dark">INFO</span>
                            {% endif %}
                        </td>
                        <td><code>{{ log.message }}</code></td>
                    </tr>
                    {% else %}
                    <tr>
                        <td colspan="4" class="text-center text-muted py-4">No system logs available.</td>
                    </tr>
                    {% endfor %}
                </tbody>
            </table>
        </div>
    </div>
</div>
{% endblock %}