templates/FrontCommun/VoyagesOrganise/reservation.html.twig line 1

Open in your IDE?
  1. {% extends 'FrontCommun/base.html.twig' %}
  2. {% block title %}Réservation!{% endblock %}
  4. {% block stylesheets %}
  5.     {{ parent() }}
  11.     <link rel="stylesheet" href="{{ asset('assets-commun/css/readmore.css') }}">
  12.     {% if  configAffichage!= null and configAffichage.GENERALE.NUMEROTATION_TITLE_FORM is defined and configAffichage.GENERALE.NUMEROTATION_TITLE_FORM == 'oui' %}
  13.         <link rel="stylesheet" href="{{ asset('assets-commun/css/numerotation-form.css') }}">
  14.     {% endif %}
  17. {% endblock %}
  19. {% block body %}
  20.     {% include checkCustomTemplate('VoyagesOrganise/reservation-content.html.twig') %}
  21. {% endblock %}
  23. {% block jquery %}
  24.     <script type="text/javascript" src="{{ asset("assets-commun/js/loadingoverlay.min.js") }}"></script>
  26.     <script>
  29.         function strReplaceAll(string, Find, Replace) {
  30.             try {
  31.                 return string.replace(new RegExp(Find, "g"), Replace);
  32.             } catch (ex) {
  33.                 return string;
  34.             }
  35.         }
  36.         BookingCreation ={{ details|json_encode|raw }}
  37.         var vjsRecap = new Vue({
  38.             el: "#vjs-recap",
  39.             data: {
  40.                 total: 0..formatMoney(3, ',', ' '),
  41.                 totalPayer: 0..formatMoney(3, ',', ' '),
  42.                 margeB2B: 0..formatMoney(3, ',', ' '),
  43.                 sousTotal: 0..formatMoney(3, ',', ' '),
  44.                 TotalAchat: 0..formatMoney(3, ',', ' '),
  45.                 remise: 0..formatMoney(3, ',', ' '),
  46.                 remiseInternet: 0..formatMoney(3, ',', ' '),
  47.                 fraisDossier: 0..formatMoney(3, ',', ' '),
  48.                 commission: 0..formatMoney(3, ',', ' '),
  49.                 timbre: 0..formatMoney(3, ',', ' '),
  50.                 nuitees:'',
  51.                 chambres: [],
  52.                 coupon: {
  53.                     code: '',
  54.                     reduction: 0,
  55.                     amount: 0,
  56.                     montant: (0).formatMoney(3, ',', ' ')
  57.                 },
  58.             },
  59.             computed: {
  60.                 Total: function () {
  61.                     return (parseFloat(vjsRecap.total.replace(' ','').replace(',','.')) - parseFloat(this.coupon.amount)).formatMoney(3, ',', ' ');
  62.                 },
  63.             },
  64.             methods: {
  65.                 onInputCoupon() {
  66.                     /*vjsForm.request.HotelBooking.DiscountCoupon = this.coupon.code*/
  67.                 },
  68.                 verifCoupon() {
  69.                     this.coupon.reduction = ''
  70.                     this.coupon.amount = 0
  71.                     this.coupon.montant = (0).formatMoney(3, ',', ' ')
  73.                     $('#nuitees').val(BookingCreation["firstPeriode"]["nbrNuit"]);
  74.                     $('#dateDebut').val(BookingCreation["firstPeriode"]["depart"]);
  76.                     if (this.coupon.code == "")
  77.                         return;
  79.                     $("i#load-coupon").removeClass("hidden")
  81.                     $.get(Routing.generate('verif_couponreduction', {
  82.                         produit: 'VO',
  83.                         achat: vjsRecap.TotalAchat,
  84.                         vente: vjsRecap.sousTotal,
  85.                         nuitees: BookingCreation["firstPeriode"]["nbrNuit"],
  86.                         checkin: BookingCreation["firstPeriode"]["depart"],
  87.                         code: encodeURIComponent(this.coupon.code)
  88.                     }), function (data) {
  89.                         if (data.error !== undefined)
  90.                             viewAlert(data.error, "danger")
  91.                             //viewAlert(`Code coupon <b class="text-danger">${vjsRecap.coupon.code}</b> invalid`, "danger")
  92.                         else if (data.reduction !== undefined) {
  93.                              $('#couponReduction').val(data.code);
  94.                             vjsRecap.coupon.montant = parseFloat(data.reduction).formatMoney(3, ',', ' ')
  95.                             vjsRecap.coupon.amount = (data.reduction).formatMoney(3, ',', ' ')
  96.                             if (data.type == "sur-total" && data.valeurPour)
  97.                                 vjsRecap.coupon.reduction = '(-' + (data.valeurPour ? data.valeur + '%' : (parseFloat(data.valeur).formatMoney(3, ',', ' ') + ' {{ deviseSelected().symbole }}')) + ')'
  99.                         }
  100.                         $("i#load-coupon").addClass("hidden")
  101.                     });
  104.                 },
  105.             },
  106.             mounted() {
  107.                 this.verifCoupon()
  108.             }
  110.         })
  115.         function calcTotal() {
  116.             $('#vjs-recap').LoadingOverlay("show", {
  117.                 image: "",
  118.                 fontawesome: "fa fa-spinner fa-spin"
  119.             });
  120.             setTimeout(function () {
  121.                 var formData = new FormData(document.getElementById('form-reservation'))
  122.                 formData.append('preReservation', true);
  123.                 $.ajax({
  124.                     url: $('#form-reservation').attr("action"),
  125.                     type: $('#form-reservation').attr("method"),
  126.                     dataType: "JSON",
  127.                     data: formData,
  128.                     processData: false,
  129.                     contentType: false,
  130.                     complete: function () {
  131.                         $("#vjs-recap").LoadingOverlay("hide", true);
  132.                     },
  133.                     success: function (data, status) {
  134.                         console.log("vall",data.Resultat)
  135.                         vjsRecap.total = parseFloat(data.Resultat.total).formatMoney(3, ',', ' ')
  136.                         vjsRecap.totalPayer = parseFloat(data.Resultat.totalPayer).formatMoney(3, ',', ' ')
  137.                         vjsRecap.margeB2B = parseFloat(data.Resultat.margeB2B).formatMoney(3, ',', ' ')
  138.                         vjsRecap.sousTotal = parseFloat(data.Resultat.sousTotal-data.Resultat.remise).formatMoney(3, ',', ' ')
  139.                         //vjsRecap.remise = parseFloat(data.Resultat.remise).formatMoney(3, ',', ' ')
  140.                         vjsRecap.remiseInternet = parseFloat(data.Resultat.remiseInternet).formatMoney(3, ',', ' ')
  141.                         vjsRecap.fraisDossier = parseFloat(data.Resultat.fraisDossier).formatMoney(3, ',', ' ')
  142.                         vjsRecap.commission = parseFloat(data.Resultat.commission).formatMoney(3, ',', ' ')
  143.                         vjsRecap.timbre = parseFloat(data.Resultat.timbre).formatMoney(3, ',', ' ')
  144.                         vjsRecap.chambres = data.Resultat.chambres
  145.                     },
  146.                     error: function (xhr, desc, err) {
  149.                     }
  150.                 });
  151.             }, 500);
  152.         }
  154.         $(document).on('change', "#single,#double,#triple,#quadruple,select.age", function () {
  155.             calcTotal()
  156.         })
  158.         $("#frais,#excrsion,#supplements").on('click', function () {
  159.             calcTotal()
  160.         })
  163.       
  164. {% set omraRoomAdditionAllowed = configAffichage is defined and configAffichage is not null and configAffichage.VOYAGE is defined and configAffichage.VOYAGE.OMRA_ALLOW_ROOM_ADDITION is defined and configAffichage.VOYAGE.OMRA_ALLOW_ROOM_ADDITION == 'oui' %}
  166. {% if type == 6 and omraRoomAdditionAllowed %}
  167.       
  168.        $(document).ready(function () {
  169.             var str = '{{ app.request.get('rooms') }}';
  170.             /* '0,0,1,1-4!2!2!0;3!1!2!0' */
  172.             var config_omra = false;
  173.             {% if configAffichage is defined and configAffichage!= null and configAffichage.VOYAGE.ADD_FORM_ROOM_PAX_DETAILS_OMRA =='oui' and type==6 %}
  174.             config_omra  = true;
  175.             var data = JSON.parse('{{ app.request.get('reservation')|json_encode|raw }}');
  177.             var string_chambres = '';
  178.             var nbre_chambre_single = 0;
  179.             var nbre_chambre_double = 0;
  180.             var nbre_chambre_triple = 0;
  181.             var nbre_chambre_quadruple = 0;
  182.             var chambre_single = "";
  183.             var chambre_double = "";
  184.             var chambre_triple = "";
  185.             var chambre_quadruple = "";
  187.             $.each(data.chambre, function (index, value) {
  188.                 var adultes = parseInt(value.adultes);
  189.                 var enfants = parseInt(value.enfants);
  190.                 var bebes = parseInt(value.bebes);
  191.                 var nbre_occupations = adultes + enfants + bebes;
  192.                 var string_occupations = value.type + '!' + adultes + '!' + enfants + '!' + bebes;
  193.                 switch (value.type) {
  194.                     case "1":
  195.                         nbre_chambre_single += 1;
  196.                         chambre_single = chambre_single == "" ? string_occupations : chambre_single + ';' + string_occupations;
  197.                         break;
  198.                     case "2":
  199.                         nbre_chambre_double += 1;
  200.                         chambre_double = chambre_double == "" ? string_occupations : chambre_double + ';' + string_occupations;
  201.                         break;
  202.                     case "3":
  203.                         nbre_chambre_triple += 1;
  204.                         chambre_triple = chambre_triple == "" ? string_occupations : chambre_triple + ';' + string_occupations;
  205.                         break;
  206.                     case "4":
  207.                         nbre_chambre_quadruple += 1;
  208.                         chambre_quadruple = chambre_quadruple == "" ? string_occupations : chambre_quadruple + ';' + string_occupations;
  209.                         break;
  210.                 }
  211.                 string_chambres = nbre_chambre_single + ',' + nbre_chambre_double + ',' + nbre_chambre_triple + ',' + nbre_chambre_quadruple;
  212.             });
  214.             string_chambres = string_chambres + '-' + chambre_single + (chambre_single == "" ? '' : ';')  + chambre_double + (chambre_double == "" ? '' : ';') + chambre_triple + (chambre_triple == "" ? '' : ';')+ chambre_quadruple;
  215.             str = string_chambres;
  216.             {% endif %}
  218.             if (str.length > 0) {
  220.                 var arr = str.split('-');
  221.                 var nbr_chambres = arr[0].split(',');
  222.                 var occupants_type = arr[1].split(';');
  224.                 var nbr_ch_single = nbr_chambres[0];
  225.                 var nbr_ch_double = nbr_chambres[1];
  226.                 var nbr_ch_triple = nbr_chambres[2];
  227.                 var nbr_ch_quadruple = nbr_chambres[3];
  229.                 var rooms = [];
  230.                 rooms['single'] = [];
  231.                 rooms['double'] = [];
  232.                 rooms['triple'] = [];
  233.                 rooms['quadruple'] = [];
  235.                 $.each(occupants_type, function (index, value) {
  236.                     switch (value[0].split('!').toString()) {
  237.                         case "1":
  238.                             rooms['single'].push(value);
  239.                             break;
  240.                         case "2":
  241.                             rooms['double'].push(value);
  242.                             break;
  243.                         case "3":
  244.                             rooms['triple'].push(value);
  245.                             break;
  246.                         case "4":
  247.                             rooms['quadruple'].push(value);
  248.                             break;
  249.                     }
  250.                 });
  252.             } else {
  253.                 var nbr_chambres = 1;
  254.                 var occupants_type = ['2!1!1!0'];
  256.                 var nbr_ch_single = 0;
  257.                 var nbr_ch_double = 0;
  258.                 var nbr_ch_triple = 0;
  259.                 var nbr_ch_quadruple = 0;
  261.                 var rooms = [];
  262.                 rooms['single'] = [];
  263.                 rooms['double'] = [];
  264.                 rooms['triple'] = [];
  265.                 rooms['quadruple'] = [];
  267.                 $.each(occupants_type, function (index, value) {
  268.                     switch (value[0].split('!').toString()) {
  269.                         case "1":
  270.                             rooms['single'].push(value);
  271.                             break;
  272.                         case "2":
  273.                             rooms['double'].push(value);
  274.                             break;
  275.                         case "3":
  276.                             rooms['triple'].push(value);
  277.                             break;
  278.                         case "4":
  279.                             rooms['quadruple'].push(value);
  280.                             break;
  281.                     }
  282.                 });
  283.             }
  285.             var occupants_data =
  286.                 '<div class="ligne">' +
  287.                 '<div class="">' +
  288.                 '<div class="col-md-8">' +
  289.                 '<div class="form-group" style="margin-bottom:0;">' +
  290.                 '<label>Nom & Prénom </label>' +
  291.                 '<input type="text" name="data[' + '_TYPE_' + '_nom_' + '_IDX_CH_' + '_IDX_OCC_' + ']" required class="form-control" />' +
  292.                 '</div>' +
  293.                 '</div>' +
  295.                 '<div class="col-md-3">' +
  296.                 '<div class="form-group" style="margin-bottom:0;">' +
  297.                 '<label>Age</label>' +
  298.                 '<select id="mySelect" name="data[' + '_TYPE_' + '_age_' + '_IDX_CH_' + '_IDX_OCC_' + ']" required class="form-control age">' +
  299.                     {% for i in 0..12 %}
  300.                 '<option value="{{ i }}">{{ i }}</option>' +
  301.                     {% endfor %}
  302.                 '<option value="adulte" selected>+12</option>' +
  303.                 '</select>' +
  304.                 '</div>' +
  305.                 '</div>' +
  307.                 '<div class="col-md-1" style="padding: 0;">' +
  308.                 '<a style="box-shadow: none;padding-left: 0;margin-top:20px" href="javascript:void(0)" class="btn btn-block btn-vo">' +
  309.                 '<i class="delete-ligne fa icon-trash" style="font-size: 20px;"></i>' +
  310.                 '</a>' +
  311.                 '</div>' +
  312.                 '</div>' +
  314.                 '<div class="col-md-1">' +
  315.                 '<div class="form-group" style="margin-bottom:0;">' +
  316.                 '<input type="hidden" name="data[' + '_TYPE_' + '_passport_' + '_IDX_CH_' + '_IDX_OCC_' + ']" class="form-control" />' +
  317.                 '</div>' +
  318.                 '</div>' +
  320.                 '<div class="col-md-offset-2 col-md-10">' +
  321.                 '<div class="checkbox">' +
  323.                 '</div>' +
  324.                 '</div>' +
  326.                 '</div>';
  328.             $("#single,#double,#triple,#quadruple").on('change', function () {
  329.                 var occupants = '';
  330.                 var nbrChambre = $(this).val();
  331.                 var name = $(this).data('name');
  332.                 var block = $('.row_billetterie.occupants.' + name);
  333.                 var exist = block.children().length;
  334.                 var ligne = '';
  335.                 var occ = 0;
  336.                 var j = 0;
  337.                 var max_occupant = 0;
  338.                 var maxByType = {
  339.                     single: 1,
  340.                     double: 2,
  341.                     triple: 3,
  342.                     quadruple: 4
  343.                 };
  345.                 if (exist < nbrChambre) {
  346.                     for (i = 1; i <= nbrChambre; i++) {
  347.                         var nombre_occupants = 1;
  348.                         var definition_chambre = [];
  349.                         if (rooms[name].length > 0) {
  350.                             var roomIndex = Math.min(rooms[name].length - 1, i - 1);
  351.                             var _rooms = rooms[name][roomIndex];
  352.                             if (_rooms) {
  353.                                 console.log("rooms", _rooms);
  354.                                 definition_chambre = _rooms.split('!');
  355.                                 nombre_occupants = parseInt(definition_chambre[1], 10) + parseInt(definition_chambre[2], 10) + parseInt(definition_chambre[3], 10);
  356.                             }
  357.                         }
  359.                         max_occupant = maxByType[name] || 1;
  360.                         if (config_omra && definition_chambre.length > 0) {
  361.                             occ = Math.min(nombre_occupants, max_occupant);
  362.                         } else {
  363.                             occ = 1;
  364.                         }
  366.                         if (i > exist) {
  367.                             occupants = '<div class="occ" data-name="' + name + '" data-index="' + block.find('.occ').length + '">';
  368.                             {% if type == 8 %}
  369.                             occupants += '<div class="col-md-12" style="margin-bottom: 5px;font-weight: 700;">' + (i == 1 ? i + '<sup>ère</sup>' : i + '<sup>ème</sup>') + ' occupant ' +'</div>';
  370.                             {% else %}
  371.                             occupants += '<div class="col-md-12" style="margin-bottom: 5px;font-weight: 700;">' + (i == 1 ? i + '<sup>ère</sup>' : i + '<sup>ème</sup>') + ' Chambre ' + name + '</div>';
  372.                             {% endif %}
  373.                             for (j = 1; j <= occ; j++) {
  374.                                 ligne = strReplaceAll(occupants_data, "_IDX_OCC_", "_" + j);
  375.                                 ligne = strReplaceAll(ligne, "_IDX_CH_", i);
  376.                                 ligne = strReplaceAll(ligne, "_TYPE_", name);
  377.                                 occupants += ligne;
  378.                             }
  379.                             occupants += '</div>';
  380.                             block.append(occupants);
  382.                             if (config_omra && definition_chambre.length > 1) {
  383.                                 console.log("definition_chambre", definition_chambre);
  384.                                 var nbAdultes = parseInt(definition_chambre[1], 10);
  385.                                 if (nbAdultes <= nombre_occupants && nbAdultes > 0) {
  386.                                     block.find('.occ[data-index="' + parseInt(i - 1, 10) + '"][data-name="' + name + '"]').children('.ligne').each(function () {
  387.                                         if ($(this).index() <= nbAdultes) {
  388.                                             $(this).find('.age').val("adulte");
  389.                                         }
  390.                                     });
  391.                                 }
  392.                             }
  394.                             var btn_add = '<div style="font-size: 12px;" class="addPersWrap col-md-10"><div class="pull-right"><a class="addPers" href="javascript:void(0)" data-name="' + name + '"><i class="fa fa-user-plus"></i> ajouter ligne</a></div></div>';
  396.                             if (block.find('.occ[data-index="' + parseInt(i - 1, 10) + '"] .addPersWrap').length == 0 && block.find('.occ[data-index="' + parseInt(i - 1, 10) + '"] .ligne').length < max_occupant) {
  397.                                 block.find('.occ[data-index="' + parseInt(i - 1, 10) + '"]').append(btn_add);
  398.                             }
  399.                         }
  400.                     }
  401.                 } else {
  402.                     var toRemove = (exist - nbrChambre);
  403.                     var nmbr = block.children().length;
  404.                     for (var i = nmbr; i >= (nmbr - toRemove); i--)
  405.                         block.children().eq(i).remove();
  406.                 }
  407.                 if (block.children().length > 0) {
  408.                     block.css({'display': 'block'})
  409.                 } else {
  410.                     block.css({'display': 'none'})
  411.                 }
  413.                 $(".row.row_billetterie.occupants .row").each(function () {
  414.                     $(this).find('div:eq(3)').css('display', 'none');
  415.                 });
  418.             });
  419.       
  420.       {% else %}
  421.       $(document).ready(function () {
  422.             var str = '{{ app.request.get('rooms') }}';
  423.             /* '0,0,1,1-4!2!2!0;3!1!2!0' */
  425.             var config_omra = false;
  426.             {% if configAffichage is defined and configAffichage!= null and configAffichage.VOYAGE.ADD_FORM_ROOM_PAX_DETAILS_OMRA =='oui' and type==6 %}
  427.             config_omra  = true;
  428.             var data = JSON.parse('{{ app.request.get('reservation')|json_encode|raw }}');
  430.             var string_chambres = '';
  431.             var nbre_chambre_single = 0;
  432.             var nbre_chambre_double = 0;
  433.             var nbre_chambre_triple = 0;
  434.             var nbre_chambre_quadruple = 0;
  435.             var chambre_single = "";
  436.             var chambre_double = "";
  437.             var chambre_triple = "";
  438.             var chambre_quadruple = "";
  440.             $.each(data.chambre, function (index, value) {
  441.                 var adultes = parseInt(value.adultes);
  442.                 var enfants = parseInt(value.enfants);
  443.                 var bebes = parseInt(value.bebes);
  444.                 var nbre_occupations = adultes + enfants + bebes;
  445.                 var string_occupations = value.type + '!' + adultes + '!' + enfants + '!' + bebes;
  446.                 switch (value.type) {
  447.                     case "1":
  448.                         nbre_chambre_single += 1;
  449.                         chambre_single = chambre_single == "" ? string_occupations : chambre_single + ';' + string_occupations;
  450.                         break;
  451.                     case "2":
  452.                         nbre_chambre_double += 1;
  453.                         chambre_double = chambre_double == "" ? string_occupations : chambre_double + ';' + string_occupations;
  454.                         break;
  455.                     case "3":
  456.                         nbre_chambre_triple += 1;
  457.                         chambre_triple = chambre_triple == "" ? string_occupations : chambre_triple + ';' + string_occupations;
  458.                         break;
  459.                     case "4":
  460.                         nbre_chambre_quadruple += 1;
  461.                         chambre_quadruple = chambre_quadruple == "" ? string_occupations : chambre_quadruple + ';' + string_occupations;
  462.                         break;
  463.                 }
  464.                 string_chambres = nbre_chambre_single + ',' + nbre_chambre_double + ',' + nbre_chambre_triple + ',' + nbre_chambre_quadruple;
  465.             });
  467.             string_chambres = string_chambres + '-' + chambre_single + (chambre_single == "" ? '' : ';')  + chambre_double + (chambre_double == "" ? '' : ';') + chambre_triple + (chambre_triple == "" ? '' : ';')+ chambre_quadruple;
  468.             str = string_chambres;
  469.             {% endif %}
  471.             if (str.length > 0) {
  473.                 var arr = str.split('-');
  474.                 var nbr_chambres = arr[0].split(',');
  475.                 var occupants_type = arr[1].split(';');
  477.                 var nbr_ch_single = nbr_chambres[0];
  478.                 var nbr_ch_double = nbr_chambres[1];
  479.                 var nbr_ch_triple = nbr_chambres[2];
  480.                 var nbr_ch_quadruple = nbr_chambres[3];
  482.                 var rooms = [];
  483.                 rooms['single'] = [];
  484.                 rooms['double'] = [];
  485.                 rooms['triple'] = [];
  486.                 rooms['quadruple'] = [];
  488.                 $.each(occupants_type, function (index, value) {
  489.                     switch (value[0].split('!').toString()) {
  490.                         case "1":
  491.                             rooms['single'].push(value);
  492.                             break;
  493.                         case "2":
  494.                             rooms['double'].push(value);
  495.                             break;
  496.                         case "3":
  497.                             rooms['triple'].push(value);
  498.                             break;
  499.                         case "4":
  500.                             rooms['quadruple'].push(value);
  501.                             break;
  502.                     }
  503.                 });
  505.             } else {
  506.                 var nbr_chambres = 1;
  507.                 var occupants_type = ['2!1!1!0'];
  509.                 var nbr_ch_single = 0;
  510.                 var nbr_ch_double = 0;
  511.                 var nbr_ch_triple = 0;
  512.                 var nbr_ch_quadruple = 0;
  514.                 var rooms = [];
  515.                 rooms['single'] = [];
  516.                 rooms['double'] = [];
  517.                 rooms['triple'] = [];
  518.                 rooms['quadruple'] = [];
  520.                 $.each(occupants_type, function (index, value) {
  521.                     switch (value[0].split('!').toString()) {
  522.                         case "1":
  523.                             rooms['single'].push(value);
  524.                             break;
  525.                         case "2":
  526.                             rooms['double'].push(value);
  527.                             break;
  528.                         case "3":
  529.                             rooms['triple'].push(value);
  530.                             break;
  531.                         case "4":
  532.                             rooms['quadruple'].push(value);
  533.                             break;
  534.                     }
  535.                 });
  536.             }
  538.             var occupants_data =
  539.                 '<div class="ligne">' +
  540.                 '<div class="">' +
  541.                 '<div class="col-md-8">' +
  542.                 '<div class="form-group" style="margin-bottom:0;">' +
  543.                 '<label>Nom & Prénom </label>' +
  544.                 '<input type="text" name="data[' + '_TYPE_' + '_nom_' + '_IDX_CH_' + '_IDX_OCC_' + ']" required class="form-control" />' +
  545.                 '</div>' +
  546.                 '</div>' +
  548.                 '<div class="col-md-3">' +
  549.                 '<div class="form-group" style="margin-bottom:0;">' +
  550.                 '<label>Age</label>' +
  551.                 '<select id="mySelect" name="data[' + '_TYPE_' + '_age_' + '_IDX_CH_' + '_IDX_OCC_' + ']" required class="form-control age">' +
  552.                     {% for i in 0..12 %}
  553.                 '<option value="{{ i }}">{{ i }}</option>' +
  554.                     {% endfor %}
  555.                 '<option value="adulte" selected>+12</option>' +
  556.                 '</select>' +
  557.                 '</div>' +
  558.                 '</div>' +
  560.                 '<div class="col-md-1" style="padding: 0;">' +
  561.                 '<a style="box-shadow: none;padding-left: 0;margin-top:20px" href="javascript:void(0)" class="btn btn-block btn-vo">' +
  562.                 '<i class="delete-ligne fa icon-trash" style="font-size: 20px;"></i>' +
  563.                 '</a>' +
  564.                 '</div>' +
  565.                 '</div>' +
  567.                 '<div class="col-md-1">' +
  568.                 '<div class="form-group" style="margin-bottom:0;">' +
  569.                 '<input type="hidden" name="data[' + '_TYPE_' + '_passport_' + '_IDX_CH_' + '_IDX_OCC_' + ']" class="form-control" />' +
  570.                 '</div>' +
  571.                 '</div>' +
  573.                 '<div class="col-md-offset-2 col-md-10">' +
  574.                 '<div class="checkbox">' +
  576.                 '</div>' +
  577.                 '</div>' +
  579.                 '</div>';
  581.             $("#single,#double,#triple,#quadruple").on('change', function () {
  582.                 var occupants = '';
  583.                 var nbrChambre = $(this).val();
  584.                 var name = $(this).data('name');
  585.                 var block = $('.row_billetterie.occupants.' + name);
  586.                 var exist = block.children().length;
  587.                 var ligne = '';
  588.                 var occ = 0;
  589.                 var j = 0;
  590.                 var max_occupant = 0;
  592.                 if (exist < nbrChambre) {
  593.                     for (i = 1; i <= nbrChambre; i++) {
  594.                         var nombre_occupants = 1;
  595.                         var definition_chambre = [];
  596.                         if (rooms[name].length > 0) {
  597.                             console.log("rooms",rooms[name][i - 1]);
  598.                             var _rooms = rooms[name][i - 1];
  599.                             if (config_omra)
  600.                                 definition_chambre = _rooms.split('!');
  601.                             else
  602.                                 definition_chambre = rooms[name][0].split('!');
  603.                             nombre_occupants = parseInt(definition_chambre[1], 10) + parseInt(definition_chambre[2], 10) + parseInt(definition_chambre[3], 10);
  604.                         }
  607.                         if (i > exist) {
  608.                             occ = nombre_occupants;
  609.                             if (name == 'single') {
  610.                                 occ = 1;
  611.                                 max_occupant = 1;
  612.                                 ligne
  613.                             }
  614.                             if (name == 'double') {
  615.                                if (!config_omra)
  616.                                    occ = 2;
  617.                                 max_occupant = 2;
  618.                             }
  619.                             if (name == 'triple') {
  620.                                 if (!config_omra)
  621.                                     occ = 3;
  622.                                 max_occupant = 3;
  623.                             }
  624.                             if (name == 'quadruple') {
  625.                                 if (!config_omra)
  626.                                     occ = 4;
  627.                                 max_occupant = 4;
  628.                             }
  629.                             occupants = '<div class="occ" data-name="' + name + '" data-index="' + block.find('.occ').length + '">';
  630.                             {% if type == 8 %}
  631.                             occupants += '<div class="col-md-12" style="margin-bottom: 5px;font-weight: 700;">' + (i == 1 ? i + '<sup>ère</sup>' : i + '<sup>ème</sup>') + ' occupant ' +'</div>';
  633.                             {% else %}
  634.                             occupants += '<div class="col-md-12" style="margin-bottom: 5px;font-weight: 700;">' + (i == 1 ? i + '<sup>ère</sup>' : i + '<sup>ème</sup>') + ' Chambre ' + name + '</div>';
  635.                             {% endif %}
  636.                             for (j = 1; j <= occ; j++) {
  637.                                 ligne = strReplaceAll(occupants_data, "_IDX_OCC_", "_" + j);
  638.                                 ligne = strReplaceAll(ligne, "_IDX_CH_", i);
  639.                                 ligne = strReplaceAll(ligne, "_TYPE_", name);
  640.                                 occupants += ligne;
  641.                             }
  642.                             occupants += '</div>';
  643.                             block.append(occupants);
  645. //                            for(x=0 ; x < block.children().length ; x++){
  646.                             console.log("definition_chambre",definition_chambre);
  647.                             if (definition_chambre.length > 1) {
  648.                                 if (definition_chambre[1] <= nombre_occupants && definition_chambre[1] > 0) {
  650.                                     block.find('.occ[data-index="' + parseInt(i - 1, 10) + '"][data-name="' + name + '"]').children('.ligne').each(function () {
  651.                                         if ($(this).index() <= definition_chambre[1]) {
  652.                                             $(this).find('.age').val("adulte");
  653.                                         }
  655.                                     });
  656.                                 }
  657.                                 // if ((definition_chambre[2] <= (nombre_occupants - definition_chambre[1])) && (nombre_occupants - definition_chambre[1]) > 0 && definition_chambre[2] > 0) {
  658.                                 //     block.find('.occ[data-index="' + parseInt(i - 1, 10) + '"][data-name="' + name + '"]').children('.ligne').each(function () {
  659.                                 //         if ($(this).index() <= (nombre_occupants - definition_chambre[3]) && $(this).index() > definition_chambre[1]) {
  660.                                 //             $(this).find('.age').val(6);
  661.                                 //         }
  662.                                 //
  663.                                 //     });
  664.                                 // }
  665.                                 // if (definition_chambre[3] <= (nombre_occupants - definition_chambre[2] - definition_chambre[1]) && ((nombre_occupants - definition_chambre[2] - definition_chambre[1]) > 0) && definition_chambre[3] > 0) {
  666.                                 //     block.find('.occ[data-index="' + parseInt(i - 1, 10) + '"][data-name="' + name + '"]').children('.ligne').each(function () {
  667.                                 //         if ($(this).index() <= (nombre_occupants) && $(this).index() > (definition_chambre[1] - (-definition_chambre[2]))) {
  668.                                 //             $(this).find('.age').val(2);
  669.                                 //         }
  670.                                 //
  671.                                 //     });
  672.                                 // }
  673.                             }
  674. //  }
  676.                             btn_add = '<div style="font-size: 12px;" class="addPersWrap col-md-10"><div class="pull-right"><a class="addPers" href="javascript:void(0)" data-name="' + name + '"><i class="fa fa-user-plus"></i> ajouter ligne</a></div></div>';
  678.                             if (block.find('.occ[data-index="' + parseInt(i - 1, 10) + '"] .addPersWrap').length == 0 && block.find('.occ[data-index="' + parseInt(i - 1, 10) + '"] .ligne').length < max_occupant) {
  679.                                 block.find('.occ[data-index="' + parseInt(i - 1, 10) + '"]').append(btn_add);
  680.                             }
  682.                         }
  684.                     }
  685.                 } else {
  686.                     var toRemove = (exist - nbrChambre);
  687.                     var nmbr = block.children().length;
  688.                     for (var i = nmbr; i >= (nmbr - toRemove); i--)
  689.                         block.children().eq(i).remove();
  690.                 }
  691.                 if (block.children().length > 0) {
  692.                     block.css({'display': 'block'})
  693.                 } else {
  694.                     block.css({'display': 'none'})
  695.                 }
  697.                 $(".row.row_billetterie.occupants .row").each(function () {
  698.                     $(this).find('div:eq(3)').css('display', 'none');
  699.                 });
  702.             });
  704. {% endif %}
  706.             $(document).on('click', '.delete-ligne', function () {
  707.                 calcTotal()
  708.                 if ($(this).parents('.ligne').siblings('.ligne').length > 0) {
  709.                     name = $(this).parents('.occ').data('name');
  710.                     occIndex = $(this).parents('.occ').index() + 1;
  711.                     inputSlector = $('.' + name + ' .occ');
  712.                     btn_add = '<div style="font-size: 12px;" class="addPersWrap col-md-10"><div class="pull-right"><a class="addPers" href="javascript:void(0)" data-name="' + name + '"><i class="fa fa-user-plus"></i> ajouter ligne</a></div></div>';
  713.                     toDelete = $(this).parents('.ligne:not(.adulte)');
  714.                     if ($(this).parents('.occ').find('.addPers').length == 0) {
  715.                         toDelete.parents('.' + name + ' .occ').append(btn_add);
  716.                     }
  717.                     toDelete.remove();
  719.                     inputSlector.find('.ligne').find("select[name^='" + name + '_age_' + occIndex + "']").each(function (idx) {
  720.                         $(this).attr('name', name + '_age_' + occIndex + '_' + parseInt(idx + 1, 10));
  721.                     });
  722.                     inputSlector.find('.ligne').find("input[name^='" + name + '_nom_' + occIndex + "']").each(function (idx) {
  723.                         $(this).attr('name', name + '_nom_' + occIndex + '_' + parseInt(idx + 1, 10));
  724.                     });
  725.                     inputSlector.find('.ligne').find("input[name^='" + name + '_passport_' + occIndex + "']").each(function (idx) {
  726.                         $(this).attr('name', name + '_passport_' + occIndex + '_' + parseInt(idx + 1, 10));
  727.                     });
  728.                     inputSlector.find('.ligne').find("input[name^='" + name + '_typevisas_' + occIndex + "']").each(function (idx) {
  729.                         $(this).attr('name', name + '_typevisas_' + occIndex + '_' + parseInt(idx + 1, 10));
  730.                     });
  731.                 }
  732.             });
  733.             $(document).on('click', '.addPers', function () {
  734.                 calcTotal()
  735.                 occlen = $(this).parents('.occ').children('.ligne').length;
  736.                 name = $(this).parents('.occ').data('name');
  737.                 if (name == 'quadruple' && occlen < 4 || name == 'triple' && occlen < 3 || name == 'double' && occlen < 2 || name == 'single' && occlen < 1) {
  738.                     occIndex = $(this).parents('.occ').index() + 1;
  739.                     ligne = strReplaceAll(occupants_data, "_IDX_OCC_", "_" + parseInt($(this).parents('.occ').find('.ligne').length + 1, 10));
  740.                     ligne = strReplaceAll(ligne, "_IDX_CH_", occIndex);
  741.                     ligne = strReplaceAll(ligne, "_TYPE_", $(this).data('name'));
  742.                     $(ligne).insertAfter($(this).parents('.addPersWrap').siblings('.ligne').last());
  743.                     $(".row.row_billetterie.occupants .row").each(function () {
  744.                         $(this).find('div:eq(3)').css('display', 'none');
  745.                     });
  746.                     occlen = $(this).parents('.occ').children('.ligne').length;
  747.                     if (name == 'quadruple' && occlen == 4 || name == 'triple' && occlen == 3 || name == 'double' && occlen == 2 || name == 'single' && occlen == 1) {
  748.                         $(this).parents('.addPersWrap').remove();
  749.                     }
  750.                 }
  753.             });
  756.             if (nbr_ch_single > 0) {
  757.                 $('#single').val(nbr_ch_single);
  758.                 $('#single').trigger('change');
  759.             }
  760.             if (nbr_ch_double > 0) {
  761.                 $('#double').val(nbr_ch_double);
  762.                 $('#double').trigger('change');
  763.             }
  764.             if (nbr_ch_triple > 0) {
  765.                 $('#triple').val(nbr_ch_triple);
  766.                 $('#triple').trigger('change');
  767.             }
  768.             if (nbr_ch_quadruple > 0) {
  769.                 $('#quadruple').val(nbr_ch_quadruple);
  770.                 $('#quadruple').trigger('change');
  771.             }
  773.             config_omra = false;
  774.         })
  776.         function popup() {
  777.             {% if details.type==3 or details.type==4 %}
  778.             window.open("{{ path('condition_vente',{produit:'circuit'}) }}", "_blank", "toolbar=yes, scrollbars=yes, resizable=yes, top=500, left=500, width=600, height=600");
  779.             {% elseif details.type==6 or details.type==7 %}
  780.             window.open("{{ path('condition_vente',{produit:'omra'}) }}", "_blank", "toolbar=yes, scrollbars=yes, resizable=yes, top=500, left=500, width=600, height=600");
  781.             {% else %}
  782.             window.open("{{ path('condition_vente',{produit:'vo'}) }}", "_blank", "toolbar=yes, scrollbars=yes, resizable=yes, top=500, left=500, width=600, height=600");
  783.             {% endif %}
  784.         }
  786.         $("#addVisa").on('click', function () {
  787.             //var name =  $(this).attr('name')
  788.             console.log("name"  , name)
  789.             var nbrLigne = $("#visas").children().length;
  790.             $("#visas").append("<div class='col-md-12'><input type='file' name='fichier[]' required class='form-control' style='border: 0;color: #213542;'></div>");
  791.             /*if ($("#visas").children().length > 0) {
  792.                 $("#visas").parent().css({opacity: 1});
  793.             } else {
  794.                 $("#visas").parent().css({opacity: 0});
  795.             }*/
  796.         });
  797.         $("#removeVisa").on('click', function () {
  798.             var nbrLigne = $("#visas").children().length;
  799.             $("#visas").children().eq(nbrLigne - 1).remove();
  800.             /*if ($("#visas").children().length > 0) {
  801.                 $("#visas").parent().css({opacity: 1});
  802.             } else {
  803.                 $("#visas").parent().css({opacity: 0});
  804.             }*/
  805.         });
  806.         $("#addLigne").trigger('click');
  808.         $(document).ready(function () {
  809.             var pack_select = $('.pack-select');
  810.             var periode_select = $('.periode-select');
  811.             var chambre_select = $('.chambre-select');
  812.             pack_select.on('change', function () {
  813.                 var idPack = $(this).val();
  814.                 var target = $('#pack_' + idPack);
  815.                 target.show().siblings(".periode").hide();
  816.                 $("#idPack").val(target.find('.periode-select').val());
  817.             });
  818.             periode_select.on('change', function () {
  819.                 $("#idPack").val($(this).val());
  820.             });
  821.             pack_select.trigger('change');
  822.         });
  827.     </script>
  830.     <script>
  832.         $(document).on('click', '.pointvente', function () {
  834.             $('input:not(:checked)').parent().removeClass("pt-vente-select");
  835.             $('input:checked').parent().addClass("pt-vente-select");
  836.         });
  838.         /*add with HtMl syntax in custom projects Please do not delete it CHD*/
  839.         const article = document.querySelector("#content");
  840.         const button = document.querySelector("#read-more");
  842.         button.addEventListener("click", readMore);
  844.         function readMore() {
  845.             if (article.className == "open") {
  846.                 // Read less
  847.                 article.className = "";
  849.                 button.innerHTML = "Afficher plus";
  850.             }
  851.             else
  852.             {
  853.                 article.className = "open";
  854.                 button.className="position-relative"
  855.                 button.innerHTML = "Afficher moins";
  856.             }
  857.         }
  858.     </script>
  860. {% endblock %}