Files
EverShelf/test.html
T
morgane 56a10bd1c4
CI / PHP Syntax Check (push) Has been cancelled
CI / JavaScript Lint (push) Has been cancelled
CI / Docker Build Test (push) Has been cancelled
CI / Validate Translation Files (push) Has been cancelled
CI / Auto-merge develop → main (push) Has been cancelled
CI / Create GitHub Release (push) Has been cancelled
Actualiser test.html
2026-06-17 19:40:02 +00:00

104 lines
4.2 KiB
HTML

<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<title>EverShelf - Réconciliation</title>
<style>
body { font-family: sans-serif; background: #222; color: #eee; padding: 20px; }
.card { background: #444; padding: 20px; border-radius: 8px; margin-bottom: 20px; }
select { padding: 8px; border-radius: 4px; border: 1px solid #666; margin-right: 10px; }
button { padding: 8px 15px; background: #1976d2; color: white; border: none; border-radius: 5px; cursor: pointer; }
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; }
</style>
</head>
<body>
<div class="card">
<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><input type="checkbox" onclick="toggleAll(this)"></th>
<th>Produit</th>
<th>Catégorie</th>
<th>Emplacement</th>
</tr>
</thead>
<tbody></tbody>
</table>
<script>
let fullProductList = [];
let categories = {};
// 1. Initialisation : Chargement des données
Promise.all([
fetch('translations/fr.json').then(r => r.json()),
fetch('api/index.php?action=products_list').then(r => r.json())
]).then(([trans, prods]) => {
categories = trans.categories || {};
fullProductList = prods.inventory || prods.products || prods;
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);
});
renderTable();
});
// 2. Affichage du tableau
function renderTable() {
const tbody = document.querySelector('#prod-table tbody');
tbody.innerHTML = "";
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 || 'Inconnu'}</td>
<td>${categories[p.category] || p.category || 'Non classé'}</td>
<td>${p.location || 'N/A'}</td>`;
tbody.appendChild(row);
});
}
function toggleAll(source) {
document.querySelectorAll('.prod-check').forEach(c => c.checked = source.checked);
}
// 3. Sauvegarde en masse
async function applyToSelected() {
const newCat = document.getElementById('cat-mass').value;
if(!newCat) return alert("Sélectionne une catégorie d'abord !");
const checkedBoxes = document.querySelectorAll('.prod-check:checked');
if(checkedBoxes.length === 0) return alert("Coche des produits !");
for (const checkbox of checkedBoxes) {
let p = fullProductList[checkbox.dataset.index];
p.category = newCat;
console.log("Envoi au serveur :", JSON.stringify(p)); // <--- Affiche ce qui est envoyé
let response = await fetch('api/index.php?action=product_save', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify(p)
});
let result = await response.json();
console.log("Résultat serveur :", result); // <--- Affiche ce que le serveur répond
}
alert("Traitement terminé. Regarde la console (F12) pour voir si le serveur a validé.");
renderTable(); // Recharge l'affichage
}
</script>
</body>
</html>