templates/planning/coiffeur_liste.html.twig line 1

Open in your IDE?
  1. {% extends 'base.html.twig' %}
  2. {% block title %}Gestion Fiches RDV{% endblock %}
  3. {% block body %}
  4.     {% include 'breadcrumb.html.twig' with {level1: 'Salon', level2: 'Liste'} %}
  5.     <div class="page-header">
  6.         <h1>Gestion Fiches RDV (vue coiffeur)</h1>
  7.     </div>
  8.     <button id="createRdv" class="btn btn-success" data-toggle="modal" data-target="#create">Création d'un RDV</button>
  9.    {{ form_start(formFilter) }}
  10.         <div style="display: flex;padding-top: 20px;align-items: center">
  11.             {{ form_row(formFilter.site) }}
  12.             {% if is_granted('ROLE_ADMIN') or is_granted('ROLE_BO') or is_granted('ROLE_ADMINISTRATIVE') %}
  13.                    {{ form_row(formFilter.intervenant) }}
  14.             {% endif %}
  15.             {{ form_row(formFilter.client) }}
  16.            <!-- motifs -->
  17.            {{ form_row(formFilter.start) }}
  18.            {{ form_row(formFilter.end) }}
  19.            {{ form_row(formFilter.status) }}
  20.             {{ form_row(formFilter.salon) }}
  21.            {#{{ form_row(formFilter.cancelReason) }}#}
  22.             <button type="submit" class="btn btn-success">Valider</button>
  23.         </div>
  24.        {{ form_end(formFilter) }}
  25.     <div class="row">
  26.         <div class="col-md-12">
  27.             <table class="table" data-sortable style="font-size:18px">
  28.                 <thead>
  29.                 <tr >
  30.                     <th><input class="mass-checkbox-select-all" type="checkbox" name=""></th>
  31.                     <th>Client</th>
  32.                     <th style="font-weight: normal;">Chambre</th>
  33.                     <th style="font-weight: normal;">Début</th>
  34.                     <th style="font-weight: normal;">Périodicité</th>
  35.                     <th style="font-weight: normal;">Prestations</th>
  36.                     <th>HT <span class="totalht"></span> € <br/> TTC <span class="totalttc"></span> €</th>
  37.                     <th>Paiement </th>
  38.                     <th>N° Facture </th>
  39.                     <th style="font-weight: normal;">Statut</th>
  40.                 </tr>
  41.                 </thead>
  42.                 <tbody>
  43.                 {% for session in sessions %}
  44.                     <tr   {% if session.status  == 'cancel'  %}style="background:grey"{% endif %}{% if session.status  == 'validated' or session.status  == 'billing'  %}style="background:#39CCCC"{% endif %}>
  45.                         <td><input class="mass-checkbox" type="checkbox" name=""
  46.                                    data-id="{{ session.id }}" data-client="{{ session.client }}"
  47.                                    data-date="{{ session.start|date('d/m/Y') }}"
  48.                                    data-ttc={{ session.ttc }}
  49.                             ></td>
  50.                         <td style="font-weight: bold">
  51.                             {% if session.comment %}
  52.                                 🚨
  53.                             {% endif %}
  54.                             {%if session.paid is defined%}
  55.                                 {%if session.paid > 30 %}
  56.                                     <span style="color:red">{{ session.lastname }} {{ session.firstname }}</span>
  57.                                 {%else%}
  58.                                     <span>{{ session.lastname }} {{ session.firstname }}</span>
  59.                                 {%endif%}
  60.                             {%else%}
  61.                                 <span>{{ session.lastname }} {{ session.firstname }}</span>
  62.                             {%endif%} </td>
  63.                         <td>{{ session.roomNumber is defined ? session.roomNumber : 'Pas de client associé' }}</td>
  64.                         <td>{{ session.start|date('d/m/Y H:i') }}</td>
  65.                         {% if session.nbSemaine is not null %}
  66.                             <td>{{ session.nbSemaine }}</td>
  67.                         {% else %}
  68.                             <td>--</td>
  69.                         {% endif %}
  70.                          <td>{% for product in session.products  %}{{ product.ui }}, {% endfor %}</td>
  71.                         <td>
  72.                             {{ session.ttc }} €
  73.                         </td>
  74.                         <td>
  75.                             {% if session.qrlink %}
  76.                             <a href="{{ session.qrlink }}" class="btn btn-success">
  77.                                 Payer
  78.                             </a>
  79.                             {% endif %}
  80.                             {% if session.qrimage is defined and session.qrimage  %}
  81.                                 <img width="150" src="data:image/png;base64,{{ session.qrimage }}" alt="QR Code" />
  82.                             {% endif %}
  83.                         </td>
  84.                         <td>{%if session.codeBilling is defined%}{{session.codeBilling}}{%endif%}</td>
  85.                         <td>{{ session.label }}</td>
  86.                         <td>{%if session.client %}<div style="background: {%if session.client.solde <= 0 %}green{%else%}red{%endif%};padding:5px;color:white">Solde : {{ session.client.solde }}</div>{%endif%}</td>
  87.                         {#<td>{{ session.end|date }}</td>#}
  88.                         <td>{%if session.paid is defined%}{{session.paid}}{%endif%}</td>
  89.                         <td>
  90.                             <a href="{{ path('app_planning_edit', {'id': session.id}) }}" target="_blank">Edition</a>
  91.                         </td>
  92.                     </tr>
  93.                 {% else %}
  94.                     {% include 'noFoundRecords.html.twig' %}
  95.                 {% endfor %}
  96.                 </tbody>
  97.             </table>
  98.         </div>
  99.     </div>
  100.     <style>
  101.         .form-group {
  102.             padding-right: 10px;
  103.         }
  104.     </style>
  105.     {% include 'planning/rdv_popup.html.twig' with {'form' : form} %}
  106. {% endblock %}
  107. {% block javascripts %}
  108.     {{ parent() }}
  109.     <script type="text/javascript">
  110.        $('#filter_start').flatpickr({
  111.             'dateFormat' : 'Y-m-d',
  112.             "locale": "fr"
  113.         });
  114.        $('#filter_end').flatpickr({
  115.            'dateFormat' : 'Y-m-d',
  116.            "locale": "fr"
  117.        });
  118.        $('#replanning_end').flatpickr({
  119.            'dateFormat' : 'Y-m-d',
  120.            "locale": "fr"
  121.        });
  122.        $('#replanning_start').flatpickr({
  123.            'dateFormat' : 'Y-m-d',
  124.            "locale": "fr"
  125.        });
  126.        $('#filter_intervenant').select2({ width: '100%' });
  127.        $('#filter_site').select2({ width: '100%' });
  128.        $('#filter_status').select2({ width: '250px' });
  129.        $('#filter_salon').select2({ width: '250px' });
  130.        $('.mass-checkbox').on('change', function () {
  131.            $('.liste-mass').html('');
  132.            $('#replanning_rdvSelected').val();
  133.            let total = 0;
  134.            $('.mass-checkbox:checkbox:checked').each(function () {
  135.                const client = $(this).data('client');
  136.                const date = $(this).data('date');
  137.                $('.liste-mass').append('<div>' + date + ' Client ' + client + '</div>');
  138.                allAttributes = $('.mass-checkbox:checkbox:checked').map(function () {
  139.                    return $(this).data('id');
  140.                }).get();
  141.                const ttc = $(this).data('ttc');
  142.                total+=ttc;
  143.            });
  144.            $('.totalttc').html(total);
  145.            $('.totalht').html((total / 1.2).toFixed(2));
  146.            $('#replanning_rdvSelected').val(allAttributes);
  147.        });
  148.        $('.mass-checkbox-select-all').on('change', function () {
  149.            $('#replanning_rdvSelected').val();
  150.            var check = $('.mass-checkbox-select-all').is(":checked");
  151.            $('.mass-checkbox').each(function () {
  152.                $(this).prop('checked', check);
  153.            });
  154.            $('.liste-mass').html('');
  155.            let total = 0;
  156.            $('.mass-checkbox:checkbox:checked').each(function () {
  157.                const client = $(this).data('client');
  158.                const date = $(this).data('date');
  159.                const ttc = $(this).data('ttc');
  160.                $('.liste-mass').append('<div>' + date + ' Client ' + client + '</div>');
  161.                allAttributes = $('.mass-checkbox:checkbox:checked').map(function () {
  162.                    return $(this).data('id');
  163.                }).get();
  164.                total+=ttc;
  165.            });
  166.            $('.totalttc').html(total.toFixed(2));
  167.            $('.totalht').html((total / 1.2).toFixed(2));
  168.            $('#replanning_rdvSelected').val(allAttributes);
  169.        });
  170.        // pop up
  171.        $('#rdv_client').select2({ width: '100%' });
  172.        $('#rdv_intervenant').select2({ width: '100%' });
  173.        $('#rdv_products').select2({ width: '100%' });
  174.        $('#rdv_client').on('change', function (e)  {
  175.            const val =  $('#rdv_client').val();
  176.            var url = '{{ path("app_planning_ajaxgetsalons", {'id': 'client_id'}) }}';
  177.            url = url.replace("client_id", val);
  178.            $('#form_add_rdv').find('.btn-primary').addClass('disabled');
  179.            $.ajax({
  180.                url: url,
  181.                type: 'get',
  182.                success: function(data) {
  183.                    $('#rdv_salon').empty();
  184.                    console.log(data);
  185.                    for(var i = 0; i < data.length; i++) {
  186.                        var item = data[i];
  187.                        if(i === 0)
  188.                        {
  189.                            $('#rdv_salon').append('<option selected value="' + item.id + '">'+ item.name + '</option>');
  190.                        }
  191.                        else {
  192.                            $('#rdv_salon').append('<option value="' + item.id + '">'+ item.name + '</option>');
  193.                        }
  194.                    }
  195.                    $('#rdv_salon').trigger('change');
  196.                    $('#form_add_rdv').find('.btn-primary').removeClass('disabled');
  197.                }
  198.            });
  199.        });
  200.        $('#rdv_salon').on('change', function (e) {
  201.            console.log('salon changed');
  202.            const val =  $('#rdv_salon').val();
  203.            var url = '{{ path("app_planning_ajaxgetproducts", {'id': 'salon_id'}) }}';
  204.            url = url.replace("salon_id", val);
  205.            {#var urlIntervenant = '{{ path("app_planning_ajaxgetintervenants", {'id': 'salon_id'}) }}';#}
  206.            {#urlIntervenant = urlIntervenant.replace("salon_id", val);#}
  207.            $.ajax({
  208.                url: url,
  209.                type: 'get',
  210.                success: function(data) {
  211.                    console.log(data);
  212.                    $('#rdv_products').empty();
  213.                    for(var i = 0; i < data.length; i++) {
  214.                        var item = data[i];
  215.                        if(i === 0)
  216.                        {
  217.                            //    $('#rdv_products').append('<option selected value="' + item.id + '">'+ item.name + '</option>');
  218.                        }
  219.                        else {
  220.                            $('#rdv_products').append('<option value="' + item.id + '">'+ item.name + '</option>');
  221.                        }
  222.                    }
  223.                }
  224.            });
  225.            // $.ajax({
  226.            //     url: urlIntervenant,
  227.            //     type: 'get',
  228.            //     success: function(data) {
  229.            //
  230.            //         console.log('intervenants',data);
  231.            //         $('#rdv_intervenant').empty();
  232.            //
  233.            //         for(var i = 0; i < data.length; i++) {
  234.            //
  235.            //             var item = data[i];
  236.            //             console.log(item.fullname);
  237.            //             if(i === 0)
  238.            //             {
  239.            //                 $('#rdv_intervenant').append('<option selected value="' + item.id + '">'+ item.fullname + '</option>');
  240.            //
  241.            //             }
  242.            //             else {
  243.            //                 $('#rdv_intervenant').append('<option value="' + item.id + '">'+ item.fullname + '</option>');
  244.            //
  245.            //             }
  246.            //         }
  247.            //
  248.            //         $('#rdv_intervenant').trigger('change.select2');
  249.            //
  250.            //
  251.            //
  252.            //     }
  253.            // });
  254.        });
  255.        $('#rdv_start').on('change', function (e) {
  256.            console.log('salon changed');
  257.            const val =  $('#rdv_salon').val();
  258.            const date =  $('#rdv_start').val();
  259.            var url = '{{ path("app_planning_ajaxgetproducts", {'id': 'salon_id'}) }}';
  260.            url = url.replace("salon_id", val);
  261.            var urlIntervenant = '{{ path("app_planning_ajaxgetintervenants", {'id': 'salon_id','date' : 'date_id'}) }}';
  262.            urlIntervenant = urlIntervenant.replace("salon_id", val);
  263.            urlIntervenant = urlIntervenant.replace("date_id", date);
  264.            $.ajax({
  265.                url: urlIntervenant,
  266.                type: 'get',
  267.                success: function(data) {
  268.                    console.log('intervenants',data);
  269.                    $('#rdv_intervenant').empty();
  270.                    for(var i = 0; i < data.length; i++) {
  271.                        var item = data[i];
  272.                        console.log(item.fullname);
  273.                        if(i === 0)
  274.                        {
  275.                            $('#rdv_intervenant').append('<option selected value="' + item.id + '">'+ item.fullname + '</option>');
  276.                        }
  277.                        else {
  278.                            $('#rdv_intervenant').append('<option value="' + item.id + '">'+ item.fullname + '</option>');
  279.                        }
  280.                    }
  281.                    $('#rdv_intervenant').trigger('change.select2');
  282.                }
  283.            });
  284.        });
  285.        $('#createRdv').on('click', function (e) {
  286.            $('#rdv').modal({});
  287.        });
  288.        $('#form_add_rdv').on('submit', function (e) {
  289.            e.preventDefault();
  290.            const path = "{{ path('app_planning_addrdvajax') }}";
  291.            $.ajax({
  292.                url: path,
  293.                data: $(this).serialize(),
  294.                type: 'post',
  295.                success: function(data) {
  296.                    $('#rdv').modal('hide');
  297.                    window.location.reload();
  298.                }
  299.            });
  300.        });
  301.     </script>
  302. {% endblock %}