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

{% block title %}Paramètres planning{% endblock %}
{% block page_header %}{% endblock %}

{% block content %}
{% set view_labels = {week: 'Semaine', month: 'Mois', day: 'Jour', team: 'Équipe', employee: 'Salarié'} %}
{% set workflow_labels = {draft_then_publish: 'Brouillon → Publié', auto_publish: 'Publication auto', manager_publish: 'Manager', rh_publish: 'RH'} %}
{% set cards = [
    {
        title: 'Paramètres généraux',
        text: 'Vue par défaut, horaires de journée, granularité des créneaux de planification.',
        eyebrow: 'Global',
        icon: 'ti ti-adjustments-horizontal',
        tone: 'blue',
        route: path('planning_settings_configure', {section: 'general'}),
        rows: {'Vue par défaut': view_labels[settings.defaultView]|default(settings.defaultView), 'Granularité': settings.slotDurationMinutes ~ ' min'},
        primary: false
    },
    {
        title: 'Publication',
        text: 'Workflow de publication, notifications automatiques et délai de prévenance légal.',
        eyebrow: 'Workflow',
        icon: 'ti ti-send',
        tone: 'green',
        route: path('planning_settings_configure', {section: 'publication'}),
        rows: {'Méthode': workflow_labels[settings.publicationWorkflow]|default(settings.publicationWorkflow), 'Préavis': (settings.defaultNoticeDays|default(7)) ~ ' jours'},
        primary: false
    },
    {
        title: 'Règles de conformité',
        text: 'Durées maximales, repos, pauses obligatoires, chevauchements et gestion des conflits.',
        eyebrow: 'Légal',
        icon: 'ti ti-scale',
        tone: 'red',
        route: path('planning_settings_rules'),
        rows: {'Règles actives': rules_count ~ ' règle' ~ (rules_count > 1 ? 's' : ''), 'Blocages': blocking_rules_count ~ ' bloquante' ~ (blocking_rules_count > 1 ? 's' : '')},
        primary: true
    },
    {
        title: 'Disponibilités',
        text: "Autoriser les salariés à déclarer leurs disponibilités et périodes d'indisponibilité.",
        eyebrow: 'Employé',
        icon: 'ti ti-user-check',
        tone: 'purple',
        route: path('planning_settings_configure', {section: 'availability'}),
        rows: {'Statut': settings.allowEmployeeAvailability ? 'Activé' : 'Désactivé', 'Type': settings.getOption('availabilityModel', 'weekly_recurring') == 'specific_calendar' ? 'Calendrier' : 'Hebdomadaire'},
        primary: false
    },
    {
        title: 'Demandes de changement',
        text: "Permettre aux salariés de demander un changement d'horaire ou un échange de shift.",
        eyebrow: 'Service-client',
        icon: 'ti ti-route',
        tone: 'amber',
        route: path('planning_settings_configure', {section: 'change-requests'}),
        rows: {'Statut': settings.allowEmployeeChangeRequests ? 'Activé' : 'Désactivé', 'Validation': settings.getOption('changeValidationLevel', 'manager') == 'manager' ? 'N+1 requis' : 'RH'},
        primary: false
    },
    {
        title: 'Verrouillage',
        text: 'Verrouillage automatique des plannings passés pour figer les données de paie.',
        eyebrow: 'Sécurité',
        icon: 'ti ti-lock',
        tone: 'slate',
        route: path('planning_settings_configure', {section: 'locking'}),
        rows: {'Délai auto': (settings.lockDelayDays|default(7)) ~ ' jours', 'Période': settings.getOption('lockingFrequency', 'weekly') == 'monthly' ? 'Mensuelle' : 'Fin de semaine'},
        primary: false
    }
] %}

<div class="data-page planning-settings-page">
    <div class="planning-settings-header">
        <div>
            <nav class="data-breadcrumb" aria-label="Fil d'Ariane">
                <a href="{{ path('planning_index') }}">Plannings</a>
                <i class="ti ti-chevron-right" aria-hidden="true"></i>
                <span class="text-muted">Paramètres</span>
            </nav>
            <h1>Paramètres planning</h1>
            <p class="fw-normal">Configurez les règles métier, les flux de travail et les préférences d'affichage pour l'ensemble de votre organisation.</p>
        </div>
        <div class="planning-settings-header__actions">
            <a class="data-button data-button--secondary" href="{{ path('planning_settings_configure', {section: 'general'}) }}">
                <i class="ti ti-rotate-2" aria-hidden="true"></i>
                Réinitialiser
            </a>
            <a class="data-button data-button--primary" href="{{ path('planning_settings_configure', {section: 'general'}) }}">
                <i class="ti ti-device-floppy" aria-hidden="true"></i>
                Configurer
            </a>
        </div>
    </div>

    <div class="planning-settings-grid">
        {% for card in cards %}
            <article class="planning-settings-card">
                <div class="planning-settings-card__top">
                    <span class="planning-settings-icon planning-settings-icon--{{ card.tone }}"><i class="{{ card.icon }}" aria-hidden="true"></i></span>
                    <span class="planning-settings-card__eyebrow">{{ card.eyebrow }}</span>
                </div>
                <h2>{{ card.title }}</h2>
                <p>{{ card.text }}</p>
                <dl>
                    {% for label, value in card.rows %}
                        <div>
                            <dt>{{ label }}</dt>
                            <dd class="{{ value in ['Activé', '0 bloquante', '0 bloquantes'] ? 'is-success' : (label == 'Blocages' and value != '0 bloquante' ? 'is-danger' : '') }}">{{ value }}</dd>
                        </div>
                    {% endfor %}
                </dl>
                <a class="planning-settings-card__button {{ card.primary ? 'planning-settings-card__button--primary' : '' }}" href="{{ card.route }}">{{ card.primary ? 'Gérer' : 'Configurer' }}</a>
            </article>
        {% endfor %}
    </div>

    <section class="planning-settings-help">
        <div>
            <h2>Besoin d'aide pour configurer Staffelia ?</h2>
            <p>Consultez notre guide de mise en place des plannings pour découvrir les meilleures pratiques RH et optimiser votre gestion d'équipe.</p>
            <div>
                <a class="data-button data-button--secondary" href="{{ path('planning_dashboard') }}">Voir la documentation</a>
                <a class="data-button planning-settings-help__support" href="{{ path('planning_dashboard') }}">Contacter le support</a>
            </div>
        </div>
        <span aria-hidden="true">?</span>
    </section>
</div>
{% endblock %}