templates/pages/job/job_single.html.twig line 1

Open in your IDE?
  1. {% extends 'base.html.twig' %}
  3. {% block title %}Offre d'emploi : {{ data[0].specialite ?? 'Poste disponible' }}{% endblock %}
  5. {% block description %}
  6. Offre d'emploi pour {{ data[0].specialite ?? 'un poste' }} à {{ data[0].departement ?? 'un département' }}. 
  7. Postulez dès maintenant chez Réseau Médical Service.
  8. {% endblock %}
  10. {% block body %}
  11.     {% include ("pages/job/header.html.twig") %}
  13.     <script type="application/ld+json">
  14.     {
  15.       "@type" : "JobPosting",
  16.       "title" : "{{ data[0]["specialite"] }}",
  17.       
  18.       "description" : "{{ data[0]['infoPratique'] | escape  }} ",
  19.       
  20.       "datePosted" : "{{ data[0]["createAt"]['date'] | date('d-m-Y') }}",
  21.       "hiringOrganization" : {
  22.         "@type" : "Organization",
  23.         "name" : "Réseau Médical Service",
  24.         "sameAs" : "https://reseaumedical.fr/",
  25.         "logo" : "http://img.mailinblue.com/2078301/images/rnb/original/5c20a51c5fb5f9000e5a5a1d.jpg"
  26.       },
  27.       "jobLocation": {
  28.         "@type": "Place",
  29.         "address": {
  30.         "@type": "PostalAddress",
  31.         "streetAddress": "{{ data[0]["departement"] }}",
  32.         "addressRegion": "{{ data[0]["departement"] }}",
  33.         "postalCode": "{{ data[0]["numeroDepartement"] }}",
  34.         "addressCountry": "FR"
  35.         }
  36.       }
  37.     }
  38.     </script>
  39.     <section class="ftco-section ftco-degree-bg" style="color : black ">
  40.         <div class="container">
  41.             <div class="row">
  42.                 <div class="col-md-7 ftco-animate">
  43.                     <span class="subadge">Intérim</span>
  44.                     <h1>{{ data[0]["specialite"] }}</h1>
  45.                     <div class="tagcloud mb-3">
  46.                         <a href="#" class="tag-cloud-link">
  47.                             <span class="icon-my_location"></span>&ensp; {{ data[0]["departement"] }} {{ data[0]["numeroDepartement"] }}
  48.                         </a>
  49.                         <a href="#" class="tag-cloud-link">{{ data| length }} Date(s)</a>
  50.                         <a href="#" class="tag-cloud-link">
  51.                             <span class="icon-date_range"></span>
  52.                             Publié {{ data[0]["createAt"]['date'] | date('d-m-Y') }}
  53.                         </a>
  54.                     </div>{{ data[0]["infoPratique"] | escape  }}
  55.                 </div> <!-- .col-md-8 -->
  56.                 <div class="col-md-5 pl-md-5 sidebar ftco-animate">
  57.                     <div class="sidebar-box ftco-animate">
  58.                         <div class="categories" data-spy="scroll" data-offset="0">
  59.                             <h3 class="heading-3">Date à Pourvoir </h3>
  60.                             {% for period  in periods %}
  61.                                 {% if (period|length) == 1 %}
  62.                                     <li style="font-size: 14px"><a href="#">{{ period[0]["jour"] | date('d-m-Y') }}
  63.                                             <span>{{ period[0]["designation"] }}</span></a></li>
  64.                                 {% else %}
  65.                                     <li style="font-size: 14px"><a href="#">Du {{ period[0]["jour"] | date('d-m-Y') }}
  66.                                             au {{ period[(period|length)-1]["jour"] | date('d-m-Y') }}
  67.                                             <span>{{ period[0]["designation"] }}</span></a></li>
  68.                                 {% endif %}
  69.                             {% endfor %}
  70.                         </div>
  71.                     </div>
  72.                     <div class="row">
  73.                         <div class="col-6">
  74.                             <button class="btn btn-secondary" data-toggle="modal" data-target="#modalMaintenance"
  75.                                     style="font-size: 14px">Postuler avec Myrms
  76.                             </button>
  77.                         </div>
  78.                         <div class="col-6">
  79.                             <button class="btn btn-primary py-2" data-toggle="modal" data-target="#modalCandidatureCV"
  80.                                     style="font-size: 14px">Postuler avec votre Cv
  81.                             </button>
  82.                         </div>
  83.                     </div>
  87.                     <div class="sidebar-box ftco-animate">
  88.                         <h3 class="heading-3">Partager</h3>
  91.                         <ul class="ftco-footer-social list-unstyled float-md-left float-lft mt-3">
  92.                             <li class="ftco-animate"><a
  93.                                         href="https://twitter.com/intent/tweet?url={{ url('app_job_single', {'refererence':data[0]['reference'] }) }}&text=Regardez cette offre de Réseau Médical Services!"
  94.                                         target="_blank"><span class="icon-twitter"></span></a></li>
  95.                             <li class="ftco-animate"><a
  96.                                         href="https://www.linkedin.com/shareArticle?mini=true&url={{ url('app_job_single', {'refererence':data[0]['reference'] }) }}"
  97.                                         target="_blank"><span class="icon-linkedin"></span></a></li>
  98.                             <li class="ftco-animate"><a
  99.                                         href="https://www.facebook.com/sharer/sharer.php?u={{ url('app_job_single', {'refererence':data[0]['reference'] }) }}"
  100.                                         target="_blank"><span class="icon-facebook"></span></a></li>
  101.                         </ul>
  102.                     </div>
  103.                 </div>
  105.             </div>
  106.         </div>
  107.     </section> <!-- .section -->
  111.     <!-- Modal candidature cv -->
  112.     <div class="modal fade" id="modalCandidatureCV" tabindex="-1" role="dialog" aria-labelledby="modalCandidatureCV"
  113.          aria-hidden="true">
  114.         <div class="modal-dialog modal-dialog-centered" role="document">
  115.             <div class="modal-content">
  116.                 <div class="modal-header">
  117.                     <h5 class="modal-title" id="modalCandidatureCV">Postuler pour cette Offre</h5>
  118.                     <button type="button" class="close" data-dismiss="modal" aria-label="Close">
  119.                         <span aria-hidden="true">&times;</span>
  120.                     </button>
  121.                 </div>
  122.                 <div class="modal-body">
  123.                     <div class="container-fluid">
  124.                         {% include ('pages/candidature/candidature_cv.html.twig') %}
  125.                     </div>
  126.                 </div>
  128.                 <div class="modal-footer">
  129.                     {#          <button type="button" class="btn btn-secondary">Candidature avec Myrms</button>#}
  130.                     {#          <a href="{{ path('app_candidature_cv',{reference:data[0]['reference']}) }}" type="button" class="btn btn-primary">Candidature avec Cv</a>#}
  131.                 </div>
  132.             </div>
  133.         </div>
  134.     </div>
  136.         <div class="modal fade" id="modalMaintenance" tabindex="-1" role="dialog" aria-labelledby="modalMaintenance"
  137.          aria-hidden="true">
  138.         <div class="modal-dialog modal-dialog-centered" role="document">
  139.             <div class="modal-content">
  140.                 <div class="modal-header">
  141.                     <h5 class="modal-title" id="modalMaintenance">Postuler pour cette Offre</h5>
  142.                     <button type="button" class="close" data-dismiss="modal" aria-label="Close">
  143.                         <span aria-hidden="true">&times;</span>
  144.                     </button>
  145.                 </div>
  146.                 <div class="modal-body">
  147.                     <div class="container-fluid">
  148.                        <h2>Espace MyRMS en Maintenance</h2>
  149.                         <h5>Nous sommes désolés, veillez postuler directement avec votre CV.</h5>
  150.                     </div>
  151.                 </div>
  153.                 <div class="modal-footer">
  154.                     {#          <button type="button" class="btn btn-secondary">Candidature avec Myrms</button>#}
  155.                     {#          <a href="{{ path('app_candidature_cv',{reference:data[0]['reference']}) }}" type="button" class="btn btn-primary">Candidature avec Cv</a>#}
  156.                 </div>
  157.             </div>
  158.         </div>
  159.     </div>
  161.     <!-- Modal candidature MyRMS -->
  162.      <div class="modal fade" id="modalCandidatureMyRMS" tabindex="-1" role="dialog"
  163.          aria-labelledby="modalCandidatureMyRMS" aria-hidden="true">
  164.         <div class="modal-dialog modal-dialog-centered modal-lg" role="document">
  165.             <div class="modal-content">
  166.                 <div class="modal-header">
  167.                     <h5 class="modal-title" id="modalCandidatureMyRMS">Postuler pour cette Offre</h5>
  168.                     <button type="button" class="close" data-dismiss="modal" aria-label="Close">
  169.                         <span aria-hidden="true">&times;</span>
  170.                     </button>
  171.                 </div>
  172.                 <div class="modal-body">
  173.                     <div class="container-fluid">
  174.                     <div id = "candidatureMyRMS">
  176.                         <h2>Espace MyRMS en Maintenance</h2>
  177.                         <h5>Nous sommes désolés, veillez postuler directement avec votre CV.</h5>
  179.                 {#<div id="checkbox-container"></div>
  181.                 <div class="pagination">
  183.                 <button id="prev-btn" disabled>Précédent</button>
  185.                 <span id="page-counter">Page 1</span>
  187.                 <button id="next-btn">Suivant</button>
  189.                 </div>
  191.                 <div id="data-container" data-data="{{ data|json_encode }}"></div>
  193.                 <script>
  194.                      var dataFromServer = JSON.parse(document.getElementById("data-container").getAttribute("data-data"));
  195.                     var taille_data = dataFromServer.length;
  196.                     var n_page =  Math.floor(taille_data / 12) + 1;
  199.                     const checkboxContainer = document.getElementById("checkbox-container");
  201.                     const prevButton = document.getElementById("prev-btn");
  203.                     const nextButton = document.getElementById("next-btn");
  205.                     const pageCounter = document.getElementById("page-counter");
  207.  
  209.                     const totalPages = n_page ; // le nombre total de pages
  211.                     let currentPage = 1;
  212.                     function formatDateFromString(dateString) {
  213.                         const parts = dateString.split(' ');
  214.                         const datePart = parts[0];
  215.                         const timePart = parts[1];
  216.   
  217.                         const dateComponents = datePart.split('-');
  218.                         const year = parseInt(dateComponents[0]);
  219.                         const month = parseInt(dateComponents[1]) - 1; 
  220.                         const day = parseInt(dateComponents[2]);
  222.                         const timeComponents = timePart.split(':');
  223.                         const hour = parseInt(timeComponents[0]);
  224.                         const minute = parseInt(timeComponents[1]);
  225.                         const second = parseInt(timeComponents[2]);
  226.   
  227.                         return new Date(year, month, day, hour, minute, second);
  228.                     }
  231.                     function formatDate(date) {
  232.                         const day = String(date.getDate()).padStart(2, '0');
  233.                         const month = String(date.getMonth() + 1).padStart(2, '0');
  234.                         const year = date.getFullYear();
  235.   
  236.                         return `${day}-${month}-${year}`;
  237.                     }
  238.  
  240.                     function updatePaginationButtons() {
  242.                         prevButton.disabled = currentPage === 1;
  244.                         nextButton.disabled = currentPage === totalPages;
  246.                         pageCounter.textContent = `Page ${currentPage}`;
  248.                     }
  250.  
  252.                     function createCheckboxes(page) {
  253.                         checkboxContainer.innerHTML = "";
  255.                     
  256.                         const startIndex = (page - 1) * 12;
  257.                         const endIndex = Math.min(taille_data, startIndex + 12, totalPages * 12);
  259.             
  260.                         const table = document.createElement("table");
  261.                         table.classList.add("table-paginated");
  262.                         
  263.                         const row1 = document.createElement("tr");
  264.                         const titre1 = document.createElement("th");
  265.                         const titre2 = document.createElement("th");
  266.                         const titre3 = document.createElement("th");
  267.                         const titre4 = document.createElement("th");
  268.                         const titre5 = document.createElement("th");
  269.                         const titre6 = document.createElement("th");
  270.             
  272.                         titre1.textContent = `#`;
  273.                         titre2.textContent = ` `;
  274.                         titre3.textContent = `Date`;
  275.                         titre4.textContent = `Libelle`;
  276.                         titre5.textContent = `Debut`;
  277.                         titre6.textContent = `Fin`;
  279.                         row1.appendChild(titre1);
  280.                         row1.appendChild(titre2);
  281.                         row1.appendChild(titre3);
  282.                         row1.appendChild(titre4);
  283.                         row1.appendChild(titre5);
  284.                         row1.appendChild(titre6);
  285.                         table.appendChild(row1);
  287.                         for (let i = startIndex; i < endIndex; i++) {
  288.                 
  289.                             const row = document.createElement("tr");
  291.                             const content1Cell = document.createElement("td");
  292.                             content1Cell.textContent = i+1;
  294.                 
  295.                             const checkboxCell = document.createElement("td");
  296.                             const checkbox = document.createElement("input");
  297.                             checkbox.type = "checkbox";
  298.                             checkboxCell.appendChild(checkbox);
  300.                             const content2Cell = document.createElement("td");
  301.                             const inputDate = formatDateFromString(dataFromServer[i]["date"]["date"]);
  302.                             const formattedDate = formatDate(inputDate);
  303.                             content2Cell.textContent = formattedDate;
  305.                             const content3Cell = document.createElement("td");
  306.                             content3Cell.textContent = dataFromServer[i]["designation"];
  308.                             const content4Cell = document.createElement("td");
  309.                             content4Cell.textContent = `...`;
  311.                             const content5Cell = document.createElement("td");
  312.                             content5Cell.textContent = `...`;
  313.                 
  315.                 
  316.                             row.appendChild(content1Cell);
  317.                             row.appendChild(checkboxCell);
  318.                             row.appendChild(content2Cell);
  319.                             row.appendChild(content3Cell);
  320.                             row.appendChild(content4Cell);
  321.                             row.appendChild(content5Cell);
  322.             
  323.                             table.appendChild(row);
  324.                         }
  326.         
  327.                     checkboxContainer.appendChild(table);
  329.                     updatePaginationButtons();
  330.                 }
  333.                 prevButton.addEventListener("click", () => {
  335.                         if (currentPage > 1) {
  337.                             currentPage--;
  339.                             createCheckboxes(currentPage);
  341.                         }
  343.                 });
  345.  
  347.                 nextButton.addEventListener("click", () => {
  349.                     if (currentPage < totalPages) {
  351.                         currentPage++;
  353.                         createCheckboxes(currentPage);
  355.                     }
  357.                 });
  359.  
  361.                 // Initialiser la pagination avec la première page
  363.                 createCheckboxes(currentPage);
  366.                 </script>
  367.                         <br>
  368.                         <div class="form-check  mb-4">
  369.                         <input class="form-check-input"  v-model="cgu" required type="checkbox" value="" id="flexCheckDefault" />
  370.                         <label class="form-check-label" for="flexCheckDefault">J'ai lu et j'accepte les Conditions Générales d'Utilisation, notamment la mention relative à la protection des données personnelles.<a href="{{ url('app_r_g_p_d') }}">(CGU)</a></label>
  371.                         </div>
  373.                             <!-- Submit button -->
  374.                             <button type="submit"  class="btn btn-primary btn-block mb-3">Soumettre</button>
  375.                         </form>
  377.                     </div>
  378.                 </div>
  379.                 </div>
  381.                 <div class="modal-footer">#}
  382.                     {#          <button type="button" class="btn btn-secondary">Candidature avec Myrms</button>#}
  383.                     {#          <a href="{{ path('app_candidature_cv',{reference:data[0]['reference']}) }}" type="button" class="btn btn-primary">Candidature avec Cv</a>#}
  384.                 {#</div>#}
  385.             </div>
  386.         </div>
  387.     </div> 
  389.     
  390.     
  393. {% endblock %}