gilles/suivi_achat
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Ajout d'une 4ᵉ colonne avec un bouton radio pour inverser les montants et ajustements CSS

Browse Source
This commit is contained in:
gilles soulier
2024-12-14 13:55:58 +01:00
parent 81f7baf9de
commit 891fee7c11
2 changed files with 10 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
public/script.js
View File

@@ -50,16 +50,16 @@ document.addEventListener("DOMContentLoaded", () => {
const totalCell = document.createElement("td"); const totalCell = document.createElement("td");
totalCell.textContent = "0.00 €"; totalCell.textContent = "0.00 €";
// Bouton Option // Radio Option
const optionCell = document.createElement("td"); const optionCell = document.createElement("td");
const optionButton = document.createElement("button"); const radioInput = document.createElement("input");
optionButton.textContent = "Option"; radioInput.type = "radio";
optionButton.addEventListener("click", () => { radioInput.addEventListener("change", () => {
const montant = parseFloat(montantInput.value || "0"); const montant = parseFloat(montantInput.value || "0");
montantInput.value = montant > 0 ? -montant : Math.abs(montant); montantInput.value = radioInput.checked ? -Math.abs(montant) : Math.abs(montant);
updateRowTotal(); updateRowTotal();
}); });
optionCell.appendChild(optionButton); optionCell.appendChild(radioInput);
// Calculer le total de la ligne // Calculer le total de la ligne
const updateRowTotal = () => { const updateRowTotal = () => {

14
public/style.css
View File

@@ -42,7 +42,7 @@ body {
right: 15px; right: 15px;
z-index: 2000; z-index: 2000;
padding: 10px 22px; padding: 10px 22px;
background-color: #007bff; /* Bleu */ background-color: #007bff;
color: white; color: white;
border: none; border: none;
border-radius: 5px; border-radius: 5px;
@@ -89,20 +89,14 @@ body {
width: 25%; width: 25%;
} }
#articles-table td input { #articles-table td input,
#articles-table td select {
padding: 5px; padding: 5px;
width: 90%;
font-size: 16px; font-size: 16px;
} }
#articles-table td button { #articles-table td input[type="radio"] {
background-color: #ffc107;
border: none;
border-radius: 5px;
color: white;
cursor: pointer; cursor: pointer;
padding: 5px 10px;
font-size: 14px;
} }
#articles-table tbody tr:nth-child(even) { #articles-table tbody tr:nth-child(even) {