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">
<head>
<meta charset="UTF-8">
<title>⚡ Sandbox - Récupération Dynamique</title>
<title>⚡ Sandbox - Découverte de Table</title>
<style>
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); }
.debug-panel { margin-top: 20px; padding: 15px; background: #222; border-radius: 8px; border: 1px solid #444; font-size: 12px; }
.btn { padding: 10px 20px; border-radius: 8px; border: none; cursor: pointer; margin: 5px; font-weight: bold; }
.btn-blue { background: #1976d2; color: white; }
.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; font-family: monospace; }
.btn { padding: 10px 20px; border-radius: 8px; border: none; cursor: pointer; margin: 5px; background: #1976d2; color: white; }
</style>
</head>
<body>
<div class="modal" id="app-container">
<h3>Produit : Jus Ananas</h3>
<p>Catégorie actuelle : <b>Boissons</b></p>
<button class="btn btn-blue" onclick="initForm()">✏️ Modifier la catégorie</button>
<div class="modal">
<h3>Découverte automatique</h3>
<button class="btn" onclick="discoverCategories()">Lancer la lecture de la table</button>
<div id="result-area"></div>
</div>
<div class="debug-panel">
<strong>Debug - État :</strong>
<pre id="debug-log">Prêt à charger les données...</pre>
<strong>Table des catégories trouvées :</strong>
<pre id="table-display">En attente...</pre>
</div>
<script>
let GLOBAL_CATEGORY_LABELS = {};
// 1. Récupération par injection de script (méthode robuste)
async function fetchCategories() {
async function discoverCategories() {
try {
// On va utiliser 'window' directement pour lire la mémoire de l'application
// Si CATEGORY_LABELS est défini dans app.js, il est forcément dans 'window'
if (typeof window.CATEGORY_LABELS !== 'undefined') {
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.";
return true;
// On lit le fichier source directement depuis le serveur
const response = await fetch('/assets/js/app.js');
const text = await response.text();
// On cherche la définition de CATEGORY_LABELS par regex
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 {
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) {
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
async function initForm() {
const loaded = await fetchCategories();
if (!loaded) return;
const container = document.getElementById('app-container');
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('')}
function renderDropdown(data) {
const area = document.getElementById('result-area');
const options = Object.entries(data).map(([k, v]) => `<option value="${k}">${v}</option>`).join('');
area.innerHTML = `
<select style="width:100%; padding:10px; margin-top:10px;">
${options}
</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>
</body>
</html>