{% extends "base.html" %}
{% load static %}
{% load i18n %}
{% load roles %}

{% block head %}
    <title>StreetUp | {% translate "Accueil" %}</title>
    <link rel="stylesheet" href="{% static 'home/home_index.css' %}">
{% endblock head %}

{% block content %}
    {% include "home/_intervention_type_modal.html" %}
    {% include "home/_new_inspection_modal.html" %}
    {% if can_add_structures_repair %}
    {% include "home/_add_repair_intervention_modal.html" %}
    {% endif %}
    <div class="background-layer"></div>
    <div class="bg-image">  
        <div class="container content-box">
            <!-- <h1 class="display-4 m-3 halo-text"><strong>Brussels Mobility</strong></h1> -->
             <div class="row justify-content-center mt-2 mb-3">
                <div class="col-md-12">
                    {% if user.config|has_any_role:"observer,manager,controller,admin,external_manager,top_manager" %}
                        <a href="{% url 'observations:observation_add' %}" class="btn btn-light main-button my-1 ms-1" type="button">
                            <i class="bi bi-eye me-2"></i>{% translate "Nouvelle observation" %}
                        </a>
                    {% endif %}
                    {% if can_add_structures_repair %}
                        <button class="btn btn-light main-button my-1 ms-1" type="button" data-bs-toggle="modal" data-bs-target="#addRepairInterventionModal">
                            <i class="bi bi-plus-lg me-2"></i>{% translate "Intervention Réparation" %}
                        </button>
                    {% endif %}
                    {% if is_inspector %}
                        <button class="btn btn-light main-button my-1 ms-1" type="button" data-bs-toggle="modal" data-bs-target="#newInspectionModal">
                            <i class="bi bi-search me-2"></i>{% translate "Nouvelle inspection" %}
                        </button>
                    {% endif %}
                    {% if user.config|has_any_role:"manager,admin,controller,external_manager,top_manager" %}
                        <button class="btn btn-light main-button my-1 ms-1" type="button" data-bs-toggle="modal" data-bs-target="#interventionTypeModal">
                            <i class="bi bi-wrench me-2"></i>{% translate "Nouvelle intervention" %}
                        </button>
                    {% elif user.config|has_any_role:"operator" %}
                        <a class="btn btn-danger main-button my-1 ms-1"
                            href="{% url 'interventions:intervention_add_choose_thematic' %}?type=corrective">
                            <i class="bi bi-tools me-2"></i>{% translate "Nouvelle intervention corrective" %}
                        </a>
                        <a class="btn btn-success main-button my-1 ms-1"
                            href="{% url 'interventions:intervention_add_choose_thematic' %}?type=ameliorative">
                            <i class="bi bi-arrow-up-circle me-2"></i>{% translate "Nouvelle intervention améliorative" %}
                        </a>
                    {% endif %}
                    {% if user.config|has_any_role:"manager,admin" %}
                        <a href="{% url 'projects:projects_add' %}" class="btn btn-light main-button my-1 ms-1" type="button">
                            <i class="bi bi-wrench-adjustable me-2"></i>{% translate "Nouveau projet" %}
                        </a>
                        <a href="{% url 'contracts:contracts_orders_add' %}" class="btn btn-light main-button my-1 ms-1" type="button">
                            <i class="bi bi-currency-euro me-2"></i>{% translate "Nouvelle commande" %}
                        </a>
                    {% endif %}
                </div>
            </div>

            {# ========== Bouton rapport journalier ========== #}
            {% if can_generate_daily_report %}
            <div class="row justify-content-center mb-3">
                <div class="col-md-8">
                    <div class="dropdown d-inline-block">
                        <button class="btn btn-light main-button my-1 ms-1 dropdown-toggle" type="button" data-bs-toggle="dropdown" aria-expanded="false">
                            <i class="bi bi-file-earmark-bar-graph me-2"></i>{% translate "Rapport journalier" %}
                        </button>
                        <ul class="dropdown-menu">
                            <li>
                                <a class="dropdown-item" href="{% url 'contracts:daily_report' %}?format=pdf" target="_blank">
                                    <i class="bi bi-file-pdf me-2 text-danger"></i>{% translate "Télécharger PDF" %}
                                </a>
                            </li>
                            <li>
                                <a class="dropdown-item" href="{% url 'contracts:daily_report' %}?format=excel">
                                    <i class="bi bi-file-earmark-excel me-2 text-success"></i>{% translate "Télécharger Excel" %}
                                </a>
                            </li>
                            <li>
                                <a class="dropdown-item" href="{% url 'contracts:daily_report' %}?format=zip">
                                    <i class="bi bi-file-zip me-2 text-warning"></i>{% translate "Télécharger ZIP (PDF + Excel)" %}
                                </a>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
            {% endif %}

            {# ========== Widget Orchestrator ========== #}
            {% for row in widget_rows %}
                <div class="row justify-content-center mt-4 mb-4 g-3">
                    {% for resolved in row %}
                    <div class="col-md-{{ resolved.col_width }}">
                        {% include resolved.template_name with widget=resolved.widget user_contracts=user_contracts user_team=user_team %}
                    </div>
                    {% endfor %}
                </div>
            {% empty %}
                {% include "home/widgets/_default.html" %}
            {% endfor %}
            
        </div>
    </div>

{% endblock content%}


{% block script %}
    <!-- ECharts 5.5.1 (local) -->
    <script src="{% static 'common/echarts.min.js' %}"></script>
    <script src="{% url 'javascript-catalog' %}"></script>
    <script>
        function formatDate(date) {
            return date.toISOString().slice(0, 10);  // 'YYYY-MM-DD'
        }

        const today = new Date();
        const tomorrow = new Date();
        const yesterday = new Date();
        yesterday.setDate(today.getDate() - 1);  // soustrait 1
        tomorrow.setDate(today.getDate() + 1);  // ajoute 1 jour

        const begin_date_min = formatDate(yesterday);
        const begin_date_max = formatDate(tomorrow);

        var baseUrl = "{% url 'interventions:interventions_geojson' %}";
        {% if thematic_filter_param %}
            baseUrl += "?{{ thematic_filter_param|safe }}&";
        {% else %}
            baseUrl += "?";
        {% endif %}
        const interventions_geojson_urls = [
            `${baseUrl}status=to_be_processed,assigned,in_progress,on_pause,finished&begin_date_min=${begin_date_min}&begin_date_max=${begin_date_max}`
        ];
        const interventionsUrl = "{% url 'interventions:interventions_index' %}{% if thematic_filter_param %}?{{ thematic_filter_param }}{% endif %}";
        const interventionDetailUrlPattern = "{% url 'interventions:intervention_detail' 0 %}";

        const seriesData = {{ series_data|safe }};

    </script>
    <script src="{% static 'interventions/status_colors.js' %}"></script>
    <script src="{% static 'home/home_index.js' %}"></script>
{% endblock script %}