Actualiser test.html
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

This commit is contained in:
2026-06-17 17:29:12 +00:00
parent 7fae0e08bf
commit df8211c8ac
+35 -48
View File
@@ -2,76 +2,63 @@
<html lang="fr"> <html lang="fr">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>⚡ Sandbox - Récupération Dynamique</title> <title>⚡ Sandbox - Découverte de Table</title>
<style> <style>
body { font-family: sans-serif; background: #333; padding: 50px; color: white; } body { font-family: sans-serif; background: #333; padding: 50px; color: white; }
.modal { background: white; padding: 20px; border-radius: 12px; width: 400px; margin: 0 auto; color: black; box-shadow: 0 4px 15px rgba(0,0,0,0.3); } .modal { background: white; padding: 20px; border-radius: 12px; width: 400px; margin: 0 auto; color: black; }
.debug-panel { margin-top: 20px; padding: 15px; background: #222; border-radius: 8px; border: 1px solid #444; font-size: 12px; } .debug-panel { margin-top: 20px; padding: 15px; background: #222; border-radius: 8px; font-family: monospace; }
.btn { padding: 10px 20px; border-radius: 8px; border: none; cursor: pointer; margin: 5px; font-weight: bold; } .btn { padding: 10px 20px; border-radius: 8px; border: none; cursor: pointer; margin: 5px; background: #1976d2; color: white; }
.btn-blue { background: #1976d2; color: white; }
</style> </style>
</head> </head>
<body> <body>
<div class="modal" id="app-container"> <div class="modal">
<h3>Produit : Jus Ananas</h3> <h3>Découverte automatique</h3>
<p>Catégorie actuelle : <b>Boissons</b></p> <button class="btn" onclick="discoverCategories()">Lancer la lecture de la table</button>
<button class="btn btn-blue" onclick="initForm()">✏️ Modifier la catégorie</button> <div id="result-area"></div>
</div> </div>
<div class="debug-panel"> <div class="debug-panel">
<strong>Debug - État :</strong> <strong>Table des catégories trouvées :</strong>
<pre id="debug-log">Prêt à charger les données...</pre> <pre id="table-display">En attente...</pre>
</div> </div>
<script> <script>
let GLOBAL_CATEGORY_LABELS = {}; async function discoverCategories() {
// 1. Récupération par injection de script (méthode robuste)
async function fetchCategories() {
try { try {
// On va utiliser 'window' directement pour lire la mémoire de l'application // On lit le fichier source directement depuis le serveur
// Si CATEGORY_LABELS est défini dans app.js, il est forcément dans 'window' const response = await fetch('/assets/js/app.js');
if (typeof window.CATEGORY_LABELS !== 'undefined') { const text = await response.text();
GLOBAL_CATEGORY_LABELS = window.CATEGORY_LABELS;
document.getElementById('debug-log').innerText = "Succès : Données récupérées depuis la mémoire de l'app."; // On cherche la définition de CATEGORY_LABELS par regex
return true; const match = text.match(/const CATEGORY_LABELS = ({[\s\S]*?});/);
if (match) {
// On transforme le bloc trouvé en objet JS
const categoryObject = eval('(' + match[1] + ')');
// Affichage dans le panneau de debug
document.getElementById('table-display').innerText = JSON.stringify(categoryObject, null, 2);
// Génération du menu déroulant
renderDropdown(categoryObject);
} else { } else {
document.getElementById('debug-log').innerText = "Erreur : CATEGORY_LABELS n'est pas encore chargé en mémoire."; document.getElementById('table-display').innerText = "Erreur : Table CATEGORY_LABELS introuvable dans app.js.";
} }
} catch (e) { } catch (e) {
document.getElementById('debug-log').innerText = "Erreur fatale : " + e.message; document.getElementById('table-display').innerText = "Erreur de lecture : " + e.message;
} }
return false;
} }
// 2. Initialisation du formulaire function renderDropdown(data) {
async function initForm() { const area = document.getElementById('result-area');
const loaded = await fetchCategories(); const options = Object.entries(data).map(([k, v]) => `<option value="${k}">${v}</option>`).join('');
if (!loaded) return; area.innerHTML = `
<select style="width:100%; padding:10px; margin-top:10px;">
const container = document.getElementById('app-container'); ${options}
const entries = Object.entries(GLOBAL_CATEGORY_LABELS);
container.innerHTML = `
<h3>Changer la catégorie</h3>
<select id="cat-select" style="width:100%; padding:10px; margin: 10px 0;">
${entries.map(([key, label]) => `<option value="${key}">${label}</option>`).join('')}
</select> </select>
<br>
<button class="btn btn-blue" onclick="save()">Enregistrer</button>
<button class="btn" onclick="location.reload()">Annuler</button>
`; `;
} }
// 3. Sauvegarde
function save() {
const selectedKey = document.getElementById('cat-select').value;
const selectedLabel = GLOBAL_CATEGORY_LABELS[selectedKey];
alert("Réconciliation réussie : Envoi de la clé '" + selectedKey + "' vers EverShelf.");
console.log("Donnée API :", { category: selectedKey });
location.reload();
}
</script> </script>
</body> </body>
</html> </html>