Working state before icon/utils fixes - Oct 22

This commit is contained in:
2025-10-21 21:56:54 +02:00
parent a7d9d44a13
commit 5be47b91a2
39 changed files with 6017 additions and 508 deletions

View File

@@ -1,5 +1,5 @@
<!DOCTYPE html>
<html :class="{ 'theme-dark': dark }" x-data="loginData()" lang="en">
<html :class="{ 'theme-dark': dark }" x-data="adminLogin()" lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
@@ -45,6 +45,7 @@
class="block w-full mt-1 text-sm dark:border-gray-600 dark:bg-gray-700 focus:border-purple-400 focus:outline-none focus:shadow-outline-purple dark:text-gray-300 dark:focus:shadow-outline-gray form-input"
:class="{ 'border-red-600': errors.username }"
placeholder="Enter your username"
autocomplete="username"
required />
<span x-show="errors.username" x-text="errors.username"
class="text-xs text-red-600 dark:text-red-400"></span>
@@ -59,6 +60,7 @@
:class="{ 'border-red-600': errors.password }"
placeholder="***************"
type="password"
autocomplete="current-password"
required />
<span x-show="errors.password" x-text="errors.password"
class="text-xs text-red-600 dark:text-red-400"></span>
@@ -85,80 +87,29 @@
Forgot your password?
</a>
</p>
<p class="mt-2">
<a class="text-sm font-medium text-gray-600 dark:text-gray-400 hover:underline"
href="/">
← Back to Platform
</a>
</p>
</div>
</div>
</div>
</div>
</div>
<!-- Alpine.js v3 -->
<script defer src="https://cdn.jsdelivr.net/npm/alpinejs@3.14.0/dist/cdn.min.js"></script>
<!-- Scripts in CORRECT ORDER -->
<!-- 1. Icons FIRST (defines $icon magic) -->
<script src="/static/shared/js/icons.js"></script>
<!-- API Client -->
<!-- 2. API Client -->
<script src="/static/shared/js/api-client.js"></script>
<!-- Login Logic -->
<script>
function loginData() {
return {
dark: false,
loading: false,
error: '',
success: '',
credentials: {
username: '',
password: ''
},
errors: {
username: '',
password: ''
},
<!-- 3. Login Logic -->
<script src="/static/admin/js/login.js"></script>
clearErrors() {
this.error = '';
this.errors = { username: '', password: '' };
},
async handleLogin() {
this.clearErrors();
this.loading = true;
try {
// Your existing API call
const response = await fetch('/api/v1/auth/login', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify(this.credentials)
});
const data = await response.json();
if (!response.ok) {
throw new Error(data.message || 'Login failed');
}
// Store token
localStorage.setItem('token', data.access_token);
// Show success
this.success = 'Login successful! Redirecting...';
// Redirect to dashboard
setTimeout(() => {
window.location.href = '/static/admin/dashboard.html';
}, 1000);
} catch (error) {
this.error = error.message || 'Invalid username or password';
console.error('Login error:', error);
} finally {
this.loading = false;
}
}
}
}
</script>
<!-- 4. Alpine.js LAST with defer -->
<script defer src="https://cdn.jsdelivr.net/npm/alpinejs@3.14.0/dist/cdn.min.js"></script>
</body>
</html>