templates/front/purchase/mission/choice-offer.html.twig line 1

Open in your IDE?
  1. {% extends 'front/layout.html.twig' %}
  3. {% block title %}Informations du compte parents | Les Bons Profs
  4. {% endblock %}
  6. {% block nav %}
  7. {% endblock %}
  8. {% block stylesheet %}
  9.     {{ encore_entry_link_tags('offre') }}
  10.     <script>
  11.         !function(f,b,e,v,n,t,s)
  12.         {if(f.fbq)return;n=f.fbq=function(){n.callMethod?
  13.             n.callMethod.apply(n,arguments):n.queue.push(arguments)};
  14.             if(!f._fbq)f._fbq=n;n.push=n;n.loaded=!0;n.version='2.0';
  15.             n.queue=[];t=b.createElement(e);t.async=!0;
  16.             t.src=v;s=b.getElementsByTagName(e)[0];
  17.             s.parentNode.insertBefore(t,s)}(window, document,'script',
  18.             'https://connect.facebook.net/en_US/fbevents.js');
  19.         fbq('init', '334520913601498');
  20.     </script>
  21.     <noscript><img height="1" width="1" style="display:none"
  22.                    src="https://www.facebook.com/tr?id=334520913601498&ev=PageView&noscript=1"
  23.         /></noscript>
  24. {% endblock %}
  25. {% block body %}
  26.     <div class="page-mission-bacbrevet">
  27.         <header class="hearder-main">
  28.             <div class="container mb-4">
  29.                 <div class="d-flex flex-row justify-content-md-between justify-content-center align-items-center w-100">
  30.                     <div class="d-flex justify-content-center mb-4">
  31.                         <img style="width: 250px" class="h-100" src="{{ asset('static/img/commun/logo.png') }}"/>
  32.                     </div>
  33.                     <div class="text-md-end text-center d-md-inline d-none text-white">
  34.                         Besoin d'aide ? Sabrina vous répond au 01 86 95 72 01 du lundi au jeudi de 9h à 17h
  35.                     </div>
  36.                 </div>
  37.             </div>
  39.             <div>
  40.                 <div class="text-center title-page">
  41.                     Mission {{ titleExam }} <span>2025</span>
  42.                 </div>
  43.                 <div class="text-center grab-page">
  44.                     vos annales corrigées en vidéo
  45.                 </div>
  47.             </div>
  48.         </header>
  49.         <div class="container">
  50.             <div class="step-indicator d-flex flex-row mb-4">
  51.                 <div class="d-flex justify-content-center align-items-center">
  52.                     <span>1</span>
  53.                 </div>
  54.                 <div class="d-flex justify-content-center align-items-center">
  55.                     <span>2</span>
  56.                 </div>
  57.                 <div class="d-flex justify-content-center align-items-center">
  58.                     <span>3</span>
  59.                 </div>
  60.             </div>
  61.             {% if typeOffer.id == 4 %}
  62.                 <div class="d-flex flex-row mb-5">
  63.                     <div>Pour accèder au <strong class="text-uppercase">Mission Bac de Français Technologique</strong> <a class="btn fw-bold text-white ms-4" style="background-color: #D34479;" href="{{ path('choice-mission') }}?mission=bac-francais-techno">c'est par ici ! </a> </div>
  64.                 </div>
  65.             {% endif %}
  66.             <div class="row pb-4">
  67.                 <div class="col-md-6 order-md-2 order-2 md-mb-0 mb-4">
  68.                     <h4 class="mb-4">Les Bons Profs ont déjà aidé plus de 2 millions d'élèves à réussir leur examen</h4>
  69.                     {% if typeOffer %}
  70.                         <div>
  71.                             {{ typeOffer.description|raw }}
  72.                         </div>
  73.                     {% endif %}
  74.                 </div>
  75.                 <form id="form-1" action="" method="post" class="col-md-6 order-md-1 order-1 md-mb-0 mb-5">
  76.                     <div class="col-md-8 mb-4">
  77.                         <select class="form-select mb-4" name="price">
  78.                             {% if missionsPrice|length > 1 %}
  79.                             <option data-price="0" value="">Choisissez votre Mission {{ titleExam }}</option>
  80.                             {% endif %}
  81.                             {% for mp in missionsPrice %}
  82.                                 <option {% if getPrice == mp.id or missionsPrice|length == 1 %}selected{% endif%} data-price="{{ mp.price }}" data-oldprice="{{ mp.oldPrice }}" data-nbr="{{ mp.nbrDis }}" value="{{ mp.id }}">{{ mp.title }}</option>
  83.                             {% endfor %}
  84.                         </select>
  85.                         {% if typeOffer and typeOffer.displayPack  %}
  86.                         <div>
  87.                             <h4 class="mb-3">Choisissez votre/vos matière(s) :</h4>
  88.                             <div>
  89.                                 {% for dis in packs %}
  90.                                     <div class="form-check mb-2">
  91.                                         <input class="form-check-input{% if dis.id not in listMissionCustomer %} checkbox-discipline{% endif %}" type="checkbox" value="{{ dis.id }}" name="dis[]" id="flexCheckDefault-{{ loop.index }}" {% if dis.id in listMissionCustomer %}disabled {% endif %}>
  92.                                         <label class="form-check-label" for="flexCheckDefault-{{ loop.index }}">
  93.                                             {{ dis.title }}
  94.                                         </label>
  95.                                     </div>
  96.                                 {% endfor %}
  97.                             </div>
  98.                         </div>
  99.                         {% endif %}
  100.                     </div>
  101.                     <div class="col-md-12">
  102.                         <div class="bg-light p-3 d-none" id="recap-basket">
  103.                             <div class="d-flex justify-content-between mb-4">
  104.                                 <div style="width: 80%">
  105.                                     <div class="fw-bolder" style="font-size: 16px">Mission {{ titleExam }} {% if typeOffer and typeOffer.displayPack  %}<span class="nbr-discipline"></span> matière(s){% endif %} </div>
  106.                                     {% if typeOffer and typeOffer.displayPack  %}
  107.                                     <div>Liste des produits sélectionnés :  <span id="list-disc"></span></div>
  108.                                     {% endif %}
  109.                                 </div>
  110.                                 <div class="text-end" style="width: 20%">
  111.                                     <span class="text-decoration-line-through oldPrice" style="font-size: 12px;"></span>
  112.                                     <span class="realPrice fw-bolder"></span>
  113.                                 </div>
  115.                             </div>
  116.                             {% if typeOffer %}
  117.                             <div>
  118.                                 {{ typeOffer.grab|raw }}
  119.                             </div>
  120.                             {% endif %}
  121.                         </div>
  122.                         <hr/>
  123.                         <div class="col-md-6">
  125.                             <div class="mb-3">Code promo</div>
  126.                             <div class="input-group">
  127.                                 <input type="text" class="form-control" placeholder="Ecrivez le ici" aria-label="Recipient's username" aria-describedby="button-addon2">
  128.                                 <button class="btn btn-outline-secondary btn-purple" type="button" id="button-code-promo">Valider</button>
  129.                             </div>
  130.                         </div>
  131.                         <div class="col-md-12">
  132.                             <hr/>
  133.                             <div class="d-flex flex-row justify-content-between">
  134.                                 <div class="d-flex flex-row align-items-center">
  135.                                     <h4 class="mb-0 me-1">Total panier : </h4>
  136.                                     <div class="code-promo-text">remise appliquée <span class="fw-bold"></span></div>
  137.                                 </div>
  139.                                 <div class="">
  140.                                     <span class="toto-basket fw-bold fs-3"></span>
  141.                                     <button class="ms-3 btn btn-purple" id="but-submit-form">Acheter</button>
  142.                                 </div>
  143.                             </div>
  144.                         </div>
  145.                     </div>
  146.                 </form>
  148.             </div>
  149.         </div>
  150.     </div>
  151.     {% if not popinChoiceMission %}
  152.     <div class="modalcustom" id="popinChoiceMission">
  153.         <h4 class="mb-4 text-center">Veuillez sélectionner<br/> votre mission</h4>
  154.         <a class="d-block" href="{{ path('choice-mission') }}?mission=bac">Mission Bac <span>2025</span></a>
  155.         <a class="d-block" href="{{ path('choice-mission') }}?mission=bac-francais">Mission Bac Français <span>2025</span></a>
  156.         <a class="d-block" href="{{ path('choice-mission') }}?mission=bac-francais-techno">Mission Bac Français Techno <span>2025</span></a>
  157.         <a class="d-block" href="{{ path('choice-mission') }}?mission=brevet">Mission Brevet <span>2025</span></a>
  158.     </div>
  159.     {% endif %}
  161. {% endblock %}
  162. {% block javascript %}
  163. {{ encore_entry_script_tags('offre') }}
  164.     <script type="text/javascript">
  165.         $(document).ready(function(){
  166.             {% if not popinChoiceMission %}
  167.                 $('#popinChoiceMission').modalcustom({
  168.                 closeExisting: false,
  169.                 showClose: false,
  170.                 clickClose:false
  171.                 })
  172.             {% endif %}
  174.             $('#but-submit-form').click(function(e){
  175.                 e.preventDefault();
  176.                 var nbr = $('select[name="price"] option:selected').data('nbr');
  177.                 if(nbr){
  179.                     if($('.checkbox-discipline:checked').length == nbr {% if getMission %} || {{ getMission!='bac'?'true':'false' }}{% endif %}){
  180.                         var som       = $('select[name="price"] option:selected').data('price');
  181.                         if($('#button-code-promo').is("[data-percent]")){
  182.                         var percent  = $('#button-code-promo').attr('data-percent');
  183.                          som = som - som*(parseFloat(percent)/100);
  184.                        }
  185.                         fbq('track', 'AddToCart', {
  186.                           content_name: $('[name="price"] option:selected').text(),
  187.                           content_category: '{{ typeOffer.title|upper }}',
  188.                           content_ids: [$('[name="price"]').val()],
  189.                           content_type: 'product',
  190.                           value: som,
  191.                           currency: 'EUR'
  192.                         });
  193.                         $(this).parents('form').submit();
  194.                     }else{
  195.                         $('#show-dialog').find('.infos-text').text("Veuillez selectionner "+nbr+" matière(s)")
  196.                         $('#show-dialog').modalcustom()
  197.                     }
  198.                 }else{
  199.                     $('#show-dialog').find('.infos-text').text("Veuillez selectionner une mission.")
  200.                     $('#show-dialog').modalcustom()
  201.                 }
  204.             })
  206.             $('.checkbox-discipline').change(function(){
  208.                 var nbr = $('select[name="price"] option:selected').data('nbr');
  209.                 if($('.checkbox-discipline:checked').length<=nbr){
  210.                     var join = [];
  212.                     $('.checkbox-discipline:checked').each(function(){
  213.                         join.push($(this).next().text().trim())
  214.                     })
  216.                     $('#list-disc').text(join.join(', '))
  218.                     if($('.checkbox-discipline:checked').length==nbr){
  219.                         $('.checkbox-discipline:not(:checked)').attr('disabled','disabled');
  220.                     }else{
  221.                         if($('.checkbox-discipline:checked').length<nbr){
  222.                             $('.checkbox-discipline:not(:checked)').removeAttr('disabled');
  223.                         }
  224.                     }
  226.                 }
  227.             })
  229.             $('select[name="price"]').change(function(){
  230.                 var selectPrice = $(this).val();
  231.                  $('.checkbox-discipline').removeAttr('disabled');
  232.                 if(selectPrice!=""){
  233.                     var price       = $('select[name="price"] option:selected').data('price');
  234.                     var oldPrice    = $('select[name="price"] option:selected').data('oldprice');
  235.                     var nbr         = $('select[name="price"] option:selected').data('nbr');
  236.                     var som         = price;
  237.                     var percent     = 0;
  239.                     if($('#button-code-promo').is("[data-percent]")){
  240.                         percent  = $('#button-code-promo').attr('data-percent');
  241.                         som = price - price*(parseFloat(percent)/100);
  242.                     }
  243.                     var pricetext = new Intl.NumberFormat('fr-FR', { style: 'currency', currency: 'EUR',}).format(som)
  244.                     $('.toto-basket').text(pricetext);
  245.                     $('#recap-basket').find('.nbr-discipline').text(nbr)
  246.                     $('#recap-basket').find('.realPrice').text(new Intl.NumberFormat('fr-FR', { style: 'currency',currency: 'EUR', }).format(price))
  247.                     if(oldPrice!="")
  248.                     $('#recap-basket').find('.oldPrice').text(new Intl.NumberFormat('fr-FR', { style: 'currency',currency: 'EUR', }).format(oldPrice))
  249.                     $('#recap-basket').removeClass('d-none')
  250.                 }else{
  251.                     $('.toto-basket').text("");
  252.                 }
  254.             })
  255.             {% if missionsPrice|length==1 %}
  256.             $('select[name="price"]').change();
  257.             {% endif %}
  259.             $('#button-code-promo').click(function(e){
  261.                 e.preventDefault()
  262.                 var priceId = $('select[name="price"]').val();
  263.                 if(priceId!=''){
  264.                     var self   = $(this);
  265.                     self.parents('.input-group').find('input').removeClass('is-invalid');
  266.                     var coupon = $(this).parents('.input-group').find('input').val();
  268.                     $.ajax({
  269.                     url:"{{ path('valid_coupon') }}",
  270.                     data:"coupon="+coupon,
  271.                     success:function(elem){
  272.                         self.parents('.input-group').find('input').val('');
  273.                         var verif = true;
  275.                         if(elem.success){
  277.                             if(elem.data.allowOffer.length>0 && !elem.data.allowOffer.includes(parseInt(priceId))){
  278.                                 verif = false;
  279.                             }
  280.                             if(verif){
  281.                                 if($('#form-1').find('input[name="discount"]').length==0){
  282.                                     $('#form-1').append('<input type="hidden" name="discount" value="'+elem.data.code+'"/>')
  283.                                 }else{
  284.                                     $('#form-1').find('input[name="discount"]').val(elem.data.code);
  285.                                 }
  286.                                 var percent = elem.data.percent;
  287.                                 self.attr('data-percent',percent);
  288.                                 var price = $('select[name="price"] option:selected').data('price');
  289.                                 $('.code-promo-text').find('span').text(elem.data.percent+" %")
  290.                                 $('.code-promo-text').show();
  291.                                 if(price){
  292.                                     price = price - price*(parseFloat(percent)/100);
  294.                                       var pricetext = new Intl.NumberFormat('fr-FR', {
  295.                                         style: 'currency',
  296.                                         currency: 'EUR',
  297.                                     }).format(price);
  299.                                     $('.toto-basket').text(pricetext);
  300.                                 }
  301.                             }
  304.                         }
  305.                         if(!elem.success || !verif){
  306.                             self.parents('.input-group').parent().find('.invalid-feedback').text('').text('Ce code promo est invalide !');
  307.                             if(!self.parents('.input-group').find('input').hasClass('is-invalid')){
  308.                                 self.parents('.input-group').find('input').addClass('is-invalid');
  309.                             }
  310.                         }
  311.                     }
  312.                 })
  313.                 }else{
  314.                     alert("Veuillez choisir une mission");
  315.                 }
  317.             })
  318.         })
  319.     </script>
  320. {{ parent() }}
  321. {% endblock %}
  322. {% block footer %}
  323. {% endblock %}