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