Ajouter test2.html

2026-06-17 17:11:20 +00:00
parent 6c63bb17a3
commit 4bedfdd0f4
1 changed files with 50 additions and 0 deletions
@@ -0,0 +1,50 @@
 <!DOCTYPE html>
 <html lang="fr">
 <head>
    <meta charset="UTF-8">
    <title>⚡ Sandbox - Modification Catégorie</title>
    <style>
        body { font-family: sans-serif; background: #333; padding: 50px; }
        .modal { background: white; padding: 20px; border-radius: 12px; width: 400px; margin: 0 auto; }
        .btn { padding: 10px 20px; border-radius: 8px; border: none; cursor: pointer; margin: 5px; }
        .btn-blue { background: #1976d2; color: white; }
    </style>
 </head>
 <body>
    <div class="modal">
        <h3>Produit : Jus Ananas</h3>
        <p>Catégorie actuelle : <b>Boissons</b></p>
        <button class="btn btn-blue" onclick="editCategory()">✏️ Modifier la catégorie</button>
    </div>
    <script>
        // Simulation des données d'EverShelf
        const app = {
            categories: ["Fruits", "Légumes", "Boissons", "Épicerie", "Surgelés", "Produits laitiers"],
            updateProductCategory: function(newCat) {
                alert("SUCCESS : EverShelf a enregistré la nouvelle catégorie : " + newCat);
            }
        };
        function editCategory() {
            const container = document.querySelector('.modal');
            container.innerHTML = `
                <h3>Changer la catégorie</h3>
                <select id="cat-select" style="width:100%; padding:10px;">
                    ${app.categories.map(c => `<option value="${c}">${c}</option>`).join('')}
                </select>
                <br><br>
                <button class="btn btn-blue" onclick="save()">Enregistrer</button>
                <button class="btn" onclick="location.reload()">Annuler</button>
            `;
        }
        function save() {
            const selected = document.getElementById('cat-select').value;
            app.updateProductCategory(selected);
            location.reload();
        }
    </script>
 </body>
 </html>