69 lines
1.9 KiB
HTML
69 lines
1.9 KiB
HTML
<!doctype html>
|
|
<title>Calcul du prix à payer</title>
|
|
|
|
<input type="number" min="2008" max="2021" id="yearOfBirthday" name="year-of-birthday"/>
|
|
|
|
<button id="add">
|
|
Ajouter aux licences à calculer
|
|
</button>
|
|
|
|
<ul id="licences">
|
|
</ul>
|
|
|
|
<button id="calcul">
|
|
Caclul le montant à payer
|
|
</button>
|
|
|
|
<p>Montant total à régler : <span id="licencesPrice"> </span> € </p>
|
|
|
|
<script>
|
|
|
|
const grilleTarifs = {
|
|
senior: 185, u18: 145, u15: 115, u13: 115, u11: 95, u9: 90, babyhand: 85, loisir: 85
|
|
}
|
|
const categoriesMapping = {
|
|
senior: [2008],
|
|
u18: [2011, 2010, 2009],
|
|
u15: [2013, 2012],
|
|
u13: [2015, 2014],
|
|
u11: [2017, 2016],
|
|
u9: [2018, 2020],
|
|
babyhand: [2021],
|
|
loisir: [],
|
|
}
|
|
window.onload = (event) => {
|
|
|
|
add.addEventListener('click', (event) => {
|
|
if(!yearOfBirthday.value) {
|
|
return
|
|
}
|
|
console.log(yearOfBirthday.value)
|
|
const liNode = document.createElement("li")
|
|
liNode.year = yearOfBirthday.value
|
|
const textNode = document.createTextNode(`1 licence pour une personne née en ${yearOfBirthday.value}`)
|
|
liNode.appendChild(textNode)
|
|
licences.appendChild(liNode)
|
|
})
|
|
|
|
calcul.addEventListener('click', (event) => {
|
|
let prices = []
|
|
let basePrice = 0
|
|
for(licence of licences.children) {
|
|
Object.values(categoriesMapping).forEach((years, index) => {
|
|
if(years.includes(parseInt(licence.year))) {
|
|
const categorie = Object.keys(categoriesMapping)[index]
|
|
prices.push(parseInt(grilleTarifs[categorie], 10))
|
|
}
|
|
})
|
|
}
|
|
const sortedPrices = prices.sort((a, b) => a < b ? 1 : -1).reverse()
|
|
basePrice += sortedPrices.pop()
|
|
console.log(sortedPrices)
|
|
const sortedPricesWithReduce = sortedPrices.map((e) => e - (e * 0.05))
|
|
console.log(sortedPricesWithReduce)
|
|
const s = sortedPricesWithReduce.reduce((accumulator, value) => accumulator + value, basePrice)
|
|
licencesPrice.innerHTML = s
|
|
})
|
|
};
|
|
</script>
|