templates/front/ssr34.html.twig line 1

Open in your IDE?
  1. {% extends 'base_front.html.twig' %}
  2. {% set queryParams = app.request.query.all %}
  3. {% block title %}{{ parent() }} | {{ r.nom }} | {{ ssr.nom }}{% endblock %}
  4. {% block h1 %}
  5.     {{ ssr.nom }}
  6.     {% if app.user and is_granted('ROLE_MODO') %}
  7.         <a target="_blank" href="{{ path('app_admin_sous_rubrique_show', {'uuid': ssr.uuid}) }}"><i class="text-danger" data-feather="unlock"></i></a>
  8.     {% endif %}
  9. {% endblock %}
  10. {% block ariane %}
  11.     <nav class="navigateur" aria-label="breadcrumb">
  12.         <ol class="breadcrumb">
  13.             <li class="breadcrumb-item"><a href="{{ path("home") }}">{{ config.titreAccueil }}</a></li>
  14.             <li class="breadcrumb-item"><a href="{{ path('rubriques', {slug:r.slug })}}">{{ r.nom }}</a></li>
  15.             <li class="breadcrumb-item active" aria-current="page">{{ ssr.nom }}</li>
  16.         </ol>
  17.     </nav>
  18. {% endblock %}
  19. {% macro filter(queryParams) %}
  20.     <div class="col-4" id="filterZone">
  21.         <input id="searchInput" class="form-control bg-white rounded pl-40" placeholder="Rechercher" {% if queryParams is not empty and queryParams.recherche is defined %} value="{{queryParams.recherche}}" {% endif %}>
  22.         <i id="searchBtn" class="toggle-password-alone fa fa-search text-primary" ></i>
  23.         {% if queryParams is not empty and queryParams.recherche is defined %}
  24.             <i id="resetBtn" class="refresh fa fa-refresh text-danger"></i>
  25.         {% endif %}
  26.     </div>
  27.     {% set options = [
  28.         {
  29.             'k' : '',
  30.             'v' : 'Trier par :'
  31.         },
  32.         {
  33.             'k' : 'titre-croissant',
  34.             'v' : 'Titre A-Z'
  35.         },
  36.         {
  37.             'k' : 'titre-decroissant',
  38.             'v' : 'Titre Z-A'
  39.         },
  40.         {
  41.             'k' : 'date-croissante',
  42.             'v' : 'Date croissante'
  43.         },
  44.         {
  45.             'k' : 'date-decroissante',
  46.             'v' : 'Date décroissante'
  47.         },
  48.     ] %}
  49.     <div class="col-2">
  50.         <select class="bg-white rounded form-control" id="ordonnance">
  51.             {% for option in options %}
  52.                 <option {% if queryParams is not empty and queryParams.ordre is defined and queryParams.ordre == option.k %} selected {% endif %} value="{{option.k}}">{{option.v|raw}}</option>
  53.             {% endfor %}
  54.         </select>
  55.     </div>
  56. {% endmacro %}
  57. {% block body %}
  58.     {% if app.user %}
  59.         {% set co = true %}
  60.     {% else %}
  61.         {% set co = false %}
  62.     {% endif %}
  63.     <input type="hidden" value="{{co}}" id="co">
  64.     {% set acces = false %}
  65.     {% if form2.children.titre.vars.errors is not empty %}
  66.         {% set acces = true %}
  67.     {% endif %}
  68.     {% if form2.children.description.vars.errors is not empty %}
  69.         {% set acces = true %}
  70.     {% endif %}
  71.     {% if form2.children.fichier.vars.errors is not empty %}
  72.         {% set acces = true %}
  73.     {% endif %}
  74.     {% if form2.children.hashtag.vars.errors is not empty %}
  75.         {% set acces = true %}
  76.     {% endif %}
  77.     <input type="hidden" id="acces" value="{{acces}}">
  78.     {% if ssr.phrase %}
  79.         <div class="my-4 mx-12 bg-white p-4 rounded ck">{{ ssr.phrase|raw }}</div>
  80.     {% endif %}
  81.     {% if ssr.srcImg %}
  82.         <div class="mx-12">
  83.             <img 
  84.                 src="{{ asset('images/sousrubrique/' ~ ssr.srcImg) }}" 
  85.                 {% if ssr.altImg %}
  86.                     alt="{{ ssr.altImg }}" 
  87.                 {% endif %}
  88.                 {% if ssr.titleImg %}
  89.                     title="{{ ssr.titleImg }}" 
  90.                 {% endif %}
  91.                 class="imgRatio rounded"
  92.             >
  93.         </div>
  94.     {% endif %}
  95.     {% if ssr.description %}
  96.         <div class="my-4 mx-12  bg-white p-4 rounded ck">{{ ssr.description|raw }}</div>
  97.     {% endif %}
  98.     {# {% if app.user %}
  99.         <a class="btn btn-primary mx-12 rounded" href="{{ path('post_new', {slug: r.slug, slug2 : ssr.slug }) }}">Ajouter</a>
  100.     {% else %}
  101.         <div class="my-4 mx-12 bg-white p-4 rounded">
  102.             <h3 class="text-center">{{ ssr.info }}, <a class="lien" href="{{ path('app_login')}}">connectez-vous</a> ou <a class="lien" href="{{ path('app_register')}}">créez votre compte</a></h3>
  103.         </div>
  104.     {% endif %} #}
  105.     {# {% if domaines %} #}
  106.         {# <div class="text-end me-2">
  107.             <button type="button" class="btnTransparent text-primary" data-bs-toggle="modal" data-bs-target="#exampleModal">
  108.                 {% include "svg/svg-filter.html.twig" %} ({{ count }})
  109.             </button>
  110.         </div> #}
  111.         {# <div class="row justify-content-center mx-0">
  112.             {% for domaine in domaines %}
  113.                 
  114.                 <div class="col-md-6  mt-4">
  115.                     <a href="{{ path('post_domaine', {slug1: r.slug , slug2: ssr.slug, slug: domaine.slug}) }}">
  116.                         <div class="p-4 bg-white rounded taille">
  117.                             <h3 class="text-center titreH3">{{ domaine.nom }}</h3>
  118.                             <div class="text-center mb-4">
  119.                                 <img 
  120.                                     src="{{ asset('images/domaine/' ~ domaine.src) }}" 
  121.                                     {% if domaine.alt %}
  122.                                         alt="{{ domaine.alt }}" 
  123.                                     {% endif %}
  124.                                     {% if domaine.title %}
  125.                                         title="{{ domaine.title }}"
  126.                                     {% endif %}
  127.                                     class="img80Dpx"
  128.                                 >
  129.                             </div>
  130.                             {% if domaine.intro %}
  131.                                 <div class="text-center ck">
  132.                                     {{ domaine.intro|raw }}
  133.                                 </div>   
  134.                             {% endif %}
  135.                             <div class="text-end">
  136.                                 <svg width="24" height="24" xmlns="http://www.w3.org/2000/svg" fill="#0B6BA8" viewBox="0 0 32 32"><path d="M31.71,15.29l-10-10L20.29,6.71,28.59,15H0v2H28.59l-8.29,8.29,1.41,1.41,10-10A1,1,0,0,0,31.71,15.29Z"/></g></svg>
  137.                             </div>
  138.                         </div>
  139.                     </a>
  140.                 </div>
  141.             
  142.             {% endfor %}
  143.         </div> #}
  144.     {# {% else %}
  145.         <h4 class="text-center text-danger fst-italic my-4  mx-12 bg-white p-4 rounded">{{ config.messageDefault }}</h4> #}
  146.     {# {% endif %} #}
  147.     {# {% if posts %}
  148.         <div class="row justify-content-center mx-0">
  149.             {% for post in posts %}
  150.                 
  151.                 <div class="col-sm-12 col-md-12 col-lg-12  mt-4">
  152.                     <a href="">
  153.                         <div class="p-4 bg-white rounded">
  154.                             <h3 class="text-center titreH3">{{ post.titre }}</h3>
  155.                             {% if post.description %}
  156.                                 <div class="text-center ck">
  157.                                     {{ post.description|raw }}
  158.                                 </div>   
  159.                             {% endif %}
  160.                             <div class="text-end pb-2">
  161.                                 {% if post.mime == 'image' %}
  162.                                     <a href="{{ asset('post/' ~ post.fichier )}}" target="_blank">
  163.                                         <i class="text-danger" data-feather="file"></i>
  164.                                     </a>
  165.                                 {% elseif post.mime == 'application' %}
  166.                                     <a href="{{ asset('post/' ~ post.fichier )}}" target="_blank">
  167.                                         <i class="text-danger" data-feather="file"></i>
  168.                                     </a>
  169.                                 {% endif %}
  170.                             </div>
  171.                         <p class="fst-italic text-end">{{ post.createdAt|date('d/m/Y') }}</p>
  172.                             <div class="text-end">
  173.                                 <svg width="24" height="24" xmlns="http://www.w3.org/2000/svg" fill="#0B6BA8" viewBox="0 0 32 32"><path d="M31.71,15.29l-10-10L20.29,6.71,28.59,15H0v2H28.59l-8.29,8.29,1.41,1.41,10-10A1,1,0,0,0,31.71,15.29Z"/></g></svg>
  174.                             </div>
  175.                         </div>
  176.                     </a>
  177.                 </div>
  178.             
  179.             {% endfor %}
  180.         </div>
  181.     {% endif %} #}
  182.     {% if app.user %}
  183.         <div class="row justify-content-between mx-0">
  184.             <div class="col-6">
  185.                 <button type="button" class="btn btn-primary rounded" data-bs-toggle="modal" data-bs-target="#exampleModalAdd">
  186.                     Ajouter
  187.                 </button>
  188.             </div>
  189.             {% if items %}
  190.                 {{ _self.filter(queryParams) }}
  191.             {% endif %}
  192.         </div>
  193.     {% else %}
  194.         <div class="mx-12 bg-white p-4 rounded">
  195.             <h3 class="text-center">{{ ssr.info }}, {% include '_connexion_bouton.html.twig' with {'contenu': 'connectez-vous', 'class': "lien" } %} ou <a class="lien" href="{{ path('app_register')}}">créez votre compte</a></h3>
  196.         </div>
  197.         {% if items %}
  198.             <div class="row justify-content-between mx-0 mt-4">
  199.                 <div class="col-6"></div>
  200.                 {{ _self.filter(queryParams) }}
  201.             </div>
  202.         {% endif %}
  203.     {% endif %}
  204.     {% if items %}
  205.         <div id="zoneContent">
  206.             {% include "front/_ssr34_post.html.twig" %}
  207.         </div>
  208.     {% endif %}
  209.     
  210.     {% if app.user %}
  211.         <div class="modal fade" id="exampleModalAdd" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
  212.             <div class="modal-dialog modal-xl">
  213.                 {{form_start(form2)}}
  214.                     <div class="modal-content">
  215.                     <div class="modal-header">
  216.                         <h1 class="modal-title fs-5" id="exampleModalLabel">Ajouter une astuce</h1>
  217.                         <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
  218.                     </div>
  219.                     <div class="modal-body row">
  220.                         <div class="col-12">
  221.                             {{ form_row(form2.titre) }}
  222.                         </div>
  223.                         <div class="col-12">
  224.                             {{ form_row(form2.hashtag) }}
  225.                         </div>
  226.                         <div class="col-12">
  227.                             {{ form_row(form2.description) }}
  228.                         </div>
  229.                         <div class="col-12">
  230.                             {{ form_row(form2.fichier) }}
  231.                         </div>
  232.           
  233.                         
  234.     
  235.                     </div>
  236.                     <div class="modal-footer">
  237.                         <button type="button" title="En annulant, vous réinitialiserez le formulaire" class="btn btn-danger rounded" data-bs-dismiss="modal">Annuler</button>
  238.                         <button type="submit" class="btn btn-primary rounded">Ajouter</button>
  239.                     </div>
  240.                     </div>
  241.                 {{form_end(form2)}}
  242.             </div>
  243.         </div>
  244.     {% endif %}
  245. {% endblock %}
  246. {% block javascripts %}
  247.     <script src="{{ asset('js/cardShow.js') }}"></script>
  248.     <script>
  249.         let checkStatut = $('.checkStatut');
  250.         checkStatut.change(function()
  251.         {
  252.             let data = {
  253.                 "token" : $(this).data('token'),
  254.                 "uuid" : $(this).data('uuid')
  255.             }
  256.     
  257.             let url = "{{ path('change_front_statut_post') }}";
  258.             $.ajax({
  259.                 method: 'post',
  260.                 dataType: 'json',
  261.                 url : url,
  262.                 data : data,
  263.                 success: function (data)
  264.                 {
  265.                     if(data.response){
  266.                         $('#droit' + data.token).remove();
  267.                     }
  268.                 },
  269.                 error: function()
  270.                 {
  271.                     alert('error');
  272.                 }
  273.             });
  274.         });
  275.         let acces = $("#acces").val();
  276.         if(acces){
  277.             var myModal = new bootstrap.Modal(document.getElementById('exampleModalAdd'))
  278.             myModal.show()
  279.         }
  280.         function confirmDelete(element) {
  281.             var confirmDelete = confirm('Êtes-vous sûr de vouloir supprimer cette astuce ?');
  282.             
  283.             if (confirmDelete) {
  284.                
  285.                 let data = {
  286.                     "uuid" : element.getAttribute('data-uuid'),
  287.                     "token" : element.getAttribute('data-token')
  288.                 }
  289.                 let url = "{{ path('supprimer_post') }}";
  290.                 $.ajax({
  291.                     method: 'post',
  292.                     dataType: 'json',
  293.                     url : url,
  294.                     data : data,
  295.                     success: function (data)
  296.                     {
  297.                         if(data.response){
  298.                             $('#droit' + data.token).remove();
  299.                         }
  300.                         
  301.                     },
  302.                     error: function()
  303.                     {
  304.                         alert('Une erreur est survenue, veuillez recommencer');
  305.                     }
  306.                 });
  307.             } 
  308.         }
  309.         $("#searchBtn").click(function() {
  310.             updateData();
  311.         });
  312.         $("#ordonnance").change(function() {
  313.             updateData();
  314.         });
  315.         $('body').on('click', '#resetBtn', function() {
  316.             $("#searchInput").val('');
  317.             $('#ordonnance').prop('selectedIndex', 0);
  318.             
  319.             updateData();
  320.         });
  321.         function updateData(){
  322.             var inputValue = $("#searchInput").val();
  323.             const selectElement = document.querySelector("#ordonnance");
  324.             const selectedValue = selectElement.value;
  325.             const Params = new URLSearchParams();
  326.             Params.append('page', "{{page}}");
  327.             if(inputValue){
  328.                 Params.append('recherche', inputValue);
  329.             }
  330.             if(selectedValue){
  331.                 Params.append('ordre', selectedValue);
  332.             }
  333.             
  334.             const Url = new URL(window.location.href);
  335.     
  336.             fetch(Url.pathname + "?" + Params.toString() + "&ajax=xxx", {
  337.                 headers: {
  338.                     "X-Requested-With": "XMLHttpRequest"
  339.                 }
  340.             }).then(response => {
  341.                 return response.json()
  342.             }).then(data => {
  343.                 
  344.               const content = document.querySelector("#zoneContent");
  345.               content.innerHTML = data.content;
  346.               history.pushState({}, null, Url.pathname + "?" + Params.toString());
  347.               var elements = document.querySelectorAll(".taille");
  348.               sizeCard(elements);
  349.               if ($('#resetBtn').length > 0) {
  350.                 $('#resetBtn').remove();
  351.               }
  352.               if (inputValue){
  353.                 $('#filterZone').each(function() {
  354.                     $(this).append('<i id="resetBtn" class="refresh fa fa-refresh text-danger"></i>');
  355.                 });
  356.               }
  357.             
  358.             }).catch(e => alert(e));
  359.         }
  360.         var coElement = document.getElementById('co').value;
  361.         if (coElement) {
  362.             var cancelButton = document.querySelector('#exampleModalAdd .btn-danger');
  363.             
  364.             cancelButton.addEventListener('click', function () {
  365.                 var form = document.querySelector('#exampleModalAdd form');
  366.                 form.reset();
  367.             });
  368.         }
  369.         var elements = document.querySelectorAll(".taille");
  370.         sizeCard(elements);
  371.         $(window).on('resize', function() {
  372.             var elements = document.querySelectorAll(".taille");
  373.             sizeCard(elements);
  374.         });
  375.     </script>
  376.     
  377. {% endblock %}