morgane/EverShelf
1
0
Fork 0
Code Issues Pull Requests Actions 4 Packages Projects Releases Wiki Activity

Actualiser test.html
CI / PHP Syntax Check (push) Has been cancelled
Details
CI / JavaScript Lint (push) Has been cancelled
Details
CI / Docker Build Test (push) Has been cancelled
Details
CI / Validate Translation Files (push) Has been cancelled
Details
CI / Auto-merge develop → main (push) Has been cancelled
Details
CI / Create GitHub Release (push) Has been cancelled
Details

Browse Source
This commit is contained in:
morgane
2026-06-17 19:35:18 +00:00
parent 11886578ab
commit 57ec6af58c
1 changed files with 41 additions and 48 deletions
Download Patch File Download Diff File Expand all files Collapse all files
test.html
+41 -48
View File
@@ -5,24 +5,23 @@
<style> <style>
body { font-family: sans-serif; background: #222; color: #eee; padding: 20px; } body { font-family: sans-serif; background: #222; color: #eee; padding: 20px; }
.card { background: #444; padding: 20px; border-radius: 8px; margin-bottom: 20px; } .card { background: #444; padding: 20px; border-radius: 8px; margin-bottom: 20px; }
input, select { padding: 8px; border-radius: 4px; border: 1px solid #666; margin-right: 5px; } table { width: 100%; border-collapse: collapse; background: #333; }
table { width: 100%; border-collapse: collapse; background: #333; margin-top: 20px; } th, td { border: 1px solid #555; padding: 8px; text-align: left; }
th, td { border: 1px solid #555; padding: 10px; text-align: left; } .selected { background: #1e3a8a; } /* Couleur pour les lignes sélectionnées */
th { background: #444; }
</style> </style>
</head> </head>
<body> <body>
<div class="card"> <div class="card">
<h3>Modification de produit</h3> <h3>Modification en masse</h3>
<select id="sel" onchange="fill()"><option value="">-- Choisir un produit --</option></select> <select id="cat-mass"><option value="">-- Choisir nouvelle catégorie --</option></select>
<input id="id" readonly placeholder="ID" style="width: 50px;"> <button onclick="applyToSelected()">APPLIQUER AUX COCHÉS</button>
<select id="cat-sel"><option value="">-- Catégorie --</option></select>
<button onclick="save()">ENREGISTRER</button>
</div> </div>
<table id="prod-table"> <table id="prod-table">
<thead><tr><th>Produit</th><th>Catégorie</th><th>Emplacement</th></tr></thead> <thead>
<tr><th><input type="checkbox" onclick="toggleAll(this)"></th><th>Produit</th><th>Catégorie</th><th>Emplacement</th></tr>
</thead>
<tbody></tbody> <tbody></tbody>
</table> </table>
@@ -30,7 +29,7 @@
let fullProductList = []; let fullProductList = [];
let categories = {}; let categories = {};
// 1. Initialisation : Chargement des catégories et des produits // Chargement initial
Promise.all([ Promise.all([
fetch('translations/fr.json').then(r => r.json()), fetch('translations/fr.json').then(r => r.json()),
fetch('api/index.php?action=products_list').then(r => r.json()) fetch('api/index.php?action=products_list').then(r => r.json())
@@ -38,59 +37,53 @@
categories = trans.categories || {}; categories = trans.categories || {};
fullProductList = prods.inventory || prods.products || prods; fullProductList = prods.inventory || prods.products || prods;
// Remplir le select de modif const catSel = document.getElementById('cat-mass');
const sel = document.getElementById('sel');
const catSel = document.getElementById('cat-sel');
Object.entries(categories).forEach(([key, val]) => { Object.entries(categories).forEach(([key, val]) => {
let opt = document.createElement('option'); let opt = document.createElement('option');
opt.value = key; opt.textContent = val; opt.value = key; opt.textContent = val;
catSel.appendChild(opt); catSel.appendChild(opt);
}); });
fullProductList.forEach((p, index) => {
let opt = document.createElement('option');
opt.value = index;
opt.textContent = p.name;
sel.appendChild(opt);
});
renderTable(); renderTable();
}); });
function renderTable() { function renderTable() {
const tbody = document.querySelector('#prod-table tbody'); const tbody = document.querySelector('#prod-table tbody');
tbody.innerHTML = ""; tbody.innerHTML = "";
fullProductList.forEach(p => { fullProductList.forEach((p, index) => {
let row = `<tr> let row = document.createElement('tr');
<td>${p.name}</td> row.innerHTML = `<td><input type="checkbox" class="prod-check" data-index="${index}"></td>
<td>${categories[p.category] || p.category}</td> <td>${p.name}</td>
<td>${p.location || 'N/A'}</td> <td>${categories[p.category] || p.category}</td>
</tr>`; <td>${p.location || 'N/A'}</td>`;
tbody.innerHTML += row; tbody.appendChild(row);
}); });
} }
function fill() { function toggleAll(source) {
let s = document.getElementById('sel'); document.querySelectorAll('.prod-check').forEach(c => c.checked = source.checked);
let p = fullProductList[s.value];
document.getElementById('id').value = p.id;
document.getElementById('cat-sel').value = p.category || "";
} }
function save() { async function applyToSelected() {
let s = document.getElementById('sel'); const newCat = document.getElementById('cat-mass').value;
let p = fullProductList[s.value]; if(!newCat) return alert("Sélectionne une catégorie !");
p.category = document.getElementById('cat-sel').value;
const checkedBoxes = document.querySelectorAll('.prod-check:checked');
fetch('api/index.php?action=product_save', {
method: 'POST', // On traite chaque produit coché
headers: { 'Content-Type': 'application/json' }, for (const checkbox of checkedBoxes) {
body: JSON.stringify(p) let p = fullProductList[checkbox.dataset.index];
}).then(() => { p.category = newCat;
renderTable(); // Rafraîchit le tableau immédiatement
alert("Modifié avec succès !"); // Envoi à l'API
}); await fetch('api/index.php?action=product_save', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify(p)
});
}
alert("Traitement terminé !");
renderTable();
} }
</script> </script>
</body> </body>