templates/forum/detail.html.twig line 1

Open in your IDE?
  1. {% extends 'base.html.twig' %}
  2. {% block stylesheets %}
  3.     <link rel="stylesheet" href="{{ asset('css/detail-forum.css') }}">
  4.      <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1"/> 
  5.     {% endblock %}
  6.     {% block body %}
  7.         <div class="section-about" id="section-about">
  8.             {% for message in app.flashes('success') %}
  9.                 <div class="alert alert-success alert-dismissible fade show col-md-6" role="alert">{{ message }}</div>
  10.             {% endfor %}
  11.             <div class="section-gallery">
  12.                 <div class="container">
  13.                     <div class="row  justify-content-center pb-5">
  14.                         <div class="row justify-content-center pb-5 {{ app.request.locale == 'ar_TN' ? 'form_direction_rtl' : 'form_direction_ltr' }}">
  15.                             <h5>{% trans %} forum.details.forum {% endtrans %}</h5>
  16.                             <h2 class="pb-0">Lorem ipsum dolor</h2>
  17.                         </div>
  18.                     </div>
  19.                     <div class="box"></div>
  20.                     <div class="row  justify-content-center pb-5">
  21.                         <div class="row  justify-content-center pb-5">
  22.                             <div class="card-body {{ app.request.locale == 'ar_TN' ? 'form_direction_rtl' : 'form_direction_ltr' }}">
  23.                                 <h6 class="card-title">
  24.                                     <strong>{{ sujetForum.sujet }}
  25.                                     </strong>
  26.                                 </h6>
  27.                                 <hr>
  28.                                     <p class="card-text">{{ sujetForum.description }}</p>
  29.                                     <h6 class="card-title">
  30.                                         <span id="date">
  31.                                    {{ app.request.locale == 'ar_TN' ? sujetForum.getDatePublic | date('Y/m/d') : sujetForum.getDatePublic | date('d/m/Y') }} </p></span>
  32.                                     </h6>
  33.                                 </div>
  34.                             </div>
  35.                         </div>
  36.                         <div class="row  justify-content-center pb-5">
  37.                             <div class="row  justify-content-center pb-5">
  38.                                 <form class="{{ app.request.locale == 'ar_TN' ? 'form_direction_rtl' : 'form_direction_ltr' }}" method="post" action="{{ path('make_forum_response', { id: sujetForum.id }) }}" id="form-envoyer">
  39.                                     <div
  40.                                         class="input-group">
  41.                                         <textarea name="message" class="form-control col-md-4" aria-label="With textarea" placeholder="{{ 'Réponse'|trans }}"></textarea>
  42.                                     </div>
  43.                                     <input id="sujetForumId" type="hidden" value="{{ sujetForum.id }}"/>
  44.                                     {% if  app.user != null %}
  45.                                         <button type="submit" class="btn-slider-text-forum-dtls">{% trans %} forum.details.send {% endtrans %}</button>
  46.                                     {% endif %}
  47.                                     {% if  app.user == null %}
  48.                                         <a href="/login">
  49.                                             <button type="button" class="btn-slider-text-forum-dtls">{% trans %} forum.details.send {% endtrans %}</button>
  50.                                         </a>
  51.                                     {% endif %}
  52.                                 </form>
  53.                             </div>
  54.                         </div>
  55.                         <div class="row justify-content-center pb-5" id="ReponseSujet">
  56.                             <div class="row justify-content-center pb-5" style="">
  57.                                 <div class="accordion-content">
  58.                                     {% for reponse in reponsesForums %}
  59.                                         <div
  60.                                             class="accordion-item" id="accordion-item">
  61.                                             {% if app.user != null and reponse.user.id == app.user.id and reponse.etat == false %}
  62.                                                 <header class="item-header answer">
  63.                                                     <h4 id="item-quest-user" class="item-question answer">{{ reponse.user }}</h4>
  64.                                                     <h4 id="item-quest-date" class="item-question">
  65.                                                        {{ app.request.locale == 'ar_TN' ? reponse.date | date('Y/m/d') : reponse.date | date('d/m/Y') }} </p></span></h4>
  66.                                                     <form class="" method="post" action="{{ path('update_forum_response', { id: reponse.id }) }}" id="form-reponse">
  67.                                                         <div class="input-group {{ app.request.locale == 'ar_TN' ? 'form_direction_rtl' : 'form_direction_ltr' }}">
  68.                                                             <textarea name="message" class="form-control form-control-lg " aria-lab-el="With textarea" required>{{ reponse.reponse }}</textarea>
  69.                                                         </div>
  70.                                                         <button type="submit" class="btn-slider-text modif">
  71.                                                             <i id="update-commentaire" class="fa-solid fa-pen-to-square"></i>
  72.                                                         </button>
  73.                                                         <a class="col-md-10" style="margin:10px;">
  74.                                                             <i id="drop-commentaire" onclick="supprimerReponse({{ reponse.id }})" class="fa-sharp fa-solid fa-trash"></i>
  75.                                                         </a>
  76.                                                     </form>
  77.                                                 </header>
  78.                                             {% else %}
  79.                                                 <header class=" item-header container">
  80.                                                     <div class="row {{ app.request.locale == 'ar_TN' ? 'form_direction_rtl' : 'form_direction_ltr' }}">
  81.                                                         <div class="col-md-2">
  82.                                                             <h4 id="item-quest-user" class="item-question">{{ reponse.user }}</h4>
  83.                                                             <div class="col-md-2">
  84.                                                                 <h4 id="item-quest-date" class="item-question">
  85.                                                              {{ app.request.locale == 'ar_TN' ? reponse.date | date('Y/m/d') : reponse.date | date('d/m/Y') }} </p></span></h4></h4>
  86.                                                             </div>
  87.                                                         </div>
  88.                                                         <div class="col-md-12 description">
  89.                                                             {{ reponse.reponse }}
  90.                                                         </div>
  91.                                                     </div>
  92.                                                 </header>
  93.                                             {% endif %}
  94.                                         </div>
  95.                                         <form method="post" action="{{ path('make_forum_comment', { id: sujetForum.id, repid: reponse.id }) }}" id="reponse-form">
  96.                                             <div class="input-group ">
  97.                                                 <div class="{{ app.request.locale == 'ar_TN' ? 'form_direction_rtl' : 'form_direction_ltr' }}" style="width:100%">
  98.                                                 <div
  99.                                                     class="input-group">
  100.                                                     <textarea name="message" class="form-control" aria-label="With textarea" placeholder="{{ 'Commenter_la_réponse'|trans }}"></textarea>
  101.                                                 </div>
  102.                                                 <input
  103.                                                 type="hidden" value="{{ sujetForum.id }}"/>
  104.                                                 {% if  app.user != null %}
  105.                                                     <button type="submit" class="btn-slider-text-forum-dtls">{% trans %} forum.details.send {% endtrans %}</button>
  106.                                                 {% endif %}
  107.                                                 {% if  app.user == null %}
  108.                                                     <a href="/login">
  109.                                                         <button type="button" class="btn-slider-text-forum-dtls">{% trans %} forum.details.send {% endtrans %}</button>
  110.                                                     </a>
  111.                                                 {% endif %}
  112.                                                 </div>
  113.                                         </form>
  114.                                             {% for child in reponse.children %}
  115.                                                 {% if app.user != null and child.user.id == app.user.id and child.etat == false %}
  116.                                                     <div class="accordion-content mx-5">
  117.                                                         <div class="accordion-item">
  118.                                                             <header class="item-header" id="Rps-child">
  119.                                                                 <h4 id="item-quest-user" class="item-question">{{ child.user }}
  120.                                                                 </h4>
  121.                                                                 <h4 id="item-quest-date" class="item-question">
  122.                                                                    {{ app.request.locale == 'ar_TN' ? child.date | date('Y/m/d') : child.date | date('d/m/Y') }} </p></span></h4>
  123. </h4>
  124.                                                                 <form method="post" action="{{ path('update_forum_response', { id: child.id }) }}" style="margin-right: 30px">
  125.                                                                     <div class="input-group {{ app.request.locale == 'ar_TN' ? 'form_direction_rtl' : 'form_direction_ltr' }}">
  126.                                                                         <textarea name="message" class="form-control col-md-4" aria-label="With textarea" required>{{ child.reponse }}</textarea>
  127.                                                                     </div>
  128.                                                                     <button type="submit" class="btn-slider-text modif">
  129.                                                                         <i id="update-commentaire" class="fa-solid fa-pen-to-square"></i>
  130.                                                                     </button>
  131.                                                                     <i id="drop-commentaire" onclick="supprimerReponse({{ child.id }})" class="fa-sharp fa-solid fa-trash"></i>
  132.                                                                 </form>
  133.                                                             </header>
  134.                                                         </div>
  135.                                                     </div>
  136.                                                 {% elseif child.etat != false %}
  137.                                                     <div class="accordion-content mx-5" id="Rps-child">
  138.                                                         <div class="accordion-item">
  139.                                                             <header class=" item-header container">
  140.                                                                 <div class="row {{ app.request.locale == 'ar_TN' ? 'form_direction_rtl' : 'form_direction_ltr' }}">
  141.                                                                     <div class="col-md-2">
  142.                                                                         <h4 id="item-quest-user" class="item-question">{{ child.user }}</h4>
  143.                                                                         <div class="col-md-2">
  144.                                                                             <h4 id="item-quest-date" class="item-question">
  145.                                                                                {{ app.request.locale == 'ar_TN' ? child.date | date('Y/m/d') : child.date | date('d/m/Y') }} </p></span></h4></h4>
  146.                                                                         </div>
  147.                                                                     </div>
  148.                                                                     <div class="col-md-12 description">
  149.                                                                         {{ child.reponse }}
  150.                                                                     </div>
  151.                                                                 </div>
  152.                                                             </header>
  153.                                                         </div>
  154.                                                     </div>
  155.                                                 {% endif %}
  156.                                             {% endfor %}
  157.                                         {% endfor %}
  158.                                     </div>
  159.                                 </div>
  160.                             </div>
  161.                             <div class="container showMore">
  162.                                 <div class="row justify-content-center">
  163.                                     <div class="col-md-12">
  164.                                         <div class="row justify-content-center pb-5">
  165.                                             <a>
  166.                                                 <input type="hidden" value="{{ sujetForum.id }}" id="idSujetForum">
  167.                                                     <button class="btn-slider-text mt-5" id="addMore">
  168.                                                         {% trans %} forum.details.show {% endtrans %}</button>
  169.                                                 </a>
  170.                                             </div>
  171.                                         </div>
  172.                                     </div>
  173.                                 </div>
  174.                             </div>
  175.                         </div>
  176.                     </div>
  177.                     <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
  178.                     <script>
  179.                        function supprimerReponse(a) {
  180.                         console.log('supprimer')
  181.                             event.preventDefault();
  182.                             Swal.fire({
  183.                                 title: 'Êtes-vous sûr?',
  184.                                 text: 'Vous ne pourrez pas revenir en arrière !',
  185.                                 icon: 'warning',
  186.                                 showCancelButton: true,
  187.                                 confirmButtonColor: '#3085d6',
  188.                                 cancelButtonColor: '#d33',
  189.                                 confirmButtonText: 'Oui, supprimez-le!'
  190.                             }).then((result) => {
  191.                                 if (result.isConfirmed) {
  192.                                     $.ajax({
  193.                                         type: 'POST',
  194.                                         url: '/delete/forum/reponse/' + a,
  195.                                         // data: JSON.stringify(item),
  196.                                         dataType: 'json',
  197.                                         success: function (response) {
  198.                                             console.log(response)
  199.                                             location.reload()
  200.                                         }
  201.                                     })
  202.                                     // window.location.href = "/make/command/delete/"+a;
  203.                                 }
  204.                             })
  205.                         }
  206.                         // Get the modal
  207.                         var modal = document.getElementById('myModal')
  208.                         // Get the image and insert it inside the modal - use its "alt" text as a caption
  209.                         var img = document.getElementById('dream-img')
  210.                         {# var modalImg = document.getElementById('img01') {
  211.                             
  212.                             var pathImg = document.getElementById('path-img').value
  213.                             function showImg(img) {
  214.                                 var img = pathImg + img
  215.                                 modalImg.style.backgroundImage = 'url(' + img + ')'
  216.                                 modal.style.display = 'block'
  217.                             }
  218.                             
  219.                         } #}
  220.                         // Get the <span> element that closes the modal
  221.                         var span = document.getElementsByClassName('close')[0]
  222.                         // When the user clicks on <span> (x), close the modal
  223.                         $(document).ready(function () {});
  224.                         let offset = 1;
  225.                         $('#addMore').on('click', function () {
  226.                             console.log(offset)
  227.                             sujetForumId = $('#idSujetForum').val()
  228.                             var url = '/ajax/get/ReponseForum/' + sujetForumId;
  229.                             console.log('/ajax/get/ReponseForum/' + sujetForumId)
  230.                             console.log("offset " + offset)
  231.                             div = ` test one div`
  232.                             $(div).insertBefore(".showMore");
  233.                             $.ajax({
  234.                                 type: "GET",
  235.                                 url: url,
  236.                                 data: {
  237.                                     'offset': offset
  238.                                 },
  239.                                 success: function (response) {
  240.                                     console.log(JSON.stringify(response))
  241.                                     div = ``
  242.                                     $(div).insertBefore(".showMore");
  243.                                     response.result.map((value, index) => {
  244.                                         forumDate = value.date
  245.                                         console.log(forumDate)
  246.                                         console.log(typeof(forumDate))
  247.                                         div = `<div class="accordion-item" id="accordion-item">`
  248.                                         $(div).insertBefore(".showMore")
  249.                                         appUser = "{{ app.user }}"
  250.                                         if (appUser != null && value.etat === false) {
  251.                                             div = `
  252.               <div class="row justify-content-center pb-5" id="ReponseSujet">
  253.                 <div class="row justify-content-center pb-5" style="">
  254.                 <div class="accordion-content">
  255.       
  256.                  <div class="accordion-item" id="accordion-item">
  257.                  <header class="item-header answer">
  258.                     <h4 id="item-quest-user" class="item-question answer">${
  259.                                                 value.userName
  260.                                             }</h4>
  261.                     <h4 id="item-quest-date" class="item-question"> 
  262.                     {% if  app.request.locale == 'ar_TN' %}
  263.                     ${forumDate.split('/').reverse().join('/')} 
  264.                     {% else %} 
  265.                     ${forumDate} 
  266.                     {% endif %}
  267.                     </h4>
  268.                     <form method="post" action="/update/forum/response/${
  269.                                                 value.id
  270.                                             }" id="form-reponse">
  271.                       <div class="input-group {{ app.request.locale == 'ar_TN' ? 'form_direction_rtl' : 'form_direction_ltr' }}">
  272.                         <textarea name="message" class="form-control form-control-lg " aria-label="With textarea" required>${
  273.                                                 value.reponse
  274.                                             }</textarea>
  275.                       </div>
  276.                       <button type="submit" class="btn-slider-text modif"> <i id="update-commentaire" class="fa-solid fa-pen-to-square"></i> 
  277.                       </button>
  278.                       <a class="col-md-10" style="0:10px;">
  279.                       <i id="drop-commentaire"   onclick="supprimerReponse(${
  280.                                                 value.reponse.id
  281.                                             })" class="fa-sharp fa-solid fa-trash"></i>
  282.                       </a>
  283.                     </form>
  284.                     </header>
  285.                     </div>
  286.                     </div>
  287.              
  288.                     `;
  289.                                             $(div).insertBefore(".showMore");
  290.                                         } else {
  291.                                             div = `
  292.               
  293.                 <div class="row justify-content-center pb-5" id="ReponseSujet">
  294.       <div class="row justify-content-center pb-5" style="">
  295.         <div class="accordion-content">
  296.       
  297.             <div class="accordion-item" id="accordion-item">
  298.             
  299.         
  300.                 <header class="item-header {{ app.request.locale == 'ar_TN' ? 'form_direction_rtl' : 'form_direction_ltr' }}">
  301.                   <h4 id="item-quest-user" class="item-question">${
  302.                                                 value.userName
  303.                                             }</h4>
  304.                   <h4 id="item-quest-date" class="item-question"> 
  305.                   {% if  app.request.locale == 'ar_TN' %}
  306.                     ${forumDate.split('/').reverse().join('/')} 
  307.                     {% else %} 
  308.                     ${forumDate} 
  309.                     {% endif %}
  310.                   </h4>
  311.                  ${
  312.                                                 value.reponse
  313.                                             }  
  314.                 </header>
  315.             
  316.             </div>
  317.                    
  318.             <form method="post" action="/make/forum/comment/${sujetForumId}/${
  319.                                                 value.id
  320.                                             }"  id="reponse-form">
  321.               <div class="input-group">
  322.                 <div class="input-group {{ app.request.locale == 'ar_TN' ? 'form_direction_rtl' : 'form_direction_ltr' }}" >
  323.                   <textarea name="message" class="form-control" aria-label="With textarea" placeholder="{{ 'Commenter_la_réponse'|trans }}"></textarea>
  324.                 </div>
  325.                 <input type="hidden" value="${sujetForumId}" />
  326.                      <div class="{{ app.request.locale == 'ar_TN' ? 'form_direction_rtl' : 'form_direction_ltr' }}" style="width:100%;">     {% if  app.user != null %}
  327.           <button type="submit" class="btn-slider-text-forum-dtls">{% trans %} forum.details.send {% endtrans %}</button>
  328.         {% endif %}
  329.           {% if  app.user == null %}
  330.           <a href="/login"><button type="button" class="btn-slider-text-forum-dtls">{% trans %} forum.details.send {% endtrans %}</button>
  331.        </a>
  332.        </div>
  333.         {% endif %}
  334.                 </div>
  335.               </form>
  336.             </div>
  337.             </div>
  338.             </div>
  339.                     `;
  340.                                             $(div).insertBefore(".showMore");
  341.                                         }
  342.                                         value.childs.forEach(child => {
  343.                                             console.log("childs " + child)
  344.                                             var forumDate = child.date // Assurez-vous de remplacer cela par la valeur réelle en JavaScript
  345.                                             var date = new Date(forumDate);
  346.                                             var formattedDate = (date.getDate() < 10 ? '0' : '') + date.getDate() + '/' + (
  347.                                             (date.getMonth() + 1) < 10 ? '0' : ''
  348.                                         ) + (date.getMonth() + 1) + '/' + date.getFullYear();
  349.                                             if (appUser && child.userName == appUser && child.etat == false) {
  350.                                                 div = `       
  351.                   <div class="row justify-content-center pb-5" id="ReponseSujet">
  352.       <div class="row justify-content-center pb-5" style="">
  353.         <div class="accordion-content">
  354.                 <div class="accordion-content mx-5">
  355.                   <div class="accordion-item">
  356.                     <header class="item-header" id="Rps-child">
  357.                      <h4 id="item-quest-user" class="item-question">${
  358.                                                     child.userName
  359.                                                 } </h4>
  360.                      <h4  id="item-quest-date" class="item-question"> 
  361.                       {% if  app.request.locale == 'ar_TN' %}
  362.                     ${child.date.split('/').reverse().join('/')} 
  363.                     {% else %} 
  364.                     ${child.date} 
  365.                     {% endif %}
  366.                     </h4> 
  367.                       <form method="post" action="/update/forum/response/${
  368.                                                     child.id
  369.                                                 }" style="margin-right: 30px">
  370.                         <div class="input-group {{ app.request.locale == 'ar_TN' ? 'form_direction_rtl' : 'form_direction_ltr' }}">
  371.                           <textarea name="message" class="form-control col-md-4" aria-label="With textarea" required> ${
  372.                                                     child.reponse
  373.                                                 }</textarea>
  374.                         </div>
  375.                          <button type="submit" class="btn-slider-text modif"> <i id="update-commentaire" class="fa-solid fa-pen-to-square"></i>  </button>
  376.                          <i id="drop-commentaire"   onclick="supprimerReponse(${
  377.                                                     child.id
  378.                                                 })" class="fa-sharp fa-solid fa-trash"></i>
  379.                       </form>
  380.                     </header>
  381.                   </div>
  382.                 </div>
  383.                 </div>
  384.                 </div>
  385.                 `
  386.                                                 $(div).insertBefore(".showMore");
  387.                                             }
  388.                                         });
  389.                                         offset = offset + 1;
  390.                                     });
  391.                                 }
  392.                             });
  393.                         });
  394.                     </script>
  395.                 {% endblock %}