{# Formulaire ajout ou modification de justificatif Si justif, edit #} {% extends "sco_page.j2" %} {% import 'wtf.j2' as wtf %} {% block styles %} {{super()}} <link rel="stylesheet" href="{{scu.STATIC_DIR}}/css/assiduites.css"> {% endblock %} {% block app_content %} <style> form#ajout-justificatif-etud { margin-bottom: 24px; } form#ajout-justificatif-etud > div { margin-bottom: 16px; } fieldset > div { margin-bottom: 12px; } div.fichiers { margin-top: 16px; margin-bottom: 32px; } div.fichiers ul { list-style-type: none; } span.suppr_fichier_just { margin-right: 8px; } div.submit { margin-top: 12px; } div.submit > input { margin-right: 16px; } .info-saisie { margin-top: 12px; margin-bottom: 12px; font-style: italic; } </style> <div class="tab-content"> <h2>{{title|safe}}</h2> {% if justif %} <div class="info-saisie"> Saisie par {{justif.user.get_prenomnom() if justif.user else "inconnu"}} le {{justif.entry_date.strftime("%d/%m/%Y à %H:%M") if justif.entry_date else "?"}} </div> {% endif %} <section class="justi-form page"> {% for err_msg in form.error_messages %} <div class="wtf-error-messages"> {{ err_msg }} </div> {% endfor %} <form id="ajout-justificatif-etud" method="post" enctype="multipart/form-data"> <fieldset> {{ form.hidden_tag() }} {# Dates et heures #} <div class="dates-heures"> {{ form.date_debut.label }} : {{ form.date_debut }} de {{ form.heure_debut }} à {{ form.heure_fin }} <span class="help">laisser les heures vides pour indiquer la journée entière</span> {{ render_field_errors(form, 'date_debut') }} {{ render_field_errors(form, 'heure_debut') }} {{ render_field_errors(form, 'heure_fin') }} <div> {{ form.date_fin.label }} : {{ form.date_fin }} <span class="help">si le jour de fin est différent, les heures seront ignorées (journées complètes)</span> {{ render_field_errors(form, 'date_fin') }} </div> </div> {# Etat #} <div> <div>{{ form.etat.label }}</div> {{ form.etat() }} {{ render_field_errors(form, 'etat') }} </div> {# Raison #} <div> {% if (not justif) or can_view_justif_detail %} <div>{{ form.raison.label }}</div> {{ form.raison() }} {{ render_field_errors(form, 'raison') }} <div class="help">La raison sera visible aux utilisateurs ayant le droit <tt>AbsJustifView</tt> et à celui ayant déposé le justificatif {%- if justif and justif.user %} (<b>{{justif.user.get_prenomnom()}}</b>){%- endif -%}. </div> {% else %} <div class="unauthorized">raison confidentielle</div> {% endif %} </div> <div class="fichiers"> {# Liste des fichiers existants #} {% if justif and nb_files > 0 %} <div><b>{{nb_files}} fichiers justificatifs déposés {% if filenames|length < nb_files %} , dont {{filenames|length}} vous {{'sont accessibles' if filenames|length > 1 else 'est accessible'}} {% endif %} </b> </div> <ul> {% for filename in filenames %} <li><span data-justif_id="{{justif.id}}" class="suppr_fichier_just" >{{scu.icontag("delete_img", alt="supprimer", title="Supprimer")|safe}}</span> {{filename}}</li> {% endfor %} </ul> {% endif %} {# Ajout fichier(s) justificatif(s) #} <div> <div>{{ form.fichiers.label }}</div> {{ form.fichiers() }} {{ render_field_errors(form, 'fichiers') }} </div> </div> {# Date dépôt #} {{ form.entry_date.label }} : {{ form.entry_date }} à {{ form.entry_time }} <span class="help" style="margin-left: 12px;">laisser vide pour date courante</span> {{ render_field_errors(form, 'entry_date') }} {# Submit #} <div class="submit"> {{ form.submit }} {{ form.cancel }} </div> </fieldset> </form> </section> {% if tableau %} <section class="assi-liste"> {{tableau | safe }} </section> {% endif %} </div> {% include "assiduites/explication_etats_justifs.j2" %} {% endblock app_content %} {% block scripts %} {{ super() }} <script src="{{scu.STATIC_DIR}}/js/assiduites.js"></script> <script src="{{scu.STATIC_DIR}}/js/etud_info.js"></script> {% include "sco_timepicker.j2" %} <script> document.addEventListener("DOMContentLoaded", function() { // Suppression d'un fichier justificatif function delete_file(justif_id, fileName, liElement) { // Construct the URL var url = "{{url_for('apiweb.justif_remove', justif_id=-1, scodoc_dept=g.scodoc_dept)}}".replace('-1', justif_id); payload = { "remove": "list", "filenames" : [ fileName ], } // Send API request fetch(url, { method: 'POST', headers: { 'Accept': 'application/json', 'Content-Type': 'application/json' }, body: JSON.stringify(payload) }) .then(response => { if (response.ok) { // Hide the <li> element on successful deletion liElement.style.display = 'none'; sco_message("fichier supprimé"); } else { // Handle non-successful responses here console.error('Deletion failed:', response.statusText); sco_error_message("erreur lors de la suppression du fichier"); } }) .catch(error => { console.error('Error:', error); sco_error_message("erreur lors de la suppression du fichier (2)"); }); } // Add event listeners to all elements with class 'suppr_fichier_just' var deleteButtons = document.querySelectorAll('.suppr_fichier_just'); deleteButtons.forEach(function(button) { button.addEventListener('click', function() { // Get the text content of the next sibling node var justif_id = this.dataset.justif_id; var fileName = this.nextSibling.nodeValue.trim(); var liElement = this.parentNode; // Get the parent <li> element delete_file(justif_id, fileName, liElement); }); }); }); </script> {% endblock scripts %}