ucef/as-talange
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: recalculate license and remaining prices dynamically on residency checkbox change

Browse Source
This commit is contained in:
Youssef
2026-05-20 19:12:56 +02:00
parent 1f803a6ecc
commit cac229486a
1 changed files with 64 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files
as-talange-web/src/main/resources/templates/adherents/form.html
+64 -5
View File
@@ -186,11 +186,15 @@
<td colspan="7" class="py-4 px-4 text-center text-gray-500">Aucune licence enregistrée.</td>
</tr>
<th:block th:each="lic : ${licences}">
<tr class="hover:bg-gray-50 border-b border-gray-100">
<tr class="hover:bg-gray-50 border-b border-gray-100 licence-row"
th:data-tarif-base="${lic.categorie.tarifBase}"
th:data-tarif-exterieur="${lic.categorie.tarifExterieur}"
th:data-equipements-contrib="${lic.getPrixTotal().subtract(adherent.residentTalange ? lic.categorie.tarifBase : lic.categorie.tarifExterieur)}"
th:data-total-paye="${lic.getPrixTotal().subtract(lic.getResteAPayer())}">
<td class="py-4 px-4 font-medium text-gray-900" th:text="${lic.saison}">2024-2025</td>
<td class="py-4 px-4 text-gray-600">
<span th:text="${lic.categorie.nom}">U15</span>
<span class="text-[10px] text-gray-400 block" th:text="${(lic.adherent != null && lic.adherent.residentTalange ? lic.categorie.tarifBase : lic.categorie.tarifExterieur) + ' € (Catégorie)'}">100.00 € (Catégorie)</span>
<span class="text-[10px] text-gray-400 block cell-tarif-categorie" th:text="${(lic.adherent != null && lic.adherent.residentTalange ? lic.categorie.tarifBase : lic.categorie.tarifExterieur) + ' € (Catégorie)'}">100.00 € (Catégorie)</span>
</td>
<td class="py-4 px-4 text-gray-600 font-mono text-xs" th:text="${lic.numeroLicence != null and !lic.numeroLicence.isEmpty() ? lic.numeroLicence : '-'}">-</td>
<td class="py-4 px-4">
@@ -198,13 +202,13 @@
th:classappend="${lic.etat == 'Validée' ? 'bg-blue-100 text-blue-800' : (lic.etat == 'Payée' ? 'bg-green-100 text-green-800' : 'bg-yellow-100 text-yellow-800')}"
th:text="${lic.etat}">Brouillon</span>
</td>
<td class="py-4 px-4 text-gray-900 font-medium" th:text="${lic.getPrixTotal() + ' €'}">130.00 €</td>
<td class="py-4 px-4 font-semibold"
<td class="py-4 px-4 text-gray-900 font-medium cell-tarif-global" th:text="${lic.getPrixTotal() + ' €'}">130.00 €</td>
<td class="py-4 px-4 font-semibold cell-reste-payer"
th:classappend="${lic.getResteAPayer() == 0 ? 'text-green-600' : 'text-red-600'}"
th:text="${lic.getResteAPayer() + ' €'}">30.00 €</td>
<td class="py-4 px-4 text-right">
<button th:if="${lic.getResteAPayer() > 0}" th:onclick="'openPaiementModal(' + ${lic.id} + ', ' + ${lic.getResteAPayer()} + ')'"
class="text-green-600 hover:text-green-800 font-medium bg-green-50 px-3 py-1 rounded-lg">Payer</button>
th:data-licence-id="${lic.id}" class="text-green-600 hover:text-green-800 font-medium bg-green-50 px-3 py-1 rounded-lg btn-payer">Payer</button>
</td>
</tr>
<tr th:if="${!#lists.isEmpty(lic.paiements)}" class="bg-gray-50/50">
@@ -428,6 +432,61 @@
if (hasRepError || document.getElementById('representantLegal').classList.contains('border-red-500')) {
repBlock.classList.remove('hidden-block');
}
// Recalculate price dynamically when residentTalange checkbox changes
const residentCheckbox = document.getElementById('residentTalange');
if (residentCheckbox) {
residentCheckbox.addEventListener('change', function() {
const isResident = this.checked;
document.querySelectorAll('.licence-row').forEach(row => {
const tarifBase = parseFloat(row.getAttribute('data-tarif-base') || '0');
const tarifExterieur = parseFloat(row.getAttribute('data-tarif-exterieur') || '0');
const equipContrib = parseFloat(row.getAttribute('data-equipements-contrib') || '0');
const totalPaye = parseFloat(row.getAttribute('data-total-paye') || '0');
const baseTarif = isResident ? tarifBase : tarifExterieur;
const newTotal = baseTarif + equipContrib;
const newReste = Math.max(0, newTotal - totalPaye);
// Update Category price cell
const catCell = row.querySelector('.cell-tarif-categorie');
if (catCell) {
catCell.textContent = baseTarif.toFixed(2) + ' € (Catégorie)';
}
// Update Tarif Global cell
const globalCell = row.querySelector('.cell-tarif-global');
if (globalCell) {
globalCell.textContent = newTotal.toFixed(2) + ' €';
}
// Update Reste à Payer cell
const resteCell = row.querySelector('.cell-reste-payer');
if (resteCell) {
resteCell.textContent = newReste.toFixed(2) + ' €';
if (newReste === 0) {
resteCell.classList.remove('text-red-600');
resteCell.classList.add('text-green-600');
} else {
resteCell.classList.remove('text-green-600');
resteCell.classList.add('text-red-600');
}
}
// Update Payer button
const payerBtn = row.querySelector('.btn-payer');
if (payerBtn) {
if (newReste > 0) {
payerBtn.classList.remove('hidden');
const licId = payerBtn.getAttribute('data-licence-id');
payerBtn.setAttribute('onclick', `openPaiementModal(${licId}, ${newReste})`);
} else {
payerBtn.classList.add('hidden');
}
}
});
});
}
});
</script>
</body>