{% extends 'admin/layout.html.twig' %}
{% block title %}Simulateur tarifaire — WTL{% endblock %}
{% block admin_body %}
<div class="mb-4">
<h1 class="h2 mb-1">Simulateur tarifaire</h1>
<p class="text-secondary mb-0">Les montants sont recalculés instantanément. Les frais variables restent saisis ici, sans polluer le paramétrage.</p>
</div>
<div class="row g-4">
<div class="col-xl-7">
  <div class="sim-section card table-card mb-3">
<div class="card-body p-4">
<h2 class="h5 mb-3">
<span class="sim-step">A</span> Formule et cible</h2>
<div class="row g-3">
<div class="col-md-7">
<label class="form-label">Formule</label>
<select class="form-select" id="tariff">
{% for t in tariffs %}
<option value="{{ t.code }}" data-floor="{{ t.floorPrice }}" data-target="{{ t.targetPrice }}" data-comfort="{{ t.comfortPrice }}">{{ t.code }} — {{ t.venueFormula }}
</option>
{% endfor %}
</select>
</div>
<div class="col-md-5">
<label class="form-label">Niveau tarifaire</label>
<select class="form-select" id="level">
<option value="floor">Plancher</option>
<option value="target" selected>Cible</option>
<option value="comfort">Confort</option>
</select>
</div>
</div>
</div>
</div>
  <div class="sim-section card table-card mb-3">
<div class="card-body p-4">
<h2 class="h5 mb-3">
<span class="sim-step">B</span> Trajet et stationnement</h2>
<div class="row g-3">
<div class="col-md-4">
<label class="form-label">Distance aller simple (km)</label>
<input class="form-control sim-input" type="number" min="0" step="1" id="distance" value="0">
</div>
<div class="col-md-4">
<label class="form-label">Péages estimés (€)</label>
<input class="form-control sim-input" type="number" min="0" step="0.01" id="tolls" value="0">
</div>
<div class="col-md-4">
<label class="form-label">Stationnement (€)</label>
<input class="form-control sim-input" type="number" min="0" step="0.01" id="parking" value="0">
</div>
</div>
</div>
</div>
  <div class="sim-section card table-card mb-3">
<div class="card-body p-4">
<h2 class="h5 mb-3">
<span class="sim-step">C</span> Repas et nuit artiste / accompagnateur</h2>
<div class="row g-3">
<div class="col-md-6">
<label class="form-label">Repas non fournis</label>
<input class="form-control sim-input" type="number" min="0" step="1" id="artistMeals" value="0">
</div>
<div class="col-md-6">
<label class="form-label">Nuits</label>
<input class="form-control sim-input" type="number" min="0" step="1" id="artistNights" value="0">
</div>
</div>
</div>
</div>
  <div class="sim-section card table-card mb-3">
<div class="card-body p-4">
<h2 class="h5 mb-3">
<span class="sim-step">D</span> Techniciens supplémentaires</h2>
<div class="row g-3">
<div class="col-md-4">
<label class="form-label">Nombre de techniciens</label>
<input class="form-control sim-input" type="number" min="0" step="1" id="techs" value="0">
</div>
<div class="col-md-4">
<label class="form-label">Repas techniciens</label>
<input class="form-control sim-input" type="number" min="0" step="1" id="techMeals" value="0" disabled>
</div>
<div class="col-md-4">
<label class="form-label">Nuits techniciens</label>
<input class="form-control sim-input" type="number" min="0" step="1" id="techNights" value="0" disabled>
</div>
</div>
<div class="form-text mt-2">Sans technicien supplémentaire, les repas et nuits techniciens sont automatiquement ignorés.</div>
</div>
</div>
  <div class="sim-section card table-card mb-3">
<div class="card-body p-4">
<h2 class="h5 mb-3">
<span class="sim-step">E</span> Options</h2>
<div class="row g-3">
<div class="col-md-6">
<label class="form-label">Vidéo (€)</label>
<input class="form-control sim-input" type="number" min="0" step="0.01" id="video" value="0">
</div>
<div class="col-md-6">
<label class="form-label">Lumière (€)</label>
<input class="form-control sim-input" type="number" min="0" step="0.01" id="light" value="0">
</div>
</div>
</div>
</div>
  <div class="sim-section card table-card mb-3">
<div class="card-body p-4">
<h2 class="h5 mb-3">
<span class="sim-step">F</span> Autres frais</h2>
<label class="form-label">Montant (€)</label>
<input class="form-control sim-input" type="number" min="0" step="0.01" id="other" value="0">
</div>
</div>
  <div class="sim-section card table-card">
<div class="card-body p-4">
<h2 class="h5 mb-3">
<span class="sim-step">G</span> Remise commerciale</h2>
<label class="form-label">Montant de la remise (€)</label>
<input class="form-control sim-input" type="number" min="0" step="0.01" id="discount" value="0">
</div>
</div>
</div>
<div class="col-xl-5">
<div class="card table-card position-sticky" style="top:1.5rem">
<div class="card-body p-4">
<h2 class="h5 mb-3">Récapitulatif</h2>
<div class="d-flex justify-content-between py-2 border-bottom">
<span>Tarif artistique</span>
<strong id="r-artistic">0 €</strong>
</div>
<div class="d-flex justify-content-between py-2 border-bottom">
<span>Déplacement kilométrique</span>
<strong id="r-travel">0 €</strong>
</div>
<div class="d-flex justify-content-between py-2 border-bottom">
<span>Péages & stationnement</span>
<strong id="r-road">0 €</strong>
</div>
<div class="d-flex justify-content-between py-2 border-bottom">
<span>Accueil & techniciens</span>
<strong id="r-hospitality">0 €</strong>
</div>
<div class="d-flex justify-content-between py-2 border-bottom">
<span>Options & autres frais</span>
<strong id="r-options">0 €</strong>
</div>
<div class="d-flex justify-content-between py-2">
<span>Remise</span>
<strong id="r-discount">0 €</strong>
</div>
<div class="mt-4 p-3 rounded bg-dark text-white">
<div class="small text-white-50">TOTAL HT</div>
<div class="sim-total" id="r-total">0 €</div>
</div>
<a href="#" id="report-link" class="btn btn-outline-dark w-100 mt-3">
<i class="bi bi-arrow-right-circle me-1">
</i>Reporter vers une nouvelle prospection</a>
</div>
</div>
</div>
</div>
<script id="fee-data" type="application/json">{{ feeMap|json_encode|raw }}
</script>
{% endblock %}
{% block javascripts %}{{ parent() }}
<script>
(()=>{const fees=JSON.parse(document.querySelector('#fee-data').textContent||'{}'),q=id=>document.querySelector('#'+id),num=id=>parseFloat(q(id)?.value||0),eur=v=>new Intl.NumberFormat('fr-FR',{style:'currency',currency:'EUR'}).format(v);
function calc(){const techs=Math.max(0,num('techs'));const hasTech=techs>0;q('techMeals').disabled=!hasTech;q('techNights').disabled=!hasTech;if(!hasTech){q('techMeals').value=0;q('techNights').value=0;}const o=q('tariff').selectedOptions[0],level=q('level').value,art=parseFloat(o?.dataset[level]||0);const travel=num('distance')*2*(fees.KM||0);const road=num('tolls')+num('parking');const hospitality=num('artistMeals')*(fees.REPAS||0)+num('artistNights')*(fees.HOTEL||0)+techs*(fees.TECH||0)+(hasTech?num('techMeals')*(fees.REPAS_TECH||0):0)+(hasTech?num('techNights')*(fees.HOTEL_TECH||0):0);const options=num('video')+num('light')+num('other');const discount=num('discount');const total=Math.max(0,art+travel+road+hospitality+options-discount);q('r-artistic').textContent=eur(art);q('r-travel').textContent=eur(travel);q('r-road').textContent=eur(road);q('r-hospitality').textContent=eur(hospitality);q('r-options').textContent=eur(options);q('r-discount').textContent='− '+eur(discount);q('r-total').textContent=eur(total);q('report-link').href='{{ path('admin_prospection_new') }}?proposedFee='+encodeURIComponent(total.toFixed(2))+'&travelFee='+encodeURIComponent((travel+road).toFixed(2));}
document.querySelectorAll('input,select').forEach(e=>{e.addEventListener('input',calc);e.addEventListener('change',calc)});calc()})();
</script>
{% endblock %}