{% extends 'assistant/base.html' %}
{% load static %}
{% load i18n %}

{% block sidebar.dashboard %} {% endblock %}
{% block sidebar.patients %} {% endblock %}
{% block sidebar.diet_management %} class="active" {% endblock %}

{% block content %}
<div class="content">
    <div class="row">
        <div class="col-12 text-center mb-4">
            <h4 class="page-title" style="color: #009A6E; font-size: 28px;">
                داشبورد مدیریت رژیم های غذایی
            </h4>
        </div>
    </div>

    <!-- Statistics Cards -->
    <div class="row mb-4">
        <div class="col-md-3 col-sm-6">
            <div class="dash-widget" style="background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);">
                <span class="dash-widget-icon"><i class="fa fa-users" style="color: white;"></i></span>
                <div class="dash-widget-info text-center" style="color: white;">
                    <h3 style="color: white;">{{ total_patients }}</h3>
                    <span class="widget-title" style="color: white;">{% trans "total_patients" as total_patients_text %}{% if total_patients_text == "total_patients" %}کل بیماران{% else %}{{ total_patients_text }}{% endif %}</span>
                </div>
            </div>
        </div>
        <div class="col-md-3 col-sm-6">
            <div class="dash-widget" style="background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);">
                <span class="dash-widget-icon"><i class="fa fa-clock-o" style="color: white;"></i></span>
                <div class="dash-widget-info text-center" style="color: white;">
                    <h3 style="color: white;">{{ recently_received_count }}</h3>
                    <span class="widget-title" style="color: white;">{% trans "recently_received" as recently_received_text %}{% if recently_received_text == "recently_received" %}رژیم های اخیر{% else %}{{ recently_received_text }}{% endif %}</span>
                </div>
            </div>
        </div>
        <div class="col-md-3 col-sm-6">
            <div class="dash-widget" style="background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%);">
                <span class="dash-widget-icon"><i class="fa fa-check-circle" style="color: white;"></i></span>
                <div class="dash-widget-info text-center" style="color: white;">
                    <h3 style="color: white;">{{ active_diets_count }}</h3>
                    <span class="widget-title" style="color: white;">{% trans "active_diets" as active_diets_text %}{% if active_diets_text == "active_diets" %}رژیم های فعال{% else %}{{ active_diets_text }}{% endif %}</span>
                </div>
            </div>
        </div>
        <div class="col-md-3 col-sm-6">
            <div class="dash-widget" style="background: linear-gradient(135deg, #fa709a 0%, #fee140 100%);">
                <span class="dash-widget-icon"><i class="fa fa-exclamation-triangle" style="color: white;"></i></span>
                <div class="dash-widget-info text-center" style="color: white;">
                    <h3 style="color: white;">{{ expiring_soon_count }}</h3>
                    <span class="widget-title" style="color: white;">{% trans "expiring_soon" as expiring_soon_text %}{% if expiring_soon_text == "expiring_soon" %}نزدیک به اتمام{% else %}{{ expiring_soon_text }}{% endif %}</span>
                </div>
            </div>
        </div>
    </div>

    <!-- Tabs for Categories -->
    <div class="row">
        <div class="col-12">
            <ul class="nav nav-tabs nav-tabs-bottom" role="tablist">
                <li class="nav-item">
                    <a class="nav-link active" href="#recently_received_tab" data-toggle="tab" role="tab">
                        <span class="badge badge-pill badge-danger">{{ recently_received_count }}</span>
                        {% trans "recently_received" as recently_received_tab_text %}{% if recently_received_tab_text == "recently_received" %}رژیم های اخیر{% else %}{{ recently_received_tab_text }}{% endif %}
                    </a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="#active_diets_tab" data-toggle="tab" role="tab">
                        <span class="badge badge-pill badge-success">{{ active_diets_count }}</span>
                        {% trans "active_diets" as active_diets_tab_text %}{% if active_diets_tab_text == "active_diets" %}رژیم های فعال{% else %}{{ active_diets_tab_text }}{% endif %}
                    </a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="#expiring_soon_tab" data-toggle="tab" role="tab">
                        <span class="badge badge-pill badge-warning">{{ expiring_soon_count }}</span>
                        {% trans "expiring_soon" as expiring_soon_tab_text %}{% if expiring_soon_tab_text == "expiring_soon" %}نزدیک به اتمام{% else %}{{ expiring_soon_tab_text }}{% endif %}
                    </a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="#no_diet_tab" data-toggle="tab" role="tab">
                        <span class="badge badge-pill badge-secondary">{{ no_diet_count }}</span>
                        {% trans "no_diet" as no_diet_tab_text %}{% if no_diet_tab_text == "no_diet" %}بدون رژیم{% else %}{{ no_diet_tab_text }}{% endif %}
                    </a>
                </li>
            </ul>

            <div class="tab-content">
                <!-- Recently Received Tab -->
                <div class="tab-pane fade show active" id="recently_received_tab" role="tabpanel">
                    <div class="card">
                        <div class="card-body">
                            <h5 class="card-title">{% trans "recently_received_desc" as recently_received_desc_text %}{% if recently_received_desc_text == "recently_received_desc" %}کاربرانی که طی 7 روز گذشته رژیم دریافت کرده‌اند{% else %}{{ recently_received_desc_text }}{% endif %}</h5>
                            <div class="table-responsive">
                                <table class="table table-hover table-striped">
                                    <thead>
                                        <tr>
                                            <th>{% trans "نام" %}</th>
                                            <th>{% trans "نام خانوادگی" %}</th>
                                            <th>{% trans "from_date" as from_date_text %}{% if from_date_text == "from_date" %}تاریخ شروع{% else %}{{ from_date_text }}{% endif %}</th>
                                            <th>{% trans "days_since_start" as days_since_start_text %}{% if days_since_start_text == "days_since_start" %}روز از شروع{% else %}{{ days_since_start_text }}{% endif %}</th>
                                            <th>{% trans "days_remaining" as days_remaining_text %}{% if days_remaining_text == "days_remaining" %}روز باقیمانده{% else %}{{ days_remaining_text }}{% endif %}</th>
                                            <th>{% trans "تغییرات" %}</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        {% for item in recently_received %}
                                        <tr style="background-color: rgba(252, 231, 243, 0.5);">
                                            <td>{{ item.patient.profile.first_name }}</td>
                                            <td>{{ item.patient.profile.last_name }}</td>
                                            <td>{{ item.jalali_date }}</td>
                                            <td>
                                                <span class="badge badge-info">{{ item.days_since_start }} {% trans "days" as days_text %}{% if days_text == "days" %}روز{% else %}{{ days_text }}{% endif %}</span>
                                            </td>
                                            <td>
                                                <span class="badge badge-success">{{ item.days_remaining }} {% trans "days" as days_text2 %}{% if days_text2 == "days" %}روز{% else %}{{ days_text2 }}{% endif %}</span>
                                            </td>
                                            <td>
                                                <a href="{% url 'panel-assistant-show-patient' item.patient.id %}" class="btn btn-sm btn-primary">
                                                    <i class="fa fa-eye"></i> {% trans "مشاهده" %}
                                                </a>
                                                <a href="{% url 'panel-assistant-diets2' item.patient.id %}" class="btn btn-sm btn-success">
                                                    <i class="fa fa-cutlery"></i> {% trans "view_diet" as view_diet_text %}{% if view_diet_text == "view_diet" %}مشاهده رژیم{% else %}{{ view_diet_text }}{% endif %}
                                                </a>
                                            </td>
                                        </tr>
                                        {% empty %}
                                        <tr>
                                            <td colspan="6" class="text-center">{% trans "no_patients_in_category" as no_patients_text %}{% if no_patients_text == "no_patients_in_category" %}هیچ بیماری در این دسته وجود ندارد{% else %}{{ no_patients_text }}{% endif %}</td>
                                        </tr>
                                        {% endfor %}
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>

                <!-- Active Diets Tab -->
                <div class="tab-pane fade" id="active_diets_tab" role="tabpanel">
                    <div class="card">
                        <div class="card-body">
                            <h5 class="card-title">{% trans "active_diets_desc" as active_diets_desc_text %}{% if active_diets_desc_text == "active_diets_desc" %}کاربران با رژیم فعال (بیش از 7 روز باقیمانده){% else %}{{ active_diets_desc_text }}{% endif %}</h5>
                            <div class="table-responsive">
                                <table class="table table-hover table-striped">
                                    <thead>
                                        <tr>
                                            <th>{% trans "نام" %}</th>
                                            <th>{% trans "نام خانوادگی" %}</th>
                                            <th>{% trans "from_date" as from_date_text2 %}{% if from_date_text2 == "from_date" %}تاریخ شروع{% else %}{{ from_date_text2 }}{% endif %}</th>
                                            <th>{% trans "days_since_start" as days_since_start_text2 %}{% if days_since_start_text2 == "days_since_start" %}روز از شروع{% else %}{{ days_since_start_text2 }}{% endif %}</th>
                                            <th>{% trans "days_remaining" as days_remaining_text2 %}{% if days_remaining_text2 == "days_remaining" %}روز باقیمانده{% else %}{{ days_remaining_text2 }}{% endif %}</th>
                                            <th>{% trans "تغییرات" %}</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        {% for item in active_diets %}
                                        <tr style="background-color: rgba(224, 247, 250, 0.5);">
                                            <td>{{ item.patient.profile.first_name }}</td>
                                            <td>{{ item.patient.profile.last_name }}</td>
                                            <td>{{ item.jalali_date }}</td>
                                            <td>
                                                <span class="badge badge-info">{{ item.days_since_start }} {% trans "days" as days_text3 %}{% if days_text3 == "days" %}روز{% else %}{{ days_text3 }}{% endif %}</span>
                                            </td>
                                            <td>
                                                <span class="badge badge-primary">{{ item.days_remaining }} {% trans "days" as days_text4 %}{% if days_text4 == "days" %}روز{% else %}{{ days_text4 }}{% endif %}</span>
                                            </td>
                                            <td>
                                                <a href="{% url 'panel-assistant-show-patient' item.patient.id %}" class="btn btn-sm btn-primary">
                                                    <i class="fa fa-eye"></i> {% trans "مشاهده" %}
                                                </a>
                                                <a href="{% url 'panel-assistant-diets2' item.patient.id %}" class="btn btn-sm btn-success">
                                                    <i class="fa fa-cutlery"></i> {% trans "view_diet" as view_diet_text2 %}{% if view_diet_text2 == "view_diet" %}مشاهده رژیم{% else %}{{ view_diet_text2 }}{% endif %}
                                                </a>
                                            </td>
                                        </tr>
                                        {% empty %}
                                        <tr>
                                            <td colspan="6" class="text-center">{% trans "no_patients_in_category" as no_patients_text2 %}{% if no_patients_text2 == "no_patients_in_category" %}هیچ بیماری در این دسته وجود ندارد{% else %}{{ no_patients_text2 }}{% endif %}</td>
                                        </tr>
                                        {% endfor %}
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>

                <!-- Expiring Soon Tab -->
                <div class="tab-pane fade" id="expiring_soon_tab" role="tabpanel">
                    <div class="card">
                        <div class="card-body">
                            <h5 class="card-title" style="color: #ff6b6b;">{% trans "expiring_soon_desc" as expiring_soon_desc_text %}{% if expiring_soon_desc_text == "expiring_soon_desc" %}⚠️ کاربرانی که رژیمشان طی 7 روز آینده به پایان می‌رسد{% else %}{{ expiring_soon_desc_text }}{% endif %}</h5>
                            <div class="table-responsive">
                                <table class="table table-hover table-striped">
                                    <thead>
                                        <tr>
                                            <th>{% trans "نام" %}</th>
                                            <th>{% trans "نام خانوادگی" %}</th>
                                            <th>{% trans "from_date" as from_date_text3 %}{% if from_date_text3 == "from_date" %}تاریخ شروع{% else %}{{ from_date_text3 }}{% endif %}</th>
                                            <th>{% trans "days_since_start" as days_since_start_text3 %}{% if days_since_start_text3 == "days_since_start" %}روز از شروع{% else %}{{ days_since_start_text3 }}{% endif %}</th>
                                            <th>{% trans "days_remaining" as days_remaining_text3 %}{% if days_remaining_text3 == "days_remaining" %}روز باقیمانده{% else %}{{ days_remaining_text3 }}{% endif %}</th>
                                            <th>{% trans "تغییرات" %}</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        {% for item in expiring_soon %}
                                        <tr style="background-color: rgba(255, 235, 205, 0.7);">
                                            <td>{{ item.patient.profile.first_name }}</td>
                                            <td>{{ item.patient.profile.last_name }}</td>
                                            <td>{{ item.jalali_date }}</td>
                                            <td>
                                                <span class="badge badge-info">{{ item.days_since_start }} {% trans "days" as days_text5 %}{% if days_text5 == "days" %}روز{% else %}{{ days_text5 }}{% endif %}</span>
                                            </td>
                                            <td>
                                                {% if item.days_remaining == 0 %}
                                                    <span class="badge badge-danger">{% trans "expired" as expired_text %}{% if expired_text == "expired" %}منقضی شده{% else %}{{ expired_text }}{% endif %}</span>
                                                {% else %}
                                                    <span class="badge badge-warning">{{ item.days_remaining }} {% trans "days" as days_text6 %}{% if days_text6 == "days" %}روز{% else %}{{ days_text6 }}{% endif %}</span>
                                                {% endif %}
                                            </td>
                                            <td>
                                                <a href="{% url 'panel-assistant-show-patient' item.patient.id %}" class="btn btn-sm btn-primary">
                                                    <i class="fa fa-eye"></i> {% trans "مشاهده" %}
                                                </a>
                                                <a href="{% url 'panel-assistant-diets2' item.patient.id %}" class="btn btn-sm btn-success">
                                                    <i class="fa fa-cutlery"></i> {% trans "view_diet" as view_diet_text3 %}{% if view_diet_text3 == "view_diet" %}مشاهده رژیم{% else %}{{ view_diet_text3 }}{% endif %}
                                                </a>
                                            </td>
                                        </tr>
                                        {% empty %}
                                        <tr>
                                            <td colspan="6" class="text-center">{% trans "no_patients_in_category" as no_patients_text3 %}{% if no_patients_text3 == "no_patients_in_category" %}هیچ بیماری در این دسته وجود ندارد{% else %}{{ no_patients_text3 }}{% endif %}</td>
                                        </tr>
                                        {% endfor %}
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>

                <!-- No Diet Tab -->
                <div class="tab-pane fade" id="no_diet_tab" role="tabpanel">
                    <div class="card">
                        <div class="card-body">
                            <h5 class="card-title" style="color: #6c757d;">{% trans "no_diet_desc" as no_diet_desc_text %}{% if no_diet_desc_text == "no_diet_desc" %}کاربران بدون رژیم تعیین شده{% else %}{{ no_diet_desc_text }}{% endif %}</h5>
                            <div class="table-responsive">
                                <table class="table table-hover table-striped">
                                    <thead>
                                        <tr>
                                            <th>{% trans "نام" %}</th>
                                            <th>{% trans "نام خانوادگی" %}</th>
                                            <th>{% trans "جنسیت" %}</th>
                                            <th>{% trans "تغییرات" %}</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        {% for item in no_diet %}
                                        <tr style="background-color: rgba(220, 220, 220, 0.3);">
                                            <td>{{ item.patient.profile.first_name }}</td>
                                            <td>{{ item.patient.profile.last_name }}</td>
                                            <td>
                                                {% if item.patient.profile.gender %}
                                                    {% trans "زن" %}
                                                {% else %}
                                                    {% trans "مرد" %}
                                                {% endif %}
                                            </td>
                                            <td>
                                                <a href="{% url 'panel-assistant-show-patient' item.patient.id %}" class="btn btn-sm btn-primary">
                                                    <i class="fa fa-eye"></i> {% trans "مشاهده" %}
                                                </a>
                                                <a href="{% url 'panel-assistant-diets2' item.patient.id %}" class="btn btn-sm btn-warning">
                                                    <i class="fa fa-plus"></i> {% trans "add_diet" as add_diet_text %}{% if add_diet_text == "add_diet" %}افزودن رژیم{% else %}{{ add_diet_text }}{% endif %}
                                                </a>
                                            </td>
                                        </tr>
                                        {% empty %}
                                        <tr>
                                            <td colspan="4" class="text-center">{% trans "no_patients_in_category" as no_patients_text4 %}{% if no_patients_text4 == "no_patients_in_category" %}هیچ بیماری در این دسته وجود ندارد{% else %}{{ no_patients_text4 }}{% endif %}</td>
                                        </tr>
                                        {% endfor %}
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<style>
    .dash-widget {
        border-radius: 15px;
        padding: 20px;
        margin-bottom: 20px;
        box-shadow: 0 4px 6px rgba(0,0,0,0.1);
        transition: transform 0.3s ease;
    }
    
    .dash-widget:hover {
        transform: translateY(-5px);
        box-shadow: 0 8px 12px rgba(0,0,0,0.15);
    }
    
    .dash-widget-icon {
        font-size: 40px;
        opacity: 0.8;
    }
    
    .nav-tabs-bottom {
        border-bottom: 2px solid #009A6E;
    }
    
    .nav-tabs-bottom .nav-link {
        border: none;
        border-bottom: 3px solid transparent;
        color: #333;
        font-weight: 500;
        padding: 15px 20px;
    }
    
    .nav-tabs-bottom .nav-link.active {
        border-bottom: 3px solid #009A6E;
        color: #009A6E;
    }
    
    .nav-tabs-bottom .nav-link:hover {
        border-bottom: 3px solid #009A6E;
    }
    
    .card {
        border: none;
        box-shadow: 0 2px 4px rgba(0,0,0,0.1);
        border-radius: 10px;
        margin-top: 20px;
    }
    
    .card-title {
        font-size: 18px;
        font-weight: 600;
        margin-bottom: 20px;
        padding-bottom: 10px;
        border-bottom: 2px solid #f0f0f0;
    }
    
    .table thead th {
        background-color: #f8f9fa;
        border-bottom: 2px solid #dee2e6;
        font-weight: 600;
        text-align: center;
    }
    
    .table tbody td {
        vertical-align: middle;
        text-align: center;
    }
    
    .badge-pill {
        padding: 5px 10px;
        font-size: 12px;
    }
</style>
{% endblock %}