{% extends 'admin/base_site.html' %}
{% load i18n static pinmok_admin_tags pinmok_tags %}

{% block page_header %}
    <div class="row g-2 align-items-center">
        <div class="col">
            <!-- Page pre-title -->
            <div class="page-pretitle">{{ index_title }}</div>
            <h2 class="page-title">{% translate 'Dashboard' %}</h2>
        </div>
        <div class="col-auto ms-auto d-print-none">
            <h3 class="h2">
                {% translate 'Welcome,' %}
                {% if user.get_full_name %}{{ user.get_full_name }}{% else %}{{ user.get_username }}{% endif %}
            </h3>
        </div>
    </div>
{% endblock %}

{% block content %}
    <div class="row row-deck row-cards">
        <!-- BEGIN INFORMATION PANELS -->
        <div class="col-sm-12 col-lg-8">
            <div class="row gy-3">
                <!-- BEGIN SYSTEM INFORMATION -->
                <div class="col-12">
                    <div class="card">
                        <div class="card-body">
                            <div class="d-flex align-items-center justify-content-between">
                                <div class="flex-grow-1">
                                    <h3 class="card-title">{% translate 'System Information' %}</h3>
                                    <table class="table table-sm table-borderless table-striped" style="max-width: 22rem">
                                        <tbody>
                                        <tr>
                                            <td class="fw-bold">{{ sys_info.project_name }} {% translate 'version' %}</td>
                                            <td class="text-end">{{ sys_info.project_version }}</td>
                                        </tr>
                                        <tr>
                                            <td class="fw-bold">{% translate 'Operating System' %}</td>
                                            <td class="text-end">{{ sys_info.os }}</td>
                                        </tr>
                                        <tr>
                                            <td class="fw-bold">Python {% translate 'version' %}</td>
                                            <td class="text-end">{{ sys_info.python_version }}</td>
                                        </tr>
                                        <tr>
                                            <td class="fw-bold">Django {% translate 'version' %}</td>
                                            <td class="text-end">{{ sys_info.django_version }}</td>
                                        </tr>
                                        <tr>
                                            <td class="fw-bold">{% translate 'Database' %}</td>
                                            <td class="text-end">{{ sys_info.db_vendor }}</td>
                                        </tr>
                                        <tr>
                                            <td class="fw-bold">{% translate 'Database' %} {% translate 'version' %}</td>
                                            <td class="text-end">{{ sys_info.db_version }}</td>
                                        </tr>
                                        </tbody>
                                    </table>
                                </div>
                                <div class="ms-3 flex-shrink-0" style="width:clamp(150px, 15vw, 300px);">
                                    <img src="{% static 'admin/svg/arrows.svg' %}" class="w-100 h-auto d-block" alt="">
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <!-- END SYSTEM INFORMATION -->

                <!-- BEGIN DISK INFORMATION -->
                <div class="col-12">
                    <div class="card">
                        <div class="card-body">
                            <p class="mb-3">
                                {% blocktranslate trimmed with used_percent=disk_info.used_percent total=disk_info.total %}
                                    Total storage: {{ total }}, used: {{ used_percent }}%
                                {% endblocktranslate %}
                            </p>
                            <div class="progress progress-separated mb-3">
                                <div class="progress-bar {% if disk_info.used_percent >= 90 %}bg-danger{% elif disk_info.used_percent >= 70 %}bg-warning{% else %}bg-success{% endif %}"
                                     role="progressbar" style="width: {{ disk_info.used_percent }}%" aria-label="Regular"></div>
                            </div>
                            <div class="row">
                                <div class="col-auto d-flex align-items-center pe-2">
                                    <span class="legend me-2 {% if disk_info.used_percent >= 90 %}bg-danger{% elif disk_info.used_percent >= 70 %}bg-warning{% else %}bg-success{% endif %}"></span>
                                    <span>{% translate 'Used' %}</span>
                                    <strong class="d-none d-md-inline ms-2 text-secondary">{{ disk_info.used }}</strong>
                                </div>
                                <div class="col-auto d-flex align-items-center ps-2">
                                    <span class="legend me-2"></span>
                                    <span>{% translate 'Free' %}</span>
                                    <strong class="d-none d-md-inline ms-2 text-secondary">{{ disk_info.free }}</strong>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <!-- END DISK INFORMATION -->
            </div>
        </div>
        <!-- END INFORMATION PANELS -->

        <!-- BEGIN USER ACTIONS -->
        <div class="col-sm-12 col-lg-4">
            <div class="card">
                <div class="card-body">
                    <div class="d-flex justify-content-between">
                        <h3 class="card-title">{% translate 'Recent actions' %}</h3>
                        <span>{% translate 'My actions' %}</span>
                    </div>
                    {% load log %}
                    {% get_admin_log 5 as admin_log for_user user %}
                    {% if not admin_log %}
                        <p>{% translate 'None available' %}</p>
                    {% else %}
                        <div class="divide-y">
                            {% for entry in admin_log %}
                                <div class="row">
                                    <div class="text-truncate {% if entry.is_addition %}text-success{% endif %}{% if entry.is_change %}text-primary{% endif %}{% if entry.is_deletion %}text-danger{% endif %}">
                                        <strong>
                                            {% if entry.is_addition %}
                                                {% icon 'tabler-square-add' 'icon' %} {% translate 'Added:' %}
                                            {% elif entry.is_change %}
                                                {% icon 'tabler-edit' 'icon' %} {% translate 'Changed:' %}
                                            {% elif entry.is_deletion %}
                                                {% icon 'tabler-delete' 'icon' %} {% translate 'Deleted:' %}
                                            {% endif %}
                                        </strong>
                                        <small>
                                            {% if entry.content_type %}
                                                {% filter capfirst %}{{ entry.content_type.name }}{% endfilter %}
                                            {% else %}
                                                {% translate 'Unknown content' %}
                                            {% endif %}
                                        </small>
                                        {% if entry.is_deletion or not entry.get_admin_url %}
                                            &lt;{{ entry.object_repr }}&gt;
                                        {% else %}
                                            &lt;<a href="{{ entry.get_admin_url }}">{{ entry.object_repr }}</a>&gt;
                                        {% endif %}
                                    </div>
                                    <div class="text-secondary">
                                        <span class="fs-6 text-muted">{{ entry.action_time }}</span>
                                    </div>
                                </div>
                            {% endfor %}
                        </div>
                    {% endif %}
                </div>
            </div>
        </div>
        <!-- END USER ACTIONS -->
    </div>
{% endblock %}