morgane
b60994d745
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
77 lines
3.1 KiB
HTML
77 lines
3.1 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="fr">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<title>⚡ Debug Catégories - Dashboard</title>
|
|
<style>
|
|
body { font-family: sans-serif; background: #222; color: #eee; padding: 20px; }
|
|
.debug-header { background: #333; padding: 15px; border-radius: 8px; margin-bottom: 20px; border-left: 5px solid #555; }
|
|
.status-ok { color: #4ade80; font-weight: bold; }
|
|
.status-err { color: #f87171; font-weight: bold; }
|
|
.controls { background: #444; padding: 20px; margin-bottom: 20px; border-radius: 8px; }
|
|
table { width: 100%; border-collapse: collapse; background: #333; }
|
|
th, td { border: 1px solid #555; padding: 10px; text-align: left; }
|
|
th { background: #444; }
|
|
.key { color: #fbbf24; font-weight: bold; }
|
|
select { padding: 10px; width: 300px; border-radius: 5px; }
|
|
</style>
|
|
</head>
|
|
<body>
|
|
|
|
<div class="debug-header" id="debug-panel">
|
|
État : <span id="status-text">Tentative de récupération...</span>
|
|
</div>
|
|
|
|
<div class="controls">
|
|
<h3>Choisir une catégorie :</h3>
|
|
<select id="category-selector">
|
|
<option value="">-- Sélectionner --</option>
|
|
</select>
|
|
</div>
|
|
|
|
<h1>Table des Catégories (Source: translations/fr.json)</h1>
|
|
<table id="cat-table">
|
|
<thead><tr><th>Clé</th><th>Libellé (Français)</th></tr></thead>
|
|
<tbody></tbody>
|
|
</table>
|
|
|
|
<script>
|
|
const statusText = document.getElementById('status-text');
|
|
const debugPanel = document.getElementById('debug-panel');
|
|
|
|
fetch('translations/fr.json')
|
|
.then(res => {
|
|
if (!res.ok) throw new Error("Fichier introuvable (" + res.status + ")");
|
|
return res.json();
|
|
})
|
|
.then(data => {
|
|
const tbody = document.querySelector('#cat-table tbody');
|
|
const selector = document.querySelector('#category-selector');
|
|
const catData = data.categories;
|
|
|
|
if (catData) {
|
|
statusText.innerText = "OK - Données chargées avec succès.";
|
|
debugPanel.style.borderLeftColor = "#4ade80";
|
|
statusText.className = "status-ok";
|
|
|
|
Object.entries(catData).forEach(([key, val]) => {
|
|
const row = `<tr><td class="key">${key}</td><td>${val}</td></tr>`;
|
|
tbody.innerHTML += row;
|
|
|
|
const opt = document.createElement('option');
|
|
opt.value = key;
|
|
opt.textContent = val;
|
|
selector.appendChild(opt);
|
|
});
|
|
} else {
|
|
throw new Error("Structure JSON invalide (section 'categories' manquante)");
|
|
}
|
|
})
|
|
.catch(err => {
|
|
statusText.innerText = "ERREUR : " + err.message;
|
|
debugPanel.style.borderLeftColor = "#f87171";
|
|
statusText.className = "status-err";
|
|
});
|
|
</script>
|
|
</body>
|
|
</html> |