{% extends 'admin/layout.html.twig' %}
{% block title %}{{ prospection.id ? 'Modifier' : 'Nouvelle' }} prospection — WTL{% endblock %}
{% block admin_body %}
{% include 'admin/ui/_page_header.html.twig' with {page_eyebrow:'Prospection',page_title:prospection.id ? 'Modifier la prospection' : 'Nouvelle prospection',page_subtitle:'Les informations essentielles sont affichées en premier. Dépliez les options avancées uniquement si nécessaire.',page_actions:[{label:'Retour',href:prospection.id ? path('admin_prospection_show',{id:prospection.id}) : path('admin_prospection_index'),icon:'bi-arrow-left'}]} %}
<div class="card"><div class="card-body p-4 p-xl-5">
{% if wizard %}
<div class="wizard-nav d-flex justify-content-between mb-5 border-bottom pb-4">
    <div class="active" data-step-nav="0"><span class="step-dot">1</span><span class="d-none d-md-inline ms-2">Lieu</span></div>
    <div data-step-nav="1"><span class="step-dot">2</span><span class="d-none d-md-inline ms-2">Contact</span></div>
    <div data-step-nav="2"><span class="step-dot">3</span><span class="d-none d-md-inline ms-2">Suivi</span></div>
</div>
{% endif %}
{{ form_start(form, {'attr': {'id':'prospection-form','data-prevent-double-submit':'true'}}) }}
{% set advancedFields = ['followUp1CustomDate','followUp2CustomDate','postponeUntil','futureRecontactDate','travelFee','hatPlanned','mealPlanned','accommodationPlanned','hospitalityType','audioSent','pressKitSent'] %}
{% set sections = wizard
    ? [['venueEntity','priority'],['targetContact','initialChannel','firstContactDate'],['followUp1CustomDate','followUp2CustomDate','postponeUntil','futureRecontactDate','proposedFee','travelFee','hatPlanned','mealPlanned','accommodationPlanned','hospitalityType','audioSent','pressKitSent','notes']]
    : [['venueEntity','priority','targetContact','initialChannel','firstContactDate','followUp1CustomDate','followUp2CustomDate','postponeUntil','futureRecontactDate','proposedFee','travelFee','hatPlanned','mealPlanned','accommodationPlanned','hospitalityType','audioSent','pressKitSent','notes']] %}
{% for fields in sections %}
<section class="wizard-step {{ loop.first ? 'active' : '' }}" data-step="{{ loop.index0 }}">
{% if (wizard and loop.index0 == 2) or not wizard %}<button type="button" class="btn btn-sm btn-outline-secondary mb-3" id="prospectionAdvancedToggle" aria-expanded="false"><i class="bi bi-sliders me-1" aria-hidden="true"></i>Afficher les options avancées</button>{% endif %}
<div class="row g-3">
    {% for field in fields %}
        {% set full = field == 'notes' %}
        {% set checkbox = field in ['hatPlanned','mealPlanned','accommodationPlanned','audioSent','pressKitSent'] %}
        <div class="{{ full ? 'col-12' : (checkbox ? 'col-12 col-md-4 d-flex align-items-end pb-2' : 'col-12 col-md-6') }} {{ field in advancedFields ? 'prospection-advanced-field d-none' : '' }}">
            {% if field == 'proposedFee' %}
                <div id="proposed-fee-wrap" class="rounded p-2 budget-indicator-neutral">
                    {{ form_row(attribute(form,field)) }}
                    <div id="budget-comparison" class="small fw-semibold d-none"></div>
                </div>
            {% else %}
                {{ form_row(attribute(form,field)) }}
            {% endif %}
            {% if field == 'venueEntity' %}
                <div class="form-text">Lieu introuvable ? <a href="{{ path('admin_venue_new') }}" target="_blank" rel="noopener">Créer sa fiche complète dans un autre onglet</a>, puis rechargez cette page.</div>
                <div id="venue-summary" class="border rounded bg-light p-3 mt-3 small d-none">
                    <div class="fw-semibold mb-1" id="venue-summary-legal"></div>
                    <div id="venue-summary-address"></div>
                    <div class="text-secondary mt-1"><span id="venue-summary-siret"></span><span id="venue-summary-vat" class="ms-2"></span><span id="venue-summary-email" class="ms-2"></span></div>
                    <div id="venue-summary-budget" class="mt-2 fw-semibold"></div>
                </div>
            {% endif %}
        </div>
    {% endfor %}
</div></section>
{% endfor %}
{{ form_rest(form) }}
<div class="bottom-action-bar">
    <button type="button" class="btn btn-outline-secondary d-none" id="wizard-prev">Précédent</button>
    <div class="ms-auto d-flex gap-2"><button type="button" class="btn btn-dark {{ wizard ? '' : 'd-none' }}" id="wizard-next">Suivant</button><button class="btn btn-dark {{ wizard ? 'd-none' : '' }}" id="wizard-submit" data-loading-label="Enregistrement…">Enregistrer</button></div>
</div>
{{ form_end(form) }}
</div></div>
{% endblock %}
{% block javascripts %}{{ parent() }}
{% if wizard %}<script src="{{ asset('js/wizard.js') }}"></script>{% endif %}
<script>
(() => {
    const venue = document.getElementById('prospection_venueEntity');
    const contact = document.getElementById('prospection_targetContact');
    const fee = document.getElementById('prospection_proposedFee');
    const box = document.getElementById('venue-summary');
    if (!venue || !contact) return;

    const advancedToggle = document.getElementById('prospectionAdvancedToggle');
    advancedToggle?.addEventListener('click', () => {
        const expanded = advancedToggle.getAttribute('aria-expanded') !== 'true';
        advancedToggle.setAttribute('aria-expanded', expanded ? 'true' : 'false');
        advancedToggle.innerHTML = expanded ? '<i class="bi bi-chevron-up me-1" aria-hidden="true"></i>Masquer les options avancées' : '<i class="bi bi-sliders me-1" aria-hidden="true"></i>Afficher les options avancées';
        document.querySelectorAll('.prospection-advanced-field').forEach(field => field.classList.toggle('d-none', !expanded));
    });

    const selectedContact = contact.value;
    const updateBudget = () => {
        const option = venue.selectedOptions[0];
        const budget = Number(option?.dataset.budget || 0);
        const wrap = document.getElementById('proposed-fee-wrap');
        const message = document.getElementById('budget-comparison');
        if (!wrap || !message || !budget) {
            wrap?.classList.remove('budget-ok','budget-warning','budget-danger');
            message?.classList.add('d-none');
            return;
        }
        const value = Number(fee?.value || 0);
        wrap.classList.remove('budget-ok','budget-warning','budget-danger');
        if (!value) { message.classList.add('d-none'); return; }
        if (value <= budget) wrap.classList.add('budget-ok');
        else if (value <= budget + 100) wrap.classList.add('budget-warning');
        else wrap.classList.add('budget-danger');
        message.classList.remove('d-none');
        const diff = value - budget;
        message.textContent = value <= budget
            ? `Tarif inférieur ou égal au budget indicatif (${budget.toLocaleString('fr-FR')} €).`
            : `Tarif supérieur au budget indicatif de ${diff.toLocaleString('fr-FR')} € (budget ≈ ${budget.toLocaleString('fr-FR')} €).`;
    };

    const updateSummary = () => {
        const o = venue.selectedOptions[0];
        if (box && o?.value) {
            box.classList.remove('d-none');
            document.getElementById('venue-summary-legal').textContent = o.dataset.legal || o.textContent;
            document.getElementById('venue-summary-address').textContent = o.dataset.address || '';
            document.getElementById('venue-summary-siret').textContent = o.dataset.siret ? 'SIRET : ' + o.dataset.siret : '';
            document.getElementById('venue-summary-vat').textContent = o.dataset.vat ? 'TVA : ' + o.dataset.vat : '';
            document.getElementById('venue-summary-email').textContent = o.dataset.billingEmail ? 'Facturation : ' + o.dataset.billingEmail : '';
            document.getElementById('venue-summary-budget').textContent = o.dataset.budget ? 'Budget approximatif : ' + Number(o.dataset.budget).toLocaleString('fr-FR',{minimumFractionDigits:2}) + ' € HT' : '';
        } else box?.classList.add('d-none');
        updateBudget();
    };

    let contactsRequest = 0;
    const contactsUrlTemplate = `{{ path('admin_venue_contacts_json', {id: 999999999}) }}`;

    const loadContacts = async (keepValue = null) => {
        const venueId = venue.value;
        const requestId = ++contactsRequest;
        contact.innerHTML = '<option value="">' + (venueId ? 'Chargement…' : '— Sélectionnez d’abord un lieu —') + '</option>';
        if (!venueId) return;

        try {
            const url = contactsUrlTemplate.replace('999999999', encodeURIComponent(venueId));
            const response = await fetch(url, {headers:{'X-Requested-With':'XMLHttpRequest'}});
            if (!response.ok) throw new Error(`HTTP ${response.status}`);
            const rows = await response.json();
            if (requestId !== contactsRequest) return;

            contact.innerHTML = '<option value="">— Contact du lieu —</option>';
            let primaryId = null;
            rows.forEach(row => {
                const selected = keepValue !== null && String(row.id) === String(keepValue);
                const option = new Option(row.text, row.id, false, selected);
                if (row.primary) {
                    option.dataset.primary = '1';
                    if (primaryId === null) primaryId = row.id;
                }
                contact.add(option);
            });

            if (!keepValue && primaryId !== null) contact.value = String(primaryId);
        } catch (e) {
            if (requestId !== contactsRequest) return;
            contact.innerHTML = '<option value="">Impossible de charger les contacts</option>';
            console.error('Chargement des contacts du lieu impossible', e);
        }
    };

    const refreshVenue = () => { updateSummary(); loadContacts(); };
    venue.addEventListener('change', refreshVenue);
    if (window.jQuery) {
        window.jQuery(venue).on('select2:select select2:clear', refreshVenue);
    }

    document.getElementById('wizard-next')?.addEventListener('click', () => {
        const activeStep = document.querySelector('.wizard-step.active');
        if (activeStep?.dataset.step === '0' && venue.value) {
            loadContacts(contact.value || selectedContact || null);
        }
    });

    fee?.addEventListener('input', updateBudget);
    updateSummary();
    if (venue.value) loadContacts(selectedContact);
})();
</script>
{% endblock %}