scayac
/
CrossApp
1
0
Fork 0
Code Issues 1 Pull Requests Projects Releases Wiki Activity
Browse Source

Bug scan course non commencée 

Amelioration génération des dossards (gestion des sélections)
master
scayac 2 months ago
parent
ac46736973
commit
be0431acf0
4 changed files with 100 additions and 38 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 83
      main/templates/dossards.html
  2. 2
      main/templates/scan.html
  3. 4
      static/datatables/dataTables.select.min.js
  4. 1
      static/datatables/select.dataTables.min.css

83
main/templates/dossards.html
Unescape View File

@ -22,6 +22,7 @@
<table id="coureursTable" class="table table-bordered table-striped"> <table id="coureursTable" class="table table-bordered table-striped">
<thead> <thead>
<tr> <tr>
<th class="select-checkbox"></th>
<th>Nom</th> <th>Nom</th>
<th>Prénom</th> <th>Prénom</th>
<th>Classe</th> <th>Classe</th>
@ -30,6 +31,7 @@
<tbody> <tbody>
{% for c in coureurs %} {% for c in coureurs %}
<tr data-id="{{ c.id }}"> <tr data-id="{{ c.id }}">
<td class="select-checkbox"></td>
<td>{{ c.nom }}</td> <td>{{ c.nom }}</td>
<td>{{ c.prenom }}</td> <td>{{ c.prenom }}</td>
<td>{{ c.classe }}</td> <td>{{ c.classe }}</td>
@ -90,38 +92,92 @@
</div> </div>
</div> </div>
</div> </div>
<style>
.dt-select-info span:contains('colonne'),
.dt-select-info span:contains('cellule') {
display: none !important;
}
table.dataTable tbody td.select-checkbox {
cursor: pointer;
position: relative;
}
table.dataTable tr.selected td.select-checkbox:after {
content: '\2714';
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
color: #007bff;
font-size: 1.2em;
}
</style>
<link rel="stylesheet" href="{% static 'datatables/select.dataTables.min.css' %}" />
{% block extra_js %} {% block extra_js %}
<script src="{% static 'jquery/jquery-3.6.0.min.js' %}"></script> <script src="{% static 'jquery/jquery-3.6.0.min.js' %}"></script>
<script src="{% static 'bootstrap/bootstrap.bundle.min.js' %}"></script> <script src="{% static 'bootstrap/bootstrap.bundle.min.js' %}"></script>
<script src="{% static 'jquery/jquery.dataTables.min.js' %}"></script> <script src="{% static 'jquery/jquery.dataTables.min.js' %}"></script>
<script src="{% static 'bootstrap/dataTables.bootstrap4.min.js' %}"></script> <script src="{% static 'bootstrap/dataTables.bootstrap4.min.js' %}"></script>
<script src="{% static 'datatables/dataTables.select.min.js' %}"></script>
<script src="{% static 'jquery/datatables.fr.js' %}"></script> <script src="{% static 'jquery/datatables.fr.js' %}"></script>
<script> <script>
$(document).ready(function() { $(function() {
// Empêche la double initialisation de DataTables
var table;
if (!$.fn.DataTable.isDataTable('#coureursTable')) { if (!$.fn.DataTable.isDataTable('#coureursTable')) {
table = $('#coureursTable').DataTable({ var table = $('#coureursTable').DataTable({
pageLength: 50, pageLength: 50,
initComplete: function (settings, json) {
table.rows().select();
},
select: {
style: 'multi',
selector: 'td.select-checkbox'
},
info: false,
order: [[1, 'asc']],
columnDefs: [
{ orderable: false, className: 'select-checkbox', targets: 0 }
],
language: {
url: "https://cdn.datatables.net/plug-ins/1.13.7/i18n/fr-FR.json"
}
}); });
// Sélection/désélection totale via l'entête (exemple officiel)
$('#coureursTable thead').on('click', 'th.select-checkbox', function() {
if (table.rows({selected: true, search:'applied'}).count() === table.rows({search:'applied'}).count()) {
table.rows({search:'applied'}).deselect();
} else { } else {
table = $('#coureursTable').DataTable(); table.rows({search:'applied'}).select();
} }
});
// Sélection individuelle par clic sur la case (exemple officiel)
$('#coureursTable tbody').on('click', 'td.select-checkbox', function(e) {
e.stopPropagation();
var row = table.row($(this).closest('tr'));
if (row.selected()) {
row.deselect();
} else {
row.select();
}
});
// Affichage du compteur
function updateMainDossardsCount() { function updateMainDossardsCount() {
var count = table.rows({search:'applied'}).count(); var count = table.rows({selected: true, search: 'applied'}).count();
$('#mainDossardsCountText').text('Générer ' + count + ' dossards'); $('#mainDossardsCountText').text('Générer ' + count + ' dossards');
} }
table.on('select deselect draw', updateMainDossardsCount);
updateMainDossardsCount(); updateMainDossardsCount();
table.on('draw', updateMainDossardsCount);
$('#filterClasse').on('change', updateMainDossardsCount); // Filtre classe (colonne 3)
$('#filterClasse').on('change', function() { $('#filterClasse').on('change', function() {
var val = $(this).val(); var val = $(this).val();
if(val) { if(val) {
table.column(2).search('^'+val+'$', true, false).draw(); table.column(3).search('^'+val+'$', true, false).draw();
} else { } else {
table.column(2).search('').draw(); table.column(3).search('').draw();
} }
table.rows({search:'applied'}).select();
}); });
// Ouvre le modal au clic sur le bouton // Ouvre le modal au clic sur le bouton
@ -130,19 +186,18 @@ $(document).ready(function() {
$('#dossardsModal').modal('show'); $('#dossardsModal').modal('show');
}); });
// Prépare la soumission du formulaire pour n'envoyer que les IDs filtrés // Prépare la soumission du formulaire pour n'envoyer que les IDs sélectionnés
$('#dossardsForm').on('submit', function(e) { $('#dossardsForm').on('submit', function(e) {
var ids = []; var ids = [];
table.rows({search:'applied'}).every(function(){ table.rows({selected: true, search: 'applied'}).every(function(){
var row = this.node(); var row = this.node();
var id = $(row).data('id'); var id = $(row).data('id');
if (id) ids.push(id); if (id) ids.push(id);
}); });
$('#coureurIdsInput').val(ids.join(',')); $('#coureurIdsInput').val(ids.join(','));
// Ferme le modal juste après la soumission
$('#dossardsModal').modal('hide'); $('#dossardsModal').modal('hide');
// continue submit
}); });
}
}); });
</script> </script>
{% endblock %} {% endblock %}

2
main/templates/scan.html
Unescape View File

@ -11,6 +11,8 @@
<div class="card-body"> <div class="card-body">
{% if course and course.fin %} {% if course and course.fin %}
<div class="alert alert-danger text-center mb-0">Cette course est terminée. Le scan n'est plus possible.</div> <div class="alert alert-danger text-center mb-0">Cette course est terminée. Le scan n'est plus possible.</div>
{% elif course and not course.debut %}
<div class="alert alert-warning text-center mb-0">Cette course n'a pas encore démarré. Le scan n'est pas possible.</div>
{% else %} {% else %}
<div id="reader" style="width:100%; max-width:400px; margin:auto;"></div> <div id="reader" style="width:100%; max-width:400px; margin:auto;"></div>
<div class="mt-4 position-relative" style="max-width:400px; margin:auto;"> <div class="mt-4 position-relative" style="max-width:400px; margin:auto;">

4
static/datatables/dataTables.select.min.js vendored
View File

File diff suppressed because one or more lines are too long

1
static/datatables/select.dataTables.min.css vendored
Unescape View File

@ -0,0 +1 @@
table.dataTable>tbody>tr>.selected{background-color:rgba(13, 110, 253, 0.9);color:white}table.dataTable>tbody>tr>td.select-checkbox,table.dataTable>tbody>tr>th.select-checkbox{position:relative}table.dataTable>tbody>tr>td.select-checkbox:before,table.dataTable>tbody>tr>td.select-checkbox:after,table.dataTable>tbody>tr>th.select-checkbox:before,table.dataTable>tbody>tr>th.select-checkbox:after{display:block;position:absolute;top:50%;left:50%;width:12px;height:12px;box-sizing:border-box}table.dataTable>tbody>tr>td.select-checkbox:before,table.dataTable>tbody>tr>th.select-checkbox:before{content:" ";margin-top:-6px;margin-left:-6px;border:1px solid black;border-radius:3px}table.dataTable>tbody>tr.selected>td.select-checkbox:before,table.dataTable>tbody>tr.selected>th.select-checkbox:before{border:1px solid white}table.dataTable>tbody>tr.selected>td.select-checkbox:after,table.dataTable>tbody>tr.selected>th.select-checkbox:after{content:"✓";font-size:20px;margin-top:-12px;margin-left:-6px;text-align:center}table.dataTable.compact>tbody>tr>td.select-checkbox:before,table.dataTable.compact>tbody>tr>th.select-checkbox:before{margin-top:-12px}table.dataTable.compact>tbody>tr.selected>td.select-checkbox:after,table.dataTable.compact>tbody>tr.selected>th.select-checkbox:after{margin-top:-16px}div.dataTables_wrapper span.select-info,div.dataTables_wrapper span.select-item{margin-left:.5em}html.dark table.dataTable>tbody>tr>td.select-checkbox:before,html.dark table.dataTable>tbody>tr>th.select-checkbox:before,html[data-bs-theme=dark] table.dataTable>tbody>tr>td.select-checkbox:before,html[data-bs-theme=dark] table.dataTable>tbody>tr>th.select-checkbox:before{border:1px solid rgba(255, 255, 255, 0.6)}@media screen and (max-width: 640px){div.dataTables_wrapper span.select-info,div.dataTables_wrapper span.select-item{margin-left:0;display:block}}
Write Preview
Loading…
Cancel
Save