108 lines
3.7 KiB
HTML
108 lines
3.7 KiB
HTML
|
<!DOCTYPE html>
|
||
|
|
<html lang="en">
|
||
|
|
<head>
|
||
|
|
<meta charset="UTF-8">
|
||
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
|
|
<title>Test Logout Button</title>
|
||
|
|
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
|
||
|
|
<style>
|
||
|
|
body {
|
||
|
|
padding: 50px;
|
||
|
|
font-family: Arial, sans-serif;
|
||
|
|
}
|
||
|
|
.test-result {
|
||
|
|
margin: 20px 0;
|
||
|
|
padding: 15px;
|
||
|
|
border-radius: 8px;
|
||
|
|
}
|
||
|
|
.success { background: #d4edda; border: 1px solid #c3e6cb; }
|
||
|
|
.info { background: #d1ecf1; border: 1px solid #bee5eb; }
|
||
|
|
.btn-logout {
|
||
|
|
background: #dc3545;
|
||
|
|
color: white;
|
||
|
|
border: none;
|
||
|
|
padding: 12px 24px;
|
||
|
|
border-radius: 8px;
|
||
|
|
cursor: pointer;
|
||
|
|
font-size: 16px;
|
||
|
|
}
|
||
|
|
.btn-logout:hover {
|
||
|
|
background: #c82333;
|
||
|
|
}
|
||
|
|
</style>
|
||
|
|
</head>
|
||
|
|
<body>
|
||
|
|
<div class="container">
|
||
|
|
<h1>🔓 Logout Button Test Page</h1>
|
||
|
|
<p class="lead">This page tests the logout functionality</p>
|
||
|
|
|
||
|
|
<div class="test-result info" id="loadStatus">
|
||
|
|
⏳ Loading auth.js...
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="test-result success" id="functionCheck" style="display: none;">
|
||
|
|
✓ window.logout function is available!
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="mt-4">
|
||
|
|
<h3>Click the button to test logout:</h3>
|
||
|
|
<button class="btn-logout" onclick="logout()">
|
||
|
|
🚪 Logout
|
||
|
|
</button>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="mt-4">
|
||
|
|
<h4>What should happen:</h4>
|
||
|
|
<ol>
|
||
|
|
<li>Confirmation dialog appears: "Are you sure you want to logout?"</li>
|
||
|
|
<li>If you click OK, the logout API is called</li>
|
||
|
|
<li>You are redirected to /admin/login.html</li>
|
||
|
|
</ol>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="mt-4">
|
||
|
|
<h4>Debug Info:</h4>
|
||
|
|
<pre id="debugInfo"></pre>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<script src="/admin/js/auth.js"></script>
|
||
|
|
<script>
|
||
|
|
window.addEventListener('load', function() {
|
||
|
|
const loadStatus = document.getElementById('loadStatus');
|
||
|
|
const functionCheck = document.getElementById('functionCheck');
|
||
|
|
const debugInfo = document.getElementById('debugInfo');
|
||
|
|
|
||
|
|
let debug = [];
|
||
|
|
|
||
|
|
// Check if window.logout exists
|
||
|
|
if (typeof window.logout === 'function') {
|
||
|
|
loadStatus.style.display = 'none';
|
||
|
|
functionCheck.style.display = 'block';
|
||
|
|
debug.push('✓ window.logout is defined');
|
||
|
|
} else {
|
||
|
|
loadStatus.innerHTML = '✗ window.logout NOT found!';
|
||
|
|
loadStatus.className = 'test-result alert alert-danger';
|
||
|
|
debug.push('✗ window.logout is NOT defined');
|
||
|
|
}
|
||
|
|
|
||
|
|
// Check other functions
|
||
|
|
['checkAuth', 'showSuccess', 'showError', 'redirectToLogin'].forEach(func => {
|
||
|
|
if (typeof window[func] === 'function') {
|
||
|
|
debug.push(`✓ window.${func} is defined`);
|
||
|
|
} else {
|
||
|
|
debug.push(`✗ window.${func} is NOT defined`);
|
||
|
|
}
|
||
|
|
});
|
||
|
|
|
||
|
|
// Check auth state
|
||
|
|
debug.push(`\nAuth State:`);
|
||
|
|
debug.push(` isAuthenticated: ${window.adminAuth?.isAuthenticated || false}`);
|
||
|
|
debug.push(` user: ${window.adminAuth?.user ? JSON.stringify(window.adminAuth.user) : 'null'}`);
|
||
|
|
|
||
|
|
debugInfo.textContent = debug.join('\n');
|
||
|
|
});
|
||
|
|
</script>
|
||
|
|
</body>
|
||
|
|
</html>
|