{% extends 'base.html' %}

{% block title %}Admin Dashboard | {{ settings.site_name }}{% endblock %}

{% block content %}
<section class="section-light py-4">
    <div class="container">
        <div class="d-flex justify-content-between align-items-center">
            <div>
                <h1 class="h3 mb-1">Admin Dashboard</h1>
                <p class="text-muted mb-0">Welcome back, {{ current_user.name or current_user.username }}</p>
            </div>
            <div>
                <a href="{{ url_for('admin.settings') }}" class="btn btn-outline-secondary">
                    <i class="fas fa-cog me-2"></i>Settings
                </a>
            </div>
        </div>
    </div>
</section>

<section class="section">
    <div class="container">
        <!-- Stats Cards -->
        <div class="row g-4 mb-5">
            <div class="col-md-6 col-lg-3">
                <div class="card border-0 shadow-sm h-100">
                    <div class="card-body">
                        <div class="d-flex justify-content-between align-items-center">
                            <div>
                                <p class="text-muted mb-1">Articles</p>
                                <h3 class="mb-0">{{ stats.total_articles or 0 }}</h3>
                            </div>
                            <div class="bg-primary bg-opacity-10 p-3 rounded">
                                <i class="fas fa-file-alt text-primary fa-lg"></i>
                            </div>
                        </div>
                        <a href="{{ url_for('admin.articles') }}" class="small text-primary text-decoration-none mt-2 d-block">
                            View all <i class="fas fa-arrow-right ms-1"></i>
                        </a>
                    </div>
                </div>
            </div>
            <div class="col-md-6 col-lg-3">
                <div class="card border-0 shadow-sm h-100">
                    <div class="card-body">
                        <div class="d-flex justify-content-between align-items-center">
                            <div>
                                <p class="text-muted mb-1">Journals</p>
                                <h3 class="mb-0">{{ stats.total_journals or 0 }}</h3>
                            </div>
                            <div class="bg-secondary bg-opacity-10 p-3 rounded">
                                <i class="fas fa-book text-secondary fa-lg"></i>
                            </div>
                        </div>
                        <a href="{{ url_for('admin.journals') }}" class="small text-primary text-decoration-none mt-2 d-block">
                            View all <i class="fas fa-arrow-right ms-1"></i>
                        </a>
                    </div>
                </div>
            </div>
            <div class="col-md-6 col-lg-3">
                <div class="card border-0 shadow-sm h-100">
                    <div class="card-body">
                        <div class="d-flex justify-content-between align-items-center">
                            <div>
                                <p class="text-muted mb-1">Submissions</p>
                                <h3 class="mb-0">{{ stats.pending_submissions or 0 }}</h3>
                            </div>
                            <div class="bg-warning bg-opacity-10 p-3 rounded">
                                <i class="fas fa-paper-plane text-warning fa-lg"></i>
                            </div>
                        </div>
                        <a href="{{ url_for('admin.submissions') }}" class="small text-primary text-decoration-none mt-2 d-block">
                            View all <i class="fas fa-arrow-right ms-1"></i>
                        </a>
                    </div>
                </div>
            </div>
            <div class="col-md-6 col-lg-3">
                <div class="card border-0 shadow-sm h-100">
                    <div class="card-body">
                        <div class="d-flex justify-content-between align-items-center">
                            <div>
                                <p class="text-muted mb-1">Messages</p>
                                <h3 class="mb-0">{{ stats.unread_messages or 0 }}</h3>
                            </div>
                            <div class="bg-info bg-opacity-10 p-3 rounded">
                                <i class="fas fa-envelope text-info fa-lg"></i>
                            </div>
                        </div>
                        <a href="{{ url_for('admin.messages') }}" class="small text-primary text-decoration-none mt-2 d-block">
                            View all <i class="fas fa-arrow-right ms-1"></i>
                        </a>
                    </div>
                </div>
            </div>
        </div>
        
        <div class="row g-4">
            <!-- Recent Submissions -->
            <div class="col-lg-6">
                <div class="card border-0 shadow-sm h-100">
                    <div class="card-header bg-transparent d-flex justify-content-between align-items-center">
                        <h5 class="mb-0"><i class="fas fa-inbox me-2"></i>Recent Submissions</h5>
                        <a href="{{ url_for('admin.submissions') }}" class="btn btn-sm btn-outline-primary">View All</a>
                    </div>
                    <div class="card-body p-0">
                        {% if recent_submissions %}
                        <div class="list-group list-group-flush">
                            {% for submission in recent_submissions %}
                            <a href="{{ url_for('admin.view_submission', id=submission.id) }}" 
                               class="list-group-item list-group-item-action">
                                <div class="d-flex justify-content-between align-items-start">
                                    <div>
                                        <h6 class="mb-1">{{ submission.title|truncate(50) }}</h6>
                                        <small class="text-muted">{{ submission.authors }} &bull; {{ submission.tracking_id }}</small>
                                    </div>
                                    <span class="badge 
                                        {% if submission.status == 'pending' %}bg-warning
                                        {% elif submission.status == 'under_review' %}bg-info
                                        {% elif submission.status == 'revision_requested' %}bg-secondary
                                        {% elif submission.status == 'accepted' %}bg-success
                                        {% elif submission.status == 'rejected' %}bg-danger
                                        {% elif submission.status == 'published' %}bg-primary
                                        {% else %}bg-secondary{% endif %}">
                                        {{ submission.status|replace('_', ' ')|title }}
                                    </span>
                                </div>
                            </a>
                            {% endfor %}
                        </div>
                        {% else %}
                        <div class="text-center py-4">
                            <i class="fas fa-inbox fa-2x text-muted mb-2"></i>
                            <p class="text-muted mb-0">No submissions yet</p>
                        </div>
                        {% endif %}
                    </div>
                </div>
            </div>
            
            <!-- Recent Messages -->
            <div class="col-lg-6">
                <div class="card border-0 shadow-sm h-100">
                    <div class="card-header bg-transparent d-flex justify-content-between align-items-center">
                        <h5 class="mb-0"><i class="fas fa-comments me-2"></i>Recent Messages</h5>
                        <a href="{{ url_for('admin.messages') }}" class="btn btn-sm btn-outline-primary">View All</a>
                    </div>
                    <div class="card-body p-0">
                        {% if recent_messages %}
                        <div class="list-group list-group-flush">
                            {% for thread in recent_messages %}
                            <a href="{{ url_for('admin.view_message', id=thread.id) }}" 
                               class="list-group-item list-group-item-action">
                                <div class="d-flex justify-content-between align-items-start">
                                    <div>
                                        <h6 class="mb-1">{{ thread.subject|truncate(40) }}</h6>
                                        <small class="text-muted">{{ thread.name }} &bull; {{ thread.email }}</small>
                                    </div>
                                    {% if thread.is_closed %}
                                    <span class="badge bg-secondary">Closed</span>
                                    {% else %}
                                    <span class="badge bg-success">Open</span>
                                    {% endif %}
                                </div>
                            </a>
                            {% endfor %}
                        </div>
                        {% else %}
                        <div class="text-center py-4">
                            <i class="fas fa-comments fa-2x text-muted mb-2"></i>
                            <p class="text-muted mb-0">No messages yet</p>
                        </div>
                        {% endif %}
                    </div>
                </div>
            </div>
        </div>
        
        <!-- Quick Actions -->
        <div class="card border-0 shadow-sm mt-4">
            <div class="card-header bg-transparent">
                <h5 class="mb-0"><i class="fas fa-bolt me-2"></i>Quick Actions</h5>
            </div>
            <div class="card-body">
                <div class="row g-3">
                    <div class="col-6 col-md-4 col-lg-2">
                        <a href="{{ url_for('admin.add_article') }}" class="btn btn-outline-primary w-100 py-3">
                            <i class="fas fa-plus-circle d-block mb-2 fa-lg"></i>
                            New Article
                        </a>
                    </div>
                    <div class="col-6 col-md-4 col-lg-2">
                        <a href="{{ url_for('admin.add_journal') }}" class="btn btn-outline-primary w-100 py-3">
                            <i class="fas fa-book-medical d-block mb-2 fa-lg"></i>
                            New Journal
                        </a>
                    </div>
                    <div class="col-6 col-md-4 col-lg-2">
                        <a href="{{ url_for('admin.users') }}" class="btn btn-outline-success w-100 py-3">
                            <i class="fas fa-users d-block mb-2 fa-lg"></i>
                            All Users
                        </a>
                    </div>
                    <div class="col-6 col-md-4 col-lg-2">
                        <a href="{{ url_for('admin.add_user') }}" class="btn btn-outline-primary w-100 py-3">
                            <i class="fas fa-user-plus d-block mb-2 fa-lg"></i>
                            New User
                        </a>
                    </div>
                    <div class="col-6 col-md-4 col-lg-2">
                        <a href="{{ url_for('admin.submissions') }}" class="btn btn-outline-warning w-100 py-3">
                            <i class="fas fa-tasks d-block mb-2 fa-lg"></i>
                            Submissions
                        </a>
                    </div>
                    <!-- <div class="col-6 col-md-4 col-lg-2">
                        <a href="{{ url_for('admin.content_blocks') }}" class="btn btn-outline-secondary w-100 py-3">
                            <i class="fas fa-edit d-block mb-2 fa-lg"></i>
                            Content
                        </a>
                    </div>
                    <div class="col-6 col-md-4 col-lg-2">
                        <a href="{{ url_for('admin.images') }}" class="btn btn-outline-info w-100 py-3">
                            <i class="fas fa-images d-block mb-2 fa-lg"></i>
                            Images
                        </a>
                    </div> -->
                </div>
            </div>
        </div>
    </div>
</section>
{% endblock %}