{% extends '@App/app.html.twig' %}

{% block title %}Planning hebdomadaire{% endblock %}
{% block page_header %}{% endblock %}

{% block content %}
{% set french_days = {
    1: 'Lundi',
    2: 'Mardi',
    3: 'Mercredi',
    4: 'Jeudi',
    5: 'Vendredi',
    6: 'Samedi',
    7: 'Dimanche'
} %}
{% set french_months = {
    1: 'Janvier',
    2: 'Février',
    3: 'Mars',
    4: 'Avril',
    5: 'Mai',
    6: 'Juin',
    7: 'Juillet',
    8: 'Août',
    9: 'Septembre',
    10: 'Octobre',
    11: 'Novembre',
    12: 'Décembre'
} %}
{% set current_query = app.request.query.all %}
{% set previous_start = calendar.start|date_modify('-7 days')|date('Y-m-d') %}
{% set next_start = calendar.start|date_modify('+7 days')|date('Y-m-d') %}
{% set completion = calendar.contractMinutes > 0 ? ((calendar.totalMinutes / calendar.contractMinutes * 100)|round(0, 'floor')) : 0 %}
{% set completion = completion > 100 ? 100 : completion %}
{% set week_is_editable = calendar.editableSchedule is not empty %}
{% set schedule_count = calendar.schedules|length %}
{% set week_is_published = schedule_count > 0 and not week_is_editable %}
{% set conflict_count = conflicts|length %}
{% set show_avatars = settings is defined ? settings.getOption('showAvatars', true) : true %}
{% set show_breaks = settings is defined ? settings.getOption('showBreaks', true) : true %}
{% set color_by = settings is defined ? settings.getOption('colorBy', 'service') : 'service' %}

<div class="data-page planning-weekly" data-controller="planning-weekly" data-planning-weekly-conflict-count-value="{{ conflict_count }}" data-color-by="{{ color_by }}">
    <div class="planning-weekly__header">
        <div>
            <div class="data-breadcrumb">
                <a href="{{ path('planning_index') }}">Plannings</a>
                <i class="ti ti-chevron-right" aria-hidden="true"></i>
                <span class="text-muted">Gestion des Plannings</span>
            </div>
            <h1>Planning Hebdomadaire</h1>
            <p>Gestion des horaires - Semaine {{ calendar.start|date('W') }} ({{ calendar.start|date('d/m/Y') }} - {{ calendar.end|date('d/m/Y') }})</p>
        </div>

        <div class="planning-weekly__controls">
            {% if schedule_count == 0 %}
                <form method="post" action="{{ path('planning_week_create') }}">
                    <input type="hidden" name="start" value="{{ calendar.start|date('Y-m-d') }}">
                    <input type="hidden" name="_token" value="{{ csrf_token('planning_week_create_' ~ calendar.start|date('Y-m-d')) }}">
                    <button class="data-button data-button--primary" type="submit"><i class="ti ti-plus" aria-hidden="true"></i>Nouveau Planning</button>
                </form>
            {% elseif week_is_editable %}
                <form method="post" action="{{ path('planning_week_publish') }}" data-action="submit->planning-weekly#confirmPublish">
                    <input type="hidden" name="start" value="{{ calendar.start|date('Y-m-d') }}">
                    <input type="hidden" name="_token" value="{{ csrf_token('planning_week_publish_' ~ calendar.start|date('Y-m-d')) }}">
                    <button class="data-button data-button--primary" type="submit"><i class="ti ti-send" aria-hidden="true"></i>Publier la semaine</button>
                </form>
            {% elseif week_is_published %}
                <button class="data-button data-button--primary" type="button" data-action="planning-weekly#openTemplateModal">
                    <i class="ti ti-copy-plus" aria-hidden="true"></i>
                    Ajouter comme modèle
                </button>
            {% endif %}
            <div class="planning-weekly__views" aria-label="Vues planning">
                <a href="{{ path('planning_week', current_query) }}">Jour</a>
                <a class="is-active" href="{{ path('planning_week', current_query) }}">Semaine</a>
                <a href="{{ path('planning_month') }}">Mois</a>
            </div>
            <div class="planning-weekly__nav">
                <button class="data-button data-button--secondary" type="button" data-action="planning-weekly#go" data-url="{{ path('planning_week', current_query|merge({start: previous_start})) }}"><i class="ti ti-chevron-left" aria-hidden="true"></i></button>
                <button class="data-button data-button--secondary" type="button" data-action="planning-weekly#go" data-url="{{ path('planning_week') }}">Aujourd'hui</button>
                <button class="data-button data-button--secondary" type="button" data-action="planning-weekly#go" data-url="{{ path('planning_week', current_query|merge({start: next_start})) }}"><i class="ti ti-chevron-right" aria-hidden="true"></i></button>
            </div>
            
        </div>
    </div>

    <form class="planning-weekly__filters" method="get">
        <input type="hidden" name="start" value="{{ calendar.start|date('Y-m-d') }}">
        <div class="planning-weekly__filter-fields">
            <select name="etablissement" aria-label="Établissement" data-action="planning-weekly#submit">
                <option value="">Tous les établissements</option>
                {% for etablissement in etablissements %}
                    <option value="{{ etablissement.id }}" {{ app.request.query.get('etablissement') == etablissement.id ? 'selected' : '' }}>{{ etablissement.nom }}</option>
                {% endfor %}
            </select>
            <select name="service" aria-label="Service" data-action="planning-weekly#submit">
                <option value="">Tous les services</option>
                {% for service in services %}
                    <option value="{{ service.id }}" {{ app.request.query.get('service') == service.id ? 'selected' : '' }}>Service : {{ service.nom }}</option>
                {% endfor %}
            </select>
            <button class="data-button data-button--secondary" type="button" data-action="planning-weekly#toggleFilters"><i class="ti ti-filter" aria-hidden="true"></i>Plus de filtres</button>
            <div class="planning-weekly__filter-fields" data-planning-weekly-target="advancedFilters" hidden>
                <button class="data-button data-button--secondary" type="submit"><i class="ti ti-check" aria-hidden="true"></i>Appliquer</button>
                <a class="data-button data-button--secondary" href="{{ path('planning_week') }}">Réinitialiser</a>
            </div>
        </div>
        <div class="planning-weekly__legend">
            <span data-tone="morning">Matin</span>
            <span data-tone="afternoon">A-Midi</span>
            <span data-tone="night">Nuit</span>
            <span data-tone="leave">Congé</span>
            <span data-tone="sick">Maladie</span>
        </div>
    </form>

    <section class="planning-week-table" data-controller="planning-drag">
        <div class="planning-week-table__header">
            <div class="planning-week-table__head planning-week-table__head--employee">Salarié</div>
            {% for day in calendar.days %}
                <div class="planning-week-table__head">
                    <span>{{ french_days[day|date('N')]|upper }}</span>
                    <strong>{{ day|date('j') }} {{ french_months[day|date('n')] }}</strong>
                </div>
            {% endfor %}
        </div>

        <div class="planning-week-table__body">
            {% for group in calendar.rowGroups %}
                <div class="planning-week-table__service-row">
                    <div class="planning-week-table__service-name">
                        <i class="ti ti-building-store" aria-hidden="true"></i>
                        <strong>{{ group.label }}</strong>
                        <span>{{ group.employeeCount }} salarié{{ group.employeeCount > 1 ? 's' : '' }}</span>
                    </div>
                </div>

                {% for row in group.rows %}
                {% set salarie = row.employee %}
                {% set photo_path = salarie.photo ? salarie.photo|trim : null %}
                {% set avatar_src = photo_path ? (photo_path starts with 'http://' or photo_path starts with 'https://' ? photo_path : asset(photo_path starts with '/' ? photo_path|slice(1) : photo_path)) : null %}
                {% set initials = (salarie.prenom|default('?')|first ~ salarie.nom|default('')|first)|upper %}
                <div class="planning-week-table__row">
                    <div class="planning-week-table__employee {{ not show_avatars ? 'planning-week-table__employee--no-avatar' : '' }}" style="grid-column: 1;">
                        {% if show_avatars %}
                            <span class="data-avatar {{ avatar_src ? '' : 'data-avatar--initials' }}">
                                {% if avatar_src %}
                                    <img src="{{ avatar_src }}" alt="{{ salarie }}">
                                {% else %}
                                    {{ initials }}
                                {% endif %}
                            </span>
                            <span class="planning-week-table__presence" aria-hidden="true"></span>
                        {% endif %}
                        <div>
                            <strong>{{ salarie }}</strong>
                            <span>{{ salarie.employeeJob ? salarie.employeeJob.nom : salarie.poste|default('Salarié') }}</span>
                        </div>
                    </div>

                    {% for leave in row.leaveSpans %}
                        <div class="planning-week-absence planning-week-absence--{{ leave.tone }}" style="grid-column: {{ leave.columnStart }} / span {{ leave.span }};">
                            <i class="ti {{ leave.tone == 'sick' ? 'ti-first-aid-kit' : 'ti-beach' }}" aria-hidden="true"></i>
                            <strong>{{ leave.tone == 'sick' ? 'Arrêt maladie' : 'Congé payé' }}</strong>
                            {% if leave.request.startDate and leave.request.endDate %}
                                <span>{{ leave.request.startDate|date('d/m') }} → {{ leave.request.endDate|date('d/m') }}</span>
                            {% endif %}
                        </div>
                    {% endfor %}

                    {% for day in calendar.days %}
                        {% set day_key = day|date('Y-m-d') %}
                        {% set cell = row.cells[day_key] %}
                        <div class="planning-week-table__cell {{ day|date('N') >= 6 ? 'is-weekend' : '' }} {{ cell.coveredByLeave ? 'is-covered' : '' }}"
                            style="grid-column: {{ loop.index + 1 }};"
                            {% if week_is_editable %}
                                data-planning-drag-target="cell"
                                data-date="{{ day_key }}"
                                data-salarie-id="{{ salarie.id }}"
                                data-cell-modal-url="{{ path('planning_schedule_cell_modal', {id: calendar.editableSchedule.id, date: day_key, salarieId: salarie.id, returnToWeek: 1}) }}"
                                data-action="click->planning-drag#openCellModal dragover->planning-drag#allowDrop dragleave->planning-drag#leaveDrop drop->planning-drag#drop"
                            {% endif %}
                        >
                            {% for assignment in cell.assignments %}
                                {% set shift = assignment.shift %}
                                {% set start_hour = shift.startTime ? shift.startTime|date('H') : '08' %}
                                {% set tone = start_hour >= '18' or start_hour < '06' ? 'night' : (start_hour >= '12' ? 'afternoon' : 'morning') %}
                                {% set shift_schedule = shift.schedule %}
                                {% set shift_editable = week_is_editable and shift_schedule and shift_schedule.id == calendar.editableSchedule.id %}
                                {% set shift_unpublished = shift_schedule and shift_schedule.status in ['draft', 'ready'] %}
                                {% set shift_state = shift_unpublished ? 'draft' : 'published' %}
                                {% set status_label = shift_unpublished ? (shift_schedule.status == 'ready' ? 'Planifié' : 'Brouillon') : 'Publié' %}
                                {% set shift_conflicts = conflicts|filter(conflict => (conflict.shift and conflict.shift.id == shift.id) or (conflict.assignment and conflict.assignment.id == assignment.id)) %}
                                {% set shift_has_conflict = shift_conflicts|length > 0 %}
                                {% set shift_alert_message = shift_conflicts|map(conflict => conflict.message)|join(' · ') %}
                                <div class="planning-week-card planning-week-card--{{ tone }} planning-week-card--{{ shift_state }} {{ shift_has_conflict ? 'planning-week-card--alert' : '' }} {{ shift_editable ? 'is-draggable' : 'is-locked' }}"
                                    {% if shift_editable %}
                                        draggable="true"
                                        data-planning-drag-target="shift"
                                        data-shift-id="{{ shift.id }}"
                                        data-assignment-id="{{ assignment.id }}"
                                        data-move-url="{{ path('planning_shift_move', {id: shift.id}) }}"
                                        data-edit-modal-url="{{ path('planning_shift_edit_modal', {id: shift.id, returnToWeek: 1, weekStart: calendar.start|date('Y-m-d')}) }}"
                                        data-csrf-token="{{ csrf_token('planning_shift_move_' ~ shift.id) }}"
                                        data-action="dragstart->planning-drag#dragStart dragend->planning-drag#dragEnd click->planning-drag#openEditModal"
                                    {% endif %}
                                >
                                    <div class="planning-week-card__top">
                                        <strong>{{ shift.title ?: (tone == 'afternoon' ? 'A-Midi' : (tone == 'night' ? 'Nuit' : 'Matin')) }}</strong>
                                        {% if shift_has_conflict %}
                                            <i class="ti ti-alert-triangle planning-alert-icon" aria-hidden="true" title="{{ shift_alert_message }}" aria-label="{{ shift_alert_message }}" data-tooltip="{{ shift_alert_message }}"></i>
                                        {% elseif shift_state == 'published' %}
                                            <i class="ti ti-circle-check-filled" aria-hidden="true"></i>
                                        {% endif %}
                                    </div>
                                    <b>{{ shift.startTime|date('H:i') }}-{{ shift.endTime|date('H:i') }}</b>
                                    <small>
                                        {% if show_breaks and shift.breakDurationMinutes > 0 %}
                                            Pause: {{ shift.breakDurationMinutes }} min
                                        {% elseif shift.service %}
                                            {{ shift.service }}
                                        {% else %}
                                            {{ (shift.netDurationMinutes / 60)|number_format(1, ',', ' ') }}h
                                        {% endif %}
                                    </small>
                                    <em>{{ status_label }}</em>
                                </div>
                            {% else %}
                                {% if week_is_editable and not cell.coveredByLeave %}
                                    <button class="planning-week-empty" type="button" aria-label="Ajouter un créneau">+</button>
                                {% endif %}
                            {% endfor %}
                        </div>
                    {% endfor %}

                </div>
                {% endfor %}
            {% else %}
                <div class="planning-roster__empty">Aucun salarié actif.</div>
            {% endfor %}
        </div>

        <footer class="planning-week-table__footer">
            <div class="planning-week-table__legend">
                <span data-tone="published">Publié</span>
                <span data-tone="draft">Brouillon / Modifié</span>
                <span data-tone="leave">Congé</span>
                <span data-tone="sick">Arrêt maladie</span>
                <span data-tone="night">Nuit</span>
                <span data-tone="conflict"><i class="ti ti-alert-triangle" aria-hidden="true"></i>Conflit</span>
            </div>
            <div class="planning-week-table__display">
                Affichage de <strong>{{ calendar.rows|length }} salariés</strong> sur {{ calendar.employees|length }}
                {% if calendar.employees|length > calendar.rows|length %}
                    <a href="{{ path('planning_week', {start: calendar.start|date('Y-m-d')}) }}">Tout afficher</a>
                {% endif %}
            </div>
        </footer>
    </section>

    <div class="planning-weekly__insights">
        <section class="planning-weekly-card">
            <div class="planning-weekly-card__header">
                <h2><i class="ti ti-alert-triangle" aria-hidden="true"></i>Conflits</h2>
                {% if conflicts|length > 0 %}<span class="planning-weekly-card__tag">BLOQUANT</span>{% endif %}
            </div>
            <div class="planning-conflict-list">
                {% for conflict in conflicts|slice(0, 2) %}
                    <div class="planning-conflict-item {{ conflict.severity == 'warning' ? 'planning-conflict-item--warning' : '' }}">
                        <strong>{{ conflict.type|replace({'_': ' '})|title }}</strong>
                        <span>{{ conflict.salarie ? conflict.salarie ~ ' - ' : '' }}{{ conflict.message }}</span>
                        {% if conflict.schedule %}
                            <a href="{{ path('planning_schedule_show', {id: conflict.schedule.id}) }}">Régler</a>
                        {% endif %}
                    </div>
                {% else %}
                    <div class="planning-template-item">
                        <strong>Aucun conflit ouvert</strong>
                        <span>La semaine ne contient pas d'alerte active.</span>
                    </div>
                {% endfor %}
            </div>
        </section>

        <section class="planning-weekly-card">
            <div class="planning-weekly-card__header">
                <h2><i class="ti ti-chart-pie-filled" aria-hidden="true"></i>Répartition</h2>
            </div>
            <div class="planning-weekly-donut">
                <div class="planning-weekly-donut__chart" style="--progress: {{ completion }}%">
                    <strong>{{ completion }}%</strong>
                </div>
            </div>
        </section>

        <section class="planning-weekly-card">
            <div class="planning-weekly-card__header">
                <h2><i class="ti ti-layers-intersect" aria-hidden="true"></i>Modèles</h2>
            </div>
            <div class="planning-template-list">
                {% for template in templates %}
                    <a class="planning-template-item" href="{{ path('planning_template_show', {id: template.id}) }}">
                        <strong>{{ template.nom }}</strong>
                        <span>{{ template.service ? template.service.nom : 'Tous services' }}</span>
                    </a>
                {% else %}
                    <div class="planning-template-item">
                        <strong>Aucun modèle actif</strong>
                        <span>Créez un modèle pour accélérer les prochaines semaines.</span>
                    </div>
                {% endfor %}
                <a class="data-button data-button--secondary" href="{{ path('planning_template_index') }}">Gérer les modèles</a>
            </div>
        </section>
    </div>

    {% if week_is_editable and conflict_count > 0 %}
        <div class="planning-alert-modal is-hidden" role="dialog" aria-modal="true" aria-labelledby="planning-publish-alert-title" data-planning-weekly-target="publishAlertModal">
            <div class="planning-alert-modal__dialog">
                <header class="planning-alert-modal__header">
                    <div>
                        <h2 id="planning-publish-alert-title">Publier avec des alertes ?</h2>
                        <p>{{ conflict_count }} alerte{{ conflict_count > 1 ? 's' : '' }} ouverte{{ conflict_count > 1 ? 's' : '' }} sur cette semaine.</p>
                    </div>
                    <button type="button" class="btn-close" aria-label="Fermer" data-action="planning-weekly#closePublishAlert"></button>
                </header>
                <div class="planning-alert-modal__body">
                    <div class="planning-conflict-list">
                        {% for conflict in conflicts|slice(0, 3) %}
                            <div class="planning-conflict-item {{ conflict.severity == 'warning' ? 'planning-conflict-item--warning' : '' }}">
                                <strong>{{ conflict.type|replace({'_': ' '})|title }}</strong>
                                <span>{{ conflict.salarie ? conflict.salarie ~ ' - ' : '' }}{{ conflict.message }}</span>
                            </div>
                        {% endfor %}
                    </div>
                    {% if conflict_count > 3 %}
                        <p class="planning-alert-modal__more">+{{ conflict_count - 3 }} autre{{ conflict_count - 3 > 1 ? 's' : '' }} alerte{{ conflict_count - 3 > 1 ? 's' : '' }}</p>
                    {% endif %}
                </div>
                <footer class="planning-alert-modal__footer">
                    <button type="button" class="data-button data-button--secondary" data-action="planning-weekly#closePublishAlert">Annuler</button>
                    <button type="button" class="data-button data-button--primary" data-action="planning-weekly#publishWithAlerts">Publier malgré les alertes</button>
                </footer>
            </div>
        </div>
    {% endif %}

    {% if week_is_published %}
        <div class="planning-alert-modal is-hidden" role="dialog" aria-modal="true" aria-labelledby="planning-template-week-title" data-planning-weekly-target="templateModal">
            <div class="planning-alert-modal__dialog">
                <form method="post" action="{{ path('planning_template_from_week') }}">
                    <input type="hidden" name="weekStart" value="{{ calendar.start|date('Y-m-d') }}">
                    <input type="hidden" name="_token" value="{{ csrf_token('planning_template_from_week_' ~ calendar.start|date('Y-m-d')) }}">
                    <header class="planning-alert-modal__header">
                        <div>
                            <h2 id="planning-template-week-title">Créer un modèle depuis cette semaine</h2>
                            <p>Les shifts publiés de la semaine seront copiés dans un nouveau modèle réutilisable.</p>
                        </div>
                        <button type="button" class="btn-close" aria-label="Fermer" data-action="planning-weekly#closeTemplateModal"></button>
                    </header>
                    <div class="planning-alert-modal__body">
                        <label class="planning-create__field">
                            <span>Nom du modèle</span>
                            <input type="text" name="nom" value="Semaine type {{ calendar.start|date('W') }} {{ calendar.start|date('o') }}" required>
                        </label>
                    </div>
                    <footer class="planning-alert-modal__footer">
                        <button type="button" class="data-button data-button--secondary" data-action="planning-weekly#closeTemplateModal">Annuler</button>
                        <button class="data-button data-button--primary" type="submit">Créer le modèle</button>
                    </footer>
                </form>
            </div>
        </div>
    {% endif %}
</div>
{% endblock %}