749 lines
28 KiB
PHP
Executable File
749 lines
28 KiB
PHP
Executable File
<?php
|
||
// ═══════════════════════════════════════════════════════════════════
|
||
// SIDEBAR ADMIN - PROCESS FLOW & SUPERVISION
|
||
// ═══════════════════════════════════════════════════════════════════
|
||
|
||
$menuFile = '/opt/wevads/app/views/includes/menu.html';
|
||
$apiFile = '/opt/wevads/public/api/save-menu.php';
|
||
$adminFile = '/opt/wevads/public/sidebar-admin.php';
|
||
|
||
// System checks
|
||
$checks = [
|
||
'menu_exists' => file_exists($menuFile),
|
||
'menu_writable' => is_writable($menuFile),
|
||
'api_exists' => file_exists($apiFile),
|
||
'admin_exists' => file_exists($adminFile),
|
||
];
|
||
|
||
// Menu stats
|
||
$menuStats = ['parents' => 0, 'children' => 0, 'lines' => 0, 'size' => 0];
|
||
if ($checks['menu_exists']) {
|
||
$html = file_get_contents($menuFile);
|
||
preg_match_all('/nav-toggle/', $html, $m);
|
||
$menuStats['parents'] = count($m[0]);
|
||
preg_match_all('/<li><a href/', $html, $c);
|
||
$menuStats['children'] = count($c[0]);
|
||
$menuStats['lines'] = count(file($menuFile));
|
||
$menuStats['size'] = filesize($menuFile);
|
||
}
|
||
|
||
// File count
|
||
$fileCount = 0;
|
||
$excludeDirs = ['plugins','css','js','images','uploads','chrome','tmp','storage','assets','styles','videos','media','data','config','fonts','webfonts'];
|
||
function countFiles($dir, $exDirs) {
|
||
$count = 0;
|
||
if (!is_dir($dir)) return 0;
|
||
foreach (scandir($dir) as $f) {
|
||
if ($f[0] === '.') continue;
|
||
$path = $dir . '/' . $f;
|
||
if (is_dir($path)) {
|
||
if (!in_array($f, $exDirs)) $count += countFiles($path, $exDirs);
|
||
} else {
|
||
$ext = pathinfo($f, PATHINFO_EXTENSION);
|
||
if (in_array($ext, ['php', 'html'])) $count++;
|
||
}
|
||
}
|
||
return $count;
|
||
}
|
||
$fileCount = countFiles('/opt/wevads/public', $excludeDirs);
|
||
|
||
// All checks passed?
|
||
$allOK = $checks['menu_exists'] && $checks['menu_writable'] && $checks['admin_exists'];
|
||
?>
|
||
<!DOCTYPE html>
|
||
<html lang="fr">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<title>Sidebar Admin - Process Flow & Supervision</title>
|
||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
|
||
<style>
|
||
@media print {
|
||
body { background: #fff !important; color: #000 !important; }
|
||
.no-print { display: none !important; }
|
||
.step-box { break-inside: avoid; }
|
||
.process-section { break-before: page; }
|
||
}
|
||
|
||
* { margin: 0; padding: 0; box-sizing: border-box; }
|
||
body {
|
||
font-family: 'Segoe UI', system-ui, sans-serif;
|
||
background: linear-gradient(180deg, #0a0a15 0%, #0f0f1a 100%);
|
||
color: #fff;
|
||
min-height: 100vh;
|
||
line-height: 1.5;
|
||
}
|
||
|
||
/* Header */
|
||
.header {
|
||
background: linear-gradient(135deg, rgba(0,255,255,0.1), rgba(191,0,255,0.1));
|
||
border-bottom: 2px solid rgba(0,255,255,0.3);
|
||
padding: 20px 30px;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
}
|
||
.header h1 {
|
||
font-size: 1.5em;
|
||
color: #00ffff;
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 12px;
|
||
}
|
||
.header h1 i { color: #bf00ff; }
|
||
.header-info {
|
||
display: flex;
|
||
gap: 20px;
|
||
align-items: center;
|
||
}
|
||
.header-stat {
|
||
text-align: center;
|
||
padding: 8px 15px;
|
||
background: rgba(0,0,0,0.3);
|
||
border-radius: 8px;
|
||
border: 1px solid rgba(0,255,255,0.2);
|
||
}
|
||
.header-stat .val { font-size: 1.4em; font-weight: bold; color: #00ff88; }
|
||
.header-stat .lbl { font-size: 0.7em; color: #667; }
|
||
|
||
/* Actions */
|
||
.actions {
|
||
display: flex;
|
||
gap: 10px;
|
||
}
|
||
.btn {
|
||
padding: 10px 18px;
|
||
border: none;
|
||
border-radius: 6px;
|
||
cursor: pointer;
|
||
font-weight: 600;
|
||
font-size: 0.85em;
|
||
display: inline-flex;
|
||
align-items: center;
|
||
gap: 8px;
|
||
text-decoration: none;
|
||
transition: all 0.3s;
|
||
}
|
||
.btn-primary { background: linear-gradient(135deg, #00ffff, #00cc99); color: #000; }
|
||
.btn-primary:hover { transform: translateY(-2px); box-shadow: 0 5px 20px rgba(0,255,255,0.3); }
|
||
.btn-secondary { background: rgba(255,255,255,0.1); border: 1px solid rgba(0,255,255,0.3); color: #fff; }
|
||
.btn-secondary:hover { background: rgba(0,255,255,0.1); }
|
||
.btn-success { background: linear-gradient(135deg, #00ff88, #00cc6a); color: #000; }
|
||
.btn-print { background: rgba(191,0,255,0.2); border: 1px solid #bf00ff; color: #bf00ff; }
|
||
|
||
/* Container */
|
||
.container {
|
||
max-width: 1400px;
|
||
margin: 0 auto;
|
||
padding: 30px;
|
||
}
|
||
|
||
/* Section */
|
||
.section {
|
||
margin-bottom: 30px;
|
||
}
|
||
.section-title {
|
||
font-size: 1.2em;
|
||
color: #00ffff;
|
||
margin-bottom: 15px;
|
||
padding-bottom: 10px;
|
||
border-bottom: 1px solid rgba(0,255,255,0.2);
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 10px;
|
||
}
|
||
.section-title i { color: #bf00ff; }
|
||
|
||
/* Process Flow */
|
||
.process-flow {
|
||
display: flex;
|
||
align-items: flex-start;
|
||
gap: 0;
|
||
overflow-x: auto;
|
||
padding: 20px 0;
|
||
}
|
||
.step-box {
|
||
min-width: 180px;
|
||
max-width: 200px;
|
||
background: rgba(0,0,0,0.4);
|
||
border: 2px solid rgba(0,255,255,0.2);
|
||
border-radius: 12px;
|
||
padding: 15px;
|
||
text-align: center;
|
||
position: relative;
|
||
}
|
||
.step-box.active { border-color: #00ffff; box-shadow: 0 0 20px rgba(0,255,255,0.2); }
|
||
.step-box.ok { border-color: #00ff88; }
|
||
.step-box.error { border-color: #ff3366; }
|
||
|
||
.step-number {
|
||
position: absolute;
|
||
top: -12px;
|
||
left: 50%;
|
||
transform: translateX(-50%);
|
||
background: #bf00ff;
|
||
color: #fff;
|
||
width: 24px;
|
||
height: 24px;
|
||
border-radius: 50%;
|
||
font-size: 0.75em;
|
||
font-weight: bold;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
}
|
||
.step-icon {
|
||
width: 50px;
|
||
height: 50px;
|
||
margin: 10px auto;
|
||
border-radius: 50%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
font-size: 1.3em;
|
||
}
|
||
.step-icon.ok { background: rgba(0,255,136,0.2); color: #00ff88; }
|
||
.step-icon.warn { background: rgba(255,170,0,0.2); color: #ffaa00; }
|
||
.step-icon.err { background: rgba(255,50,100,0.2); color: #ff3366; }
|
||
.step-icon.info { background: rgba(0,255,255,0.2); color: #00ffff; }
|
||
.step-icon.action { background: rgba(191,0,255,0.2); color: #bf00ff; }
|
||
|
||
.step-title { font-weight: 600; font-size: 0.9em; margin: 8px 0 5px; }
|
||
.step-desc { font-size: 0.7em; color: #888; margin-bottom: 8px; }
|
||
.step-status {
|
||
font-size: 0.65em;
|
||
padding: 3px 10px;
|
||
border-radius: 12px;
|
||
display: inline-block;
|
||
}
|
||
.step-status.ok { background: rgba(0,255,136,0.2); color: #00ff88; }
|
||
.step-status.warn { background: rgba(255,170,0,0.2); color: #ffaa00; }
|
||
.step-status.err { background: rgba(255,50,100,0.2); color: #ff3366; }
|
||
|
||
.arrow {
|
||
min-width: 40px;
|
||
height: 3px;
|
||
background: linear-gradient(90deg, #00ffff, #bf00ff);
|
||
margin-top: 50px;
|
||
position: relative;
|
||
}
|
||
.arrow::after {
|
||
content: '';
|
||
position: absolute;
|
||
right: -6px;
|
||
top: -5px;
|
||
border: 6px solid transparent;
|
||
border-left-color: #bf00ff;
|
||
}
|
||
|
||
/* Checklist */
|
||
.checklist {
|
||
display: grid;
|
||
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
|
||
gap: 15px;
|
||
}
|
||
.check-item {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 12px;
|
||
padding: 12px 15px;
|
||
background: rgba(0,0,0,0.3);
|
||
border: 1px solid rgba(255,255,255,0.1);
|
||
border-radius: 8px;
|
||
}
|
||
.check-icon {
|
||
width: 30px;
|
||
height: 30px;
|
||
border-radius: 50%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
font-size: 0.9em;
|
||
}
|
||
.check-icon.ok { background: rgba(0,255,136,0.2); color: #00ff88; }
|
||
.check-icon.err { background: rgba(255,50,100,0.2); color: #ff3366; }
|
||
.check-info { flex: 1; }
|
||
.check-title { font-weight: 600; font-size: 0.85em; }
|
||
.check-path { font-size: 0.7em; color: #667; font-family: monospace; }
|
||
|
||
/* Detailed Steps */
|
||
.detailed-steps {
|
||
counter-reset: step-counter;
|
||
}
|
||
.detailed-step {
|
||
display: flex;
|
||
gap: 20px;
|
||
margin-bottom: 25px;
|
||
padding: 20px;
|
||
background: rgba(0,0,0,0.3);
|
||
border: 1px solid rgba(0,255,255,0.15);
|
||
border-radius: 10px;
|
||
counter-increment: step-counter;
|
||
}
|
||
.detailed-step::before {
|
||
content: counter(step-counter);
|
||
min-width: 40px;
|
||
height: 40px;
|
||
background: linear-gradient(135deg, #00ffff, #bf00ff);
|
||
color: #000;
|
||
border-radius: 50%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
font-weight: bold;
|
||
font-size: 1.1em;
|
||
}
|
||
.step-content { flex: 1; }
|
||
.step-content h3 { color: #00ffff; font-size: 1em; margin-bottom: 8px; }
|
||
.step-content p { font-size: 0.85em; color: #aaa; margin-bottom: 10px; }
|
||
.step-content .code {
|
||
background: rgba(0,0,0,0.5);
|
||
border: 1px solid rgba(0,255,255,0.2);
|
||
border-radius: 5px;
|
||
padding: 10px;
|
||
font-family: monospace;
|
||
font-size: 0.8em;
|
||
color: #00ff88;
|
||
overflow-x: auto;
|
||
}
|
||
.step-content .note {
|
||
background: rgba(255,170,0,0.1);
|
||
border-left: 3px solid #ffaa00;
|
||
padding: 8px 12px;
|
||
font-size: 0.8em;
|
||
color: #ffaa00;
|
||
margin-top: 10px;
|
||
}
|
||
.step-content .tip {
|
||
background: rgba(0,255,136,0.1);
|
||
border-left: 3px solid #00ff88;
|
||
padding: 8px 12px;
|
||
font-size: 0.8em;
|
||
color: #00ff88;
|
||
margin-top: 10px;
|
||
}
|
||
|
||
/* Test Panel */
|
||
.test-panel {
|
||
background: rgba(0,0,0,0.4);
|
||
border: 1px solid rgba(0,255,255,0.2);
|
||
border-radius: 10px;
|
||
padding: 20px;
|
||
}
|
||
.test-grid {
|
||
display: grid;
|
||
grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
|
||
gap: 12px;
|
||
margin-bottom: 20px;
|
||
}
|
||
.test-card {
|
||
background: rgba(0,0,0,0.3);
|
||
border: 1px solid rgba(255,255,255,0.1);
|
||
border-radius: 8px;
|
||
padding: 15px;
|
||
text-align: center;
|
||
}
|
||
.test-card .icon { font-size: 1.5em; margin-bottom: 8px; }
|
||
.test-card .val { font-size: 1.8em; font-weight: bold; color: #00ff88; }
|
||
.test-card .lbl { font-size: 0.7em; color: #667; }
|
||
|
||
.test-actions {
|
||
display: flex;
|
||
gap: 10px;
|
||
flex-wrap: wrap;
|
||
}
|
||
|
||
#result {
|
||
margin-top: 15px;
|
||
padding: 15px;
|
||
background: rgba(0,0,0,0.5);
|
||
border: 1px solid rgba(0,255,255,0.2);
|
||
border-radius: 8px;
|
||
font-family: monospace;
|
||
font-size: 0.8em;
|
||
display: none;
|
||
max-height: 200px;
|
||
overflow-y: auto;
|
||
}
|
||
#result.show { display: block; }
|
||
#result .ok { color: #00ff88; }
|
||
#result .err { color: #ff3366; }
|
||
#result .info { color: #00ffff; }
|
||
|
||
/* Footer */
|
||
.footer {
|
||
text-align: center;
|
||
padding: 20px;
|
||
color: #444;
|
||
font-size: 0.75em;
|
||
border-top: 1px solid rgba(255,255,255,0.05);
|
||
}
|
||
</style>
|
||
|
||
</head>
|
||
<body>
|
||
|
||
<!-- HEADER -->
|
||
<div class="header no-print">
|
||
<h1><i class="fas fa-project-diagram"></i> Sidebar Admin - Process Flow</h1>
|
||
<div class="header-info">
|
||
<div class="header-stat">
|
||
<div class="val"><?= $fileCount ?></div>
|
||
<div class="lbl">Fichiers</div>
|
||
</div>
|
||
<div class="header-stat">
|
||
<div class="val"><?= $menuStats['parents'] ?></div>
|
||
<div class="lbl">Menus</div>
|
||
</div>
|
||
<div class="header-stat">
|
||
<div class="val"><?= $menuStats['children'] ?></div>
|
||
<div class="lbl">Items</div>
|
||
</div>
|
||
</div>
|
||
<div class="actions">
|
||
<button class="btn btn-print" onclick="window.print()"><i class="fas fa-print"></i> Imprimer</button>
|
||
<a href="/sidebar-admin.php" class="btn btn-primary"><i class="fas fa-rocket"></i> Lancer Admin</a>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="container">
|
||
|
||
<!-- ═══════════════════════════════════════════════════════════════════ -->
|
||
<!-- VISUAL PROCESS FLOW -->
|
||
<!-- ═══════════════════════════════════════════════════════════════════ -->
|
||
<div class="section">
|
||
<div class="section-title"><i class="fas fa-stream"></i> Process Flow Principal</div>
|
||
|
||
<div class="process-flow">
|
||
<!-- Step 1: Scan -->
|
||
<div class="step-box <?= $fileCount > 0 ? 'ok' : 'error' ?>">
|
||
<div class="step-number">1</div>
|
||
<div class="step-icon <?= $fileCount > 0 ? 'ok' : 'err' ?>">
|
||
<i class="fas fa-search"></i>
|
||
</div>
|
||
<div class="step-title">Scanner Fichiers</div>
|
||
<div class="step-desc">Scan récursif /public<br><?= $fileCount ?> fichiers PHP/HTML</div>
|
||
<div class="step-status <?= $fileCount > 0 ? 'ok' : 'err' ?>">
|
||
<?= $fileCount > 0 ? '✓ Complété' : '✗ Erreur' ?>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="arrow"></div>
|
||
|
||
<!-- Step 2: Parse -->
|
||
<div class="step-box <?= $checks['menu_exists'] ? 'ok' : 'error' ?>">
|
||
<div class="step-number">2</div>
|
||
<div class="step-icon <?= $checks['menu_exists'] ? 'ok' : 'err' ?>">
|
||
<i class="fas fa-code"></i>
|
||
</div>
|
||
<div class="step-title">Parser Menu</div>
|
||
<div class="step-desc">Extraction menu.html<br><?= $menuStats['parents'] ?> parents, <?= $menuStats['children'] ?> enfants</div>
|
||
<div class="step-status <?= $checks['menu_exists'] ? 'ok' : 'err' ?>">
|
||
<?= $checks['menu_exists'] ? '✓ Parsé' : '✗ Manquant' ?>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="arrow"></div>
|
||
|
||
<!-- Step 3: Display -->
|
||
<div class="step-box <?= $checks['admin_exists'] ? 'ok' : 'error' ?>">
|
||
<div class="step-number">3</div>
|
||
<div class="step-icon info">
|
||
<i class="fas fa-desktop"></i>
|
||
</div>
|
||
<div class="step-title">Afficher Interface</div>
|
||
<div class="step-desc">UI double panneau<br>Fichiers ↔ Menu</div>
|
||
<div class="step-status ok">✓ Prêt</div>
|
||
</div>
|
||
|
||
<div class="arrow"></div>
|
||
|
||
<!-- Step 4: Edit -->
|
||
<div class="step-box active">
|
||
<div class="step-number">4</div>
|
||
<div class="step-icon action">
|
||
<i class="fas fa-edit"></i>
|
||
</div>
|
||
<div class="step-title">Éditer Menu</div>
|
||
<div class="step-desc">Ajouter / Modifier<br>Supprimer / Réorganiser</div>
|
||
<div class="step-status ok">Interactif</div>
|
||
</div>
|
||
|
||
<div class="arrow"></div>
|
||
|
||
<!-- Step 5: Generate -->
|
||
<div class="step-box">
|
||
<div class="step-number">5</div>
|
||
<div class="step-icon info">
|
||
<i class="fas fa-file-code"></i>
|
||
</div>
|
||
<div class="step-title">Générer HTML</div>
|
||
<div class="step-desc">Construction du<br>nouveau menu.html</div>
|
||
<div class="step-status ok">Auto</div>
|
||
</div>
|
||
|
||
<div class="arrow"></div>
|
||
|
||
<!-- Step 6: Save -->
|
||
<div class="step-box <?= $checks['menu_writable'] ? 'ok' : 'error' ?>">
|
||
<div class="step-number">6</div>
|
||
<div class="step-icon <?= $checks['menu_writable'] ? 'ok' : 'err' ?>">
|
||
<i class="fas fa-save"></i>
|
||
</div>
|
||
<div class="step-title">Sauvegarder</div>
|
||
<div class="step-desc">Écriture menu.html<br><?= round($menuStats['size']/1024, 1) ?> KB</div>
|
||
<div class="step-status <?= $checks['menu_writable'] ? 'ok' : 'err' ?>">
|
||
<?= $checks['menu_writable'] ? '✓ Writable' : '✗ Read-only' ?>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="arrow"></div>
|
||
|
||
<!-- Step 7: Apply -->
|
||
<div class="step-box">
|
||
<div class="step-number">7</div>
|
||
<div class="step-icon action">
|
||
<i class="fas fa-check-double"></i>
|
||
</div>
|
||
<div class="step-title">Appliquer</div>
|
||
<div class="step-desc">Rechargement<br>Apache/Sidebar</div>
|
||
<div class="step-status ok">Manuel/Auto</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- ═══════════════════════════════════════════════════════════════════ -->
|
||
<!-- SYSTEM CHECKS -->
|
||
<!-- ═══════════════════════════════════════════════════════════════════ -->
|
||
<div class="section">
|
||
<div class="section-title"><i class="fas fa-clipboard-check"></i> Vérifications Système</div>
|
||
|
||
<div class="checklist">
|
||
<div class="check-item">
|
||
<div class="check-icon <?= $checks['menu_exists'] ? 'ok' : 'err' ?>">
|
||
<i class="fas fa-<?= $checks['menu_exists'] ? 'check' : 'times' ?>"></i>
|
||
</div>
|
||
<div class="check-info">
|
||
<div class="check-title">Fichier Menu</div>
|
||
<div class="check-path">/opt/wevads/app/views/includes/menu.html</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="check-item">
|
||
<div class="check-icon <?= $checks['menu_writable'] ? 'ok' : 'err' ?>">
|
||
<i class="fas fa-<?= $checks['menu_writable'] ? 'check' : 'times' ?>"></i>
|
||
</div>
|
||
<div class="check-info">
|
||
<div class="check-title">Permissions Écriture</div>
|
||
<div class="check-path">chmod 644 / www-data</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="check-item">
|
||
<div class="check-icon <?= $checks['admin_exists'] ? 'ok' : 'err' ?>">
|
||
<i class="fas fa-<?= $checks['admin_exists'] ? 'check' : 'times' ?>"></i>
|
||
</div>
|
||
<div class="check-info">
|
||
<div class="check-title">Sidebar Admin</div>
|
||
<div class="check-path">/opt/wevads/public/sidebar-admin.php</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="check-item">
|
||
<div class="check-icon <?= $checks['api_exists'] ? 'ok' : 'err' ?>">
|
||
<i class="fas fa-<?= $checks['api_exists'] ? 'check' : 'times' ?>"></i>
|
||
</div>
|
||
<div class="check-info">
|
||
<div class="check-title">API Save</div>
|
||
<div class="check-path">/opt/wevads/public/api/save-menu.php</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- ═══════════════════════════════════════════════════════════════════ -->
|
||
<!-- DETAILED STEPS -->
|
||
<!-- ═══════════════════════════════════════════════════════════════════ -->
|
||
<div class="section process-section">
|
||
<div class="section-title"><i class="fas fa-list-ol"></i> Procédure Détaillée</div>
|
||
|
||
<div class="detailed-steps">
|
||
|
||
<div class="detailed-step">
|
||
<div class="step-content">
|
||
<h3><i class="fas fa-folder-open"></i> Accéder au Sidebar Admin</h3>
|
||
<p>Ouvrir l'interface d'administration du menu sidebar.</p>
|
||
<div class="code">URL: http://<?= $_SERVER['HTTP_HOST'] ?>/sidebar-admin.php</div>
|
||
<div class="tip"><i class="fas fa-lightbulb"></i> L'interface charge automatiquement tous les fichiers serveur et le menu actuel.</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="detailed-step">
|
||
<div class="step-content">
|
||
<h3><i class="fas fa-search"></i> Vérifier le Scan des Fichiers</h3>
|
||
<p>Le panneau gauche affiche tous les fichiers PHP/HTML disponibles sur le serveur.</p>
|
||
<div class="code">Fichiers scannés: <?= $fileCount ?><br>Répertoire: /opt/wevads/public/<br>Extensions: .php, .html</div>
|
||
<div class="note"><i class="fas fa-exclamation-triangle"></i> Les répertoires système (css, js, images, etc.) sont exclus du scan.</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="detailed-step">
|
||
<div class="step-content">
|
||
<h3><i class="fas fa-sitemap"></i> Vérifier la Structure du Menu</h3>
|
||
<p>Le panneau droit affiche la structure actuelle du menu sidebar.</p>
|
||
<div class="code">Menus parents: <?= $menuStats['parents'] ?><br>Sous-menus: <?= $menuStats['children'] ?><br>Taille fichier: <?= round($menuStats['size']/1024, 1) ?> KB</div>
|
||
<div class="tip"><i class="fas fa-lightbulb"></i> Utilisez les boutons +/- pour déplier/replier les menus.</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="detailed-step">
|
||
<div class="step-content">
|
||
<h3><i class="fas fa-plus-circle"></i> Ajouter un Élément au Menu</h3>
|
||
<p>Pour ajouter un fichier au menu:</p>
|
||
<div class="code">1. Cliquer sur un fichier dans le panneau GAUCHE (sélection bleue)<br>2. Cliquer sur un menu parent 📁 dans le panneau DROIT<br>3. Cliquer sur le bouton → ou sur le + du parent</div>
|
||
<div class="note"><i class="fas fa-exclamation-triangle"></i> Les liens directs 🔗 ne peuvent pas recevoir d'enfants.</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="detailed-step">
|
||
<div class="step-content">
|
||
<h3><i class="fas fa-trash-alt"></i> Supprimer un Élément</h3>
|
||
<p>Pour supprimer un élément du menu:</p>
|
||
<div class="code">1. Cliquer sur l'élément à supprimer (parent ou enfant)<br>2. Cliquer sur le bouton × rouge<br> OU<br> Cliquer sur le bouton ← central</div>
|
||
<div class="tip"><i class="fas fa-lightbulb"></i> Les éléments supprimés apparaissent dans la section "Supprimés" en bas à gauche. Cliquez dessus pour les restaurer.</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="detailed-step">
|
||
<div class="step-content">
|
||
<h3><i class="fas fa-edit"></i> Modifier un Élément</h3>
|
||
<p>Pour modifier le titre ou l'URL d'un élément:</p>
|
||
<div class="code">1. Cliquer sur le bouton ✏ de l'élément<br>2. Modifier le titre dans la boîte de dialogue<br>3. Modifier l'URL si demandé<br>4. Valider</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="detailed-step">
|
||
<div class="step-content">
|
||
<h3><i class="fas fa-save"></i> Sauvegarder les Modifications</h3>
|
||
<p>Une fois les modifications terminées:</p>
|
||
<div class="code">1. Cliquer sur le bouton "💾 Appliquer" en haut à droite<br>2. Le HTML est généré et sauvegardé automatiquement<br>3. Un backup est créé avant chaque sauvegarde</div>
|
||
<div class="note"><i class="fas fa-exclamation-triangle"></i> Si l'API n'est pas disponible, le HTML sera copié dans le presse-papier pour collage manuel.</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="detailed-step">
|
||
<div class="step-content">
|
||
<h3><i class="fas fa-sync-alt"></i> Appliquer les Changements</h3>
|
||
<p>Pour voir les changements dans l'application:</p>
|
||
<div class="code">Option 1 (Auto): Recharger la page de l'application<br><br>Option 2 (Manuel): systemctl restart apache2</div>
|
||
<div class="tip"><i class="fas fa-lightbulb"></i> Les backups sont stockés dans: menu.html.bak.[timestamp]</div>
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
</div>
|
||
|
||
<!-- ═══════════════════════════════════════════════════════════════════ -->
|
||
<!-- TEST PANEL -->
|
||
<!-- ═══════════════════════════════════════════════════════════════════ -->
|
||
<div class="section no-print">
|
||
<div class="section-title"><i class="fas fa-vial"></i> Tests & Diagnostics</div>
|
||
|
||
<div class="test-panel">
|
||
<div class="test-grid">
|
||
<div class="test-card">
|
||
<div class="icon" style="color:#00ffff"><i class="fas fa-file-code"></i></div>
|
||
<div class="val"><?= $fileCount ?></div>
|
||
<div class="lbl">Fichiers Scannés</div>
|
||
</div>
|
||
<div class="test-card">
|
||
<div class="icon" style="color:#00ff88"><i class="fas fa-folder-tree"></i></div>
|
||
<div class="val"><?= $menuStats['parents'] ?></div>
|
||
<div class="lbl">Menus Parents</div>
|
||
</div>
|
||
<div class="test-card">
|
||
<div class="icon" style="color:#bf00ff"><i class="fas fa-list"></i></div>
|
||
<div class="val"><?= $menuStats['children'] ?></div>
|
||
<div class="lbl">Sous-menus</div>
|
||
</div>
|
||
<div class="test-card">
|
||
<div class="icon" style="color:#ffaa00"><i class="fas fa-weight"></i></div>
|
||
<div class="val"><?= round($menuStats['size']/1024, 1) ?></div>
|
||
<div class="lbl">KB</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="test-actions">
|
||
<a href="/sidebar-admin.php" class="btn btn-primary"><i class="fas fa-rocket"></i> Ouvrir Sidebar Admin</a>
|
||
<button class="btn btn-secondary" onclick="testScan()"><i class="fas fa-search"></i> Tester Scan</button>
|
||
<button class="btn btn-secondary" onclick="testParse()"><i class="fas fa-code"></i> Tester Parse</button>
|
||
<button class="btn btn-secondary" onclick="testAPI()"><i class="fas fa-plug"></i> Tester API</button>
|
||
<button class="btn btn-secondary" onclick="location.reload()"><i class="fas fa-sync"></i> Rafraîchir</button>
|
||
</div>
|
||
|
||
<div id="result"></div>
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
|
||
<div class="footer">
|
||
WEVADS - Sidebar Admin Process Flow v1.0 | <?= date('Y-m-d H:i:s') ?>
|
||
</div>
|
||
|
||
<script>
|
||
function showResult(html) {
|
||
const r = document.getElementById('result');
|
||
r.innerHTML = html;
|
||
r.classList.add('show');
|
||
}
|
||
|
||
function testScan() {
|
||
showResult('<span class="info">⏳ Test du scan des fichiers...</span>');
|
||
setTimeout(() => {
|
||
showResult(`<span class="ok">✅ Scan OK!</span><br>
|
||
Fichiers trouvés: <?= $fileCount ?><br>
|
||
Répertoire: /opt/wevads/public/<br>
|
||
Extensions: .php, .html`);
|
||
}, 500);
|
||
}
|
||
|
||
function testParse() {
|
||
showResult('<span class="info">⏳ Test du parsing menu.html...</span>');
|
||
setTimeout(() => {
|
||
showResult(`<span class="ok">✅ Parse OK!</span><br>
|
||
Fichier: menu.html (<?= $menuStats['lines'] ?> lignes)<br>
|
||
Parents (nav-toggle): <?= $menuStats['parents'] ?><br>
|
||
Enfants (sub-menu items): <?= $menuStats['children'] ?>`);
|
||
}, 500);
|
||
}
|
||
|
||
function testAPI() {
|
||
showResult('<span class="info">⏳ Test de l\'API save-menu...</span>');
|
||
|
||
fetch('/api/save-menu.php', {
|
||
method: 'POST',
|
||
headers: {'Content-Type': 'application/json'},
|
||
body: JSON.stringify({test: true})
|
||
})
|
||
.then(r => r.json())
|
||
.then(d => {
|
||
if (d.error === 'No HTML provided') {
|
||
showResult(`<span class="ok">✅ API accessible!</span><br>
|
||
Endpoint: /api/save-menu.php<br>
|
||
Status: Prête à recevoir les données<br>
|
||
Mode: Sauvegarde automatique + backup`);
|
||
} else {
|
||
showResult(`<span class="err">❌ Erreur API: ${d.error}</span>`);
|
||
}
|
||
})
|
||
.catch(e => {
|
||
showResult(`<span class="err">❌ API non accessible</span><br>
|
||
<span class="info">Mode fallback: copie manuelle du HTML</span><br>
|
||
Erreur: ${e.message}`);
|
||
});
|
||
}
|
||
</script>
|
||
|
||
</body>
|
||
</html>
|