{% extends "admin/base_site.html" %}
{% load i18n static dashboard_tags %}

{% block extrastyle %}
{{ block.super }}
<link rel="stylesheet" href="{% static 'admin/css/dashboard.css' %}">
<style>
    .dashboard-stats {
        display: flex;
        flex-wrap: wrap;
        gap: 20px;
        margin-bottom: 30px;
    }
    .stat-card {
        background: #fff;
        border: 1px solid #ddd;
        border-radius: 8px;
        padding: 20px;
        flex: 1;
        min-width: 250px;
        box-shadow: 0 2px 4px rgba(0,0,0,0.05);
    }
    .stat-card h3 {
        margin-top: 0;
        font-size: 16px;
        color: #666;
        border-bottom: 1px solid #eee;
        padding-bottom: 10px;
        margin-bottom: 15px;
    }
    .stat-row {
        display: flex;
        justify-content: space-between;
        margin-bottom: 8px;
        font-size: 14px;
    }
    .stat-value {
        font-weight: bold;
        color: #333;
    }
</style>
{% endblock %}

{% block coltype %}colMS{% endblock %}

{% block bodyclass %}{{ block.super }} dashboard{% endblock %}

{% block breadcrumbs %}{% endblock %}

{% block content %}
<div id="content-main">

    {% get_dashboard_stats as stats %}

    <div class="dashboard-stats">
        <div class="stat-card">
            <h3>Users Overview</h3>
            <div class="stat-row"><span>Total Users</span> <span class="stat-value">{{ stats.users.total }}</span></div>
            <div class="stat-row"><span>Active Users</span> <span class="stat-value">{{ stats.users.active }}</span></div>
            <div class="stat-row"><span>Joined Today</span> <span class="stat-value">{{ stats.users.today }}</span></div>
            <div class="stat-row"><span>Joined This Week</span> <span class="stat-value">{{ stats.users.week }}</span></div>
            <div class="stat-row"><span>Joined This Month</span> <span class="stat-value">{{ stats.users.month }}</span></div>
        </div>
        
        <div class="stat-card">
            <h3>Push Devices</h3>
            <div class="stat-row"><span>Total Registered</span> <span class="stat-value">{{ stats.devices.total }}</span></div>
            <div class="stat-row"><span>Active Devices</span> <span class="stat-value">{{ stats.devices.active }}</span></div>
            <div class="stat-row"><span>iOS Devices</span> <span class="stat-value">{{ stats.devices.ios }}</span></div>
            <div class="stat-row"><span>Android Devices</span> <span class="stat-value">{{ stats.devices.android }}</span></div>
        </div>

        <div class="stat-card">
            <h3>Push Notifications</h3>
            <div class="stat-row"><span>Total Sent</span> <span class="stat-value">{{ stats.notifications.sent_total }}</span></div>
            <div class="stat-row"><span>Sent Today</span> <span class="stat-value">{{ stats.notifications.sent_today }}</span></div>
            <div class="stat-row"><span>Successful</span> <span class="stat-value">{{ stats.notifications.successful }}</span></div>
            <div class="stat-row"><span>Failed</span> <span class="stat-value">{{ stats.notifications.failed }}</span></div>
            <p style="font-size: 11px; color: #999; margin-top: 10px; text-align: center;">(Notification logging not fully implemented)</p>
        </div>
    </div>

    {% if app_list %}
        {% for app in app_list %}
            <div class="app-{{ app.app_label }} module" id="app-{{ app.app_label }}">
            <table>
            <caption>
                <a href="{{ app.app_url }}" class="section" title="{% blocktranslate with name=app.name %}Models in the {{ name }} application{% endblocktranslate %}">{{ app.name }}</a>
            </caption>
            {% for model in app.models %}
                <tr class="model-{{ model.object_name|lower }}{% if model.admin_url %} has_admin_url{% endif %}">
                {% if model.admin_url %}
                    <th scope="row"><a href="{{ model.admin_url }}">{{ model.name }}</a></th>
                {% else %}
                    <th scope="row">{{ model.name }}</th>
                {% endif %}

                {% if model.add_url %}
                    <td><a href="{{ model.add_url }}" class="addlink">{% translate 'Add' %}</a></td>
                {% else %}
                    <td>&nbsp;</td>
                {% endif %}

                {% if model.admin_url and show_changelinks %}
                    {% if model.view_only %}
                    <td><a href="{{ model.admin_url }}" class="viewlink">{% translate 'View' %}</a></td>
                    {% else %}
                    <td><a href="{{ model.admin_url }}" class="changelink">{% translate 'Change' %}</a></td>
                    {% endif %}
                {% elif show_changelinks %}
                    <td>&nbsp;</td>
                {% endif %}
                </tr>
            {% endfor %}
            </table>
            </div>
        {% endfor %}
    {% else %}
        <p>{% translate 'You don’t have permission to view or edit anything.' %}</p>
    {% endif %}
</div>
{% endblock %}

{% block sidebar %}
<div id="content-related">
    <div class="module" id="recent-actions-module">
        <h2>{% translate 'Recent actions' %}</h2>
        <h3>{% translate 'My actions' %}</h3>
            {% load log %}
            {% get_admin_log 10 as admin_log for_user user %}
            {% if not admin_log %}
            <p>{% translate 'None available' %}</p>
            {% else %}
            <ul class="actionlist">
            {% for entry in admin_log %}
            <li class="{% if entry.is_addition %}addlink{% endif %}{% if entry.is_change %}changelink{% endif %}{% if entry.is_deletion %}deletelink{% endif %}">
                {% if entry.is_deletion or not entry.get_admin_url %}
                    {{ entry.object_repr }}
                {% else %}
                    <a href="{{ entry.get_admin_url }}">{{ entry.object_repr }}</a>
                {% endif %}
                <br>
                {% if entry.content_type %}
                    <span class="mini quiet">{% filter capfirst %}{{ entry.content_type.name }}{% endfilter %}</span>
                {% else %}
                    <span class="mini quiet">{% translate 'Unknown content' %}</span>
                {% endif %}
            </li>
            {% endfor %}
            </ul>
            {% endif %}
    </div>
</div>
{% endblock %}